diff --git a/packages/frontend/src/Index.tsx b/packages/frontend/src/Index.tsx
index a937587..c0b5a04 100644
--- a/packages/frontend/src/Index.tsx
+++ b/packages/frontend/src/Index.tsx
@@ -80,6 +80,10 @@ function Index() {
         void refetchOrganisations();
     }, [user.id]);
 
+    useEffect(() => {
+        setSelectedOrganisation((prev) => prev || organisations[0] || null);
+    }, [organisations]);
+
     const refetchProjects = async (organisationId: number, options?: { selectProjectId?: number }) => {
         try {
             const res = await fetch(
@@ -126,24 +130,30 @@ function Index() {
         void refetchProjects(selectedOrganisation.Organisation.id);
     }, [selectedOrganisation]);
 
+    useEffect(() => {
+        setSelectedProject((prev) => prev || projects[0] || null);
+    }, [projects]);
+
+    const refetchIssues = async (projectKey: string) => {
+        try {
+            const res = await fetch(`${serverURL}/issues/${projectKey}`, {
+                headers: getAuthHeaders(),
+            });
+            const data = (await res.json()) as IssueResponse[];
+            setIssues(data);
+        } catch (err) {
+            console.error("error fetching issues:", err);
+            setIssues([]);
+        }
+    };
+
     // fetch issues when project is selected
     useEffect(() => {
         if (!selectedProject) return;
 
-        fetch(`${serverURL}/issues/${selectedProject.Project.key}`, { headers: getAuthHeaders() })
-            .then((res) => res.json())
-            .then((data: IssueResponse[]) => {
-                setIssues(data);
-            })
-            .catch((err) => {
-                console.error("error fetching issues:", err);
-            });
+        void refetchIssues(selectedProject.Project.key);
     }, [selectedProject]);
 
-    useEffect(() => {
-        setSelectedProject((prev) => prev || projects[0] || null);
-    }, [projects]);
-
     return (
         <main className="w-full h-full p-1">
             {/* header area */}