diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 8808694..ac60513 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -3,7 +3,7 @@ import defaultImg from "$lib/assets/study_space.png"; import crossUrl from "$lib/assets/cross.svg"; import Navbar from "$lib/components/Navbar.svelte"; - import { allTags } from "$lib"; + import { allTags, volumeTags, wifiTags, powerOutletTags } from "$lib"; const { data } = $props(); const { studySpaces, supabase } = $derived(data); @@ -11,10 +11,24 @@ let selectedTags = $state([]); let tagFilter = $state(""); let tagFilterElem = $state(); + + function categorySelected(category: string[]) { + return category.some(tag => selectedTags.includes(tag)); + } + let filteredTags = $derived( allTags .filter((tag) => tag.toLowerCase().includes(tagFilter.toLowerCase())) - .filter((tag) => allTags.includes(tag)) + .filter((tag) => !selectedTags.includes(tag)) + .filter((tag) => { + if (selectedTags.includes(tag)) return false; + + if (categorySelected(volumeTags) && volumeTags.includes(tag)) return false; + if (categorySelected(wifiTags) && wifiTags.includes(tag)) return false; + if (categorySelected(powerOutletTags) && powerOutletTags.includes(tag)) return false; + + return true; + }) ); let filteredStudySpaces = $derived( @@ -174,8 +188,8 @@ font-size: 1rem; } .tagInput { - width: 100%; - height: 100%; + flex: 1 1 100%; + min-width: 10rem; background: none; color: #eaffeb; font-size: 1rem;