feat: Added checkboxes for properties of a study space on the upload page.

Co-Authored By: Caspar Asaam <caspar@dyn3159-95.wlan.ic.ac.uk>
2025-06-05 23:57:00 +01:00
43 changed files with 701 additions and 2977 deletions
--- a/.env.example
+++ b/.env.example
@@ -1,3 +1,2 @@
 PUBLIC_SUPABASE_URL=http://127.0.0.1:54321
-PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here
-PUBLIC_GMAPS_API_KEY=your-google-maps-api-key-here
+PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -21,7 +21,6 @@ check_types:
  variables:
    PUBLIC_SUPABASE_URL: $SUPABASE_URL
    PUBLIC_SUPABASE_ANON_KEY: $SUPABASE_ANON_KEY
-    PUBLIC_GMAPS_API_KEY: $GMAPS_API_KEY
  script:
    - npm run check

@@ -73,7 +72,6 @@ build:
  variables:
    PUBLIC_SUPABASE_URL: $SUPABASE_URL
    PUBLIC_SUPABASE_ANON_KEY: $SUPABASE_ANON_KEY
-    PUBLIC_GMAPS_API_KEY: $GMAPS_API_KEY
  script:
    - npm run build
  artifacts:
--- a/README.md
+++ b/README.md
@@ -35,7 +35,7 @@
 - `npx supabase stop` will stop the local dev database (data is persisted unless you do a reset).
 - `npx supabase db push --local` will apply migrations to your local dev database. Useful if someone else has made new SQL migrations.
 - `npx supabase db reset` will completely reset the local dev database.
- `npx supabase db diff -f <migration-name>` will generate a new migration file based on the current state of the database. This isn't 100% foolproof, so don't use it blindly.
+- `npx supabase diff db -f <migration-name>` will generate a new migration file based on the current state of the database. This isn't 100% foolproof, so don't use it blindly.

 ### What's where?

--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -20,14 +20,12 @@
    "devDependencies": {
        "@eslint/compat": "^1.2.5",
        "@eslint/js": "^9.18.0",
-        "@googlemaps/typescript-guards": "^2.0.3",
        "@playwright/test": "^1.49.1",
        "@sveltejs/adapter-node": "^5.2.12",
        "@sveltejs/kit": "^2.16.0",
        "@sveltejs/vite-plugin-svelte": "^5.0.0",
        "@testing-library/jest-dom": "^6.6.3",
        "@testing-library/svelte": "^5.2.4",
-        "@types/google.maps": "^3.58.1",
        "eslint": "^9.18.0",
        "eslint-config-prettier": "^10.0.1",
        "eslint-plugin-svelte": "^3.0.0",
@@ -44,9 +42,7 @@
        "vitest": "^3.0.0"
    },
    "dependencies": {
-        "@googlemaps/js-api-loader": "^1.16.8",
        "@supabase/ssr": "^0.6.1",
-        "@supabase/supabase-js": "^2.49.8",
-        "posthog-js": "^1.250.1"
+        "@supabase/supabase-js": "^2.49.8"
    }
 }
--- a/src/lib/components/Button.svelte
+++ b/src/lib/components/Button.svelte
@@ -5,50 +5,29 @@
        onclick?: (event: MouseEvent) => void;
        disabled?: boolean;
        type?: "button" | "submit" | "reset";
-        style?: "normal" | "red";
-        formaction?: string;
        children?: Snippet;
    }
-    interface LinkProps {
-        href: string;
-        type: "link";
-        style?: "normal" | "red";
-        children?: Snippet;
-    }
-    const { children, type, style = "normal", ...rest }: Props | LinkProps = $props();
+    const { children, ...rest }: Props = $props();
 </script>

-{#if type === "link"}
-    <a {...rest} class="button {style}">
-        {@render children?.()}
-    </a>
-{:else}
-    <button class="button {style}" {type} {...rest}>
-        {@render children?.()}
-    </button>
-{/if}
+<button {...rest}>
+    {@render children?.()}
+</button>

 <style>
-    .button {
+    button {
        padding: 0.5rem 1rem;
        border-radius: 0.5rem;
+        background: linear-gradient(-83deg, #3fb095, #49bd85);
        box-shadow: 0rem 0rem 0.5rem #182125;
        color: #eaffeb;
        border: none;
        cursor: pointer;
-        text-decoration: none;
-        text-align: center;
    }
-    .normal {
-        background: linear-gradient(-83deg, #3fb095, #49bd85);
-    }
-    .red {
-        background-color: #bd4949;
-    }
-    .button:focus {
+    button:focus {
        outline: 2px solid #007bff;
    }
-    .button:disabled {
+    button:disabled {
        background: linear-gradient(-18deg, #66697b, #4e4e5e);
        cursor: not-allowed;
    }
--- a/src/lib/components/Carousel.svelte
+++ b/src/lib/components/Carousel.svelte
@@ -4,27 +4,20 @@
    import { onMount } from "svelte";

    interface Props {
-        scrollPosition?: number;
        urls?: string[];
        ondelete?: (idx: number) => void;
    }

-    let { scrollPosition = $bindable(0), urls = [], ondelete }: Props = $props();
+    const { urls = [], ondelete }: Props = $props();
    let carousel = $state<HTMLDivElement>();
-    let currentPosition = $state(0);
+    let scrollPosition = $state(0);
    let scrollWidth = $state(0);
    let clientWidth = $state(1);
    function updateScroll() {
-        currentPosition = carousel?.scrollLeft || 0;
+        scrollPosition = carousel?.scrollLeft || 0;
        scrollWidth = carousel?.scrollWidth || 0;
        clientWidth = carousel?.clientWidth || 1;
    }
-    $effect(() => {
-        carousel?.scrollTo({
-            left: scrollPosition * clientWidth,
-            behavior: "smooth"
-        });
-    });
    onMount(() => {
        const id = setInterval(() => {
            if (carousel) {
@@ -48,7 +41,7 @@
            </div>
        {/each}
    </div>
-    {#if currentPosition > clientWidth / 2}
+    {#if scrollPosition > clientWidth / 2}
        <button
            class="arrow left"
            onclick={(e) => {
@@ -59,7 +52,7 @@
            <img src={arrowRightUrl} alt="go to previous" />
        </button>
    {/if}
-    {#if currentPosition < scrollWidth - clientWidth * 1.5}
+    {#if scrollPosition < scrollWidth - clientWidth * 1.5}
        <button
            class="arrow right"
            onclick={(e) => {
@@ -71,7 +64,7 @@
        </button>
    {/if}
    <span class="position">
-        {Math.round(currentPosition / clientWidth) + 1} / {urls.length}
+        {Math.round(scrollPosition / clientWidth) + 1} / {urls.length}
    </span>
 </div>

--- a/src/lib/components/CompulsoryTags.svelte
+++ b/src/lib/components/CompulsoryTags.svelte
@@ -1,62 +0,0 @@
-<script lang="ts">
-    import type { Table } from "$lib";
-
-    interface Props {
-        space: Table<"study_spaces">;
-    }
-
-    const { space }: Props = $props();
-
-    const tagToColor: Record<string, string> = {
-        "Many Outlets": "compulsoryTagGreen",
-        "No Outlets": "compulsoryTagRed",
-        "Some Outlets": "compulsoryTagYellow",
-        "Good WiFi": "compulsoryTagGreen",
-        "Bad WiFi": "compulsoryTagRed",
-        "Moderate WiFi": "compulsoryTagYellow",
-        "No WiFi": "compulsoryTagRed"
-    };
-</script>
-
-<span class="compulsoryTagGreen">{space.volume}</span>
-<span class={tagToColor[space.power]}>{space.power}</span>
-<span class={tagToColor[space.wifi]}>{space.wifi}</span>
-
-<style>
-    .compulsoryTagGreen {
-        display: flex;
-        font-weight: bold;
-        align-items: center;
-        justify-content: center;
-        text-align: center;
-        border-radius: 0.25rem;
-        background-color: #eaffeb;
-        color: #2e4653;
-        cursor: pointer;
-        padding: 0.2rem 0.2rem;
-    }
-    .compulsoryTagYellow {
-        display: flex;
-        font-weight: bold;
-        align-items: center;
-        justify-content: center;
-        text-align: center;
-        border-radius: 0.25rem;
-        background-color: #ffffd4;
-        color: #534b2e;
-        cursor: pointer;
-        padding: 0.2rem 0.2rem;
-    }
-    .compulsoryTagRed {
-        display: flex;
-        font-weight: bold;
-        align-items: center;
-        justify-content: center;
-        text-align: center;
-        border-radius: 0.25rem;
-        background-color: #ffcece;
-        color: #532e2e;
-        cursor: pointer;
-        padding: 0.2rem 0.2rem;
-    }
-</style>
--- a/src/lib/components/Feedback.svelte
+++ b/src/lib/components/Feedback.svelte
@@ -1,338 +0,0 @@
-<script lang="ts">
-    import crossUrl from "$lib/assets/cross.svg";
-    import type { Table } from "$lib";
-    import type { SupabaseClient } from "@supabase/supabase-js";
-    import type { Database } from "$lib/database.d.ts";
-    import { availableStudySpaceTags, wifiTags, powerOutletTags, volumeTags } from "$lib";
-    import { invalidate } from "$app/navigation";
-
-    type StudySpaceData = Omit<
-        Table<"study_spaces">,
-        "id" | "created_at" | "updated_at" | "building_location_old" | "building_location"
-    > & {
-        id?: string;
-        building_location?: google.maps.places.PlaceResult;
-    };
-    interface Props {
-        studySpaceData: StudySpaceData;
-        supabase: SupabaseClient<Database>;
-        hideFunc: () => void;
-    }
-
-    const { studySpaceData, supabase, hideFunc }: Props = $props();
-    let newStudySpaceData: StudySpaceData = $state({ ...studySpaceData });
-    let uploading = $state(false);
-    async function uploadFeedback() {
-        const { error: feedbackUpload } = await supabase
-            .from("study_spaces")
-            .update({
-                volume: newStudySpaceData.volume,
-                wifi: newStudySpaceData.wifi,
-                power: newStudySpaceData.power,
-                tags: newStudySpaceData.tags
-            })
-            .eq("id", newStudySpaceData.id ?? "");
-        invalidate("db:study_spaces");
-        if (feedbackUpload) return alert(`Error submitting feedback: ${feedbackUpload.message}`);
-        else alert("Feedback submitted successfully!");
-    }
-
-    // Tag
-    let tagFilter = $state("");
-    let tagFilterElem = $state<HTMLInputElement>();
-    let filteredTags = $derived(
-        availableStudySpaceTags
-            .filter((tag) => tag.toLowerCase().includes(tagFilter.toLowerCase()))
-            .filter((tag) => !newStudySpaceData.tags.includes(tag))
-    );
-    let dropdownVisible = $state(false);
-
-    function deleteTag(tagName: string) {
-        return () => {
-            newStudySpaceData.tags = newStudySpaceData.tags.filter((tag) => tag !== tagName);
-        };
-    }
-
-    function addTag(tagName: string) {
-        return () => {
-            if (!newStudySpaceData.tags.includes(tagName)) {
-                newStudySpaceData.tags.push(tagName);
-            }
-            tagFilter = "";
-        };
-    }
-</script>
-
-<div class="overlay">
-    <form
-        onsubmit={async (event) => {
-            event.preventDefault();
-            uploading = true;
-            await uploadFeedback();
-            uploading = false;
-            hideFunc();
-        }}
-        class="feedbackContainer"
-    >
-        <h1 class="submitHeader">Submit Feedback</h1>
-
-        <div class="compulsoryTags">
-            <div class="compulsoryContainer">
-                <label for="volume">Sound level:</label>
-                <select
-                    bind:value={newStudySpaceData.volume}
-                    name="volume"
-                    class="compulsoryTagSelect"
-                >
-                    <option value="" disabled selected>How noisy is it?</option>
-                    {#each volumeTags as volumeTag (volumeTag)}
-                        <option value={volumeTag}>{volumeTag}</option>
-                    {/each}
-                </select>
-            </div>
-            <div class="compulsoryContainer">
-                <label for="powerOutlets">Power outlets:</label>
-                <select
-                    bind:value={newStudySpaceData.power}
-                    name="poweOutlets"
-                    class="compulsoryTagSelect"
-                >
-                    <option value="" disabled selected>Power outlets?</option>
-                    {#each powerOutletTags as powerOutletTag (powerOutletTag)}
-                        <option value={powerOutletTag}>{powerOutletTag}</option>
-                    {/each}
-                </select>
-            </div>
-            <div class="compulsoryContainer">
-                <label for="wifi">Wifi:</label>
-                <select bind:value={newStudySpaceData.wifi} name="wifi" class="compulsoryTagSelect">
-                    <option value="" disabled selected>How's the wifi?</option>
-                    {#each wifiTags as wifiTag (wifiTag)}
-                        <option value={wifiTag}>{wifiTag}</option>
-                    {/each}
-                </select>
-            </div>
-        </div>
-
-        <label for="tags">Additional tags:</label>
-        <div class="tagDisplay">
-            {#each newStudySpaceData.tags as tagName (tagName)}
-                <button class="tag" onclick={deleteTag(tagName)} type="button">
-                    {tagName}
-                    <img src={crossUrl} alt="delete" /></button
-                >
-            {/each}
-            <input
-                type="text"
-                name="tagInput"
-                class="tagInput"
-                bind:value={tagFilter}
-                bind:this={tagFilterElem}
-                onfocus={() => {
-                    dropdownVisible = true;
-                }}
-                onblur={() => {
-                    dropdownVisible = false;
-                }}
-                onkeypress={(event) => {
-                    if (event.key === "Enter") {
-                        event.preventDefault();
-                        const tag = filteredTags[0];
-                        if (tag) addTag(tag)();
-                    }
-                }}
-                placeholder="Add tags..."
-            />
-            {#if dropdownVisible}
-                <div class="tagDropdown">
-                    {#each filteredTags as avaliableTag (avaliableTag)}
-                        <button
-                            class="avaliableTag"
-                            onclick={addTag(avaliableTag)}
-                            onmousedown={(e) => {
-                                // Keep input focused
-                                e.preventDefault();
-                                e.stopPropagation();
-                            }}
-                            type="button"
-                        >
-                            {avaliableTag}
-                        </button>
-                    {/each}
-                </div>
-            {/if}
-        </div>
-
-        <button disabled={uploading} class="submit">Submit</button>
-        <button type="button" class="exit" aria-label="exit" onclick={hideFunc}
-            ><img src={crossUrl} alt="exit" /></button
-        >
-    </form>
-</div>
-
-<style>
-    .overlay {
-        display: flex;
-        width: 100%;
-        height: 100%;
-        position: fixed;
-        justify-content: center;
-        align-items: center;
-        background-color: rgba(8, 15, 18, 0.9);
-        z-index: 100;
-    }
-
-    .feedbackContainer {
-        display: flex;
-        flex-direction: column;
-        width: 80%;
-        gap: 0.5rem;
-        padding: 1rem;
-        background-color: #182125;
-        border-radius: 0.5rem;
-        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
-        color: #eaffeb;
-        position: absolute;
-        translate: 0 -3.5rem;
-        border: 2px solid #eaffeb;
-    }
-
-    .submitHeader {
-        width: 80%;
-    }
-
-    .submit {
-        width: 100%;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: none;
-        background-color: #49bd85;
-        color: #ffffff;
-        font-size: 1rem;
-        cursor: pointer;
-    }
-
-    .exit {
-        position: absolute;
-        top: 0.1rem;
-        right: 0.1rem;
-        background: none;
-        border: none;
-        cursor: pointer;
-    }
-
-    .tagDisplay {
-        display: flex;
-        gap: 0.4rem;
-        flex-wrap: wrap;
-        align-items: left;
-        justify-content: left;
-        position: relative;
-        width: 100%;
-        height: auto;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-        font-size: 1rem;
-    }
-    .tagInput {
-        width: 100%;
-        height: 100%;
-        background: none;
-        color: #eaffeb;
-        font-size: 1rem;
-        border: none;
-        outline: none;
-    }
-    ::placeholder {
-        color: #859a90;
-        opacity: 1;
-    }
-    .tag {
-        display: flex;
-        align-items: center;
-        border-radius: 0.25rem;
-        background-color: #2e4653;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        cursor: pointer;
-        border-width: 0rem;
-    }
-    .tag img {
-        width: 1rem;
-        height: 1rem;
-        margin-left: 0.2rem;
-    }
-
-    .tagDropdown {
-        width: 100%;
-        display: flex;
-        gap: 0.4rem;
-        flex-wrap: wrap;
-        position: absolute;
-        background-color: #2e4653;
-        box-shadow: 1px 1px 0.5rem rgba(0, 0, 0, 0.5);
-        border-radius: 0.5rem;
-        overflow-y: auto;
-        max-height: 10rem;
-        top: 100%;
-        left: 50%;
-        transform: translateX(-50%);
-    }
-
-    .avaliableTag {
-        width: 100%;
-        text-align: left;
-        background: none;
-        border: none;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        margin: 0%;
-        padding: 0 0.8rem 0.4rem;
-    }
-    .avaliableTag:first-child {
-        padding-top: 0.6rem;
-        background-color: hsl(201, 26%, 60%);
-    }
-    .avaliableTag:last-child {
-        padding-bottom: 0.6rem;
-    }
-
-    .compulsoryTags {
-        display: flex;
-        flex-direction: column;
-        gap: 0.4rem;
-        border-radius: 0.5rem;
-        background-color: none;
-        width: 100%;
-        font-size: 1rem;
-    }
-
-    .compulsoryContainer {
-        display: flex;
-        flex-direction: column;
-        align-items: left;
-        justify-content: top;
-        border-radius: 0.5rem;
-        background-color: none;
-    }
-
-    .compulsoryTagSelect {
-        width: 100%;
-        height: 100%;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        text-align: left;
-    }
-
-    .compulsoryTagSelect option {
-        background-color: #2e4653;
-        color: #eaffeb;
-    }
-</style>
--- a/src/lib/components/Navbar.svelte
+++ b/src/lib/components/Navbar.svelte
@@ -21,13 +21,14 @@
        display: flex;
        position: sticky;
        width: 100%;
-        height: 3.5rem;
+        height: 4rem;
        top: 0;
        left: 0;
        right: 0;
-        background: linear-gradient(-77deg, #2e4653, #223a37);
+        background: linear-gradient(-77deg, #2e4653, #3a5b56);
        box-shadow: 0rem 0rem 0.5rem #182125;
        align-items: center;
+        overflow: hidden;
        z-index: 100;
    }

--- a/src/lib/components/OpeningTimes.svelte
+++ b/src/lib/components/OpeningTimes.svelte
@@ -1,40 +0,0 @@
-<script lang="ts">
-    import type { Table } from "$lib";
-    import { formatTime } from "$lib";
-
-    interface Props {
-        hours: Table<"study_space_hours">[];
-    }
-
-    // Destructure hours with a safe default to avoid undefined
-    const { hours }: Props = $props();
-
-    // Determine today's index (0 = Sunday, 6 = Saturday)
-    const todayIndex = new Date().getDay();
-
-    // Find the hours entry matching today
-    const todayHours = hours.find((h) => h.day_of_week === todayIndex);
-
-    // Compute the display string for opening times
-    let openingDisplay = $state("");
-    if (todayHours) {
-        openingDisplay = todayHours.is_24_7
-            ? "Open 24/7"
-            : `${formatTime(todayHours.opens_at)} - ${formatTime(todayHours.closes_at)}`;
-    } else {
-        openingDisplay = "Closed";
-    }
-</script>
-
-<div class="opening-times">
-    <strong>Today's Opening Times:</strong>
-    {openingDisplay}
-</div>
-
-<style>
-    .opening-times {
-        margin-top: 0.5rem;
-        font-size: 0.9rem;
-        color: #eaffeb;
-    }
-</style>
--- a/src/lib/components/Report.svelte
+++ b/src/lib/components/Report.svelte
@@ -1,140 +0,0 @@
-<script lang="ts">
-    import { reportTypes } from "$lib";
-    import crossUrl from "$lib/assets/cross.svg";
-    import Textarea from "./inputs/Textarea.svelte";
-    import type { Table } from "$lib";
-    import type { SupabaseClient } from "@supabase/supabase-js";
-    import type { Database } from "$lib/database.d.ts";
-
-    interface Props {
-        data: { supabase: SupabaseClient<Database> };
-        studySpaceId: string;
-        hideFunc: () => void;
-    }
-
-    const { data, studySpaceId, hideFunc }: Props = $props();
-    const { supabase } = $derived(data);
-
-    let uploading = $state(false);
-    let reportData = $state<Omit<Table<"reports">, "id" | "created_at" | "updated_at">>({
-        study_space_id: studySpaceId,
-        type: "",
-        content: ""
-    });
-
-    async function uploadReport() {
-        const { error: reportUploadError } = await supabase
-            .from("reports")
-            .insert(reportData)
-            .select()
-            .single();
-
-        if (reportUploadError)
-            return alert(`Error submitting report: ${reportUploadError.message}`);
-        else alert("Report submitted successfully!");
-    }
-</script>
-
-<div class="overlay">
-    <form
-        onsubmit={async (event) => {
-            event.preventDefault();
-            uploading = true;
-            await uploadReport();
-            uploading = false;
-            hideFunc();
-        }}
-        class="reportContainer"
-    >
-        <h1 class="submitHeader">Submit a Report</h1>
-        <p>What's the reason?</p>
-        <select name="reportType" class="reportType" required bind:value={reportData.type}>
-            <option value="" disabled selected>Report type</option>
-            {#each reportTypes as reportType (reportType)}
-                <option value={reportType}>{reportType}</option>
-            {/each}
-        </select>
-        <label for="description">Briefly describe the problem:</label>
-        <Textarea
-            name="description"
-            placeholder="Image is inappropriate..."
-            rows={2}
-            bind:value={reportData.content}
-        />
-        <button
-            disabled={!reportData.type || reportData.content?.length === 0 || uploading}
-            class="submit">Submit</button
-        >
-        <button type="button" class="exit" aria-label="exit" onclick={hideFunc}
-            ><img src={crossUrl} alt="exit" /></button
-        >
-    </form>
-</div>
-
-<style>
-    .overlay {
-        display: flex;
-        width: 100%;
-        height: 100%;
-        position: fixed;
-        justify-content: center;
-        align-items: center;
-        background-color: rgba(8, 15, 18, 0.9);
-        z-index: 100;
-    }
-
-    .reportContainer {
-        display: flex;
-        flex-direction: column;
-        width: 80%;
-        gap: 0.5rem;
-        padding: 1rem;
-        background-color: #182125;
-        border-radius: 0.5rem;
-        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
-        color: #eaffeb;
-        position: absolute;
-        translate: 0 -3.5rem;
-        border: 2px solid #eaffeb;
-    }
-
-    .submitHeader {
-        width: 80%;
-    }
-    .reportType {
-        width: 100%;
-        height: 100%;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        text-align: left;
-    }
-
-    .reportType option {
-        background-color: #2e4653;
-        color: #eaffeb;
-    }
-
-    .submit {
-        width: 100%;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: none;
-        background-color: #49bd85;
-        color: #ffffff;
-        font-size: 1rem;
-        cursor: pointer;
-    }
-
-    .exit {
-        position: absolute;
-        top: 0.1rem;
-        right: 0.1rem;
-        background: none;
-        border: none;
-        cursor: pointer;
-    }
-</style>
--- a/src/lib/components/SpaceCard.svelte
+++ b/src/lib/components/SpaceCard.svelte
@@ -1,32 +1,21 @@
 <script lang="ts">
-    import CompulsoryTags from "./CompulsoryTags.svelte";
-    import OpeningTimes from "./OpeningTimes.svelte";
    import type { Table } from "$lib";

    interface Props {
        space: Table<"study_spaces">;
-        hours: Table<"study_space_hours">[];
        alt: string;
        imgSrc: string;
        href?: string;
    }

-    const { space, hours, alt, imgSrc, href }: Props = $props();
+    const { space, alt, imgSrc, href }: Props = $props();
 </script>

 <a class="card" {href}>
    <img src={imgSrc} {alt} />
    <div class="description">
        <h1>{space.location}</h1>
-        <div class="compulsoryContainer"><CompulsoryTags {space} /></div>
-        {#if space.tags.length > 0}
-            <div class="tagContainer">
-                {#each space.tags as tag (tag)}
-                    <span class="tag">{tag}</span>
-                {/each}
-            </div>
-        {/if}
-        <div class="openingTimesContainer"><OpeningTimes {hours} /></div>
+        <p>{space.description}</p>
    </div>
 </a>

@@ -44,6 +33,7 @@
    .description {
        padding: 0.5rem;
        color: #edebe9;
+        font-size: 0.875rem;
    }
    img {
        width: 100%;
@@ -51,37 +41,4 @@
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }
-
-    h1 {
-        margin-bottom: 0.5rem;
-    }
-
-    .tagContainer {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 0.4rem;
-        border-radius: 0.5rem;
-        background: none;
-        padding-top: 0.5rem;
-    }
-
-    .tag {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        text-align: center;
-        border-radius: 0.25rem;
-        background-color: #2e4653;
-        color: #eaffeb;
-        font-size: 0.875rem;
-        cursor: pointer;
-        padding: 0.2rem 0.6rem;
-    }
-
-    .compulsoryContainer {
-        display: grid;
-        grid-template-columns: repeat(auto-fit, minmax(3.75rem, 1fr));
-        gap: 0.3rem;
-        font-size: 0.8rem;
-    }
 </style>
--- a/src/lib/components/inputs/Images.svelte
+++ b/src/lib/components/inputs/Images.svelte
@@ -8,17 +8,9 @@
        minHeight?: string;
        files?: FileList;
        required?: boolean;
-        scrollPosition?: number;
    }

-    let {
-        name,
-        height,
-        minHeight,
-        files = $bindable(),
-        scrollPosition = $bindable(),
-        ...rest
-    }: Props = $props();
+    let { name, height, minHeight, files = $bindable(), ...rest }: Props = $props();
 </script>

 <label
@@ -42,7 +34,6 @@
                }
                files = dt.files;
            }}
-            bind:scrollPosition
        />
    {:else}
        <div class="message">
--- a/src/lib/components/inputs/TagFilter.svelte
+++ b/src/lib/components/inputs/TagFilter.svelte
--- a/src/lib/components/inputs/Text.svelte
+++ b/src/lib/components/inputs/Text.svelte
@@ -1,17 +1,15 @@
 <script lang="ts">
    interface Props {
-        inputElem?: HTMLInputElement;
        name: string;
        value?: string | null;
        placeholder?: string;
        required?: boolean;
-        type?: "text" | "password" | "email" | "number";
    }

-    let { inputElem = $bindable(), value = $bindable(), name, ...rest }: Props = $props();
+    let { value = $bindable(), name, ...rest }: Props = $props();
 </script>

-<input id={name} {name} bind:value bind:this={inputElem} {...rest} />
+<input type="text" id={name} {name} bind:value {...rest} />

 <style>
    input {
@@ -24,11 +22,6 @@
        font-size: 1rem;
    }

-    ::placeholder {
-        color: #859a90;
-        opacity: 1;
-    }
-
    input:focus {
        border-color: #007bff;
        outline: none;
--- a/src/lib/components/inputs/Textarea.svelte
+++ b/src/lib/components/inputs/Textarea.svelte
@@ -25,11 +25,6 @@
        font-size: 1rem;
    }

-    ::placeholder {
-        color: #859a90;
-        opacity: 1;
-    }
-
    textarea:focus {
        border-color: #007bff;
        outline: none;
--- a/src/lib/database.d.ts
+++ b/src/lib/database.d.ts
@@ -34,41 +34,6 @@ export type Database = {
  }
  public: {
    Tables: {
-      reports: {
-        Row: {
-          content: string | null
-          created_at: string | null
-          id: string
-          study_space_id: string | null
-          type: string
-          updated_at: string | null
-        }
-        Insert: {
-          content?: string | null
-          created_at?: string | null
-          id?: string
-          study_space_id?: string | null
-          type: string
-          updated_at?: string | null
-        }
-        Update: {
-          content?: string | null
-          created_at?: string | null
-          id?: string
-          study_space_id?: string | null
-          type?: string
-          updated_at?: string | null
-        }
-        Relationships: [
-          {
-            foreignKeyName: "reports_study_space_id_fkey"
-            columns: ["study_space_id"]
-            isOneToOne: false
-            referencedRelation: "study_spaces"
-            referencedColumns: ["id"]
-          },
-        ]
-      }
      study_space_images: {
        Row: {
          created_at: string | null
@@ -100,108 +65,31 @@ export type Database = {
      }
      study_spaces: {
        Row: {
-          building_location: Json | null
-          building_location_old: string | null
+          building_location: string | null
          created_at: string | null
          description: string | null
          id: string
          location: string | null
-          power: string
-          tags: string[]
          updated_at: string | null
-          volume: string
-          wifi: string
        }
        Insert: {
-          building_location?: Json | null
-          building_location_old?: string | null
+          building_location?: string | null
          created_at?: string | null
          description?: string | null
          id?: string
          location?: string | null
-          power: string
-          tags?: string[]
          updated_at?: string | null
-          volume: string
-          wifi: string
        }
        Update: {
-          building_location?: Json | null
-          building_location_old?: string | null
+          building_location?: string | null
          created_at?: string | null
          description?: string | null
          id?: string
          location?: string | null
-          power?: string
-          tags?: string[]
          updated_at?: string | null
-          volume?: string
-          wifi?: string
        }
        Relationships: []
      }
-      users: {
-        Row: {
-          created_at: string
-          id: string
-          is_admin: boolean
-          updated_at: string
-        }
-        Insert: {
-          created_at?: string
-          id: string
-          is_admin?: boolean
-          updated_at?: string
-        }
-        Update: {
-          created_at?: string
-          id?: string
-          is_admin?: boolean
-          updated_at?: string
-        }
-        Relationships: []
-      }
-      study_space_hours: {
-        Row: {
-          id: string
-          study_space_id: string
-          day_of_week: number
-          opens_at: string
-          closes_at: string
-          is_24_7: boolean
-          created_at: string | null
-          updated_at: string | null
-        }
-        Insert: {
-          id?: string
-          study_space_id: string
-          day_of_week: number
-          opens_at: string
-          closes_at: string
-          is_24_7: boolean
-          created_at?: string | null
-          updated_at?: string | null
-        }
-        Update: {
-          id?: string
-          study_space_id?: string
-          day_of_week?: number
-          opens_at?: string
-          closes_at?: string
-          is_24_7?: boolean
-          created_at?: string | null
-          updated_at?: string | null
-        }
-        Relationships: [
-          {
-            foreignKeyName: "study_space_hours_study_space_id_fkey"
-            columns: ["study_space_id"]
-            isOneToOne: false
-            referencedRelation: "study_spaces"
-            referencedColumns: ["id"]
-          },
-        ]
-      }
    }
    Views: {
      [_ in never]: never
@@ -331,3 +219,4 @@ export const Constants = {
    Enums: {},
  },
 } as const
+
--- a/src/lib/index.ts
+++ b/src/lib/index.ts
@@ -1,4 +1,3 @@
-import { PUBLIC_GMAPS_API_KEY } from "$env/static/public";
 import type { Database } from "./database.d.ts";

 export type Table<T extends keyof Database["public"]["Tables"]> =
@@ -6,56 +5,23 @@ export type Table<T extends keyof Database["public"]["Tables"]> =
 export type Enum<T extends keyof Database["public"]["Enums"]> = Database["public"]["Enums"][T];

 export const availableStudySpaceTags = [
-    "Crowded",
+    "Quiet",
+    "Loud",
+    "Silent",
    "Group study",
+    "Individual study",
+    "Power outlets",
+    "No power outlets",
+    "24/7",
    "Food allowed",
    "No food allowed",
-    "Well lit",
-    "Poorly lit",
+    "Good wifi",
+    "Bad wifi",
+    "No wifi",
    "Whiteboard",
    "Restricted access",
    "Hot",
    "Air conditioned",
    "Cold",
-    "PCs",
    "Cringe"
 ];
-
-export const volumeTags = ["Silent", "Some Noise", "Loud"];
-export const wifiTags = ["Good WiFi", "Moderate WiFi", "Bad/No WiFi"];
-export const powerOutletTags = ["Many Outlets", "Some Outlets", "No Outlets"];
-
-export const allTags = [...availableStudySpaceTags, ...volumeTags, ...wifiTags, ...powerOutletTags];
-
-export const reportTypes = [
-    "Inappropriate content",
-    "Duplicate content",
-    "Incorrect content",
-    "Other"
-];
-
-export async function gmapsLoader() {
-    const { Loader } = await import("@googlemaps/js-api-loader");
-    return new Loader({
-        apiKey: PUBLIC_GMAPS_API_KEY,
-        version: "weekly",
-        libraries: ["places"]
-    });
-}
-
-export function formatTime(time: string) {
-    const [h, m] = time.split(":").map(Number);
-    const date = new Date();
-    date.setHours(h, m);
-    return date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
-}
-
-export const daysOfWeek = [
-    "Sunday",
-    "Monday",
-    "Tuesday",
-    "Wednesday",
-    "Thursday",
-    "Friday",
-    "Saturday"
-];
--- a/src/routes/+layout.server.ts
+++ b/src/routes/+layout.server.ts
@@ -1,29 +1,9 @@
 import type { LayoutServerLoad } from "./$types";

-export const load: LayoutServerLoad = async ({
-    locals: { safeGetSession, supabase },
-    cookies,
-    depends
-}) => {
-    depends("supabase:auth");
+export const load: LayoutServerLoad = async ({ locals: { safeGetSession }, cookies }) => {
    const { session } = await safeGetSession();
-    let adminMode = false;
-    if (session) {
-        const { data: userData, error: userError } = await supabase
-            .from("users")
-            .select("*")
-            .eq("id", session.user.id)
-            .single();
-        if (userError) {
-            console.error("Failed to fetch user data:", userError);
-        }
-        if (userData?.is_admin) {
-            adminMode = true;
-        }
-    }
    return {
        session,
-        adminMode,
        cookies: cookies.getAll()
    };
 };
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,24 +1,7 @@
 <script lang="ts">
-    import posthog from "posthog-js";
    import logoUrl from "$lib/assets/logo.svg";
-    import { onMount } from "svelte";
-    import { invalidate } from "$app/navigation";

-    let { data, children } = $props();
-    let { session, supabase } = $derived(data);
-
-    onMount(() => {
-        posthog.init("phc_hTnel2Q8GKo0TgIBnFWBueJW1ATmCG9tJOtETnQTUdY", {
-            api_host: "https://eu.i.posthog.com",
-            person_profiles: "always"
-        });
-        const { data } = supabase.auth.onAuthStateChange((_, newSession) => {
-            if (newSession?.expires_at !== session?.expires_at) {
-                invalidate("supabase:auth");
-            }
-        });
-        return () => data.subscription.unsubscribe();
-    });
+    const { children } = $props();
 </script>

 <svelte:head>
@@ -32,8 +15,7 @@
    :global(body) {
        margin: 0;
        padding: 0;
-        width: 100%;
-        overflow-x: hidden;
+        width: 100vw;
    }

    :global(html) {
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -40,5 +40,5 @@ export const load: LayoutLoad = async ({ data, depends, fetch }) => {
        data: { user }
    } = await supabase.auth.getUser();

-    return { session, supabase, user, adminMode: data.adminMode };
+    return { session, supabase, user };
 };
--- a/src/routes/+page.server.ts
+++ b/src/routes/+page.server.ts
@@ -5,7 +5,7 @@ export const load: PageServerLoad = async ({ depends, locals: { supabase } }) =>
    depends("db:study_spaces");
    const { data: studySpaces, error: err } = await supabase
        .from("study_spaces")
-        .select("*, study_space_images(*), study_space_hours(*)");
+        .select("*, study_space_images(*)");
    if (err) error(500, "Failed to load study spaces");

    return {
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -3,186 +3,19 @@
    import defaultImg from "$lib/assets/study_space.png";
    import crossUrl from "$lib/assets/cross.svg";
    import Navbar from "$lib/components/Navbar.svelte";
-    import { allTags, volumeTags, wifiTags, powerOutletTags } from "$lib";
-    import Button from "$lib/components/Button.svelte";

    const { data } = $props();
-    const { studySpaces, supabase, session, adminMode } = $derived(data);
-
-    let selectedTags = $state<string[]>([]);
-    let tagFilter = $state("");
-    let openingFilter = $state("");
-    let closingFilter = $state("");
-    let tagFilterElem = $state<HTMLInputElement>();
-
-    function categorySelected(category: string[]) {
-        return category.some((tag) => selectedTags.includes(tag));
-    }
-
-    let filteredTags = $derived(
-        allTags
-            .filter((tag) => tag.toLowerCase().includes(tagFilter.toLowerCase()))
-            .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;
-            })
-    );
-
-    // Convert "HH:MM" or "HH:MM:SS" to minutes since midnight
-    function toMinutes(timeStr: string): number {
-        const [h, m] = timeStr.slice(0, 5).split(":").map(Number);
-        return h * 60 + m;
-    }
-
-    // Combine tag and time filtering
-    let filteredStudySpaces = $derived(
-        studySpaces
-            // tag filtering
-            .filter((space) => {
-                if (selectedTags.length === 0) return true;
-                const allTags = [
-                    ...(space.tags || []),
-                    space.volume,
-                    space.wifi,
-                    space.power
-                ].filter(Boolean);
-                return selectedTags.every((tag) => allTags.includes(tag));
-            })
-            // opening time filter
-            .filter((space) => {
-                if (!openingFilter) return true;
-                const entry = space.study_space_hours?.find(
-                    (h) => h.day_of_week === new Date().getDay()
-                );
-                if (!entry) return false;
-                if (entry.is_24_7) return true;
-                const openMin = toMinutes(entry.opens_at);
-                let closeMin = toMinutes(entry.closes_at);
-                // Treat midnight as end of day and handle overnight spans
-                if (closeMin === 0) closeMin = 24 * 60;
-                if (closeMin <= openMin) closeMin += 24 * 60;
-                const filterMin = toMinutes(openingFilter);
-                // Include spaces open at the filter time
-                return filterMin >= openMin && filterMin < closeMin;
-            })
-            // closing time filter
-            .filter((space) => {
-                if (!closingFilter) return true;
-                const entry = space.study_space_hours?.find(
-                    (h) => h.day_of_week === new Date().getDay()
-                );
-                if (!entry) return false;
-                if (entry.is_24_7) return true;
-                const openMin = toMinutes(entry.opens_at);
-                let closeMin = toMinutes(entry.closes_at);
-                if (closeMin === 0) closeMin = 24 * 60;
-                if (closeMin <= openMin) closeMin += 24 * 60;
-                const filterMin =
-                    toMinutes(closingFilter) === 0 ? 24 * 60 : toMinutes(closingFilter);
-                // Include spaces still open at the filter time
-                return filterMin > openMin && filterMin <= closeMin;
-            })
-    );
-
-    let dropdownVisible = $state(false);
-
-    function deleteTag(tagName: string) {
-        return () => {
-            selectedTags = selectedTags.filter((tag) => tag !== tagName);
-        };
-    }
-
-    function addTag(tagName: string) {
-        return () => {
-            if (!selectedTags.includes(tagName)) {
-                selectedTags.push(tagName);
-            }
-            tagFilter = "";
-        };
-    }
+    const { studySpaces, supabase } = $derived(data);
 </script>

 <Navbar>
-    <div class="navActions">
-        <div class="tagDisplay">
-            {#each selectedTags as tagName (tagName)}
-                <button class="tag" onclick={deleteTag(tagName)} type="button">
-                    {tagName}
-                    <img src={crossUrl} alt="delete" /></button
-                >
-            {/each}
-            <input
-                type="text"
-                name="tagInput"
-                class="tagInput"
-                bind:value={tagFilter}
-                bind:this={tagFilterElem}
-                onfocus={() => {
-                    dropdownVisible = true;
-                }}
-                onblur={() => {
-                    dropdownVisible = false;
-                }}
-                onkeypress={(event) => {
-                    if (event.key === "Enter") {
-                        event.preventDefault();
-                        const tag = filteredTags[0];
-                        if (tag) addTag(tag)();
-                    }
-                }}
-                placeholder="Search by tags..."
-            />
-            {#if dropdownVisible}
-                <div class="tagDropdown">
-                    {#each filteredTags as avaliableTag (avaliableTag)}
-                        <button
-                            class="avaliableTag"
-                            onclick={addTag(avaliableTag)}
-                            onmousedown={(e) => {
-                                // Keep input focused
-                                e.preventDefault();
-                                e.stopPropagation();
-                            }}
-                            type="button"
-                        >
-                            {avaliableTag}
-                        </button>
-                    {/each}
-                </div>
-            {/if}
-        </div>
-        {#if session}
-            <a href="/space/new/edit">
-                <img src={crossUrl} alt="new" class="new-space" />
-            </a>
-        {/if}
-    </div>
+    <a href="/space">
+        <img src={crossUrl} alt="new" class="new-space" />
+    </a>
 </Navbar>

 <main>
-    <div class="time-filter-container">
-        <label>
-            Open from:
-            <input type="time" bind:value={openingFilter} />
-        </label>
-        <label>
-            Open until:
-            <input type="time" bind:value={closingFilter} />
-        </label>
-    </div>
-    {#if adminMode}
-        <div class="checkReports">
-            <Button href="/space/reports" type="link" style="red">Check Reports</Button>
-        </div>
-    {/if}
-    {#each filteredStudySpaces as studySpace (studySpace.id)}
+    {#each studySpaces as studySpace (studySpace.id)}
        {@const imgUrl =
            studySpace.study_space_images.length > 0
                ? supabase.storage
@@ -194,19 +27,10 @@
            href="/space/{studySpace.id}"
            imgSrc={imgUrl}
            space={studySpace}
-            hours={studySpace.study_space_hours}
        />
    {/each}
 </main>

-<footer>
-    {#if session}
-        <Button onclick={() => supabase.auth.signOut()}>Signout</Button>
-    {:else}
-        <Button href="/auth" type="link">Login / Signup</Button>
-    {/if}
-</footer>
-
 <style>
    main {
        display: grid;
@@ -219,137 +43,10 @@
        margin: 0 auto;
    }

-    footer {
-        display: flex;
-        flex-direction: column;
-        max-width: 600px;
-        width: 100%;
-        padding: 1rem;
-        margin: 0 auto;
-    }
-
    .new-space {
        transform: rotate(45deg);
    }

-    .navActions {
-        display: flex;
-        height: 100%;
-        width: 100%;
-        align-items: center;
-        padding-left: 2rem;
-        gap: 1rem;
-        z-index: 200;
-    }
-
-    .time-filter-container {
-        grid-column: 1 / -1;
-        display: flex;
-        gap: 1rem;
-        justify-content: center;
-        margin-bottom: 0.5rem;
-    }
-    .time-filter-container label {
-        display: flex;
-        align-items: center;
-        gap: 0.5rem;
-        font-size: 1rem;
-        color: #eaffeb;
-    }
-    .time-filter-container input[type="time"] {
-        background: none;
-        border: 2px solid #eaffeb;
-        border-radius: 0.5rem;
-        padding: 0.25rem 0.5rem;
-        color: #eaffeb;
-    }
-
-    .tagDisplay {
-        display: flex;
-        gap: 0.4rem;
-        flex-wrap: wrap;
-        align-items: left;
-        justify-content: left;
-        position: relative;
-        width: 100%;
-        height: auto;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-        font-size: 1rem;
-    }
-    .tagInput {
-        flex: 1 1 100%;
-        min-width: 10rem;
-        background: none;
-        color: #eaffeb;
-        font-size: 1rem;
-        border: none;
-        outline: none;
-    }
-    ::placeholder {
-        color: #859a90;
-        opacity: 1;
-    }
-    .tag {
-        display: flex;
-        align-items: center;
-        border-radius: 0.25rem;
-        background-color: #2e4653;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        cursor: pointer;
-        border-width: 0rem;
-    }
-    .tag img {
-        width: 1rem;
-        height: 1rem;
-        margin-left: 0.2rem;
-    }
-
-    .tagDropdown {
-        width: 100%;
-        display: flex;
-        gap: 0.4rem;
-        flex-wrap: wrap;
-        position: absolute;
-        background-color: #2e4653;
-        box-shadow: 1px 1px 0.5rem rgba(0, 0, 0, 0.5);
-        border-radius: 0.5rem;
-        overflow-y: auto;
-        max-height: 10rem;
-        top: 100%;
-        left: 50%;
-        transform: translateX(-50%);
-        z-index: 1000;
-    }
-
-    .avaliableTag {
-        width: 100%;
-        text-align: left;
-        background: none;
-        border: none;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        margin: 0%;
-        padding: 0 0.8rem 0.4rem;
-    }
-    .avaliableTag:first-child {
-        padding-top: 0.6rem;
-        background-color: hsl(201, 26%, 60%);
-    }
-    .avaliableTag:last-child {
-        padding-bottom: 0.6rem;
-    }
-    .checkReports {
-        grid-column: 1 / -1;
-        display: flex;
-        flex-direction: column;
-        font-size: 1.2rem;
-    }
-
    @media (max-width: 20rem) {
        main {
            grid-template-columns: 1fr;
--- a/src/routes/auth/+layout.svelte
+++ b/src/routes/auth/+layout.svelte
@@ -1,14 +0,0 @@
-<script lang="ts">
-    import Navbar from "$lib/components/Navbar.svelte";
-    import crossUrl from "$lib/assets/cross.svg";
-
-    const { children } = $props();
-</script>
-
-<Navbar>
-    <a href="/">
-        <img src={crossUrl} alt="close" />
-    </a>
-</Navbar>
-
-{@render children?.()}
--- a/src/routes/auth/+page.server.ts
+++ b/src/routes/auth/+page.server.ts
@@ -1,30 +0,0 @@
-import { redirect, error } from "@sveltejs/kit";
-
-import type { Actions } from "./$types";
-
-export const actions: Actions = {
-    signup: async ({ request, locals: { supabase } }) => {
-        const formData = await request.formData();
-        const email = formData.get("email") as string;
-        const password = formData.get("password") as string;
-
-        const { error: authError } = await supabase.auth.signUp({ email, password });
-        if (authError) {
-            error(400, "Failed to sign up: " + authError.message);
-        } else {
-            redirect(303, "/");
-        }
-    },
-    login: async ({ request, locals: { supabase } }) => {
-        const formData = await request.formData();
-        const email = formData.get("email") as string;
-        const password = formData.get("password") as string;
-
-        const { error: authError } = await supabase.auth.signInWithPassword({ email, password });
-        if (authError) {
-            error(400, "Failed to log in: " + authError.message);
-        } else {
-            redirect(303, "/");
-        }
-    }
-};
--- a/src/routes/auth/+page.svelte
+++ b/src/routes/auth/+page.svelte
@@ -1,36 +0,0 @@
-<script lang="ts">
-    import Button from "$lib/components/Button.svelte";
-    import Text from "$lib/components/inputs/Text.svelte";
-</script>
-
-<form method="POST" action="?/login">
-    <label for="email">Email</label>
-    <Text type="email" name="email" placeholder="your@email.com" />
-
-    <label for="password">Password</label>
-    <Text type="password" name="password" placeholder="*********" />
-
-    <div class="actions">
-        <Button type="submit">Login</Button>
-        <Button formaction="?/signup">Signup</Button>
-    </div>
-</form>
-
-<style>
-    form {
-        display: flex;
-        flex-direction: column;
-        gap: 0.5rem;
-        max-width: 600px;
-        margin: 1rem auto;
-    }
-    label {
-        margin-top: 0.5rem;
-    }
-    .actions {
-        display: grid;
-        margin-top: 0.5rem;
-        grid-template-columns: 1fr 1fr;
-        gap: 1rem;
-    }
-</style>
--- a/src/routes/space/+page.svelte
+++ b/src/routes/space/+page.svelte
@@ -0,0 +1,263 @@
+<script lang="ts">
+    import { goto } from "$app/navigation";
+    import Text from "$lib/components/inputs/Text.svelte";
+    import Textarea from "$lib/components/inputs/Textarea.svelte";
+    import Navbar from "$lib/components/Navbar.svelte";
+    import crossUrl from "$lib/assets/cross.svg";
+    import Button from "$lib/components/Button.svelte";
+    import Images from "$lib/components/inputs/Images.svelte";
+    import type { Table } from "$lib";
+    import { availableStudySpaceTags } from "$lib/index"
+
+    const { data } = $props();
+    const { supabase } = $derived(data);
+
+    let spaceImgs = $state<FileList>();
+    let studySpaceData = $state<Omit<Table<"study_spaces">, "id" | "created_at" | "updated_at">>({
+        description: "",
+        building_location: "",
+        location: ""
+    });
+
+    async function uploadStudySpace() {
+        if (!spaceImgs || spaceImgs.length < 1) return alert("Please select an image file.");
+
+        const { data: studySpaceInsert, error: studySpaceError } = await supabase
+            .from("study_spaces")
+            .insert(studySpaceData)
+            .select()
+            .single();
+        if (studySpaceError)
+            return alert(`Error uploading study space: ${studySpaceError.message}`);
+
+        const imgUploads = await Promise.all(
+            Array(spaceImgs.length)
+                .keys()
+                .map(async (i) => {
+                    const imageFile = spaceImgs![i];
+                    const resp = await supabase.storage
+                        .from("files_bucket")
+                        .upload(`public/${studySpaceInsert.id}-${imageFile.name}`, imageFile, {
+                            contentType: imageFile.type
+                        });
+                    return resp;
+                })
+        );
+        const imageError = imgUploads.find(({ error }) => error)?.error;
+        if (imageError) return alert(`Error uploading image: ${imageError.message}`);
+
+        const { error: imageInsertError } = await supabase
+            .from("study_space_images")
+            .insert(
+                imgUploads.map(({ data }) => ({
+                    study_space_id: studySpaceInsert.id,
+                    image_path: data!.path
+                }))
+            )
+            .select();
+        if (imageInsertError) return alert(`Error creating image: ${imageInsertError.message}`);
+
+        alert("Thank you for your contribution!");
+        // Redirect to the new study space page
+        await goto(`/space/${studySpaceInsert.id}`, {
+            invalidate: ["db:study_spaces"]
+        });
+    }
+
+    let selectedTags = $state<string[]>([]);
+
+    function toggleTag(tag: string) {
+        if (selectedTags.includes(tag)) {
+        selectedTags = selectedTags.filter(t => t !== tag);
+        } else {
+            selectedTags = [...selectedTags, tag];
+        }
+    }
+
+</script>
+
+<Navbar>
+    <a href="/">
+        <img src={crossUrl} alt="close" />
+    </a>
+</Navbar>
+
+<form
+    onsubmit={async (event) => {
+        event.preventDefault();
+        await uploadStudySpace();
+    }}
+>
+    <Images name="study-space-image" minHeight="16rem" bind:files={spaceImgs} required />
+
+    <label for="location">Enter the name:</label>
+    <Text
+        name="location"
+        bind:value={studySpaceData.location}
+        placeholder="Room 123, Floor 1"
+        required
+    />
+
+    <fieldset>
+        <legend>Select applicable tags:</legend>
+        <div class="tag-list">
+            {#each availableStudySpaceTags as tag}
+                <label class="tag-checkbox">
+                    <input
+                        type="checkbox"
+                        checked={selectedTags.includes(tag)}
+                        onchange={() => toggleTag(tag)}
+                    />
+                    {tag}
+                </label>
+            {/each}
+        </div>
+    </fieldset>
+
+    <label for="description">Add a description:</label>
+    <Textarea
+        name="description"
+        bind:value={studySpaceData.description}
+        placeholder="A quiet and well-lit, but small space..."
+        rows={5}
+        required
+    />
+
+    <label for="building-location">Add the building location:</label>
+    <Text
+        name="building-location"
+        bind:value={studySpaceData.building_location}
+        placeholder="Huxley Building, Imperial South Kensington Campus"
+        required
+    />
+
+    <div class="submit">
+        <Button
+            type="submit"
+            disabled={(spaceImgs?.length || 0) === 0 ||
+                !studySpaceData.location ||
+                !studySpaceData.description ||
+                !studySpaceData.building_location}
+        >
+            Share this study space!
+        </Button>
+    </div>
+</form>
+
+<style>
+    /* .tag-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+    margin-top: 0.5rem;
+    }
+
+    .tag-checkbox {
+        background: #2e4653;
+        color: white;
+        border-radius: 0.5rem;
+        padding: 0.25rem 0.75rem;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        gap: 0.25rem;
+        font-size: 1rem;
+    }
+
+    input[type="checkbox"] {
+        accent-color: #49bd85;
+    } */
+
+
+    fieldset {
+    border: none;
+    padding: 0;
+    margin-top: 1rem;
+    }
+
+    legend {
+        font-size: 1rem;
+        color: #ffffff;
+        margin-bottom: 0.5rem;
+    }
+
+    .tag-list {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 0.5rem;
+    }
+
+    .tag-checkbox {
+        display: flex;
+        align-items: center;
+        background-color: #2e4653;
+        color: #ffffff;
+        padding: 0.4rem 0.8rem;
+        border-radius: 9999px; /* pill shape */
+        font-size: 0.85rem;
+        font-weight: 500;
+        cursor: pointer;
+        transition: background-color 0.2s ease, transform 0.1s ease;
+    }
+
+    .tag-checkbox:hover {
+        background-color: #3a5b56;
+        transform: scale(1.03);
+    }
+
+    .tag-checkbox input[type="checkbox"] {
+        appearance: none;
+        width: 1rem;
+        height: 1rem;
+        margin-right: 0.5rem;
+        border-radius: 0.25rem;
+        border: 2px solid #49bd85;
+        background-color: transparent;
+        position: relative;
+    }
+
+    .tag-checkbox input[type="checkbox"]:checked {
+        background-color: #49bd85;
+        border-color: #49bd85;
+    }
+
+    .tag-checkbox input[type="checkbox"]::after {
+        content: "";
+        display: block;
+        width: 0.25rem;
+        height: 0.5rem;
+        border: solid #1f2a2f;
+        border-width: 0 0.125rem 0.125rem 0;
+        transform: rotate(45deg);
+        position: absolute;
+        top: 0.15rem;
+        left: 0.32rem;
+        opacity: 0;
+    }
+
+    .tag-checkbox input[type="checkbox"]:checked::after {
+        opacity: 1;
+    }
+    form {
+        display: flex;
+        flex-direction: column;
+        padding: 1.5rem;
+        gap: 0.5rem;
+        max-width: 32rem;
+        margin: 0 auto;
+    }
+
+    label {
+        color: #ffffff;
+        margin-top: 0.5rem;
+    }
+    .submit {
+        position: sticky;
+        display: flex;
+        flex-direction: column;
+        margin-top: 0.5rem;
+        bottom: 0;
+        margin-left: -0.5rem;
+        width: calc(100% + 1rem);
+    }
+</style>
--- a/src/routes/space/[id]/+page.server.ts
+++ b/src/routes/space/[id]/+page.server.ts
@@ -1,11 +1,10 @@
 import { error } from "@sveltejs/kit";
 import type { PageServerLoad } from "./$types";

-export const load: PageServerLoad = async ({ depends, params, locals: { supabase } }) => {
-    depends("db:study_spaces");
+export const load: PageServerLoad = async ({ params, locals: { supabase } }) => {
    const { data: space, error: err } = await supabase
        .from("study_spaces")
-        .select("*, study_space_images(*), study_space_hours(*)")
+        .select("*, study_space_images(*)")
        .eq("id", params.id)
        .single();
    if (err) error(500, "Failed to load study space");
--- a/src/routes/space/[id]/+page.svelte
+++ b/src/routes/space/[id]/+page.svelte
@@ -3,17 +3,10 @@
    import crossUrl from "$lib/assets/cross.svg";
    import placeholder from "$lib/assets/study_space.png";
    import Carousel from "$lib/components/Carousel.svelte";
-    import CompulsoryTags from "$lib/components/CompulsoryTags.svelte";
-    import Report from "$lib/components/Report.svelte";
-    import Feedback from "$lib/components/Feedback.svelte";
-    import { onMount } from "svelte";
-    import { gmapsLoader, daysOfWeek, formatTime } from "$lib";
-    import Button from "$lib/components/Button.svelte";

    const { data } = $props();
-    const { space, supabase, adminMode } = $derived(data);
+    const { space, supabase } = $derived(data);

-    const place = $derived(space.building_location as google.maps.places.PlaceResult);
    const imgUrls = $derived(
        space.study_space_images.length === 0
            ? [placeholder]
@@ -23,40 +16,6 @@
                          .publicUrl
              )
    );
-
-    let isReportVisible = $state(false);
-    function hideReport() {
-        isReportVisible = false;
-    }
-
-    let isFeedbackPromptVisible = $state(false);
-    function hideFeedbackPrompt() {
-        isFeedbackPromptVisible = false;
-    }
-
-    let mapElem = $state<HTMLDivElement>();
-    onMount(async () => {
-        if (!mapElem) return console.error("Map element not found");
-        const loader = await gmapsLoader();
-        const { Map } = await loader.importLibrary("maps");
-        const { AdvancedMarkerElement } = await loader.importLibrary("marker");
-        const map = new Map(mapElem, {
-            center: place.geometry?.location,
-            zoom: 15,
-            mapId: "9f4993cd3fb1504d495821a5"
-        });
-        new AdvancedMarkerElement({
-            position: place.geometry?.location,
-            map
-        });
-    });
-
-    const hoursByDay = $derived(new Map(space.study_space_hours.map((h) => [h.day_of_week, h])));
-
-    const openingEntries = daysOfWeek.map((day, idx) => ({
-        day,
-        entry: hoursByDay.get(idx)
-    }));
 </script>

 <Navbar>
@@ -65,84 +24,19 @@
    </a>
 </Navbar>

-{#if isReportVisible}<Report {data} studySpaceId={space.id} hideFunc={hideReport} />
-{/if}
-{#if isFeedbackPromptVisible}
-    <Feedback
-        studySpaceData={{
-            ...space,
-            building_location: place
-        }}
-        {supabase}
-        hideFunc={hideFeedbackPrompt}
-    />
-{/if}
 <main>
    <Carousel urls={imgUrls} />
    <div class="nameContainer">
        {space.location}
    </div>
-    {#if space.description != null && space.description.length > 0}
-        <p class="descContainer">
-            {space.description}
-        </p>
-        <hr />
-    {/if}
-    <div class="compulsoryContainer"><CompulsoryTags {space} /></div>
-    {#if space.tags.length > 0}
-        <div class="tagContainer">
-            {#each space.tags as tag (tag)}
-                <span class="tag">
-                    {tag}
-                </span>
-            {/each}
-        </div>
-    {/if}
-    <hr />
-    <div class="subtitle">Opening Times:</div>
-    {#each openingEntries as { day, entry } (entry)}
-        <div class="opening-entry">
-            <span class="day">{day}:</span>
-            <span class="times">
-                {#if entry}
-                    {entry.is_24_7
-                        ? "Open All Day"
-                        : `${formatTime(entry.opens_at)} – ${formatTime(entry.closes_at)}`}
-                {:else}
-                    Closed
-                {/if}
-            </span>
-        </div>
-    {/each}
-
-    <div class="subtitle">Where it is:</div>
-    <p class="addrContainer">
-        {#if place.name}
-            {place.name} <br />
-        {/if}
-        {#each place.formatted_address?.split(",") || [] as line (line)}
-            {line.trim()} <br />
-        {/each}
+    <p class="descContainer">
+        {space.description}
+    </p>
+    <hr />
+    <div class="whereSubtitle">Where it is:</div>
+    <p class="addrContainer">
+        {space.building_location}
    </p>
-    <div class="addrMap" bind:this={mapElem}></div>
-
-    <button
-        type="button"
-        class="feedbackButton"
-        onclick={() => {
-            isFeedbackPromptVisible = true;
-        }}
-    >
-        Help categorise this space
-    </button>
-
-    <div class="actions">
-        {#if adminMode}
-            <Button href="/space/{space.id}/edit" type="link">Edit</Button>
-        {:else}
-            <Button onclick={() => (isReportVisible = true)} style="red">Report</Button>
-        {/if}
-    </div>
 </main>

 <style>
@@ -169,7 +63,6 @@
        border: none;
        margin: 0 auto;
    }
-
    .nameContainer {
        z-index: 10;
        display: block;
@@ -194,7 +87,7 @@
        font-size: 1.2rem;
    }

-    .subtitle {
+    .whereSubtitle {
        font-size: 1.2rem;
        font-weight: bold;
        color: #ffffff;
@@ -203,79 +96,6 @@

    .addrContainer {
        font-size: 1.2rem;
-        padding: 0rem 1.4rem 1rem;
-    }
-
-    .tagContainer {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 0.4rem;
-        padding: 1.4rem;
-        border-radius: 0.5rem;
-        background: none;
-    }
-
-    .tag {
-        display: flex;
-        align-items: center;
-        border-radius: 0.25rem;
-        background-color: #2e4653;
-        color: #eaffeb;
-        font-size: 1.1rem;
-        cursor: pointer;
-        padding: 0.2rem 0.6rem;
-    }
-
-    .compulsoryContainer {
-        display: grid;
-        grid-template-columns: repeat(3, 1fr);
-        gap: 0.5rem;
-        padding: 1.4rem;
-        font-size: 1.3rem;
-        padding-bottom: 0;
-    }
-
-    .addrMap {
-        width: 100%;
-        aspect-ratio: 1 / 1;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-    }
-    .feedbackButton {
-        width: 100%;
-        padding: 0.7rem;
-        border-radius: 0.5rem;
-        border: none;
-        background-color: #49bd85;
-        color: #ffffff;
-        font-size: 1rem;
-        cursor: pointer;
-        margin-top: 1rem;
-        text-align: center;
-    }
-    .actions {
-        display: flex;
-        flex-direction: column;
-        padding-top: 1rem;
-    }
-
-    .opening-entry {
-        display: grid;
-        grid-template-columns: auto 1fr;
-        gap: 0.75rem;
-        padding: 0.5rem 1.4rem;
-        align-items: center;
-    }
-    .opening-entry .day {
-        font-weight: bold;
-        color: #ffffff;
-        white-space: nowrap;
-    }
-    .opening-entry .times {
-        font-family: monospace;
-        background-color: rgba(255, 255, 255, 0.1);
-        padding: 0.25rem 0.5rem;
-        border-radius: 0.25rem;
-        color: #eaffeb;
+        padding: 0rem 1.4rem;
    }
 </style>
--- a/src/routes/space/[id]/edit/+page.server.ts
+++ b/src/routes/space/[id]/edit/+page.server.ts
@@ -1,59 +0,0 @@
-import { error } from "@sveltejs/kit";
-import type { PageServerLoad } from "./$types";
-import type { Table } from "$lib";
-
-type StudySpaceData = Omit<
-    Table<"study_spaces">,
-    "id" | "created_at" | "updated_at" | "building_location_old" | "building_location"
-> & {
-    id?: string;
-    building_location?: google.maps.places.PlaceResult;
-    opening_times?: {
-        day_of_week: number;
-        opens_at: string;
-        closes_at: string;
-        is_24_7: boolean;
-    }[];
-};
-
-export const load: PageServerLoad = async ({ params, locals: { supabase } }) => {
-    if (params.id === "new") {
-        return {
-            space: {
-                description: "",
-                building_location: undefined,
-                location: "",
-                tags: [],
-                volume: "",
-                power: "",
-                wifi: ""
-            } as StudySpaceData
-        };
-    }
-
-    const { data: space, error: err } = await supabase
-        .from("study_spaces")
-        .select("*, study_space_images(*)")
-        .eq("id", params.id)
-        .single();
-    if (err) error(500, "Failed to load study space");
-    const studySpaceData = space as StudySpaceData & Partial<typeof space>;
-
-    const images = studySpaceData.study_space_images || [];
-    const { data: hours, error: hoursErr } = await supabase
-        .from("study_space_hours")
-        .select("day_of_week, opens_at, closes_at, is_24_7")
-        .eq("study_space_id", params.id)
-        .order("day_of_week", { ascending: true });
-    if (hoursErr) error(500, "Failed to load opening times");
-    studySpaceData.opening_times = hours;
-
-    delete studySpaceData.created_at;
-    delete studySpaceData.updated_at;
-    delete studySpaceData.study_space_images;
-
-    return {
-        space: studySpaceData as StudySpaceData,
-        images
-    };
-};
--- a/src/routes/space/[id]/edit/+page.svelte
+++ b/src/routes/space/[id]/edit/+page.svelte
@@ -1,605 +0,0 @@
-<script lang="ts">
-    import { goto } from "$app/navigation";
-    import Text from "$lib/components/inputs/Text.svelte";
-    import Textarea from "$lib/components/inputs/Textarea.svelte";
-    import Navbar from "$lib/components/Navbar.svelte";
-    import crossUrl from "$lib/assets/cross.svg";
-    import Button from "$lib/components/Button.svelte";
-    import Images from "$lib/components/inputs/Images.svelte";
-    import {
-        availableStudySpaceTags,
-        wifiTags,
-        powerOutletTags,
-        volumeTags,
-        gmapsLoader,
-        daysOfWeek
-    } from "$lib";
-    import { onMount } from "svelte";
-    import type { Json } from "$lib/database.js";
-
-    const { data } = $props();
-    const { supabase } = $derived(data);
-
-    const { space, images } = $derived(data);
-    const studySpaceData = $state({
-        opening_times: daysOfWeek.map((_, index) => ({
-            day_of_week: index,
-            opens_at: "",
-            closes_at: "",
-            is_24_7: false
-        })),
-        ...space
-    });
-
-    $effect(() => {
-        if (!space) return;
-        const { opening_times, ...rest } = space;
-        Object.assign(studySpaceData, rest);
-        if (opening_times) {
-            studySpaceData.opening_times = opening_times;
-        }
-    });
-
-    let scrollPosition = $state(0);
-    const existingImages = $derived(
-        Promise.all(
-            images?.map(async ({ image_path }) => {
-                const { data, error } = await supabase.storage
-                    .from("files_bucket")
-                    .download(image_path);
-                if (error) {
-                    console.error(`Error downloading image ${image_path}:`, error);
-                    return null;
-                }
-                return { data, name: image_path.split("/").pop() || "image", type: data.type };
-            }) || []
-        )
-    );
-    let spaceImgs = $state<FileList>();
-    let uploading = $state(false);
-
-    async function uploadStudySpace() {
-        if (!spaceImgs || spaceImgs.length < 1) return alert("Please select an image file.");
-        if (!studySpaceData.building_location) return alert("Please select a building location.");
-
-        const { opening_times, ...spacePayload } = studySpaceData;
-
-        const { data: studySpaceInsert, error: studySpaceError } = await supabase
-            .from("study_spaces")
-            .upsert(
-                {
-                    ...spacePayload,
-                    building_location: studySpaceData.building_location as Json
-                },
-                {
-                    onConflict: "id"
-                }
-            )
-            .select()
-            .single();
-        if (studySpaceError)
-            return alert(`Error uploading study space: ${studySpaceError.message}`);
-
-        const imgUploads = await Promise.all(
-            Array(spaceImgs.length)
-                .keys()
-                .map(async (i) => {
-                    const imageFile = spaceImgs![i];
-                    const resp = await supabase.storage
-                        .from("files_bucket")
-                        .upload(
-                            `public/${studySpaceInsert.id}-${crypto.randomUUID()}-${imageFile.name}`,
-                            imageFile,
-                            {
-                                contentType: imageFile.type
-                            }
-                        );
-                    return resp;
-                })
-        );
-
-        const imageError = imgUploads.find(({ error }) => error)?.error;
-        if (imageError) return alert(`Error uploading image: ${imageError.message}`);
-        if (space.id) {
-            const { error: imageOverwriteError } = await supabase
-                .from("study_space_images")
-                .delete()
-                .eq("study_space_id", space.id);
-            if (imageOverwriteError)
-                return alert(`Error overwriting existing images: ${imageOverwriteError.message}`);
-        }
-
-        const { error: imageInsertError } = await supabase
-            .from("study_space_images")
-            .insert(
-                imgUploads.map(({ data }) => ({
-                    study_space_id: studySpaceInsert.id,
-                    image_path: data!.path
-                }))
-            )
-            .select();
-        if (imageInsertError) return alert(`Error creating image: ${imageInsertError.message}`);
-
-        const { error: deleteErr } = await supabase
-            .from("study_space_hours")
-            .delete()
-            .eq("study_space_id", studySpaceInsert.id);
-        if (deleteErr) return alert(`Error clearing old hours: ${deleteErr.message}`);
-
-        const { error: hoursErr } = await supabase.from("study_space_hours").insert(
-            opening_times.map((h) => ({
-                study_space_id: studySpaceInsert.id,
-                day_of_week: h.day_of_week,
-                opens_at: h.opens_at,
-                closes_at: h.closes_at,
-                is_24_7: h.is_24_7
-            }))
-        );
-        if (hoursErr) return alert(`Error saving opening times: ${hoursErr.message}`);
-
-        alert("Thank you for your contribution!");
-        // Redirect to the new study space page
-        await goto(`/space/${studySpaceInsert.id}`, {
-            invalidate: ["db:study_spaces"]
-        });
-    }
-
-    // Tag
-    let tagFilter = $state("");
-    let tagFilterElem = $state<HTMLInputElement>();
-    let filteredTags = $derived(
-        availableStudySpaceTags
-            .filter((tag) => tag.toLowerCase().includes(tagFilter.toLowerCase()))
-            .filter((tag) => !studySpaceData.tags.includes(tag))
-    );
-    let dropdownVisible = $state(false);
-
-    function deleteTag(tagName: string) {
-        return () => {
-            studySpaceData.tags = studySpaceData.tags.filter((tag) => tag !== tagName);
-        };
-    }
-
-    function addTag(tagName: string) {
-        return () => {
-            if (!studySpaceData.tags.includes(tagName)) {
-                studySpaceData.tags.push(tagName);
-            }
-            tagFilter = "";
-        };
-    }
-
-    let addressInput = $state<HTMLInputElement>();
-    onMount(async () => {
-        const loader = await gmapsLoader();
-        const places = await loader.importLibrary("places");
-        if (!addressInput) return console.error("Address input element not found");
-        addressInput.value = studySpaceData.building_location?.formatted_address || "";
-        if (studySpaceData.building_location?.name) {
-            addressInput.value = `${studySpaceData.building_location.name}, ${addressInput.value}`;
-        }
-        const placeAutocomplete = new places.Autocomplete(addressInput, {
-            componentRestrictions: { country: "gb" }
-        });
-        placeAutocomplete.addListener("place_changed", () => {
-            studySpaceData.building_location = placeAutocomplete.getPlace();
-        });
-    });
-    onMount(async () => {
-        const images = await existingImages;
-        const dt = new DataTransfer();
-        images.forEach((response) => {
-            if (response) {
-                const file = new File([response.data], response.name, { type: response.type });
-                dt.items.add(file);
-            }
-        });
-        spaceImgs = dt.files;
-    });
-
-    // --- Helper functions for opening times ---
-    function toggle247(index: number) {
-        const ot = studySpaceData.opening_times[index];
-        if (ot.is_24_7) {
-            ot.opens_at = "00:00";
-            ot.closes_at = "00:00";
-        }
-    }
-
-    function updateTimes(index: number) {
-        const ot = studySpaceData.opening_times[index];
-        ot.is_24_7 = ot.opens_at === "00:00" && ot.closes_at === "00:00";
-    }
-</script>
-
-<Navbar>
-    <a href="/">
-        <img src={crossUrl} alt="close" />
-    </a>
-</Navbar>
-
-<form
-    onsubmit={async (event) => {
-        event.preventDefault();
-        uploading = true;
-        await uploadStudySpace();
-        uploading = false;
-    }}
->
-    <Images
-        name="study-space-image"
-        minHeight="16rem"
-        bind:files={spaceImgs}
-        bind:scrollPosition
-        required
-    />
-    {#if spaceImgs?.length || 0 > 0}
-        <label class="additionalImages" for="additionalImages">
-            Add more images
-            <input
-                type="file"
-                name="additionalImages"
-                id="additionalImages"
-                multiple
-                accept=".png, .jpg, .jpeg, .svg"
-                onchange={function () {
-                    const dt = new DataTransfer();
-                    if (spaceImgs) {
-                        for (let i = 0; i < spaceImgs.length; i++) {
-                            dt.items.add(spaceImgs[i]);
-                        }
-                    }
-                    if (this.files) {
-                        for (let i = 0; i < this.files.length; i++) {
-                            dt.items.add(this.files[i]);
-                        }
-                    }
-                    spaceImgs = dt.files;
-                    scrollPosition = dt.files.length - 1;
-                }}
-            />
-        </label>
-    {/if}
-
-    <label for="location">Enter the name:</label>
-    <Text
-        name="location"
-        bind:value={studySpaceData.location}
-        placeholder="Room 123, Floor 1"
-        required
-    />
-
-    <div class="compulsoryTags">
-        <div class="compulsoryContainer">
-            <label for="volume">Sound level:</label>
-            <select bind:value={studySpaceData.volume} name="volume" class="compulsoryTagSelect">
-                <option value="" disabled selected>How noisy is it?</option>
-                {#each volumeTags as volumeTag (volumeTag)}
-                    <option value={volumeTag}>{volumeTag}</option>
-                {/each}
-            </select>
-        </div>
-        <div class="compulsoryContainer">
-            <label for="powerOutlets">Power outlets:</label>
-            <select
-                bind:value={studySpaceData.power}
-                name="poweOutlets"
-                class="compulsoryTagSelect"
-            >
-                <option value="" disabled selected>Power outlets?</option>
-                {#each powerOutletTags as powerOutletTag (powerOutletTag)}
-                    <option value={powerOutletTag}>{powerOutletTag}</option>
-                {/each}
-            </select>
-        </div>
-        <div class="compulsoryContainer">
-            <label for="wifi">Wifi:</label>
-            <select bind:value={studySpaceData.wifi} name="wifi" class="compulsoryTagSelect">
-                <option value="" disabled selected>How's the wifi?</option>
-                {#each wifiTags as wifiTag (wifiTag)}
-                    <option value={wifiTag}>{wifiTag}</option>
-                {/each}
-            </select>
-        </div>
-    </div>
-
-    <label for="opening-times-label">Opening Times:</label>
-    <div class="opening-times">
-        {#each daysOfWeek as day, index (index)}
-            <div class="opening-time-item">
-                <label for={"opens-" + index}>{day}</label>
-                <input
-                    id={"opens-" + index}
-                    type="time"
-                    bind:value={studySpaceData.opening_times[index].opens_at}
-                    required
-                    onchange={() => updateTimes(index)}
-                />
-                <span>to</span>
-                <input
-                    id={"closes-" + index}
-                    type="time"
-                    bind:value={studySpaceData.opening_times[index].closes_at}
-                    required
-                    onchange={() => updateTimes(index)}
-                />
-                <label for={"is247-" + index}>
-                    <input
-                        id={"is247-" + index}
-                        type="checkbox"
-                        bind:checked={studySpaceData.opening_times[index].is_24_7}
-                        onchange={() => toggle247(index)}
-                    />
-                    All day
-                </label>
-            </div>
-        {/each}
-    </div>
-
-    <label for="tags">Additional tags:</label>
-    <div class="tagDisplay">
-        {#each studySpaceData.tags as tagName (tagName)}
-            <button class="tag" onclick={deleteTag(tagName)} type="button">
-                {tagName}
-                <img src={crossUrl} alt="delete" /></button
-            >
-        {/each}
-        <input
-            type="text"
-            name="tagInput"
-            class="tagInput"
-            bind:value={tagFilter}
-            bind:this={tagFilterElem}
-            onfocus={() => {
-                dropdownVisible = true;
-            }}
-            onblur={() => {
-                dropdownVisible = false;
-            }}
-            onkeypress={(event) => {
-                if (event.key === "Enter") {
-                    event.preventDefault();
-                    const tag = filteredTags[0];
-                    if (tag) addTag(tag)();
-                }
-            }}
-            placeholder="Add tags..."
-        />
-        {#if dropdownVisible}
-            <div class="tagDropdown">
-                {#each filteredTags as avaliableTag (avaliableTag)}
-                    <button
-                        class="avaliableTag"
-                        onclick={addTag(avaliableTag)}
-                        onmousedown={(e) => {
-                            // Keep input focused
-                            e.preventDefault();
-                            e.stopPropagation();
-                        }}
-                        type="button"
-                    >
-                        {avaliableTag}
-                    </button>
-                {/each}
-            </div>
-        {/if}
-    </div>
-
-    <label for="description">Optional brief description:</label>
-    <Textarea
-        name="description"
-        bind:value={studySpaceData.description}
-        placeholder="A quiet room with a lovely view of the park."
-        rows={2}
-    />
-
-    <label for="building-location">Add the building location:</label>
-    <Text
-        name="building-location"
-        bind:inputElem={addressInput}
-        placeholder="Huxley Building, Imperial South Kensington Campus"
-        required
-    />
-
-    <div class="submit">
-        <Button
-            type="submit"
-            disabled={(spaceImgs?.length || 0) === 0 ||
-                !studySpaceData.location ||
-                !studySpaceData.wifi ||
-                !studySpaceData.volume ||
-                !studySpaceData.power ||
-                !studySpaceData.building_location ||
-                uploading}
-        >
-            Share this study space!
-        </Button>
-    </div>
-</form>
-
-<style>
-    form {
-        display: flex;
-        flex-direction: column;
-        padding: 1.5rem;
-        gap: 0.5rem;
-        max-width: 32rem;
-        margin: 0 auto;
-    }
-
-    label {
-        color: #ffffff;
-        margin-top: 0.5rem;
-    }
-    .submit {
-        position: sticky;
-        display: flex;
-        flex-direction: column;
-        margin-top: 0.5rem;
-        bottom: 0;
-        margin-left: -0.5rem;
-        width: calc(100% + 1rem);
-    }
-    .tagDisplay {
-        display: flex;
-        gap: 0.4rem;
-        flex-wrap: wrap;
-        align-items: left;
-        justify-content: left;
-        position: relative;
-        width: 100%;
-        height: auto;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-        font-size: 1rem;
-    }
-    .tagInput {
-        width: 100%;
-        height: 100%;
-        background: none;
-        color: #eaffeb;
-        font-size: 1rem;
-        border: none;
-        outline: none;
-    }
-    ::placeholder {
-        color: #859a90;
-        opacity: 1;
-    }
-    .tag {
-        display: flex;
-        align-items: center;
-        border-radius: 0.25rem;
-        background-color: #2e4653;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        cursor: pointer;
-        border-width: 0rem;
-    }
-    .tag img {
-        width: 1rem;
-        height: 1rem;
-        margin-left: 0.2rem;
-    }
-
-    .tagDropdown {
-        width: 100%;
-        display: flex;
-        gap: 0.4rem;
-        flex-wrap: wrap;
-        position: absolute;
-        background-color: #2e4653;
-        box-shadow: 1px 1px 0.5rem rgba(0, 0, 0, 0.5);
-        border-radius: 0.5rem;
-        overflow-y: auto;
-        max-height: 10rem;
-        top: 100%;
-        left: 50%;
-        transform: translateX(-50%);
-    }
-
-    .avaliableTag {
-        width: 100%;
-        text-align: left;
-        background: none;
-        border: none;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        margin: 0%;
-        padding: 0 0.8rem 0.4rem;
-    }
-    .avaliableTag:first-child {
-        padding-top: 0.6rem;
-        background-color: hsl(201, 26%, 60%);
-    }
-    .avaliableTag:last-child {
-        padding-bottom: 0.6rem;
-    }
-
-    .compulsoryTags {
-        display: grid;
-        gap: 0.4rem;
-        border-radius: 0.5rem;
-        background-color: none;
-        width: 100%;
-        font-size: 1rem;
-        grid-template-columns: repeat(3, 1fr);
-    }
-
-    .compulsoryContainer {
-        display: flex;
-        flex-direction: column;
-        align-items: left;
-        justify-content: top;
-        border-radius: 0.5rem;
-        background-color: none;
-    }
-
-    .compulsoryTagSelect {
-        width: 100%;
-        height: 100%;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-        font-size: 0.9rem;
-        text-align: left;
-    }
-
-    .compulsoryTagSelect option {
-        background-color: #2e4653;
-        color: #eaffeb;
-    }
-    .additionalImages {
-        padding: 0.5rem 1rem;
-        border-radius: 0.5rem;
-        background: linear-gradient(-83deg, #3fb095, #49bd85);
-        box-shadow: 0rem 0rem 0.5rem #182125;
-        color: #eaffeb;
-        border: none;
-        cursor: pointer;
-        text-align: center;
-    }
-    .additionalImages:focus {
-        outline: 2px solid #007bff;
-    }
-    .additionalImages input {
-        display: none;
-    }
-
-    /* Opening times layout and inputs styling */
-    .opening-times {
-        display: flex;
-        flex-direction: column;
-        gap: 0.5rem;
-    }
-
-    .opening-time-item {
-        display: flex;
-        align-items: center;
-        gap: 0.5rem;
-    }
-
-    .opening-time-item label {
-        margin-top: 0;
-        width: 6rem;
-    }
-
-    .opening-time-item input[type="time"] {
-        padding: 0.5rem;
-        height: 2.5rem;
-        border-radius: 0.5rem;
-        border: 2px solid #eaffeb;
-        background: none;
-        color: #eaffeb;
-    }
-
-    .opening-time-item span {
-        margin: 0 0.5rem;
-        color: #eaffeb;
-    }
-</style>
--- a/src/routes/space/reports/+page.server.ts
+++ b/src/routes/space/reports/+page.server.ts
@@ -1,14 +0,0 @@
-import { error } from "@sveltejs/kit";
-import type { PageServerLoad } from "./$types";
-
-export const load: PageServerLoad = async ({ depends, locals: { supabase } }) => {
-    depends("db:reports");
-    const { data: reports, error: err } = await supabase
-        .from("reports")
-        .select("*, study_spaces(location)");
-    if (err) error(500, "Failed to load reports");
-
-    return {
-        reports
-    };
-};
--- a/src/routes/space/reports/+page.svelte
+++ b/src/routes/space/reports/+page.svelte
@@ -1,119 +0,0 @@
-<script lang="ts">
-    import Navbar from "$lib/components/Navbar.svelte";
-    import crossUrl from "$lib/assets/cross.svg";
-    import type { Table } from "$lib";
-    const { data } = $props();
-    const { reports, supabase } = $derived(data);
-    import { invalidate } from "$app/navigation";
-
-    let deleting = $state(false);
-
-    async function deleteReport(report: Table<"reports">) {
-        const { error: reportDeleteError } = await supabase
-            .from("reports")
-            .delete()
-            .eq("id", report.id);
-
-        if (reportDeleteError)
-            return alert(`Error submitting report: ${reportDeleteError.message}`);
-        else alert("Report deleted successfully!");
-    }
-</script>
-
-<Navbar>
-    <a href="/">
-        <img src={crossUrl} alt="close" />
-    </a>
-</Navbar>
-
-<main>
-    {#each reports as report (report.id)}
-        <div class="reportContainer">
-            <button
-                type="button"
-                class="deleteReport"
-                aria-label="delete"
-                disabled={deleting}
-                onclick={async () => {
-                    deleting = true;
-                    await deleteReport(report);
-                    await invalidate("db:reports");
-                    deleting = false;
-                }}><img src={crossUrl} alt="delete" /></button
-            >
-            <h1 class="submitHeader">
-                {report.study_spaces?.location ?? "Study space doesn't exist"}
-            </h1>
-            <span class="tag">
-                {report.type}
-            </span>
-            <p class="content">{report.content}</p>
-
-            <a href="/space/{report.study_space_id}" class="viewPage">View Space</a>
-        </div>
-    {/each}
-</main>
-
-<style>
-    main {
-        display: flex;
-        gap: 1rem;
-        align-items: center;
-        flex-wrap: wrap;
-        flex-direction: column;
-        padding: 5rem 0 1rem 0;
-        max-width: 100%;
-        margin: 0 auto;
-        height: 200vh;
-    }
-
-    .tag {
-        display: flex;
-        align-items: center;
-        border-radius: 0.25rem;
-        background-color: #2e4653;
-        color: #eaffeb;
-        font-size: 1.1rem;
-        cursor: pointer;
-        padding: 0.2rem 0.6rem;
-        width: fit-content;
-    }
-
-    .reportContainer {
-        display: flex;
-        flex-direction: column;
-        width: 90%;
-        gap: 0.5rem;
-        padding: 1rem;
-        background-color: #182125;
-        border-radius: 0.5rem;
-        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
-        color: #eaffeb;
-        position: relative;
-        translate: 0 -3.5rem;
-        border: 2px solid #eaffeb;
-    }
-
-    .viewPage {
-        width: 100%;
-        padding: 0.5rem;
-        border-radius: 0.5rem;
-        border: none;
-        background-color: #49bd85;
-        color: #ffffff;
-        font-size: 1rem;
-        cursor: pointer;
-        margin-top: 1rem;
-        text-align: center;
-        text-decoration: none;
-    }
-
-    .deleteReport {
-        position: absolute;
-        top: 0.1rem;
-        right: 0.1rem;
-        background: none;
-        border: none;
-        cursor: pointer;
-    }
-</style>
--- a/supabase/migrations/20250605162005_add_tags.sql
+++ b/supabase/migrations/20250605162005_add_tags.sql
@@ -1,3 +0,0 @@
-alter table "public"."study_spaces" add column "tags" text[] not null default ARRAY[]::text[];
-
-
--- a/supabase/migrations/20250609142130_add-compulsory-tags.sql
+++ b/supabase/migrations/20250609142130_add-compulsory-tags.sql
@@ -1,11 +0,0 @@
-alter table "public"."study_spaces" add column "power" text;
-alter table "public"."study_spaces" add column "volume" text;
-alter table "public"."study_spaces" add column "wifi" text;
-
-update "public"."study_spaces" set "power" = 'Many Outlets' where "power" is null;
-update "public"."study_spaces" set "volume" = 'Quiet' where "volume" is null;
-update "public"."study_spaces" set "wifi" = 'Good WiFi' where "wifi" is null;
-
-alter table "public"."study_spaces" alter column "power" set not null;
-alter table "public"."study_spaces" alter column "volume" set not null;
-alter table "public"."study_spaces" alter column "wifi" set not null;
--- a/supabase/migrations/20250609145614_gmaps_location.sql
+++ b/supabase/migrations/20250609145614_gmaps_location.sql
@@ -1,3 +0,0 @@
-- rename old colum nto building_location_old and create a new column instead of altering
-alter table "public"."study_spaces" rename column "building_location" to "building_location_old";
-alter table "public"."study_spaces" add column "building_location" jsonb;
--- a/supabase/migrations/20250610163930_add_report_table.sql
+++ b/supabase/migrations/20250610163930_add_report_table.sql
@@ -1,12 +0,0 @@
-CREATE TABLE reports (
-    id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
-    study_space_id uuid REFERENCES study_spaces(id) ON DELETE CASCADE,
-    created_at timestamp with time zone DEFAULT now(),
-    updated_at timestamp with time zone DEFAULT now(),
-    type text NOT NULL,
-    content text
-);
-
-CREATE TRIGGER reports_updated_at
-AFTER UPDATE ON reports
-FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
--- a/supabase/migrations/20250612032104_study_space_hours_table.sql
+++ b/supabase/migrations/20250612032104_study_space_hours_table.sql
@@ -1,14 +0,0 @@
-CREATE TABLE study_space_hours (
-    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
-    study_space_id UUID REFERENCES study_spaces(id) ON DELETE CASCADE,
-    day_of_week INT CHECK (day_of_week BETWEEN 0 AND 6),  -- 0 = Sunday, 6 = Saturday
-    opens_at TIME NOT NULL,
-    closes_at TIME NOT NULL,
-    is_24_7 BOOLEAN DEFAULT FALSE,
-    created_at timestamp with time zone DEFAULT now(),
-    updated_at timestamp with time zone DEFAULT now()
-);
-
-CREATE TRIGGER study_space_hours_updated_at
-AFTER UPDATE ON study_space_hours
-FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
--- a/supabase/migrations/20250612104310_users-admin.sql
+++ b/supabase/migrations/20250612104310_users-admin.sql
@@ -1,28 +0,0 @@
-CREATE TABLE users (
-    id uuid PRIMARY KEY REFERENCES auth.users ON DELETE CASCADE,
-    is_admin boolean NOT NULL DEFAULT false,
-    created_at timestamp with time zone NOT NULL DEFAULT now(),
-    updated_at timestamp with time zone NOT NULL DEFAULT now()
-);
-
-CREATE TRIGGER users_handle_updated_at
-AFTER UPDATE ON users
-FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
-
-- Auto-create users when auth.users are created
-CREATE FUNCTION handle_new_user()
-RETURNS trigger
-LANGUAGE plpgsql
-    SECURITY DEFINER
-    SET search_path = ''
-AS $$
-BEGIN
-    INSERT INTO public.users (id, contact_email)
-    VALUES (NEW.id, NEW.email);
-    RETURN NEW;
-END;
-$$;
-
-CREATE TRIGGER users_handle_new_user 
-AFTER INSERT ON auth.users
-FOR EACH ROW EXECUTE FUNCTION handle_new_user();
--- a/supabase/migrations/20250612153946_fix-signup.sql
+++ b/supabase/migrations/20250612153946_fix-signup.sql
@@ -1,12 +0,0 @@
-CREATE OR REPLACE FUNCTION handle_new_user()
-RETURNS trigger
-LANGUAGE plpgsql
-    SECURITY DEFINER
-    SET search_path = ''
-AS $$
-BEGIN
-    INSERT INTO public.users (id)
-    VALUES (NEW.id);
-    RETURN NEW;
-END;
-$$;
--- a/supabase/schemas/0001_study_spaces.sql
+++ b/supabase/schemas/0001_study_spaces.sql
@@ -11,14 +11,8 @@ CREATE TABLE study_spaces (
    description text,
    -- Location within building, e.g., "Room 101"
    location text,
-    -- Not bothered to write a proper data migration
-    building_location_old text,
-    building_location jsonb,
+    building_location text,
    tags text[] NOT NULL DEFAULT array[]::text[],
-    volume text NOT NULL,
-    wifi text NOT NULL,
-    power text NOT NULL,
-     
    created_at timestamp with time zone DEFAULT now(),
    updated_at timestamp with time zone DEFAULT now()
 );
@@ -31,25 +25,6 @@ CREATE TABLE study_space_images (
    PRIMARY KEY (study_space_id, image_path)
 );

-CREATE TABLE reports (
-    id uuid PRIMARY KEY DEFAULT gen_random_uuid(),
-    study_space_id uuid REFERENCES study_spaces(id) ON DELETE CASCADE,
-    created_at timestamp with time zone DEFAULT now(),
-    updated_at timestamp with time zone DEFAULT now(),
-    type text NOT NULL,
-    content text
-);
-
-CREATE TABLE study_space_hours (
-    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
-    study_space_id UUID REFERENCES study_spaces(id) ON DELETE CASCADE,
-    day_of_week INT CHECK (day_of_week BETWEEN 0 AND 6),  -- 0 = Sunday, 6 = Saturday
-    opens_at TIME NOT NULL,
-    closes_at TIME NOT NULL,
-    is_24_7 BOOLEAN DEFAULT FALSE,
-    created_at timestamp with time zone DEFAULT now(),
-    updated_at timestamp with time zone DEFAULT now()
-);

 -- Triggers
 CREATE TRIGGER study_spaces_updated_at
@@ -59,11 +34,3 @@ FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
 CREATE TRIGGER study_space_images_updated_at
 AFTER UPDATE ON study_space_images
 FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
-
-CREATE TRIGGER reports_updated_at
-AFTER UPDATE ON reports
-FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
-
-CREATE TRIGGER study_space_hours_updated_at
-AFTER UPDATE ON study_space_hours
-FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
--- a/supabase/schemas/0001_users.sql
+++ b/supabase/schemas/0001_users.sql
@@ -1,28 +0,0 @@
-CREATE TABLE users (
-    id uuid PRIMARY KEY REFERENCES auth.users ON DELETE CASCADE,
-    is_admin boolean NOT NULL DEFAULT false,
-    created_at timestamp with time zone NOT NULL DEFAULT now(),
-    updated_at timestamp with time zone NOT NULL DEFAULT now(),
-);
-
-CREATE TRIGGER users_handle_updated_at
-AFTER UPDATE ON users
-FOR EACH ROW EXECUTE FUNCTION handle_updated_at();
-
-- Auto-create users when auth.users are created
-CREATE FUNCTION handle_new_user()
-RETURNS trigger
-LANGUAGE plpgsql
-    SECURITY DEFINER
-    SET search_path = ''
-AS $$
-BEGIN
-    INSERT INTO public.users (id)
-    VALUES (NEW.id);
-    RETURN NEW;
-END;
-$$;
-
-CREATE TRIGGER users_handle_new_user 
-AFTER INSERT ON auth.users
-FOR EACH ROW EXECUTE FUNCTION handle_new_user();
				`@@ -1,3 +0,0 @@`
				`alter table "public"."study_spaces" add column "tags" text[] not null default ARRAY[]::text[];`