src/lib/components/ColorPicker.svelte

@@ -1,51 +0,0 @@
-<script lang="ts">
-  import { createEventDispatcher } from "svelte";
-
-  const dispatch = createEventDispatcher();
-  export let color = "#ff0000";
-
-  function handleColorChange(event: Event) {
-    const target = event.target as HTMLInputElement;
-    color = target.value;
-    dispatch("change", color);
-  }
-  export let borderRadius;
-  const actualBorderRadius = borderRadius || "50%";
-</script>
-
-<div class="color-picker" style="border-radius: {actualBorderRadius};">
-  <label style="border-radius: inherit;">
-    <input type="color" bind:value={color} on:input={handleColorChange} />
-    <div
-      class="color-circle"
-      style="background-color: {color || '#000'};"
-    ></div>
-  </label>
-</div>
-
-<style>
-  .color-picker {
-    position: relative;
-    display: inline-block;
-  }
-
-  .color-picker input[type="color"] {
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    opacity: 0;
-    cursor: pointer;
-    border-radius: inherit;
-  }
-
-  .color-picker .color-circle {
-    width: var(--color-picker-size, 40px);
-    height: var(--color-picker-size, 40px);
-    border-radius: inherit;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-</style>

src/lib/entities.ts

@@ -20,25 +20,6 @@ export interface Card {
   name: string;
 }
 
-export interface Category {
-  id: number;
-  name: string;
-  parent_id: number;
-}
-
-export const EntityTypes = {
-  card: "Card",
-  type: "Type",
-  category: "Category",
-} as const;
-
-export type EntityName = keyof typeof EntityTypes;
-export type EntityType<T extends EntityName> =
-  T extends "card" ? Card :
-  T extends "type" ? Type :
-  T extends "category" ? Category :
-  never;
-
 //
 // }}}
 //
@@ -144,7 +125,7 @@ export async function update<T>(groupName: string, id: number, data: T, session?
   }
 }
 
-export async function remove(groupName: string, id: number, session?: string): Promise<Message | ErrorMessage> {
+export async function remove<T>(groupName: string, id: number, session?: string): Promise<T | ErrorMessage> {
   const url = `${BASE_API_URL}/${groupName}/delete/${id}`
   const defaultHeaders = {
     'Content-Type': 'application/json',
@@ -164,7 +145,7 @@ export async function remove(groupName: string, id: number, session?: string): P
     if (!response.ok) {
       throw new Error(`Failed to delete ${groupName}: ${response.statusText}`);
     }
-    return await response.json() as Message;
+    return await response.json() as T;
   } catch (err) {
     const error = err as Error
     return { message: error.message };

src/routes/+layout.svelte

@@ -26,14 +26,6 @@
     {
     Path: "/card",
     Name: "Cards",
-    },
-    {
-    Path: "/type",
-    Name: "Types",
-    },
-    {
-    Path: "/category",
-    Name: "Categories",
     }
   ]
 </script>

src/routes/api/[entity]/all/+server.ts

@@ -1,32 +0,0 @@
-import type { ErrorMessage } from "$lib/api";
-import { getAll, EntityTypes, type EntityType, type EntityName } from "$lib/entities";
-import type { RequestHandler } from "./$types";
-
-function isErrorMessage(value: any): value is ErrorMessage {
-  return value && typeof value.message === 'string';
-}
-
-export const GET: RequestHandler = async ({ cookies, params }): Promise<Response> => {
-  const session = cookies.get('session');
-  const { entity } = params;
-
-  // Check if the entity is valid
-  if (!session) {
-    return new Response(JSON.stringify("no cookies"), { status: 401 });
-  }
-
-  if (!(entity in EntityTypes)) {
-    return new Response(JSON.stringify("Invalid entity"), { status: 400 });
-  }
-
-  // TypeScript type inference for entity
-  const entityName = entity as EntityName
-  const result = await getAll<EntityType<typeof entityName>>(entityName, session);
-
-  if (isErrorMessage(result)) {
-    console.log("ERROR");
-    return new Response(JSON.stringify(result), { status: 500 });
-  }
-
-  return new Response(JSON.stringify(result), { status: 200 });
-}

src/routes/api/[entity]/create/+server.ts

@@ -1,29 +0,0 @@
-import type { ErrorMessage } from "$lib/api";
-import { create, EntityTypes, type EntityType, type EntityName } from "$lib/entities";
-import type { RequestHandler } from "./$types";
-
-function isErrorMessage(value: any): value is ErrorMessage {
-  return value && typeof value.message === 'string';
-}
-
-export const POST: RequestHandler = async ({ request, cookies, params }): Promise<Response> => {
-  const session = cookies.get('session')
-  const { entity } = params;
-
-  if (!session) {
-    throw new Response(JSON.stringify("no cookies"), { status: 401 })
-  }
-
-  if (!(entity in EntityTypes)) {
-    return new Response(JSON.stringify("Invalid entity"), { status: 400 });
-  }
-
-  const entityName = entity as EntityName;
-  const data: EntityType<typeof entityName> = await request.json();
-
-  const result = await create<EntityType<typeof entityName>>(entityName, data, session);
-  if (isErrorMessage(result)) {
-    return new Response(JSON.stringify(result), { status: 500 })
-  }
-  return new Response(JSON.stringify(result), { status: 200 })
-}

src/routes/api/[entity]/update/+server.ts

@@ -1,28 +0,0 @@
-import type { ErrorMessage } from "$lib/api";
-import { update, EntityTypes, type EntityType, type EntityName } from "$lib/entities";
-import type { RequestHandler } from "./$types";
-
-function isErrorMessage(value: any): value is ErrorMessage {
-  return value && typeof value.message === 'string';
-}
-
-export const PUT: RequestHandler = async ({ request, cookies, params }): Promise<Response> => {
-  const session = cookies.get('session')
-  const { entity } = params;
-
-  if (!session) {
-    throw new Response(JSON.stringify("no cookies"), { status: 401 })
-  }
-
-  if (!(entity in EntityTypes)) {
-    return new Response(JSON.stringify("Invalid entity"), { status: 400 });
-  }
-
-  const entityName = entity as EntityName;
-  const data: EntityType<typeof entityName> = await request.json();
-  const result = await update<EntityType<typeof entityName>>(entityName, data.id, data, session);
-  if (isErrorMessage(result)) {
-    return new Response(JSON.stringify(result), { status: 500 })
-  }
-  return new Response(JSON.stringify(result), { status: 200 })
-}

src/routes/api/card/all/+server.ts

@@ -0,0 +1,21 @@
+import type { ErrorMessage } from "$lib/api";
+import { getAll, type Card } from "$lib/entities";
+import type { RequestHandler } from "./$types";
+
+function isErrorMessage(value: any): value is ErrorMessage {
+  return value && typeof value.message === 'string';
+}
+
+export const GET: RequestHandler = async ({ cookies }): Promise<Response> => {
+  const session = cookies.get('session')
+  if (!session) {
+    throw new Response(JSON.stringify("no cookies"), { status: 401 })
+  }
+
+  const result = await getAll<Card>("card", session);
+  if (isErrorMessage(result)) {
+    console.log("ERROR")
+    return new Response(JSON.stringify(result), { status: 500 })
+  }
+  return new Response(JSON.stringify(result), { status: 200 })
+}

src/routes/api/card/create/+server.ts

@@ -0,0 +1,20 @@
+import type { ErrorMessage } from "$lib/api";
+import { create, type Card } from "$lib/entities";
+import type { RequestHandler } from "./$types";
+
+function isErrorMessage(value: any): value is ErrorMessage {
+  return value && typeof value.message === 'string';
+}
+
+export const POST: RequestHandler = async ({ request, cookies }): Promise<Response> => {
+  const session = cookies.get('session')
+  if (!session) {
+    throw new Response(JSON.stringify("no cookies"), { status: 401 })
+  }
+  const data: Card = await request.json();
+  const result = await create<Card>("card", data, session);
+  if (isErrorMessage(result)) {
+    return new Response(JSON.stringify(result), { status: 500 })
+  }
+  return new Response(JSON.stringify(result), { status: 200 })
+}

src/routes/api/card/delete/+server.ts

@@ -1,25 +1,18 @@
 import type { ErrorMessage } from "$lib/api";
-import { remove, EntityTypes, type EntityName } from "$lib/entities";
+import { remove, type Card } from "$lib/entities";
 import type { RequestHandler } from "./$types";
 
 function isErrorMessage(value: any): value is ErrorMessage {
   return value && typeof value.message === 'string';
 }
 
-export const DELETE: RequestHandler = async ({ request, cookies, params }): Promise<Response> => {
+export const DELETE: RequestHandler = async ({ request, cookies }): Promise<Response> => {
   const session = cookies.get('session')
-  const { entity } = params;
-
   if (!session) {
     throw new Response(JSON.stringify("no cookies"), { status: 401 })
   }
-
-  if (!(entity in EntityTypes)) {
-    return new Response(JSON.stringify("Invalid entity"), { status: 400 });
-  }
-
   const { id }: { id: number } = await request.json();
-  const result = await remove(entity as EntityName, id, session);
+  const result = await remove<Card>("card", id, session);
   if (isErrorMessage(result)) {
     return new Response(JSON.stringify(result), { status: 500 })
   }

src/routes/api/card/update/+server.ts

@@ -0,0 +1,20 @@
+import type { ErrorMessage } from "$lib/api";
+import { update, type Card } from "$lib/entities";
+import type { RequestHandler } from "./$types";
+
+function isErrorMessage(value: any): value is ErrorMessage {
+  return value && typeof value.message === 'string';
+}
+
+export const PUT: RequestHandler = async ({ request, cookies }): Promise<Response> => {
+  const session = cookies.get('session')
+  if (!session) {
+    throw new Response(JSON.stringify("no cookies"), { status: 401 })
+  }
+  const data: Card = await request.json();
+  const result = await update<Card>("card", data.id, data, session);
+  if (isErrorMessage(result)) {
+    return new Response(JSON.stringify(result), { status: 500 })
+  }
+  return new Response(JSON.stringify(result), { status: 200 })
+}

src/routes/category/+page.svelte

@@ -1,176 +0,0 @@
-<script lang="ts">
-  import { onMount } from "svelte";
-  import { type Category } from "$lib/entities";
-
-  let categories: Category[] = $state([]);
-  let error: string | null = $state(null);
-  let editingCategory: Category | null = $state(null);
-  let newCategory: Partial<Category> = $state({
-    name: "",
-    parent_id: 0,
-  });
-
-  onMount(async () => {
-    await fetchCategories();
-  });
-
-  async function fetchCategories() {
-    const result = await fetch("/api/category/all");
-    if (!result.ok) {
-      const obj = await result.json();
-      error = obj.message;
-    } else {
-      categories = await result.json();
-    }
-  }
-
-  async function saveCategory() {
-    const endpoint = editingCategory
-      ? `/api/category/update`
-      : "/api/category/create";
-    const method = editingCategory ? "PUT" : "POST";
-
-    const data = {
-      ...currentCategory,
-      parent_id: Number(currentCategory.parent_id),
-    };
-    const response = await fetch(endpoint, {
-      method,
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify(data),
-    });
-
-    if (!response.ok) {
-      const { message } = await response.json();
-      error = message;
-    } else {
-      await fetchCategories();
-      if (editingCategory) {
-        editingCategory = null;
-      } else {
-        newCategory = {
-          name: "",
-          parent_id: 0,
-        };
-      }
-    }
-  }
-
-  function editCategory(category: Category) {
-    editingCategory = { ...category };
-  }
-
-  async function deleteCategory(id: number) {
-    const response = await fetch(`/api/category/delete`, {
-      method: "DELETE",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ id }),
-    });
-    if (!response.ok) {
-      const { message } = await response.json();
-      error = message;
-    } else {
-      await fetchCategories();
-    }
-  }
-
-  // Helper function to get the name of the parent category
-  function getParentCategoryName(parentId: number) {
-    if (parentId === 0) return "None";
-    const parentCategory = categories.find(
-      (category) => category.id === parentId,
-    );
-    return parentCategory ? parentCategory.name : "Unknown";
-  }
-
-  const currentCategory = $derived(editingCategory ?? newCategory);
-  $inspect(currentCategory);
-</script>
-
-{#if error}
-  <p class="bg-red-100 text-red-700 p-4 rounded">{error}</p>
-{/if}
-
-<div class="container mx-auto my-8 p-6 bg-gray-100 rounded-lg shadow-lg">
-  <h1 class="text-2xl font-bold mb-4 text-center">Manage Categories</h1>
-
-  <div class="mb-8 p-6 bg-white rounded-lg shadow-md">
-    <h2 class="text-xl font-semibold mb-4">
-      {editingCategory ? "Edit Category" : "Add New Category"}
-    </h2>
-    <form onsubmit={saveCategory} class="space-y-4">
-      <label class="block">
-        <span class="text-gray-700">Name:</span>
-        <input
-          type="text"
-          bind:value={currentCategory.name}
-          required
-          class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
-        />
-      </label>
-
-      <label class="block">
-        <span class="text-gray-700">Parent Category:</span>
-        <select
-          bind:value={currentCategory.parent_id}
-          class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
-        >
-          <option value="0">None</option>
-          {#each categories as parentCategory}
-            {#if parentCategory.id != currentCategory.id}
-              <option value={parentCategory.id}>{parentCategory.name}</option>
-            {/if}
-          {/each}
-        </select>
-      </label>
-
-      <div class="flex space-x-2">
-        <button
-          type="submit"
-          class="px-4 py-2 bg-indigo-500 text-white rounded-md hover:bg-indigo-600"
-        >
-          {editingCategory ? "Update Category" : "Add Category"}
-        </button>
-        {#if editingCategory}
-          <button
-            type="button"
-            onclick={() => (editingCategory = null)}
-            class="px-4 py-2 bg-gray-300 text-gray-700 rounded-md hover:bg-gray-400"
-          >
-            Cancel
-          </button>
-        {/if}
-      </div>
-    </form>
-  </div>
-
-  <h2 class="text-xl font-semibold mb-4 text-center">Categories List</h2>
-  <ul class="space-y-4">
-    {#each categories as category}
-      <li
-        class="bg-white p-4 rounded-lg shadow-md flex justify-between items-center"
-      >
-        <div>
-          <strong class="block text-lg">{category.name}</strong>
-          <div class="text-sm text-gray-600">
-            Parent: {getParentCategoryName(category.parent_id)}
-          </div>
-        </div>
-        <div class="flex space-x-2">
-          <button
-            onclick={() => editCategory(category)}
-            class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"
-          >
-            Edit
-          </button>
-          <button
-            onclick={() => deleteCategory(category.id)}
-            class="px-4 py-2 bg-red-500 text-white rounded-md hover:bg-red-600"
-          >
-            Delete
-          </button>
-        </div>
-      </li>
-    {/each}
-  </ul>
-</div>

src/routes/type/+page.svelte

@@ -1,172 +0,0 @@
-<script lang="ts">
-  import { onMount } from "svelte";
-  import { type Type } from "$lib/entities";
-  import ColorPicker from "$lib/components/ColorPicker.svelte";
-
-  let types: Type[] = $state([]);
-  let error: string | null = $state(null);
-  let editingType: Type | null = $state(null);
-  let newType: Partial<Type> = $state({
-    name: "",
-    color: "",
-    comment: "",
-  });
-
-  // Fetch all types on page load
-  onMount(async () => {
-    await fetchTypes();
-  });
-
-  async function fetchTypes() {
-    const result = await fetch("/api/type/all");
-    if (!result.ok) {
-      const obj = await result.json();
-      error = obj.message;
-    } else {
-      types = await result.json();
-    }
-  }
-
-  async function saveType() {
-    const endpoint = editingType ? `/api/type/update` : "/api/type/create";
-    const method = editingType ? "PUT" : "POST";
-
-    const response = await fetch(endpoint, {
-      method,
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify(editingType || newType),
-    });
-
-    if (!response.ok) {
-      const { message } = await response.json();
-      error = message;
-    } else {
-      await fetchTypes();
-      if (editingType) {
-        editingType = null;
-      } else {
-        newType = {
-          name: "",
-          comment: "",
-          color: "",
-        };
-      }
-    }
-  }
-
-  function editType(type: Type) {
-    editingType = { ...type };
-  }
-
-  async function deleteType(id: number) {
-    const response = await fetch(`/api/type/delete`, {
-      method: "DELETE",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ id }),
-    });
-    if (!response.ok) {
-      const { message } = await response.json();
-      error = message;
-    } else {
-      await fetchTypes();
-    }
-  }
-
-  function handleColorChange(event: CustomEvent) {
-    currentType.color = event.detail;
-  }
-
-  const currentType = $derived(editingType ?? newType);
-  $inspect(currentType);
-</script>
-
-{#if error}
-  <p class="bg-red-100 text-red-700 p-4 rounded">{error}</p>
-{/if}
-
-<div class="container mx-auto my-8 p-6 bg-gray-100 rounded-lg shadow-lg">
-  <h1 class="text-2xl font-bold mb-4 text-center">Manage Types</h1>
-
-  <div class="mb-8 p-6 bg-white rounded-lg shadow-md">
-    <h2 class="text-xl font-semibold mb-4">
-      {editingType ? "Edit Type" : "Add New Type"}
-    </h2>
-    <form onsubmit={saveType} class="space-y-4">
-      <label class="block">
-        <span class="text-gray-700">Name:</span>
-        <input
-          type="text"
-          bind:value={currentType.name}
-          required
-          class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
-        />
-      </label>
-      <label class="block">
-        <span class="text-gray-700">Comment:</span>
-        <input
-          type="text"
-          bind:value={currentType.comment}
-          required
-          class="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-md focus:ring focus:ring-indigo-200 focus:border-indigo-500"
-        />
-      </label>
-      <label class="block">
-        <span class="text-gray-700">Color:</span>
-        <ColorPicker
-          on:change={handleColorChange}
-          bind:color={currentType.color}
-          borderRadius="50%"
-        />
-      </label>
-      <div class="flex space-x-2">
-        <button
-          type="submit"
-          class="px-4 py-2 bg-indigo-500 text-white rounded-md hover:bg-indigo-600"
-        >
-          {editingType ? "Update Type" : "Add Type"}
-        </button>
-        {#if editingType}
-          <button
-            type="button"
-            onclick={() => (editingType = null)}
-            class="px-4 py-2 bg-gray-300 text-gray-700 rounded-md hover:bg-gray-400"
-          >
-            Cancel
-          </button>
-        {/if}
-      </div>
-    </form>
-  </div>
-
-  <h2 class="text-xl font-semibold mb-4 text-center">Types List</h2>
-  <ul class="space-y-4">
-    {#each types as type}
-      <li
-        class="bg-white p-4 rounded-lg shadow-md flex justify-between items-center"
-      >
-        <div>
-          <strong class="block text-lg" style="color: {type.color};"
-            >{type.name}</strong
-          >
-          <div class="text-sm text-gray-600">
-            Color: {type.color}, Comment: {type.comment}
-          </div>
-        </div>
-        <div class="flex space-x-2">
-          <button
-            onclick={() => editType(type)}
-            class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600"
-          >
-            Edit
-          </button>
-          <button
-            onclick={() => deleteType(type.id)}
-            class="px-4 py-2 bg-red-500 text-white rounded-md hover:bg-red-600"
-          >
-            Delete
-          </button>
-        </div>
-      </li>
-    {/each}
-  </ul>
-</div>