diff --git a/dashboard/client/src/SideNavBar.svelte b/dashboard/client/src/SideNavBar.svelte
index e7def52..2312559 100644
--- a/dashboard/client/src/SideNavBar.svelte
+++ b/dashboard/client/src/SideNavBar.svelte
@@ -44,7 +44,7 @@
   {#if visible}
     <div transition:slide={{ axis: 'x' }} class="sidebar pt-5 flex-shrink-0">
       <button type="button" class="btn-close close-btn" on:click={() => (visible = false)}></button>
-      {#if !($challenges.length && $classes.length)}
+      {#if !($challenges && $classes)}
         <div class="spinner-border" role="status">
           <span class="visually-hidden">Loading...</span>
         </div>
diff --git a/dashboard/client/src/routing.js b/dashboard/client/src/routing.js
index c81dac3..79df0c3 100644
--- a/dashboard/client/src/routing.js
+++ b/dashboard/client/src/routing.js
@@ -19,12 +19,12 @@ export const chosenChallenge = derived([challenges, path], ([challenges, path])
   const match = path.match(/^#challenge\/(.+)$/);
   if (!match) return null;
 
-  return challenges.find((chall) => chall.id === match[1]) ?? null;
+  return challenges?.find((chall) => chall.id === match[1]) ?? null;
 });
 
 export const chosenClass = derived([classes, path], ([classes, path]) => {
   const match = path.match(/^#class\/(.+)$/);
   if (!match) return null;
 
-  return classes.find((cls) => cls.id === match[1]) ?? null;
+  return classes?.find((cls) => cls.id === match[1]) ?? null;
 });
diff --git a/dashboard/client/src/stores.js b/dashboard/client/src/stores.js
index b14690e..cfd3c6f 100644
--- a/dashboard/client/src/stores.js
+++ b/dashboard/client/src/stores.js
@@ -2,8 +2,8 @@ import { get, writable } from 'svelte/store';
 
 export const isLoading = writable(false);
 
-export const classes = writable([]);
-export const challenges = writable([]);
+export const classes = writable(null);
+export const challenges = writable(null);
 
 export const storageBackedWritable = (key, defaultData) => {
   const store = writable(localStorage.getItem(key) ?? defaultData);