Merge pull request #459 from Sid-80/feat/457

feat: listing and team members with api implemented
subhadeeproy3902 · Jul 12, 2024 · a15027d · a15027d
2 parents 8a5a46e + c3ca3f9
commit a15027d
Show file tree

Hide file tree

Showing 12 changed files with 132 additions and 103 deletions.
diff --git a/src/app/api/auth/register/route.ts b/src/app/api/auth/register/route.ts
@@ -20,6 +20,7 @@ export async function POST(request: Request) {
 
     return NextResponse.json({ email }, { status: 200 });
   } catch (e) {
+    console.log(e)
     return NextResponse.json({ "message":"Error occured !!" }, { status: 500 });
   }
 }
diff --git a/src/app/api/teams/create/route.ts b/src/app/api/teams/create/route.ts
@@ -22,8 +22,8 @@ export const POST = async (req: Request) => {
               createdBy:user._id,
               teamMembers:[user._id]
             });
-      
-            return NextResponse.json({ status: 200 });
+
+            return NextResponse.json({teamId:team._id,teamName:team.teamName},{ status: 200 });
         } catch (err) {
             return NextResponse.json(`Err : ${err}`, {status:500});
         }

diff --git a/src/app/api/teams/get/route.ts b/src/app/api/teams/get/route.ts
@@ -0,0 +1,28 @@
+import { mongoDB } from "@/lib/MongoDB";
+import { AuthMiddleware } from "@/Middleware/AuthMiddleware";
+import TeamModel from "@/models/team";
+import { ApiUser } from "@/types/types";
+import { NextResponse } from "next/server";
+
+export const GET = async (req: Request) => {
+
+    const result = await AuthMiddleware(req);
+
+    if (result instanceof NextResponse) {
+
+        try {
+
+            await mongoDB();
+
+            const user: ApiUser = JSON.parse(req.headers.get("user") || "{}");
+
+            const team = await TeamModel.find({$or:[{createdBy:user._id}, {teamMembers:{$in:[user._id]}}]});
+
+            return NextResponse.json(team,{ status: 200 });
+        } catch (err) {
+            return NextResponse.json(`Err : ${err}`, {status:500});
+        }
+    } else {
+      return result;
+    }
+};
diff --git a/src/app/api/teams/members/[id]/route.ts b/src/app/api/teams/members/[id]/route.ts
@@ -1,30 +1,40 @@
 import { ConvexHttpClient } from "convex/browser";
 import { api } from "../../../../../../convex/_generated/api";
 import { Id } from "../../../../../../convex/_generated/dataModel";
+import TeamModel from "@/models/team";
+import { AuthMiddleware } from "@/Middleware/AuthMiddleware";
+import { NextResponse } from "next/server";
+import { mongoDB } from "@/lib/MongoDB";
 
 export async function GET(
   request: Request,
   { params }: { params: { id: string } }
 ) {
-  const { id } = params;
-
-  if (!id) return new Response("Parameters missing!!", { status: 401 });
-
-  const client = new ConvexHttpClient(process.env.NEXT_PUBLIC_CONVEX_URL!);
-
-  const teamInfo = await client.query(api.teams.getTeamById, {
-    _id: id as Id<"teams">,
-  });
-
-  const memberDataPromises = teamInfo.teamMembers.map((mem: string) =>
-    client.query(api.user.getUser, { email: mem })
-  );
-
-  const results = await Promise.all(memberDataPromises);
-
-  const memberData = results.flatMap((result) => result || []);
 
-  return Response.json({ memberData });
+  const result = await AuthMiddleware(request);
+
+    if (result instanceof NextResponse) {
+
+        try {
+
+            const { id } = params;
+
+            if (!id) return new Response("Parameters missing!!", { status: 401 });
+
+            await mongoDB();
+
+            const TeamWithMembersData = await TeamModel.findOne({_id:id}).populate({
+              path: 'teamMembers',
+              select: 'email firstName lastName createdAt updatedAt',
+            });
+
+            return NextResponse.json(TeamWithMembersData.teamMembers,{ status: 200 });
+        } catch (err) {
+            return NextResponse.json(`Err : ${err}`, {status:500});
+        }
+    } else {
+      return result;
+    }
 }
 
 export async function PUT(

diff --git a/src/app/dashboard/_components/SideNavTopSection.tsx b/src/app/dashboard/_components/SideNavTopSection.tsx
@@ -16,11 +16,11 @@ import { setTeamInfo } from "@/app/Redux/Team/team-slice";
 import RenameTeamModal from "@/components/shared/RenameTeamModal";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
 import MembersList from "@/components/shared/MembersList";
-import axiosInstance from "@/config/AxiosInstance";
-import { getTeamMembersData } from "@/lib/API-URLs";
+import { getTeamMembersData, getTeamUrl } from "@/lib/API-URLs";
 import { RootState } from "@/config/store";
 import { signOut } from "next-auth/react";
 import { logOut } from "@/app/Redux/Auth/auth-slice";
+import createAxiosInstance from "@/config/AxiosProtectedRoute";
 
 export interface TEAM {
   createdBy: string;
@@ -52,6 +52,7 @@ function SideNavTopSection({ setActiveTeamInfo }: any) {
   const [teamMembersData, setTeamData] = useState<any[]>([]);
   const [ActiveTeamMembers, setActiveTeamMembers] = useState<string[]>([]);
   const user = useSelector((state:RootState) => state.auth.user);
+  const axiosInstance = createAxiosInstance(user.accessToken);
 
   useEffect(() => {
     user && getTeamList();
@@ -69,36 +70,33 @@ function SideNavTopSection({ setActiveTeamInfo }: any) {
     }
   }, [user]);
 
-  useEffect(() => {
-    const getData = async () => {
-      if (ActiveTeamMembers) {
-        const res = await axiosInstance.get(`${getTeamMembersData}/${activeTeam?._id}`);
-        setTeamData(res.data.memberData);
-      }
-    };
-
-    if (teamList && activeTeam) {
-      getData();
-    }
-  }, [ActiveTeamMembers, activeTeam]);
-
   useEffect(() => {
     activeTeam ? setActiveTeamInfo(activeTeam) : null;
   }, [activeTeam]);
+
   const getTeamList = async () => {
-    const res = await convex.query(api.teams.getAllTeam);
-    const allTeams = res.filter(
-      (file: { createdBy: any; teamMembers: string | any[] }) =>
-        file.createdBy === user.email || file.teamMembers?.includes(user.email)
-    );
-    setTeamList(allTeams);
-    setActiveTeam(allTeams[0]);
-    setActiveTeamMembers(allTeams[0].teamMembers);
+    const res = await axiosInstance.get(getTeamUrl)
+
+    setTeamList(res.data);
+    setActiveTeam(res.data[0]);
+    setActiveTeamMembers(res.data[0].teamMembers);
     dispatch(
-      setTeamInfo({ teamId: allTeams[0]._id, teamName: allTeams[0].teamName })
+      setTeamInfo({ teamId: res.data[0]._id, teamName: res.data[0].teamName })
     );
   };
 
+  useEffect(()=>{
+    const getData = async() => {
+      const res = await axiosInstance.get(`${getTeamMembersData}/${activeTeam?._id}`);
+      setTeamData(res.data)
+    }
+
+    if(activeTeam?._id){
+      getData()
+    }
+
+  },[activeTeam?._id])
+
   const onMenuClick = (item: any) => {
     if (item.path) {
       router.push(item.path);

diff --git a/src/app/dashboard/layout.tsx b/src/app/dashboard/layout.tsx
@@ -13,6 +13,10 @@ import { useMutation } from "convex/react";
 import Image from "next/image";
 import { SessionProvider, useSession } from "next-auth/react";
 import Link from "next/link";
+import createAxiosInstance from "@/config/AxiosProtectedRoute";
+import { createNewTeamUrl, getTeamUrl } from "@/lib/API-URLs";
+import { toast } from "sonner";
+import { setTeamInfo } from "../Redux/Team/team-slice";
 
 
 function DashboardLayout({
@@ -27,8 +31,10 @@ function DashboardLayout({
   const [loading, setLoading] = useState(true);
   const router = useRouter();
   const count = useSelector((state: RootState) => state.counter.value);
+  const user = useSelector((state: RootState) => state.auth.user);
   const [hasCheckedTeam, setHasCheckedTeam] = useState(false);
   const dispatch = useDispatch();
+  const axiosInstance = createAxiosInstance(user.accessToken);
 
   useEffect(() => {
     if (session && !hasCheckedTeam) {
@@ -37,21 +43,24 @@ function DashboardLayout({
   }, [session, hasCheckedTeam]);
 
   const checkTeam = async () => {
-    setHasCheckedTeam(true);
-    const result = await convex.query(api.teams.getTeam, {
-      email: session?.user.email!,
-    });
+    try {
+      const res = await axiosInstance.get(getTeamUrl)
+
+      if (!res.data.length) {
+        const res2 = await axiosInstance.post(createNewTeamUrl,{
+          teamName:`${user.firstName}'s Org`
+        });
 
-    if (!result?.length) {
-      createTeam({
-        teamName: `${session?.user.firstName} Org`,
-        createdBy: session?.user.email!,
-        teamMembers: [session?.user.email!],
-      }).then((resp) => {
-        if (resp) {
-          router.push("/dashboard");
+        if(res2.status === 200){
+          toast.success(`Welcome to ${user.firstName}'s Org`)
         }
-      });
+
+        dispatch(setTeamInfo({teamId:res2.data._id,teamName:res2.data.teamName}));
+      }
+      setHasCheckedTeam(true);
+
+    } catch (err) {
+      console.log(err);
     }
   };
 

diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
@@ -20,6 +20,7 @@ import { checkHealthUrl } from "@/lib/API-URLs";
 import createAxiosInstance from "@/config/AxiosProtectedRoute";
 import { useRouter } from "next/navigation";
 import { logOut } from "../Redux/Auth/auth-slice";
+import { signOut } from "next-auth/react";
 
 export interface FILE {
   archive: boolean;
@@ -30,8 +31,8 @@ export interface FILE {
   whiteboard: string;
   _id: string;
   _creationTime: number;
-  read:boolean;
-  write:boolean;
+  read: boolean;
+  write: boolean;
   writtenBy: string[];
   readBy: string[];
 }
@@ -43,39 +44,28 @@ function Dashboard() {
   const activeTeamId = useSelector((state: RootState) => state.team.teamId);
   const dispatch = useDispatch();
   const [userData, setUserdata] = useState<any>();
-  const user = useSelector((state:RootState) => state.auth.user);
-  const router = useRouter()
+  const user = useSelector((state: RootState) => state.auth.user);
+  const router = useRouter();
 
-  const accessToken = useSelector((state:RootState)=>state.auth.user.accessToken);
+  const accessToken = useSelector(
+    (state: RootState) => state.auth.user.accessToken
+  );
 
   const axiosInstance = createAxiosInstance(accessToken);
 
   useEffect(() => {
     const checkHealth = async () => {
-      const res = await axiosInstance.get(checkHealthUrl);
-      if(res.status !== 200) {
-        router.push('/signin');
-        dispatch(logOut())
-      };
+      try {
+        await axiosInstance.get(checkHealthUrl).catch((err) => {
+          signOut();
+          dispatch(logOut());
+          router.push("/signin");
+        });
+      } catch (err) {}
     };
     checkHealth();
   }, []);
 
-  const checkUser = async () => {
-    const result = await convex.query(api.user.getUser, { email: user?.email });
-    if (!result?.length) {
-      createUser({
-        name: user.firstName,
-        email: user.email,
-        image: user.image || "https://picsum.photos/50",
-      });
-      const res = await convex.query(api.user.getUser, { email: user?.email });
-      setUserdata(res[0]);
-    } else {
-      setUserdata(result[0]);
-    }
-  };
-
   const { fileList_, setFileList_ } = useContext(FileListContext);
   const [fileList, setFileList] = useState<any>();
 
@@ -95,11 +85,6 @@ function Dashboard() {
     setFileList(filteredFileList);
   };
 
-  useEffect(() => {
-    if (user) {
-      checkUser();
-    }
-  }, [user]);
 
   return (
     <div className="md:p-8 p-3">

diff --git a/src/app/signup/page.tsx b/src/app/signup/page.tsx
@@ -1,11 +1,13 @@
+"use client"
 import Image from "next/image";
 import heroImg from "@/app/assets/651593780abfac438bc371ae_Group 573.webp";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { SignupForm } from "@/components/shared/SignupForm";
 import Link from "next/link";
+import { useSession } from "next-auth/react";
 
 export default function Page() {
-
+  const { data: session } = useSession();
   return (
     <div className="flex relative h-screen w-screen">
       <div className=" absolute top-5 left-5">
@@ -26,7 +28,7 @@ export default function Page() {
             <CardTitle>Register</CardTitle>
           </CardHeader>
           <CardContent>
-            <SignupForm />
+            <SignupForm session={session} />
           </CardContent>
         </Card>
       </div>

diff --git a/src/app/teams/create/page.tsx b/src/app/teams/create/page.tsx
@@ -1,13 +1,10 @@
 "use client";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
-import { api } from "../../../../convex/_generated/api";
-import { useMutation } from "convex/react";
 import Image from "next/image";
 import { useRouter } from "next/navigation";
 import {  useState } from "react";
 import { toast } from "sonner";
-import { useConvex } from "convex/react";
 import { useSelector } from 'react-redux';
 import { RootState } from '@/config/store';
 import createAxiosInstance from "@/config/AxiosProtectedRoute";
@@ -26,7 +23,7 @@ function CreateTeam() {
       });
       if(res.status === 200){
         router.push('/dashboard');
-        toast.success("File created Successfully");
+        toast.success("Team created Successfully");
       }
     } catch (err) {
 

diff --git a/src/components/shared/MembersList.tsx b/src/components/shared/MembersList.tsx
@@ -10,7 +10,6 @@ type Props = {
 
 export default function MembersList({ TeamMembers,createdBy }: Props) {
 
-
   return (
     <div className=" bg-secondary mt-5  p-3 overflow-hidden rounded-lg">
       <div className="text-xl flex p-1 gap-2">
@@ -19,9 +18,9 @@ export default function MembersList({ TeamMembers,createdBy }: Props) {
       </div>
       <Separator className=" dark:bg-gray-500 bg-gray-500" />
       <div className=" grid relative sm:my-2 gap-2 h-[60px] grid-rows-2 items-center grid-cols-4 justify-start rounded-lg p-1 sm:p-3 overflow-x-auto">
-        {TeamMembers.map((member, index) => (
+        {TeamMembers && TeamMembers.map((member, index) => (
           <>
-            <MemberModal email={member.email} createdBy={createdBy} key={index} image={member.image} index={index} name={member.name} />
+            <MemberModal email={member.email} createdBy={createdBy} key={index} image={member.image} index={index} name={member.firstName} />
           </>
         ))}
       </div>