change: Various changes and started on more admin stuff

backend/server.go

@@ -72,7 +72,10 @@ func main() {
 	http.HandleFunc("/api/items/{itemId}/edit", handleEditMenuItem)
 	http.HandleFunc("/api/items/{itemId}/delete", handleDeleteMenuItem)
 
+	// User
 	http.HandleFunc("/api/validate-id", handleCheckUserId)
+	http.HandleFunc("/api/users", handleListUsers)
+	http.HandleFunc("/api/user", handleGetUser)
 
 	// Push
 	http.HandleFunc("/api/push/public-key", handleVAPIDPublicKeyRequest)

backend/users.go

@@ -0,0 +1,79 @@
+package main
+
+import (
+	"encoding/json"
+	log "log/slog"
+	"net/http"
+	"strconv"
+)
+
+type User struct {
+	Id          int    `json:"id"`
+	DisplayName string `json:"display_name"`
+}
+
+func handleGetUser(w http.ResponseWriter, r *http.Request) {
+	w.Header().Add("Access-Control-Allow-Origin", "*")
+
+	if r.Method != http.MethodGet {
+		http.Error(w, "wrong method", http.StatusMethodNotAllowed)
+		return
+	}
+
+	if err := r.ParseForm(); err != nil {
+		http.Error(w, err.Error(), http.StatusBadRequest)
+		return
+	}
+
+	userId, err := strconv.Atoi(r.Form.Get("userId"))
+	if err != nil {
+		http.Error(w, err.Error(), http.StatusBadRequest)
+		return
+	}
+
+	var requestedUser User
+
+	if err := db.QueryRow("SELECT display_name FROM users WHERE id = ?", userId).Scan(&requestedUser.DisplayName); err != nil {
+		log.Error("error finding user", "error", err)
+		http.Error(w, "error getting user data", http.StatusInternalServerError)
+		return
+	}
+
+	if err := json.NewEncoder(w).Encode(requestedUser); err != nil {
+		log.Error("error encoding user", "error", err)
+		http.Error(w, "error encoding user data", http.StatusInternalServerError)
+		return
+	}
+}
+
+func handleListUsers(w http.ResponseWriter, r *http.Request) {
+	w.Header().Add("Access-Control-Allow-Origin", "*")
+
+	users, err := db.Query("SELECT id, display_name FROM users")
+	if err != nil {
+		log.Error("error reading users", "error", err)
+		http.Error(w, "error listing users", http.StatusInternalServerError)
+		return
+	}
+	defer users.Close()
+
+	var resultUsers []User
+
+	for users.Next() {
+		var cur User
+
+		if err := users.Scan(&cur.Id, &cur.DisplayName); err != nil {
+			log.Error("error reading user", "error", err)
+			http.Error(w, "error reading users", http.StatusInternalServerError)
+			return
+		}
+
+		resultUsers = append(resultUsers, cur)
+	}
+
+	if err := json.NewEncoder(w).Encode(resultUsers); err != nil {
+		log.Error("error encoding users", "error", err)
+		http.Error(w, "error encoding users", http.StatusInternalServerError)
+		return
+	}
+}

src/lib/components/navbar.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
-  let { mainItem = () => {}, items = () => {} } = $props()
+  let { mainItem = () => {}, children } = $props()
 </script>
 
 <nav class="flex flex-row py-2">
   <div class="flex-grow">
-      {@render mainItem()}
+    {@render mainItem()}
   </div>
-  <div class="flex flex-row items-center space-x-4 underline">
-    {@render items()}
+  <div class="flex flex-row items-center space-x-4 text-black dark:text-white">
+    {@render children?.()}
   </div>
 </nav>

src/lib/components/userStatus.svelte

@@ -0,0 +1,13 @@
+<script lang="ts">
+    import Fa from 'svelte-fa'
+    import { faUser } from "@fortawesome/free-solid-svg-icons";
+
+    let { userName } = $props();
+</script>
+
+<div class="rounded-md border border-zinc-200 dark:border-zinc-700 bg-white shadow-sm dark:bg-zinc-800 py-2 px-4">
+    <div class="flex flex-row items-center gap-x-2">
+        <Fa icon={faUser} />
+        {userName}
+    </div>
+</div>

src/routes/(app)/+layout.svelte

@@ -43,11 +43,6 @@
 			--bg-color: #1d2021;
 		} 
 	}
-
-	.main {
-		background-color: var(--bg-color);
-		color: var(--fg-color);
-	}
 </style>
 
 <section class="grid grid-cols-8 bg-white dark:bg-neutral-900 text-neutral-900">

src/routes/(app)/+page.svelte

@@ -1,9 +1,28 @@
 <script lang="ts">;
     import MenuEditor from "$lib/components/menuEditor.svelte";
+    import Navbar from "$lib/components/navbar.svelte";
+    import UserStatus from "$lib/components/userStatus.svelte";
     import { toJsDate } from "$lib/tools.js";
+    import { onMount } from "svelte";
+
+    let username = $state("User...")
+
+    onMount(() => {
+        fetch(`${backendRootURL}/api/user?${new URLSearchParams({
+            userId: `${localStorage.getItem("userId")}`,
+        })}`)
+            .then((resp) => resp.json())
+            .then((user) => username = user.display_name)
+            .catch((error) => console.error(error));
+    })
+
     import { backendRootURL } from "../../constants.js";
 </script>
 
+<Navbar>
+    <UserStatus userName={username} />
+</Navbar>
+
 <h1 class="text-4xl text-center my-4 text-black dark:text-white">Shared With You</h1>
 <div class="flex flex-col my-4">
     {#await fetch(`${backendRootURL}/api/menu/list`).then((resp) => resp.json())}

src/routes/(app)/admin/share/+page.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+    import UiButton from "$lib/components/uiButton.svelte";
+    import { backendRootURL } from "../../../../constants";
+
+</script>
+
+{#await fetch(`${backendRootURL}/api/users`).then((resp) => resp.json())}
+Loading...
+{:then users}
+<ol>
+{#each users as user}
+<li>Id: {user.id}, Name: {user.display_name}</li>
+{/each}
+</ol>
+{:catch error}
+There was an error fetching the users: {error}
+{/await}
+
+<UiButton text="Share" action={() => {}}/>

src/routes/(app)/admin/users/+page.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+    import { backendRootURL } from "../../../../constants";
+
+</script>
+
+{#await fetch(`${backendRootURL}/api/users`).then((resp) => resp.json())}
+Loading...
+{:then users}
+<ol>
+{#each users as user}
+<li>Id: {user.id}, Name: {user.display_name}</li>
+{/each}
+</ol>
+{:catch error}
+There was an error fetching the users: {error}
+{/await}