Enhance dashboard components with user collaboration features and project management improvements

app/src/components/templates/CollaborationPopup.tsx

@@ -16,18 +16,14 @@ import { getAvatarColor } from "../../modules/collaboration/functions/getAvatarC
 interface UserListTemplateProps {
   user: User;
 }
-interface UserData {
-  _id: string;
-  Email: string;
-  userName: string
-}
+
 const UserListTemplate: React.FC<UserListTemplateProps> = ({ user }) => {
   const [accessSelection, setAccessSelection] = useState<string>(user?.Access);
-  const { projectId } = useParams()
+  const { projectId } = useParams();
+
   const accessUpdate = async ({ option }: AccessOption) => {
     if (!projectId) return
     const accessSelection = await shareAccess(projectId, user.userId, option)
-    console.log('accessSelection: ', accessSelection);
     setAccessSelection(option);
   }
 
@@ -79,24 +75,24 @@ const CollaborationPopup: React.FC<CollaborateProps> = ({
   const { userName } = getUserData();
   const [users, setUsers] = useState([])
   const { projectId } = useParams();
-  const [searchedEmail, setSearchedEmail] = useState<UserData[]>([]);
-  const [emails, setEmails] = useState<any>([]);
 
   function getData() {
     if (!projectId) return;
     getProjectSharedList(projectId).then((allUser) => {
       const accesMail = allUser?.datas || []
+      console.log('accesMail: ', accesMail);
       setUsers(accesMail)
     }).catch((err) => {
-      console.log(err);
+
     })
   }
 
   useEffect(() => {
     getData();
   }, [])
+
   useEffect(() => {
-    // console.log("activeUsers: ", activeUsers);
+    // 
   }, [activeUsers]);
   return (
     <RenderOverlay>
@@ -116,7 +112,7 @@ const CollaborationPopup: React.FC<CollaborateProps> = ({
           <div className="header">
             <div className="content">Share this file</div>
             <div className="content">
-              <div className="copy-link-button">copy link</div>
+              {/* <div className="copy-link-button">copy link</div> */}
               <div
                 className="close-button"
                 onClick={() => {
@@ -128,7 +124,7 @@ const CollaborationPopup: React.FC<CollaborateProps> = ({
             </div>
           </div>
           <div className="invite-input-container">
-            <MultiEmailInvite setSearchedEmail={setSearchedEmail} searchedEmail={searchedEmail} users={users} getData={getData} />
+            <MultiEmailInvite users={users} getData={getData} />
           </div>
           <div className="split"></div>
           <section>

app/src/components/templates/LoadingPage.tsx

@@ -6,6 +6,8 @@ import { useProjectName } from "../../store/builder/store";
 import { getAllProjects } from "../../services/dashboard/getAllProjects";
 import { useComparisonProduct } from "../../store/simulation/useSimulationStore";
 import { getUserData } from "../../functions/getUserData";
+import { recentlyViewed } from "../../services/dashboard/recentlyViewed";
+import { sharedWithMeProjects } from "../../services/dashboard/sharedWithMeProject";
 
 interface LoadingPageProps {
   progress: number; // Expect progress as a percentage (0-100)
@@ -19,18 +21,51 @@ const LoadingPage: React.FC<LoadingPageProps> = ({ progress }) => {
 
   const validatedProgress = Math.min(100, Math.max(0, progress));
 
-  useEffect(() => {
-    if (!userId) return;
+  // useEffect(() => {
+  //   if (!userId) return;
 
-    getAllProjects(userId, organization).then((projects) => {
-      if (!projects || !projects.Projects) return;
-      const filterProject = projects?.Projects.find((val: any) => val.projectUuid === projectId || val._id === projectId);
-      if (filterProject) {
-        setProjectName(filterProject.projectName);
+
+  //   // getAllProjects(userId, organization).then((projects) => {
+  //   //   sharedWithMeProjects().then((shared) => {
+  //   //     console.log('filterProject: ', shared);
+  //   //     const filterProject = (projects?.Projects || shared)?.find((val: any) => val.projectUuid === projectId || val._id === projectId)
+  //   //     console.log('filterProject: ', filterProject);
+  //   //     // setProjectName(filterProject?.projectName)
+
+  //   //   })
+  //   // }).catch(() => {
+  //   //   console.error("Error fetching projects")
+  //   // })
+  // }, []);
+  useEffect(() => {
+    if (!userId) {
+      console.error("User data not found in localStorage");
+      return;
+    }
+
+    const fetchProjects = async () => {
+      try {
+        const projects = await getAllProjects(userId, organization);
+        const shared = await sharedWithMeProjects();
+
+        const allProjects = [...(projects?.Projects || []), ...(shared || [])];
+
+        const matchedProject = allProjects.find(
+          (val: any) => val.projectUuid === projectId || val._id === projectId
+        );
+
+        if (matchedProject) {
+          setProjectName(matchedProject.projectName);
+
+        } else {
+          console.warn("Project not found with given ID:", projectId);
+        }
+      } catch (error) {
+        console.error("Error fetching projects:", error);
       }
-    }).catch((error) => {
-      console.log(error);
-    })
+    };
+
+    fetchProjects();
   }, []);
 
   return (