feat: update workspace url placeholder

apps/web/src/providers/modal.tsx

@@ -1,4 +1,4 @@
-import { createContext, useCallback, useContext, useState } from "react";
+import { createContext, useContext, useState } from "react";
 
 interface ModalState {
   contentType: string;
@@ -42,59 +42,57 @@ export const ModalProvider: React.FC<Props> = ({ children }) => {
   const entityId = currentModal?.entityId || "";
   const entityLabel = currentModal?.entityLabel || "";
 
-  const openModal = useCallback(
-    (contentType: string, entityId?: string, entityLabel?: string) => {
-      const newModal: ModalState = { contentType, entityId, entityLabel };
-      setModalStack((prev) => [...prev, newModal]);
-    },
-    [],
-  );
+  const openModal = (
+    contentType: string,
+    entityId?: string,
+    entityLabel?: string,
+  ) => {
+    const newModal: ModalState = { contentType, entityId, entityLabel };
+    setModalStack((prev) => [...prev, newModal]);
+  };
 
-  const closeModal = useCallback(() => {
+  const closeModal = () => {
     setModalStack((prev) => {
       if (prev.length <= 1) {
         return [];
       }
       return prev.slice(0, -1);
     });
-  }, []);
+  };
 
-  const closeModals = useCallback((count: number) => {
-    setModalStack((prev) => {
+  const closeModals = (count: number) => {
+    setModalStack(prev => {
       const newLength = Math.max(0, prev.length - count);
       return prev.slice(0, newLength);
     });
-  }, []);
+  };
 
-  const clearAllModals = useCallback(() => {
+  const clearAllModals = () => {
     setModalStack([]);
-  }, []);
+  };
 
-  const setModalState = useCallback((modalType: string, state: any) => {
+  const setModalState = (modalType: string, state: any) => {
     setModalStates((prev) => ({
       ...prev,
       [modalType]: state,
     }));
-  }, []);
+  };
 
-  const getModalState = useCallback(
-    (modalType: string) => {
-      return modalStates[modalType];
-    },
-    [modalStates],
-  );
+  const getModalState = (modalType: string) => {
+    return modalStates[modalType];
+  };
 
-  const clearModalState = useCallback((modalType: string) => {
+  const clearModalState = (modalType: string) => {
     setModalStates((prev) => {
       const newStates = { ...prev };
       delete newStates[modalType];
       return newStates;
     });
-  }, []);
+  };
 
-  const clearAllModalStates = useCallback(() => {
+  const clearAllModalStates = () => {
     setModalStates({});
-  }, []);
+  };
 
   return (
     <ModalContext.Provider

apps/web/src/providers/workspace.tsx

@@ -47,16 +47,12 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
   const [hasLoaded, setHasLoaded] = useState(false);
 
   const { data, isLoading } = api.workspace.all.useQuery();
-  const utils = api.useUtils();
 
   const switchWorkspace = (_workspace: Workspace) => {
     localStorage.setItem("workspacePublicId", _workspace.publicId);
 
     setWorkspace(_workspace);
 
-    // Refetch workspace data to ensure availableWorkspaces is up to date
-    void utils.workspace.all.refetch();
-
     router.push(`/boards`);
   };
 
@@ -70,15 +66,21 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
       localStorage.getItem("workspacePublicId");
 
     if (data.length) {
-      const workspaces = data.map(({ workspace, role }) => ({
-        role,
-        publicId: workspace.publicId,
-        name: workspace.name,
-        slug: workspace.slug,
-        description: workspace.description,
-        plan: workspace.plan,
-        hasLoaded: true,
-      })) as Workspace[];
+      const workspaces = data
+        .map(({ workspace, role }) => {
+          if (!workspace) return;
+
+          return {
+            role,
+            publicId: workspace.publicId,
+            name: workspace.name,
+            slug: workspace.slug,
+            description: workspace.description,
+            plan: workspace.plan,
+            hasLoaded: true,
+          };
+        })
+        .filter((workspace) => workspace !== null) as Workspace[];
 
       if (workspaces.length) setAvailableWorkspaces(workspaces);
     }
@@ -114,7 +116,7 @@ export const WorkspaceProvider: React.FC<{ children: ReactNode }> = ({
         role: primaryWorkspaceRole,
       });
     }
-  }, [data, isLoading]);
+  }, [data]);
 
   return (
     <WorkspaceContext.Provider

apps/web/src/views/boards/index.tsx

@@ -1,5 +1,4 @@
 import { t } from "@lingui/core/macro";
-import { useEffect } from "react";
 import { HiArrowDownTray, HiOutlinePlusSmall } from "react-icons/hi2";
 
 import Button from "~/components/Button";
@@ -17,11 +16,7 @@ export default function BoardsPage() {
   const { openModal, modalContentType, isOpen } = useModal();
   const { availableWorkspaces, workspace, hasLoaded } = useWorkspace();
 
-  useEffect(() => {
-    if (hasLoaded && availableWorkspaces.length === 0) {
-      openModal("NEW_WORKSPACE");
-    }
-  }, [hasLoaded, availableWorkspaces.length, openModal]);
+  if (hasLoaded && availableWorkspaces.length === 0) openModal("NEW_WORKSPACE");
 
   return (
     <>