feat: Added filtering by compulsory tags and changed filtering logic.

Co-Authored By: Caspar Asaam <caspar@dyn3159-95.wlan.ic.ac.uk>

src/routes/+page.svelte

@@ -5,6 +5,7 @@
     import Navbar from "$lib/components/Navbar.svelte";
     import TagFilter from "$lib/components/inputs/TagFilter.svelte";
     import {availableStudySpaceTags} from "$lib"
+    import {allTags} from "$lib"
 
     const { data } = $props();
     const { studySpaces, supabase } = $derived(data);  
@@ -13,20 +14,25 @@
     let tagFilter = $state("");
     let tagFilterElem = $state<HTMLInputElement>()
     let filteredTags = $derived(
-        availableStudySpaceTags
+        allTags
             .filter((tag) => tag.toLowerCase().includes(tagFilter.toLowerCase()))
-            .filter((tag) => availableStudySpaceTags.includes(tag))
+            .filter((tag) => allTags.includes(tag))
         )
 
     let filteredStudySpaces = $derived(() =>
-        selectedTags.length == 0
+        selectedTags.length === 0
             ? studySpaces
-            : studySpaces.filter(space =>
-                selectedTags.every(tag =>
-                (space.tags || []).includes(tag)
-                )
-            )
-        );
+            : studySpaces.filter(space => {
+                const allTags = [
+                ...(space.tags || []),
+                space.volume,
+                space.wifi,
+                space.power
+                ].filter(Boolean); 
+
+                return selectedTags.every(tag => allTags.includes(tag));
+            })
+    );
 
     let dropdownVisible = $state(false)
 
@@ -62,10 +68,8 @@
         deleteTag={deleteTag}
         addTag={addTag}
     />
-    {#each studySpaces.filter(space =>
-    selectedTags.length === 0 ||
-    selectedTags.every(tag => (space.tags || []).includes(tag))
-  ) as studySpace (studySpace.id)}
+
+   {#each filteredStudySpaces() as studySpace (studySpace.id)}
         {@const imgUrl =
             studySpace.study_space_images.length > 0
                 ? supabase.storage