adding toastr nice

components/Dashboard/Header.tsx

@@ -18,6 +18,7 @@ import { generateGreetings } from "../../helpers/dateTime";
 import { Dropdown, Menu } from "antd";
 import { useRouter } from "next/router";
 import { TeamMemberRole, TeamMemberStatus } from "../../models/teamMember";
+import { toast } from "react-hot-toast";
 
 export default function Header() {
   const { logOut } = useAuth();
@@ -37,15 +38,20 @@ export default function Header() {
     }
   }
 
+  async function handleAdminRoute() {
+    if (userTeamMember.role == TeamMemberRole.admin) {
+      router.push("/teams/" + teamid + "/admin");
+      return;
+    }
+
+    toast.error("You are not a team admin!");
+  }
+
   const UserMenu = (
     <Menu>
-      {userTeamMember.role == TeamMemberRole.admin && (
+      <Menu.Item key={1}>
-        <Menu.Item key={1}>
+        <button onClick={handleAdminRoute}>manage team</button>
-          <button onClick={() => router.push("/teams/" + teamid + "/admin")}>
+      </Menu.Item>
-            manage team
-          </button>
-        </Menu.Item>
-      )}
 
       <Menu.Item danger key={2}>
         <button onClick={handleSignOut}>sign out</button>

components/Dashboard/TeamVoiceLine.tsx

@@ -5,15 +5,27 @@ import { BsThreeDots } from "react-icons/bs";
 import { useTeamDashboardContext } from "../../contexts/teamDashboardContext";
 import { UserStatus } from "../../models/user";
 import { useState } from "react";
+import { toast } from "react-hot-toast";
+import { TeamMemberRole } from "../../models/teamMember";
 
 export default function TeamVoiceLine() {
   const router = useRouter();
   const { teamid } = router.query;
+  const { team, user, userTeamMember } = useTeamDashboardContext();
   const { teamMembers } = useTeamDashboardContext();
   const [loading, setLoading] = useState<Boolean>(true);
 
   //listeners for all teammates' status
 
+  async function handleAdminRoute() {
+    if (userTeamMember.role == TeamMemberRole.admin) {
+      router.push("/teams/" + teamid + "/admin");
+      return;
+    }
+
+    toast.error("You are not a team admin!");
+  }
+
   function statusBubble(status: UserStatus) {
     console.log(status);
 
@@ -118,7 +130,7 @@ export default function TeamVoiceLine() {
         </span>
 
         <button
-          onClick={() => router.push("/team/" + teamid + "/admin")}
+          onClick={handleAdminRoute}
           className="bg-gray-300 bg-opacity-25 p-2 ml-auto rounded hover:bg-opacity-40"
         >
           <FaPlus className="text-lg text-white" />

pages/_app.js

@@ -12,7 +12,7 @@ function MyApp({ Component, pageProps }) {
         <Component {...pageProps} />
       </AuthProvider>
 
-      <Toaster />
+      <Toaster position="top-center" />
     </SiteLayout>
   );
 }