From b69647cd482a5a6799493f1e03bc8f2f7414c5f3 Mon Sep 17 00:00:00 2001
From: Christoph Urlacher <christoph.urlacher@protonmail.com>
Date: Thu, 12 Dec 2024 12:10:56 +0100
Subject: [PATCH] Skeleton: Move seasondata tabs into +layout.svelte

---
 src/routes/+layout.svelte                     |  9 ++---
 src/routes/admin/users/+page.svelte           |  1 -
 src/routes/data/seasondata/+layout.svelte     | 38 +++++++++++++++++++
 .../seasondata/teams/+page.server.ts          |  2 +-
 .../seasondata/teams/+page.svelte             | 11 ------
 .../{admin => data}/userdata/+page.svelte     |  0
 src/routes/user/+page.server.ts               |  2 +-
 7 files changed, 44 insertions(+), 19 deletions(-)
 delete mode 100644 src/routes/admin/users/+page.svelte
 create mode 100644 src/routes/data/seasondata/+layout.svelte
 rename src/routes/{admin => data}/seasondata/teams/+page.server.ts (98%)
 rename src/routes/{admin => data}/seasondata/teams/+page.svelte (88%)
 rename src/routes/{admin => data}/userdata/+page.svelte (100%)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 6e75a03..3e02d1f 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -73,15 +73,14 @@
     <div class="navbar-end">
       <!-- Admin button -->
       <div class="dropdown dropdown-end mr-2">
-        <div tabindex="0" role="button" class="btn btn-ghost">Admin</div>
+        <div tabindex="0" role="button" class="btn btn-ghost">Data</div>
         <!-- svelte-ignore a11y_no_noninteractive_tabindex -->
         <ul
           tabindex="0"
           class="menu dropdown-content z-[1] mt-4 w-52 rounded-box border bg-base-100 p-2 shadow"
         >
-          <li><a href="/admin/users">Users</a></li>
-          <li><a href="/admin/seasondata/teams">Season Data</a></li>
-          <li><a href="/admin/userdata">User Data</a></li>
+          <li><a href="/data/seasondata/teams">Season Data</a></li>
+          <li><a href="/data/userdata">User Data</a></li>
         </ul>
       </div>
 
@@ -131,7 +130,7 @@
             tabindex="0"
             class="menu dropdown-content z-[1] mt-4 w-[150] rounded-box border bg-base-100 p-2 shadow"
           >
-            <h1 class="text-lg">Edit Profile</h1>
+            <h1 class="select-none text-lg">Edit Profile</h1>
             <form method="POST" enctype="multipart/form-data">
               <input type="hidden" name="id" value={data.user.id} />
               <Username
diff --git a/src/routes/admin/users/+page.svelte b/src/routes/admin/users/+page.svelte
deleted file mode 100644
index 6053f1c..0000000
--- a/src/routes/admin/users/+page.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<h1>User Management</h1>
diff --git a/src/routes/data/seasondata/+layout.svelte b/src/routes/data/seasondata/+layout.svelte
new file mode 100644
index 0000000..cd9a6c0
--- /dev/null
+++ b/src/routes/data/seasondata/+layout.svelte
@@ -0,0 +1,38 @@
+<script lang="ts">
+  import { page } from "$app/stores";
+  import type { Snippet } from "svelte";
+
+  let { children }: { children: Snippet } = $props();
+
+  // const tab = $state($page.url.pathname.split("/").at(-1));
+  const get_tab = () => {
+    return $page.url.pathname.split("/").at(-1);
+  };
+</script>
+
+<!-- TODO: Move this + the tablist into the +layout.svelte and select the correct tab dynamically -->
+<!--       This would also allow it to be animated? Maybe? -->
+<h1>Season Data</h1>
+
+<div role="tablist" class="tabs-boxed tabs">
+  <a
+    href="teams"
+    role="tab"
+    class={get_tab() === "teams" ? "tab tab-active" : "tab"}>Teams</a
+  >
+  <a
+    href="drivers"
+    role="tab"
+    class={get_tab() === "drivers" ? "tab tab-active" : "tab"}>Drivers</a
+  >
+  <a
+    href="races"
+    role="tab"
+    class={get_tab() === "races" ? "tab tab-active" : "tab"}>Races</a
+  >
+</div>
+<!-- TODO: End -->
+
+<div>
+  {@render children()}
+</div>
diff --git a/src/routes/admin/seasondata/teams/+page.server.ts b/src/routes/data/seasondata/teams/+page.server.ts
similarity index 98%
rename from src/routes/admin/seasondata/teams/+page.server.ts
rename to src/routes/data/seasondata/teams/+page.server.ts
index 70c076c..060b8cf 100644
--- a/src/routes/admin/seasondata/teams/+page.server.ts
+++ b/src/routes/data/seasondata/teams/+page.server.ts
@@ -3,7 +3,7 @@ import {
   form_data_clean,
   form_data_ensure_keys,
   form_data_get_and_remove_id,
-} from "$lib/forms";
+} from "$lib/form";
 
 // These "actions" run serverside only, as they're located inside +page.server.ts
 export const actions = {
diff --git a/src/routes/admin/seasondata/teams/+page.svelte b/src/routes/data/seasondata/teams/+page.svelte
similarity index 88%
rename from src/routes/admin/seasondata/teams/+page.svelte
rename to src/routes/data/seasondata/teams/+page.svelte
index b4771ce..31c812a 100644
--- a/src/routes/admin/seasondata/teams/+page.svelte
+++ b/src/routes/data/seasondata/teams/+page.svelte
@@ -10,17 +10,6 @@
   <title>F11 - Teams</title>
 </svelte:head>
 
-<!-- TODO: Move this + the tablist into the +layout.svelte and select the correct tab dynamically -->
-<!--       This would also allow it to be animated? Maybe? -->
-<h1>Season Data</h1>
-
-<div role="tablist" class="tabs-boxed tabs">
-  <a href="teams" role="tab" class="tab tab-active">Teams</a>
-  <a href="drivers" role="tab" class="tab">Drivers</a>
-  <a href="races" role="tab" class="tab">Races</a>
-</div>
-<!-- TODO: End -->
-
 <div
   class="mt-2 grid grid-cols-1 gap-2 md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-6"
 >
diff --git a/src/routes/admin/userdata/+page.svelte b/src/routes/data/userdata/+page.svelte
similarity index 100%
rename from src/routes/admin/userdata/+page.svelte
rename to src/routes/data/userdata/+page.svelte
diff --git a/src/routes/user/+page.server.ts b/src/routes/user/+page.server.ts
index 982288d..d504cbf 100644
--- a/src/routes/user/+page.server.ts
+++ b/src/routes/user/+page.server.ts
@@ -2,7 +2,7 @@ import {
   form_data_clean,
   form_data_ensure_keys,
   form_data_get_and_remove_id,
-} from "$lib/forms";
+} from "$lib/form";
 import { error, redirect } from "@sveltejs/kit";
 import type { Actions } from "./$types";