From 3b59620b9844b55c2064e43805b5f3dbea2e3d8b Mon Sep 17 00:00:00 2001
From: CoGomu <sebastianpeinbauer@gmail.com>
Date: Sat, 24 May 2025 20:43:35 +0200
Subject: [PATCH 1/9] cleanup

---
 web/pages/index.vue | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/web/pages/index.vue b/web/pages/index.vue
index f4c9460..2f1de3c 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -7,7 +7,6 @@ import Sidebar from '~/components/ui/Sidebar.vue';
 import { Event, type SerializableEvent } from '~/utils/event';
 
 const todos = ["Staistics", "Computer Graphics", "Webdev"]
-//const { data: todo } = useFetch<string[]>('http://localhost:8080/todos')
 const date = ref<DateTime>(DateTime.now())
 const events = ref<Event[]>([])
 
@@ -20,11 +19,9 @@ onMounted(() => {
   events.value = eventsResponse.value?.map(Event.fromSerializable) ?? []
 })
 
-
 const { data: tasks } = await useAsyncData<string[]>(
     'tasks',
     () => {
-        //return new Promise((res) => res([]))
 		return axios.get("/tasks").then(result => {
 			console.log(result.data)
 			return result.data
@@ -37,11 +34,6 @@ async function postEvent(event: Event) {
 	await axios.post('/event', event.toSerializable())
 }
 
-function myUseAsyncData<T>(name: string, callback: () => Promise<T>): { data: T, refresh: () => void, error: any } {
-    throw 'Not implemented'
-}
-
-
 </script>
 
 <template>

From aed6e8801185e86f5885cd1eaded45fe98d31c8f Mon Sep 17 00:00:00 2001
From: CoGomu <sebastianpeinbauer@gmail.com>
Date: Sat, 14 Jun 2025 15:59:23 +0200
Subject: [PATCH 2/9] basic db implementation

---
 backend/.gitignore        |   2 +
 backend/bun.lock          | 187 ++++++++++++++++++++++++++++++++++++++
 backend/drizzle.config.ts |  10 ++
 backend/package.json      |   9 +-
 backend/src/db/schema.ts  |  12 +++
 backend/{ => src}/main.ts |  30 +++---
 6 files changed, 231 insertions(+), 19 deletions(-)
 create mode 100644 backend/drizzle.config.ts
 create mode 100644 backend/src/db/schema.ts
 rename backend/{ => src}/main.ts (80%)

diff --git a/backend/.gitignore b/backend/.gitignore
index 3c3629e..79962e2 100644
--- a/backend/.gitignore
+++ b/backend/.gitignore
@@ -1 +1,3 @@
 node_modules
+local.db
+drizzle
diff --git a/backend/bun.lock b/backend/bun.lock
index 5d114ea..0b8ada6 100644
--- a/backend/bun.lock
+++ b/backend/bun.lock
@@ -3,13 +3,106 @@
   "workspaces": {
     "": {
       "dependencies": {
+        "@libsql/client": "^0.15.9",
         "@types/express": "^5.0.1",
         "cors": "^2.8.5",
+        "dotenv": "^16.5.0",
+        "drizzle-orm": "^0.44.2",
         "express": "^5.1.0",
       },
+      "devDependencies": {
+        "drizzle-kit": "^0.31.1",
+        "tsx": "^4.20.3",
+      },
     },
   },
   "packages": {
+    "@drizzle-team/brocli": ["@drizzle-team/brocli@0.10.2", "", {}, "sha512-z33Il7l5dKjUgGULTqBsQBQwckHh5AbIuxhdsIxDDiZAzBOrZO6q9ogcWC65kU382AfynTfgNumVcNIjuIua6w=="],
+
+    "@esbuild-kit/core-utils": ["@esbuild-kit/core-utils@3.3.2", "", { "dependencies": { "esbuild": "~0.18.20", "source-map-support": "^0.5.21" } }, "sha512-sPRAnw9CdSsRmEtnsl2WXWdyquogVpB3yZ3dgwJfe8zrOzTsV7cJvmwrKVa+0ma5BoiGJ+BoqkMvawbayKUsqQ=="],
+
+    "@esbuild-kit/esm-loader": ["@esbuild-kit/esm-loader@2.6.5", "", { "dependencies": { "@esbuild-kit/core-utils": "^3.3.2", "get-tsconfig": "^4.7.0" } }, "sha512-FxEMIkJKnodyA1OaCUoEvbYRkoZlLZ4d/eXFu9Fh8CbBBgP5EmZxrfTRyN0qpXZ4vOvqnE5YdRdcrmUUXuU+dA=="],
+
+    "@esbuild/aix-ppc64": ["@esbuild/aix-ppc64@0.25.5", "", { "os": "aix", "cpu": "ppc64" }, "sha512-9o3TMmpmftaCMepOdA5k/yDw8SfInyzWWTjYTFCX3kPSDJMROQTb8jg+h9Cnwnmm1vOzvxN7gIfB5V2ewpjtGA=="],
+
+    "@esbuild/android-arm": ["@esbuild/android-arm@0.25.5", "", { "os": "android", "cpu": "arm" }, "sha512-AdJKSPeEHgi7/ZhuIPtcQKr5RQdo6OO2IL87JkianiMYMPbCtot9fxPbrMiBADOWWm3T2si9stAiVsGbTQFkbA=="],
+
+    "@esbuild/android-arm64": ["@esbuild/android-arm64@0.25.5", "", { "os": "android", "cpu": "arm64" }, "sha512-VGzGhj4lJO+TVGV1v8ntCZWJktV7SGCs3Pn1GRWI1SBFtRALoomm8k5E9Pmwg3HOAal2VDc2F9+PM/rEY6oIDg=="],
+
+    "@esbuild/android-x64": ["@esbuild/android-x64@0.25.5", "", { "os": "android", "cpu": "x64" }, "sha512-D2GyJT1kjvO//drbRT3Hib9XPwQeWd9vZoBJn+bu/lVsOZ13cqNdDeqIF/xQ5/VmWvMduP6AmXvylO/PIc2isw=="],
+
+    "@esbuild/darwin-arm64": ["@esbuild/darwin-arm64@0.25.5", "", { "os": "darwin", "cpu": "arm64" }, "sha512-GtaBgammVvdF7aPIgH2jxMDdivezgFu6iKpmT+48+F8Hhg5J/sfnDieg0aeG/jfSvkYQU2/pceFPDKlqZzwnfQ=="],
+
+    "@esbuild/darwin-x64": ["@esbuild/darwin-x64@0.25.5", "", { "os": "darwin", "cpu": "x64" }, "sha512-1iT4FVL0dJ76/q1wd7XDsXrSW+oLoquptvh4CLR4kITDtqi2e/xwXwdCVH8hVHU43wgJdsq7Gxuzcs6Iq/7bxQ=="],
+
+    "@esbuild/freebsd-arm64": ["@esbuild/freebsd-arm64@0.25.5", "", { "os": "freebsd", "cpu": "arm64" }, "sha512-nk4tGP3JThz4La38Uy/gzyXtpkPW8zSAmoUhK9xKKXdBCzKODMc2adkB2+8om9BDYugz+uGV7sLmpTYzvmz6Sw=="],
+
+    "@esbuild/freebsd-x64": ["@esbuild/freebsd-x64@0.25.5", "", { "os": "freebsd", "cpu": "x64" }, "sha512-PrikaNjiXdR2laW6OIjlbeuCPrPaAl0IwPIaRv+SMV8CiM8i2LqVUHFC1+8eORgWyY7yhQY+2U2fA55mBzReaw=="],
+
+    "@esbuild/linux-arm": ["@esbuild/linux-arm@0.25.5", "", { "os": "linux", "cpu": "arm" }, "sha512-cPzojwW2okgh7ZlRpcBEtsX7WBuqbLrNXqLU89GxWbNt6uIg78ET82qifUy3W6OVww6ZWobWub5oqZOVtwolfw=="],
+
+    "@esbuild/linux-arm64": ["@esbuild/linux-arm64@0.25.5", "", { "os": "linux", "cpu": "arm64" }, "sha512-Z9kfb1v6ZlGbWj8EJk9T6czVEjjq2ntSYLY2cw6pAZl4oKtfgQuS4HOq41M/BcoLPzrUbNd+R4BXFyH//nHxVg=="],
+
+    "@esbuild/linux-ia32": ["@esbuild/linux-ia32@0.25.5", "", { "os": "linux", "cpu": "ia32" }, "sha512-sQ7l00M8bSv36GLV95BVAdhJ2QsIbCuCjh/uYrWiMQSUuV+LpXwIqhgJDcvMTj+VsQmqAHL2yYaasENvJ7CDKA=="],
+
+    "@esbuild/linux-loong64": ["@esbuild/linux-loong64@0.25.5", "", { "os": "linux", "cpu": "none" }, "sha512-0ur7ae16hDUC4OL5iEnDb0tZHDxYmuQyhKhsPBV8f99f6Z9KQM02g33f93rNH5A30agMS46u2HP6qTdEt6Q1kg=="],
+
+    "@esbuild/linux-mips64el": ["@esbuild/linux-mips64el@0.25.5", "", { "os": "linux", "cpu": "none" }, "sha512-kB/66P1OsHO5zLz0i6X0RxlQ+3cu0mkxS3TKFvkb5lin6uwZ/ttOkP3Z8lfR9mJOBk14ZwZ9182SIIWFGNmqmg=="],
+
+    "@esbuild/linux-ppc64": ["@esbuild/linux-ppc64@0.25.5", "", { "os": "linux", "cpu": "ppc64" }, "sha512-UZCmJ7r9X2fe2D6jBmkLBMQetXPXIsZjQJCjgwpVDz+YMcS6oFR27alkgGv3Oqkv07bxdvw7fyB71/olceJhkQ=="],
+
+    "@esbuild/linux-riscv64": ["@esbuild/linux-riscv64@0.25.5", "", { "os": "linux", "cpu": "none" }, "sha512-kTxwu4mLyeOlsVIFPfQo+fQJAV9mh24xL+y+Bm6ej067sYANjyEw1dNHmvoqxJUCMnkBdKpvOn0Ahql6+4VyeA=="],
+
+    "@esbuild/linux-s390x": ["@esbuild/linux-s390x@0.25.5", "", { "os": "linux", "cpu": "s390x" }, "sha512-K2dSKTKfmdh78uJ3NcWFiqyRrimfdinS5ErLSn3vluHNeHVnBAFWC8a4X5N+7FgVE1EjXS1QDZbpqZBjfrqMTQ=="],
+
+    "@esbuild/linux-x64": ["@esbuild/linux-x64@0.25.5", "", { "os": "linux", "cpu": "x64" }, "sha512-uhj8N2obKTE6pSZ+aMUbqq+1nXxNjZIIjCjGLfsWvVpy7gKCOL6rsY1MhRh9zLtUtAI7vpgLMK6DxjO8Qm9lJw=="],
+
+    "@esbuild/netbsd-arm64": ["@esbuild/netbsd-arm64@0.25.5", "", { "os": "none", "cpu": "arm64" }, "sha512-pwHtMP9viAy1oHPvgxtOv+OkduK5ugofNTVDilIzBLpoWAM16r7b/mxBvfpuQDpRQFMfuVr5aLcn4yveGvBZvw=="],
+
+    "@esbuild/netbsd-x64": ["@esbuild/netbsd-x64@0.25.5", "", { "os": "none", "cpu": "x64" }, "sha512-WOb5fKrvVTRMfWFNCroYWWklbnXH0Q5rZppjq0vQIdlsQKuw6mdSihwSo4RV/YdQ5UCKKvBy7/0ZZYLBZKIbwQ=="],
+
+    "@esbuild/openbsd-arm64": ["@esbuild/openbsd-arm64@0.25.5", "", { "os": "openbsd", "cpu": "arm64" }, "sha512-7A208+uQKgTxHd0G0uqZO8UjK2R0DDb4fDmERtARjSHWxqMTye4Erz4zZafx7Di9Cv+lNHYuncAkiGFySoD+Mw=="],
+
+    "@esbuild/openbsd-x64": ["@esbuild/openbsd-x64@0.25.5", "", { "os": "openbsd", "cpu": "x64" }, "sha512-G4hE405ErTWraiZ8UiSoesH8DaCsMm0Cay4fsFWOOUcz8b8rC6uCvnagr+gnioEjWn0wC+o1/TAHt+It+MpIMg=="],
+
+    "@esbuild/sunos-x64": ["@esbuild/sunos-x64@0.25.5", "", { "os": "sunos", "cpu": "x64" }, "sha512-l+azKShMy7FxzY0Rj4RCt5VD/q8mG/e+mDivgspo+yL8zW7qEwctQ6YqKX34DTEleFAvCIUviCFX1SDZRSyMQA=="],
+
+    "@esbuild/win32-arm64": ["@esbuild/win32-arm64@0.25.5", "", { "os": "win32", "cpu": "arm64" }, "sha512-O2S7SNZzdcFG7eFKgvwUEZ2VG9D/sn/eIiz8XRZ1Q/DO5a3s76Xv0mdBzVM5j5R639lXQmPmSo0iRpHqUUrsxw=="],
+
+    "@esbuild/win32-ia32": ["@esbuild/win32-ia32@0.25.5", "", { "os": "win32", "cpu": "ia32" }, "sha512-onOJ02pqs9h1iMJ1PQphR+VZv8qBMQ77Klcsqv9CNW2w6yLqoURLcgERAIurY6QE63bbLuqgP9ATqajFLK5AMQ=="],
+
+    "@esbuild/win32-x64": ["@esbuild/win32-x64@0.25.5", "", { "os": "win32", "cpu": "x64" }, "sha512-TXv6YnJ8ZMVdX+SXWVBo/0p8LTcrUYngpWjvm91TMjjBQii7Oz11Lw5lbDV5Y0TzuhSJHwiH4hEtC1I42mMS0g=="],
+
+    "@libsql/client": ["@libsql/client@0.15.9", "", { "dependencies": { "@libsql/core": "^0.15.9", "@libsql/hrana-client": "^0.7.0", "js-base64": "^3.7.5", "libsql": "^0.5.13", "promise-limit": "^2.7.0" } }, "sha512-VT3do0a0vwYVaNcp/y05ikkKS3OrFR5UeEf5SUuYZVgKVl1Nc1k9ajoYSsOid8AD/vlhLDB5yFQaV4HmT/OB9w=="],
+
+    "@libsql/core": ["@libsql/core@0.15.9", "", { "dependencies": { "js-base64": "^3.7.5" } }, "sha512-4OVdeAmuaCUq5hYT8NNn0nxlO9AcA/eTjXfUZ+QK8MT3Dz7Z76m73x7KxjU6I64WyXX98dauVH2b9XM+d84npw=="],
+
+    "@libsql/darwin-arm64": ["@libsql/darwin-arm64@0.5.13", "", { "os": "darwin", "cpu": "arm64" }, "sha512-ASz/EAMLDLx3oq9PVvZ4zBXXHbz2TxtxUwX2xpTRFR4V4uSHAN07+jpLu3aK5HUBLuv58z7+GjaL5w/cyjR28Q=="],
+
+    "@libsql/darwin-x64": ["@libsql/darwin-x64@0.5.13", "", { "os": "darwin", "cpu": "x64" }, "sha512-kzglniv1difkq8opusSXM7u9H0WoEPeKxw0ixIfcGfvlCVMJ+t9UNtXmyNHW68ljdllje6a4C6c94iPmIYafYA=="],
+
+    "@libsql/hrana-client": ["@libsql/hrana-client@0.7.0", "", { "dependencies": { "@libsql/isomorphic-fetch": "^0.3.1", "@libsql/isomorphic-ws": "^0.1.5", "js-base64": "^3.7.5", "node-fetch": "^3.3.2" } }, "sha512-OF8fFQSkbL7vJY9rfuegK1R7sPgQ6kFMkDamiEccNUvieQ+3urzfDFI616oPl8V7T9zRmnTkSjMOImYCAVRVuw=="],
+
+    "@libsql/isomorphic-fetch": ["@libsql/isomorphic-fetch@0.3.1", "", {}, "sha512-6kK3SUK5Uu56zPq/Las620n5aS9xJq+jMBcNSOmjhNf/MUvdyji4vrMTqD7ptY7/4/CAVEAYDeotUz60LNQHtw=="],
+
+    "@libsql/isomorphic-ws": ["@libsql/isomorphic-ws@0.1.5", "", { "dependencies": { "@types/ws": "^8.5.4", "ws": "^8.13.0" } }, "sha512-DtLWIH29onUYR00i0GlQ3UdcTRC6EP4u9w/h9LxpUZJWRMARk6dQwZ6Jkd+QdwVpuAOrdxt18v0K2uIYR3fwFg=="],
+
+    "@libsql/linux-arm-gnueabihf": ["@libsql/linux-arm-gnueabihf@0.5.13", "", { "os": "linux", "cpu": "arm" }, "sha512-UEW+VZN2r0mFkfztKOS7cqfS8IemuekbjUXbXCwULHtusww2QNCXvM5KU9eJCNE419SZCb0qaEWYytcfka8qeA=="],
+
+    "@libsql/linux-arm-musleabihf": ["@libsql/linux-arm-musleabihf@0.5.13", "", { "os": "linux", "cpu": "arm" }, "sha512-NMDgLqryYBv4Sr3WoO/m++XDjR5KLlw9r/JK4Ym6A1XBv2bxQQNhH0Lxx3bjLW8qqhBD4+0xfms4d2cOlexPyA=="],
+
+    "@libsql/linux-arm64-gnu": ["@libsql/linux-arm64-gnu@0.5.13", "", { "os": "linux", "cpu": "arm64" }, "sha512-/wCxVdrwl1ee6D6LEjwl+w4SxuLm5UL9Kb1LD5n0bBGs0q+49ChdPPh7tp175iRgkcrTgl23emymvt1yj3KxVQ=="],
+
+    "@libsql/linux-arm64-musl": ["@libsql/linux-arm64-musl@0.5.13", "", { "os": "linux", "cpu": "arm64" }, "sha512-xnVAbZIanUgX57XqeI5sNaDnVilp0Di5syCLSEo+bRyBobe/1IAeehNZpyVbCy91U2N6rH1C/mZU7jicVI9x+A=="],
+
+    "@libsql/linux-x64-gnu": ["@libsql/linux-x64-gnu@0.5.13", "", { "os": "linux", "cpu": "x64" }, "sha512-/mfMRxcQAI9f8t7tU3QZyh25lXgXKzgin9B9TOSnchD73PWtsVhlyfA6qOCfjQl5kr4sHscdXD5Yb3KIoUgrpQ=="],
+
+    "@libsql/linux-x64-musl": ["@libsql/linux-x64-musl@0.5.13", "", { "os": "linux", "cpu": "x64" }, "sha512-rdefPTpQCVwUjIQYbDLMv3qpd5MdrT0IeD0UZPGqhT9AWU8nJSQoj2lfyIDAWEz7PPOVCY4jHuEn7FS2sw9kRA=="],
+
+    "@libsql/win32-x64-msvc": ["@libsql/win32-x64-msvc@0.5.13", "", { "os": "win32", "cpu": "x64" }, "sha512-aNcmDrD1Ws+dNZIv9ECbxBQumqB9MlSVEykwfXJpqv/593nABb8Ttg5nAGUPtnADyaGDTrGvPPP81d/KsKho4Q=="],
+
+    "@neon-rs/load": ["@neon-rs/load@0.0.4", "", {}, "sha512-kTPhdZyTQxB+2wpiRcFWrDcejc4JI6tkPuS7UZCG4l6Zvc5kU/gGQ/ozvHTh1XR5tS+UlfAfGuPajjzQjCiHCw=="],
+
     "@types/body-parser": ["@types/body-parser@1.19.5", "", { "dependencies": { "@types/connect": "*", "@types/node": "*" } }, "sha512-fB3Zu92ucau0iQ0JMCFQE7b/dv8Ot07NI3KaZIkIUNXq82k4eBAqUaneXfleGY9JWskeS9y+u0nXMyspcuQrCg=="],
 
     "@types/connect": ["@types/connect@3.4.38", "", { "dependencies": { "@types/node": "*" } }, "sha512-K6uROf1LD88uDQqJCktA4yzL1YYAK6NgfsI0v/mTgyPKWsX1CnJ0XPSDhViejru1GcRkLWb8RlzFYJRqGUbaug=="],
@@ -32,10 +125,14 @@
 
     "@types/serve-static": ["@types/serve-static@1.15.7", "", { "dependencies": { "@types/http-errors": "*", "@types/node": "*", "@types/send": "*" } }, "sha512-W8Ym+h8nhuRwaKPaDw34QUkwsGi6Rc4yYqvKFo5rm2FUEhCFbzVWrxXUxuKK8TASjWsysJY0nsmNCGhCOIsrOw=="],
 
+    "@types/ws": ["@types/ws@8.18.1", "", { "dependencies": { "@types/node": "*" } }, "sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg=="],
+
     "accepts": ["accepts@2.0.0", "", { "dependencies": { "mime-types": "^3.0.0", "negotiator": "^1.0.0" } }, "sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng=="],
 
     "body-parser": ["body-parser@2.2.0", "", { "dependencies": { "bytes": "^3.1.2", "content-type": "^1.0.5", "debug": "^4.4.0", "http-errors": "^2.0.0", "iconv-lite": "^0.6.3", "on-finished": "^2.4.1", "qs": "^6.14.0", "raw-body": "^3.0.0", "type-is": "^2.0.0" } }, "sha512-02qvAaxv8tp7fBa/mw1ga98OGm+eCbqzJOKoRt70sLmfEEi+jyBYVTDGfCL/k06/4EMk/z01gCe7HoCH/f2LTg=="],
 
+    "buffer-from": ["buffer-from@1.1.2", "", {}, "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="],
+
     "bytes": ["bytes@3.1.2", "", {}, "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg=="],
 
     "call-bind-apply-helpers": ["call-bind-apply-helpers@1.0.2", "", { "dependencies": { "es-errors": "^1.3.0", "function-bind": "^1.1.2" } }, "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ=="],
@@ -52,10 +149,20 @@
 
     "cors": ["cors@2.8.5", "", { "dependencies": { "object-assign": "^4", "vary": "^1" } }, "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g=="],
 
+    "data-uri-to-buffer": ["data-uri-to-buffer@4.0.1", "", {}, "sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A=="],
+
     "debug": ["debug@4.4.1", "", { "dependencies": { "ms": "^2.1.3" } }, "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ=="],
 
     "depd": ["depd@2.0.0", "", {}, "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw=="],
 
+    "detect-libc": ["detect-libc@2.0.2", "", {}, "sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw=="],
+
+    "dotenv": ["dotenv@16.5.0", "", {}, "sha512-m/C+AwOAr9/W1UOIZUo232ejMNnJAJtYQjUbHoNTBNTJSvqzzDh7vnrei3o3r3m9blf6ZoDkvcw0VmozNRFJxg=="],
+
+    "drizzle-kit": ["drizzle-kit@0.31.1", "", { "dependencies": { "@drizzle-team/brocli": "^0.10.2", "@esbuild-kit/esm-loader": "^2.5.5", "esbuild": "^0.25.2", "esbuild-register": "^3.5.0" }, "bin": { "drizzle-kit": "bin.cjs" } }, "sha512-PUjYKWtzOzPtdtQlTHQG3qfv4Y0XT8+Eas6UbxCmxTj7qgMf+39dDujf1BP1I+qqZtw9uzwTh8jYtkMuCq+B0Q=="],
+
+    "drizzle-orm": ["drizzle-orm@0.44.2", "", { "peerDependencies": { "@aws-sdk/client-rds-data": ">=3", "@cloudflare/workers-types": ">=4", "@electric-sql/pglite": ">=0.2.0", "@libsql/client": ">=0.10.0", "@libsql/client-wasm": ">=0.10.0", "@neondatabase/serverless": ">=0.10.0", "@op-engineering/op-sqlite": ">=2", "@opentelemetry/api": "^1.4.1", "@planetscale/database": ">=1.13", "@prisma/client": "*", "@tidbcloud/serverless": "*", "@types/better-sqlite3": "*", "@types/pg": "*", "@types/sql.js": "*", "@upstash/redis": ">=1.34.7", "@vercel/postgres": ">=0.8.0", "@xata.io/client": "*", "better-sqlite3": ">=7", "bun-types": "*", "expo-sqlite": ">=14.0.0", "gel": ">=2", "knex": "*", "kysely": "*", "mysql2": ">=2", "pg": ">=8", "postgres": ">=3", "sql.js": ">=1", "sqlite3": ">=5" }, "optionalPeers": ["@aws-sdk/client-rds-data", "@cloudflare/workers-types", "@electric-sql/pglite", "@libsql/client", "@libsql/client-wasm", "@neondatabase/serverless", "@op-engineering/op-sqlite", "@opentelemetry/api", "@planetscale/database", "@prisma/client", "@tidbcloud/serverless", "@types/better-sqlite3", "@types/pg", "@types/sql.js", "@upstash/redis", "@vercel/postgres", "@xata.io/client", "better-sqlite3", "bun-types", "expo-sqlite", "gel", "knex", "kysely", "mysql2", "pg", "postgres", "sql.js", "sqlite3"] }, "sha512-zGAqBzWWkVSFjZpwPOrmCrgO++1kZ5H/rZ4qTGeGOe18iXGVJWf3WPfHOVwFIbmi8kHjfJstC6rJomzGx8g/dQ=="],
+
     "dunder-proto": ["dunder-proto@1.0.1", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.1", "es-errors": "^1.3.0", "gopd": "^1.2.0" } }, "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A=="],
 
     "ee-first": ["ee-first@1.1.1", "", {}, "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="],
@@ -68,24 +175,36 @@
 
     "es-object-atoms": ["es-object-atoms@1.1.1", "", { "dependencies": { "es-errors": "^1.3.0" } }, "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA=="],
 
+    "esbuild": ["esbuild@0.25.5", "", { "optionalDependencies": { "@esbuild/aix-ppc64": "0.25.5", "@esbuild/android-arm": "0.25.5", "@esbuild/android-arm64": "0.25.5", "@esbuild/android-x64": "0.25.5", "@esbuild/darwin-arm64": "0.25.5", "@esbuild/darwin-x64": "0.25.5", "@esbuild/freebsd-arm64": "0.25.5", "@esbuild/freebsd-x64": "0.25.5", "@esbuild/linux-arm": "0.25.5", "@esbuild/linux-arm64": "0.25.5", "@esbuild/linux-ia32": "0.25.5", "@esbuild/linux-loong64": "0.25.5", "@esbuild/linux-mips64el": "0.25.5", "@esbuild/linux-ppc64": "0.25.5", "@esbuild/linux-riscv64": "0.25.5", "@esbuild/linux-s390x": "0.25.5", "@esbuild/linux-x64": "0.25.5", "@esbuild/netbsd-arm64": "0.25.5", "@esbuild/netbsd-x64": "0.25.5", "@esbuild/openbsd-arm64": "0.25.5", "@esbuild/openbsd-x64": "0.25.5", "@esbuild/sunos-x64": "0.25.5", "@esbuild/win32-arm64": "0.25.5", "@esbuild/win32-ia32": "0.25.5", "@esbuild/win32-x64": "0.25.5" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-P8OtKZRv/5J5hhz0cUAdu/cLuPIKXpQl1R9pZtvmHWQvrAUVd0UNIPT4IB4W3rNOqVO0rlqHmCIbSwxh/c9yUQ=="],
+
+    "esbuild-register": ["esbuild-register@3.6.0", "", { "dependencies": { "debug": "^4.3.4" }, "peerDependencies": { "esbuild": ">=0.12 <1" } }, "sha512-H2/S7Pm8a9CL1uhp9OvjwrBh5Pvx0H8qVOxNu8Wed9Y7qv56MPtq+GGM8RJpq6glYJn9Wspr8uw7l55uyinNeg=="],
+
     "escape-html": ["escape-html@1.0.3", "", {}, "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow=="],
 
     "etag": ["etag@1.8.1", "", {}, "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg=="],
 
     "express": ["express@5.1.0", "", { "dependencies": { "accepts": "^2.0.0", "body-parser": "^2.2.0", "content-disposition": "^1.0.0", "content-type": "^1.0.5", "cookie": "^0.7.1", "cookie-signature": "^1.2.1", "debug": "^4.4.0", "encodeurl": "^2.0.0", "escape-html": "^1.0.3", "etag": "^1.8.1", "finalhandler": "^2.1.0", "fresh": "^2.0.0", "http-errors": "^2.0.0", "merge-descriptors": "^2.0.0", "mime-types": "^3.0.0", "on-finished": "^2.4.1", "once": "^1.4.0", "parseurl": "^1.3.3", "proxy-addr": "^2.0.7", "qs": "^6.14.0", "range-parser": "^1.2.1", "router": "^2.2.0", "send": "^1.1.0", "serve-static": "^2.2.0", "statuses": "^2.0.1", "type-is": "^2.0.1", "vary": "^1.1.2" } }, "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA=="],
 
+    "fetch-blob": ["fetch-blob@3.2.0", "", { "dependencies": { "node-domexception": "^1.0.0", "web-streams-polyfill": "^3.0.3" } }, "sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ=="],
+
     "finalhandler": ["finalhandler@2.1.0", "", { "dependencies": { "debug": "^4.4.0", "encodeurl": "^2.0.0", "escape-html": "^1.0.3", "on-finished": "^2.4.1", "parseurl": "^1.3.3", "statuses": "^2.0.1" } }, "sha512-/t88Ty3d5JWQbWYgaOGCCYfXRwV1+be02WqYYlL6h0lEiUAMPM8o8qKGO01YIkOHzka2up08wvgYD0mDiI+q3Q=="],
 
+    "formdata-polyfill": ["formdata-polyfill@4.0.10", "", { "dependencies": { "fetch-blob": "^3.1.2" } }, "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g=="],
+
     "forwarded": ["forwarded@0.2.0", "", {}, "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow=="],
 
     "fresh": ["fresh@2.0.0", "", {}, "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A=="],
 
+    "fsevents": ["fsevents@2.3.3", "", { "os": "darwin" }, "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw=="],
+
     "function-bind": ["function-bind@1.1.2", "", {}, "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA=="],
 
     "get-intrinsic": ["get-intrinsic@1.3.0", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.2", "es-define-property": "^1.0.1", "es-errors": "^1.3.0", "es-object-atoms": "^1.1.1", "function-bind": "^1.1.2", "get-proto": "^1.0.1", "gopd": "^1.2.0", "has-symbols": "^1.1.0", "hasown": "^2.0.2", "math-intrinsics": "^1.1.0" } }, "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ=="],
 
     "get-proto": ["get-proto@1.0.1", "", { "dependencies": { "dunder-proto": "^1.0.1", "es-object-atoms": "^1.0.0" } }, "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g=="],
 
+    "get-tsconfig": ["get-tsconfig@4.10.1", "", { "dependencies": { "resolve-pkg-maps": "^1.0.0" } }, "sha512-auHyJ4AgMz7vgS8Hp3N6HXSmlMdUyhSUrfBF16w153rxtLIEOE+HGqaBppczZvnHLqQJfiHotCYpNhl0lUROFQ=="],
+
     "gopd": ["gopd@1.2.0", "", {}, "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg=="],
 
     "has-symbols": ["has-symbols@1.1.0", "", {}, "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ=="],
@@ -102,6 +221,10 @@
 
     "is-promise": ["is-promise@4.0.0", "", {}, "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ=="],
 
+    "js-base64": ["js-base64@3.7.7", "", {}, "sha512-7rCnleh0z2CkXhH67J8K1Ytz0b2Y+yxTPL+/KOJoa20hfnVQ/3/T6W/KflYI4bRHRagNeXeU2bkNGI3v1oS/lw=="],
+
+    "libsql": ["libsql@0.5.13", "", { "dependencies": { "@neon-rs/load": "^0.0.4", "detect-libc": "2.0.2" }, "optionalDependencies": { "@libsql/darwin-arm64": "0.5.13", "@libsql/darwin-x64": "0.5.13", "@libsql/linux-arm-gnueabihf": "0.5.13", "@libsql/linux-arm-musleabihf": "0.5.13", "@libsql/linux-arm64-gnu": "0.5.13", "@libsql/linux-arm64-musl": "0.5.13", "@libsql/linux-x64-gnu": "0.5.13", "@libsql/linux-x64-musl": "0.5.13", "@libsql/win32-x64-msvc": "0.5.13" }, "os": [ "linux", "win32", "darwin", ], "cpu": [ "arm", "x64", "arm64", ] }, "sha512-5Bwoa/CqzgkTwySgqHA5TsaUDRrdLIbdM4egdPcaAnqO3aC+qAgS6BwdzuZwARA5digXwiskogZ8H7Yy4XfdOg=="],
+
     "math-intrinsics": ["math-intrinsics@1.1.0", "", {}, "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g=="],
 
     "media-typer": ["media-typer@1.1.0", "", {}, "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw=="],
@@ -116,6 +239,10 @@
 
     "negotiator": ["negotiator@1.0.0", "", {}, "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg=="],
 
+    "node-domexception": ["node-domexception@1.0.0", "", {}, "sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ=="],
+
+    "node-fetch": ["node-fetch@3.3.2", "", { "dependencies": { "data-uri-to-buffer": "^4.0.0", "fetch-blob": "^3.1.4", "formdata-polyfill": "^4.0.10" } }, "sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA=="],
+
     "object-assign": ["object-assign@4.1.1", "", {}, "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="],
 
     "object-inspect": ["object-inspect@1.13.4", "", {}, "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew=="],
@@ -128,6 +255,8 @@
 
     "path-to-regexp": ["path-to-regexp@8.2.0", "", {}, "sha512-TdrF7fW9Rphjq4RjrW0Kp2AW0Ahwu9sRGTkS6bvDi0SCwZlEZYmcfDbEsTz8RVk0EHIS/Vd1bv3JhG+1xZuAyQ=="],
 
+    "promise-limit": ["promise-limit@2.7.0", "", {}, "sha512-7nJ6v5lnJsXwGprnGXga4wx6d1POjvi5Qmf1ivTRxTjH4Z/9Czja/UCMLVmB9N93GeWOU93XaFaEt6jbuoagNw=="],
+
     "proxy-addr": ["proxy-addr@2.0.7", "", { "dependencies": { "forwarded": "0.2.0", "ipaddr.js": "1.9.1" } }, "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg=="],
 
     "qs": ["qs@6.14.0", "", { "dependencies": { "side-channel": "^1.1.0" } }, "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w=="],
@@ -136,6 +265,8 @@
 
     "raw-body": ["raw-body@3.0.0", "", { "dependencies": { "bytes": "3.1.2", "http-errors": "2.0.0", "iconv-lite": "0.6.3", "unpipe": "1.0.0" } }, "sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g=="],
 
+    "resolve-pkg-maps": ["resolve-pkg-maps@1.0.0", "", {}, "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw=="],
+
     "router": ["router@2.2.0", "", { "dependencies": { "debug": "^4.4.0", "depd": "^2.0.0", "is-promise": "^4.0.0", "parseurl": "^1.3.3", "path-to-regexp": "^8.0.0" } }, "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ=="],
 
     "safe-buffer": ["safe-buffer@5.2.1", "", {}, "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="],
@@ -156,10 +287,16 @@
 
     "side-channel-weakmap": ["side-channel-weakmap@1.0.2", "", { "dependencies": { "call-bound": "^1.0.2", "es-errors": "^1.3.0", "get-intrinsic": "^1.2.5", "object-inspect": "^1.13.3", "side-channel-map": "^1.0.1" } }, "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A=="],
 
+    "source-map": ["source-map@0.6.1", "", {}, "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="],
+
+    "source-map-support": ["source-map-support@0.5.21", "", { "dependencies": { "buffer-from": "^1.0.0", "source-map": "^0.6.0" } }, "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w=="],
+
     "statuses": ["statuses@2.0.1", "", {}, "sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ=="],
 
     "toidentifier": ["toidentifier@1.0.1", "", {}, "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA=="],
 
+    "tsx": ["tsx@4.20.3", "", { "dependencies": { "esbuild": "~0.25.0", "get-tsconfig": "^4.7.5" }, "optionalDependencies": { "fsevents": "~2.3.3" }, "bin": { "tsx": "dist/cli.mjs" } }, "sha512-qjbnuR9Tr+FJOMBqJCW5ehvIo/buZq7vH7qD7JziU98h6l3qGy0a/yPFjwO+y0/T7GFpNgNAvEcPPVfyT8rrPQ=="],
+
     "type-is": ["type-is@2.0.1", "", { "dependencies": { "content-type": "^1.0.5", "media-typer": "^1.1.0", "mime-types": "^3.0.0" } }, "sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw=="],
 
     "undici-types": ["undici-types@6.21.0", "", {}, "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ=="],
@@ -168,6 +305,56 @@
 
     "vary": ["vary@1.1.2", "", {}, "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="],
 
+    "web-streams-polyfill": ["web-streams-polyfill@3.3.3", "", {}, "sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw=="],
+
     "wrappy": ["wrappy@1.0.2", "", {}, "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="],
+
+    "ws": ["ws@8.18.2", "", { "peerDependencies": { "bufferutil": "^4.0.1", "utf-8-validate": ">=5.0.2" }, "optionalPeers": ["bufferutil", "utf-8-validate"] }, "sha512-DMricUmwGZUVr++AEAe2uiVM7UoO9MAVZMDu05UQOaUII0lp+zOzLLU4Xqh/JvTqklB1T4uELaaPBKyjE1r4fQ=="],
+
+    "@esbuild-kit/core-utils/esbuild": ["esbuild@0.18.20", "", { "optionalDependencies": { "@esbuild/android-arm": "0.18.20", "@esbuild/android-arm64": "0.18.20", "@esbuild/android-x64": "0.18.20", "@esbuild/darwin-arm64": "0.18.20", "@esbuild/darwin-x64": "0.18.20", "@esbuild/freebsd-arm64": "0.18.20", "@esbuild/freebsd-x64": "0.18.20", "@esbuild/linux-arm": "0.18.20", "@esbuild/linux-arm64": "0.18.20", "@esbuild/linux-ia32": "0.18.20", "@esbuild/linux-loong64": "0.18.20", "@esbuild/linux-mips64el": "0.18.20", "@esbuild/linux-ppc64": "0.18.20", "@esbuild/linux-riscv64": "0.18.20", "@esbuild/linux-s390x": "0.18.20", "@esbuild/linux-x64": "0.18.20", "@esbuild/netbsd-x64": "0.18.20", "@esbuild/openbsd-x64": "0.18.20", "@esbuild/sunos-x64": "0.18.20", "@esbuild/win32-arm64": "0.18.20", "@esbuild/win32-ia32": "0.18.20", "@esbuild/win32-x64": "0.18.20" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/android-arm": ["@esbuild/android-arm@0.18.20", "", { "os": "android", "cpu": "arm" }, "sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/android-arm64": ["@esbuild/android-arm64@0.18.20", "", { "os": "android", "cpu": "arm64" }, "sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/android-x64": ["@esbuild/android-x64@0.18.20", "", { "os": "android", "cpu": "x64" }, "sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/darwin-arm64": ["@esbuild/darwin-arm64@0.18.20", "", { "os": "darwin", "cpu": "arm64" }, "sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/darwin-x64": ["@esbuild/darwin-x64@0.18.20", "", { "os": "darwin", "cpu": "x64" }, "sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/freebsd-arm64": ["@esbuild/freebsd-arm64@0.18.20", "", { "os": "freebsd", "cpu": "arm64" }, "sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/freebsd-x64": ["@esbuild/freebsd-x64@0.18.20", "", { "os": "freebsd", "cpu": "x64" }, "sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-arm": ["@esbuild/linux-arm@0.18.20", "", { "os": "linux", "cpu": "arm" }, "sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-arm64": ["@esbuild/linux-arm64@0.18.20", "", { "os": "linux", "cpu": "arm64" }, "sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-ia32": ["@esbuild/linux-ia32@0.18.20", "", { "os": "linux", "cpu": "ia32" }, "sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-loong64": ["@esbuild/linux-loong64@0.18.20", "", { "os": "linux", "cpu": "none" }, "sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-mips64el": ["@esbuild/linux-mips64el@0.18.20", "", { "os": "linux", "cpu": "none" }, "sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-ppc64": ["@esbuild/linux-ppc64@0.18.20", "", { "os": "linux", "cpu": "ppc64" }, "sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-riscv64": ["@esbuild/linux-riscv64@0.18.20", "", { "os": "linux", "cpu": "none" }, "sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-s390x": ["@esbuild/linux-s390x@0.18.20", "", { "os": "linux", "cpu": "s390x" }, "sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/linux-x64": ["@esbuild/linux-x64@0.18.20", "", { "os": "linux", "cpu": "x64" }, "sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/netbsd-x64": ["@esbuild/netbsd-x64@0.18.20", "", { "os": "none", "cpu": "x64" }, "sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/openbsd-x64": ["@esbuild/openbsd-x64@0.18.20", "", { "os": "openbsd", "cpu": "x64" }, "sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/sunos-x64": ["@esbuild/sunos-x64@0.18.20", "", { "os": "sunos", "cpu": "x64" }, "sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/win32-arm64": ["@esbuild/win32-arm64@0.18.20", "", { "os": "win32", "cpu": "arm64" }, "sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/win32-ia32": ["@esbuild/win32-ia32@0.18.20", "", { "os": "win32", "cpu": "ia32" }, "sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g=="],
+
+    "@esbuild-kit/core-utils/esbuild/@esbuild/win32-x64": ["@esbuild/win32-x64@0.18.20", "", { "os": "win32", "cpu": "x64" }, "sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ=="],
   }
 }
diff --git a/backend/drizzle.config.ts b/backend/drizzle.config.ts
new file mode 100644
index 0000000..ec4bf5b
--- /dev/null
+++ b/backend/drizzle.config.ts
@@ -0,0 +1,10 @@
+import { defineConfig } from 'drizzle-kit'
+
+export default defineConfig({
+	out: './drizzle',
+	schema: './src/db/schema.ts',
+	dialect: 'sqlite',
+	dbCredentials: {
+		url: 'file:local.db'
+	}
+})
diff --git a/backend/package.json b/backend/package.json
index f982c1d..a3ec262 100644
--- a/backend/package.json
+++ b/backend/package.json
@@ -1,10 +1,17 @@
 {
   "dependencies": {
+    "@libsql/client": "^0.15.9",
     "@types/express": "^5.0.1",
     "cors": "^2.8.5",
+    "dotenv": "^16.5.0",
+    "drizzle-orm": "^0.44.2",
     "express": "^5.1.0"
   },
   "scripts": {
-    "start": "bun main.ts"
+    "dev": "bun run --watch src/main.ts"
+  },
+  "devDependencies": {
+    "drizzle-kit": "^0.31.1",
+    "tsx": "^4.20.3"
   }
 }
\ No newline at end of file
diff --git a/backend/src/db/schema.ts b/backend/src/db/schema.ts
new file mode 100644
index 0000000..5c159de
--- /dev/null
+++ b/backend/src/db/schema.ts
@@ -0,0 +1,12 @@
+import { sqliteTable, int, text } from 'drizzle-orm/sqlite-core'
+
+export const event = sqliteTable('event', {
+	id: int().primaryKey({ autoIncrement: true }),
+    userid: text().notNull(),
+	title: text().notNull(),
+	description: text().notNull(),
+	from: text().notNull(),
+	to: text().notNull(),
+	created_at: text().notNull().default(new Date().toISOString()),
+	updated_at: text().notNull().default(new Date().toISOString())
+})
diff --git a/backend/main.ts b/backend/src/main.ts
similarity index 80%
rename from backend/main.ts
rename to backend/src/main.ts
index c94018c..f2303ff 100644
--- a/backend/main.ts
+++ b/backend/src/main.ts
@@ -1,7 +1,11 @@
 import express from 'express'
 import cors from 'cors'
+import { drizzle } from 'drizzle-orm/libsql';
+import { event } from './db/schema';
 
+const db = drizzle("file:local.db");
 const app = express();
+const userId = "Detlef";
 
 app.use(cors())
 app.use(express.json());
@@ -16,21 +20,8 @@ app.get('/tasks', (req, res) => {
     );
 });
 
-app.get('/events', (req, res) => {
-    res.send(
-        [
-            {
-                "title": "wedding",
-                "from": "2025-05-19T08:30:26.195+02:00",
-                "to": "2025-05-19T12:32:55.883+02:00"
-            },
-            {
-                "title": "funeral",
-                "from": "2025-05-19T15:26:34.178+02:00",
-                "to": "2025-05-19T18:12:43.409+02:00"
-            }
-        ]
-    );
+app.get('/events', async(req, res) => {
+    res.send(await db.select().from(event))
 });
 
 app.get('/user/:id', (req, res) => {
@@ -83,11 +74,14 @@ app.post('/task', (req, res) => {
     res.status(200).json(newTask);
 });
 
-app.post('/event', (req, res) => {
+app.post('/event', async(req, res) => {
 
-    const newEvent = req.body;
+    const newEvent: typeof event.$inferInsert = req.body
+    newEvent.description = ""
+    newEvent.userid = userId
 
-    console.log(newEvent)
+    const returnedEvent = await db.insert(event).values(newEvent).returning()
+    console.log(returnedEvent)
 
     //Validate
 

From 65107ea969fa85c95178e2ab89b832593ca2622c Mon Sep 17 00:00:00 2001
From: CoGomu <sebastianpeinbauer@gmail.com>
Date: Sat, 14 Jun 2025 17:42:31 +0200
Subject: [PATCH 3/9] tasks can be added to db

---
 backend/src/db/schema.ts      | 12 ++++++++++
 backend/src/main.ts           | 41 ++++++++++++++++-------------------
 web/components/ui/Sidebar.vue | 14 +++++++++++-
 web/pages/index.vue           | 15 +++++++++++--
 4 files changed, 57 insertions(+), 25 deletions(-)

diff --git a/backend/src/db/schema.ts b/backend/src/db/schema.ts
index 5c159de..9893c07 100644
--- a/backend/src/db/schema.ts
+++ b/backend/src/db/schema.ts
@@ -10,3 +10,15 @@ export const event = sqliteTable('event', {
 	created_at: text().notNull().default(new Date().toISOString()),
 	updated_at: text().notNull().default(new Date().toISOString())
 })
+
+export const task = sqliteTable('task', {
+    id: int().primaryKey({ autoIncrement: true }),
+    userid: text().notNull(),
+	title: text().notNull(),
+	description: text().notNull(),
+    done: int().notNull(),
+    estimated_time: int().notNull(),
+    due_date: text().notNull(),
+	created_at: text().notNull().default(new Date().toISOString()),
+	updated_at: text().notNull().default(new Date().toISOString())
+})
diff --git a/backend/src/main.ts b/backend/src/main.ts
index f2303ff..f28b17d 100644
--- a/backend/src/main.ts
+++ b/backend/src/main.ts
@@ -1,7 +1,8 @@
 import express from 'express'
 import cors from 'cors'
 import { drizzle } from 'drizzle-orm/libsql';
-import { event } from './db/schema';
+import { event, task } from './db/schema';
+import { eq, ne, gt, gte } from 'drizzle-orm';
 
 const db = drizzle("file:local.db");
 const app = express();
@@ -14,10 +15,10 @@ app.get('/', (req, res) => {
     res.send('Hello World');
 });
 
-app.get('/tasks', (req, res) => {
-    res.send(
-        ["Homework", "cleaning", "learn Arrow-functions"]
-    );
+app.get('/tasks', async(req, res) => {
+    const tasks = await db.select({ title: task.title }).from(task)
+    const titles = tasks.map(t => t.title)
+    res.send(titles);
 });
 
 app.get('/events', async(req, res) => {
@@ -63,15 +64,15 @@ app.get('/event/:id', (req, res) => {
     res.json(event);
 });
 
-app.post('/task', (req, res) => {
+app.post('/task', async(req, res) => {
 
-    const newTask = req.body;
+    const newTask = req.body
+    newTask.userid = userId
 
-    //Validate
+    const returnedTask = await db.insert(task).values(newTask).returning()
+    console.log(returnedTask)
 
-    //const newTaskWithId = db.createEvent(newTask)
-
-    res.status(200).json(newTask);
+    res.status(201).json(returnedTask);
 });
 
 app.post('/event', async(req, res) => {
@@ -83,11 +84,7 @@ app.post('/event', async(req, res) => {
     const returnedEvent = await db.insert(event).values(newEvent).returning()
     console.log(returnedEvent)
 
-    //Validate
-
-    //const newEventWithId = db.createEvent(newEvent)
-
-    res.status(201).json(newEvent);
+    res.status(201).json(returnedEvent);
 });
 
 app.put('/task', (req, res) => {
@@ -111,17 +108,17 @@ app.put('/event', (req, res) => {
     res.status(200).json(updatedEvent);
 });
 
-app.delete('/task/:id', (req, res) => {
-    const id = req.params['id'];
+app.delete('/task/:id', async(req, res) => {
+    const id = parseInt(req.params['id']);
 
-    //const success = db.deleteTask(id)
+    const success = await db.delete(task).where(eq(task.id, id))
     res.send("Deleted");
 });
 
-app.delete('/event', (req, res) => {
-    const id = req.params['id'];
+app.delete('/event/:id', async(req, res) => {
+    const id = parseInt(req.params['id']);
 
-    //const success = db.deleteEvent(id)
+    const success = await db.delete(event).where(eq(event.id, id))
     res.send("Deleted");
 });
 
diff --git a/web/components/ui/Sidebar.vue b/web/components/ui/Sidebar.vue
index 6528c42..dd4fad2 100644
--- a/web/components/ui/Sidebar.vue
+++ b/web/components/ui/Sidebar.vue
@@ -17,6 +17,10 @@ watch(currentTheme, () => {
 	colorMode.preference = currentTheme.value;
 })
 
+const emits = defineEmits<{
+	(e: 'createTask', name: string): void
+}>()
+
 const dropDownItems = computed<DropdownMenuItem[][]>(() => [
 	[
 		{ label: "Profile", icon: "i-lucide-user" },
@@ -73,6 +77,14 @@ defineProps<{
 	todos: string[]
 }>()
 
+function addTodo(){
+	const name = prompt("Todo name:")
+	console.log(name)
+	if (name !== null) {
+		emits('createTask', name)
+	}
+}
+
 </script>
 
 <template>
@@ -90,7 +102,7 @@ defineProps<{
 					</div>
 				</div>
 				<div class="flex">
-					<UButton size="xl" class="w-full flex justify-center">
+					<UButton size="xl" class="w-full flex justify-center" @click="addTodo">
 						+
 					</UButton>
 				</div>
diff --git a/web/pages/index.vue b/web/pages/index.vue
index 2f1de3c..63bde31 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -30,15 +30,26 @@ const { data: tasks } = await useAsyncData<string[]>(
 )
 
 async function postEvent(event: Event) {
-	console.log('posting')
+	console.log('posting Event')
 	await axios.post('/event', event.toSerializable())
 }
 
+async function postTask(name: string) {
+	console.log('posting Task')
+  await axios.post('/task', {
+    title: name,
+    description: "",
+    done: false,
+    estimated_time: (new Date()).toISOString(), //TODO
+    due_date: (new Date()).toISOString(),
+  })
+}
+
 </script>
 
 <template>
     <div class="h-screen w-screen p-4 flex flex-row gap-5">
-        <Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" />
+        <Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" @create-task="postTask"/>
         <MainContent v-if="events !== null" v-model:events="events" v-model:date="date" @create-event="postEvent"/>
     </div>
 </template>

From 6039509006df7f5fa603ea0f58e2262a78cdc65f Mon Sep 17 00:00:00 2001
From: CoGomu <sebastianpeinbauer@gmail.com>
Date: Sun, 15 Jun 2025 21:04:22 +0200
Subject: [PATCH 4/9] add button for deleting task delete task from db

---
 backend/src/main.ts           | 16 ++++++++------
 web/components/ui/Sidebar.vue | 41 ++++++++++++++++++++++++++++++++---
 web/pages/index.vue           | 24 ++++++++++++++++++--
 3 files changed, 69 insertions(+), 12 deletions(-)

diff --git a/backend/src/main.ts b/backend/src/main.ts
index f28b17d..3356dbe 100644
--- a/backend/src/main.ts
+++ b/backend/src/main.ts
@@ -16,9 +16,9 @@ app.get('/', (req, res) => {
 });
 
 app.get('/tasks', async(req, res) => {
-    const tasks = await db.select({ title: task.title }).from(task)
-    const titles = tasks.map(t => t.title)
-    res.send(titles);
+    const tasks = await db.select().from(task)
+    console.log(tasks)
+    res.send(tasks);
 });
 
 app.get('/events', async(req, res) => {
@@ -38,17 +38,19 @@ app.get('/user/:id', (req, res) => {
 
 });
 
-app.get('/task/:id', (req, res) => {
+app.get('/task/:id', async(req, res) => {
 
-    const id = req.params['id'];
+    const id = parseInt(req.params['id']);
 
     if (id == null) {
         res.status(400).send({error: 'Needs an id'});
         return;
     }
 
-    const task = {id: id, name: 'Homework'}  //TODO
-    res.json(task);
+    const returnedTask = await db.select().from(task).where(eq(task.id, id))
+    //
+    console.log(returnedTask)
+    res.json(returnedTask);
 });
 
 app.get('/event/:id', (req, res) => {
diff --git a/web/components/ui/Sidebar.vue b/web/components/ui/Sidebar.vue
index dd4fad2..d8f7ee7 100644
--- a/web/components/ui/Sidebar.vue
+++ b/web/components/ui/Sidebar.vue
@@ -19,6 +19,7 @@ watch(currentTheme, () => {
 
 const emits = defineEmits<{
 	(e: 'createTask', name: string): void
+	(e: 'deleteTask', id: number): void
 }>()
 
 const dropDownItems = computed<DropdownMenuItem[][]>(() => [
@@ -73,17 +74,37 @@ const selectedDate = computed({
 	}
 })
 
+type Task = {
+  id: number
+  userid: string
+  title: string
+  description: string
+  done: number
+  estimated_time: string
+  due_date: string
+  created_at: string
+  updated_at: string
+}
+
 defineProps<{
-	todos: string[]
+  todos: Task[]
 }>()
 
-function addTodo(){
+
+function addTodo() {
 	const name = prompt("Todo name:")
 	console.log(name)
 	if (name !== null) {
 		emits('createTask', name)
 	}
 }
+function deleteTodo(todo: Task) {
+	console.log(todo.id)
+	emits('deleteTask', todo.id)
+}
+function editTodo() {
+
+}
 
 </script>
 
@@ -98,7 +119,21 @@ function addTodo(){
 				<div class="flex flex-col gap-2">
 					<Title1>Todos</Title1>
 					<div class="flex gap-2 flex-col">
-						<ListItem v-for="todo in todos">{{ todo }}</ListItem>
+						<ListItem v-for="todo in todos">
+							<div class="flex justify-between">
+								<span>
+									{{ todo.title }}
+								</span>
+								<div class="flex gap-1">
+									<UButton size="xs" color="neutral" class="flex justify-center" @click="editTodo">
+										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path><path d="m15 5 4 4"></path></svg>
+									</UButton>
+									<UButton size="xs" class="flex justify-center" color="primary" @click="() => deleteTodo(todo)">
+										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash-2"><path d="M3 6h18"></path><path d="M19 6v14c0 1-2 2-2 2H7c-1 0-2-1-2-2V6"></path><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"></path><line x1="10" x2="10" y1="11" y2="17"></line><line x1="14" x2="14" y1="11" y2="17"></line></svg>
+									</UButton>
+								</div>
+							</div>
+					</ListItem>
 					</div>
 				</div>
 				<div class="flex">
diff --git a/web/pages/index.vue b/web/pages/index.vue
index 63bde31..5f1b1f1 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -19,7 +19,20 @@ onMounted(() => {
   events.value = eventsResponse.value?.map(Event.fromSerializable) ?? []
 })
 
-const { data: tasks } = await useAsyncData<string[]>(
+type Task = {
+  id: number
+  userid: string
+  title: string
+  description: string
+  done: number
+  estimated_time: string
+  due_date: string
+  created_at: string
+  updated_at: string
+}
+
+
+const { data: tasks, refresh } = await useAsyncData<Task[]>(
     'tasks',
     () => {
 		return axios.get("/tasks").then(result => {
@@ -43,13 +56,20 @@ async function postTask(name: string) {
     estimated_time: (new Date()).toISOString(), //TODO
     due_date: (new Date()).toISOString(),
   })
+  await refresh()
+}
+
+async function deleteTask(id: number) {
+  console.log('deleting Task')
+  await axios.delete(`/task/${id}`)
+  await refresh()
 }
 
 </script>
 
 <template>
     <div class="h-screen w-screen p-4 flex flex-row gap-5">
-        <Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" @create-task="postTask"/>
+        <Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" @create-task="postTask" @delete-task="deleteTask"/>
         <MainContent v-if="events !== null" v-model:events="events" v-model:date="date" @create-event="postEvent"/>
     </div>
 </template>

From 01c57f24a1976e3032bccbd712647cfae83ffe8b Mon Sep 17 00:00:00 2001
From: quirinecker <quirin.ecker@bajupa.com>
Date: Mon, 16 Jun 2025 11:18:26 +0200
Subject: [PATCH 5/9] added dialog for creating events

---
 web/components/ui/calendar/Calendar.vue | 111 +++++++++++++++++++++---
 web/utils/event.ts                      |  32 ++++---
 2 files changed, 119 insertions(+), 24 deletions(-)

diff --git a/web/components/ui/calendar/Calendar.vue b/web/components/ui/calendar/Calendar.vue
index 3738fc1..09ad52e 100644
--- a/web/components/ui/calendar/Calendar.vue
+++ b/web/components/ui/calendar/Calendar.vue
@@ -4,10 +4,32 @@ import CalendarHeader from './CalendarHeader.vue';
 import CalendarCollumn from './CalendarCollumn.vue';
 import { Event } from '~/utils/event';
 import { DateTime } from 'luxon';
+import { UTextarea } from '#components';
 
 const events = defineModel<Event[]>('events', { required: true })
 const date = defineModel<DateTime>('date', { required: true })
 const draggedEvent = ref<DraggedEvent | undefined>()
+const createModalOpened = ref(false)
+const createContext = ref<{ date: DateTime, timespan: Timespan } | undefined>(undefined)
+const createModal = {
+	open: ref(false),
+	fromTimeField: ref<string>(''),
+	toTimeField: ref<string>(''),
+	toDateField: ref<string>(''),
+	fromDateField: ref<string>(''),
+	nameField: ref<string>(''),
+	descriptionField: ref<string>(''),
+	clear: () => {
+		createModal.nameField.value = ''
+		createModal.fromDateField.value = ''
+		createModal.toDateField.value = ''
+		createModal.fromTimeField.value = ''
+		createModal.toTimeField.value = ''
+		createModal.descriptionField.value = ''
+	}
+}
+
+const toast = useToast()
 
 type Day = {
 	date: DateTime
@@ -87,33 +109,94 @@ const seperators = ref<Seperator[]>([
 	{ text: '9 PM', time: hour(21) },
 ])
 
-
-function quickCreate(date: DateTime, timespan: Timespan) {
-	const eventTitle = prompt("Event title")
-
-	if (eventTitle === null) {
-		return
+function openCreateModal(date: DateTime, timespan: Timespan) {
+	createContext.value = {
+		date: date,
+		timespan: timespan
 	}
 
-	const newEvent: Event = new Event(
-		eventTitle,
-		date.startOf('day').plus({ minutes: timespan.from * 24 * 60 }),
-		date.startOf('day').plus({ minutes: timespan.to * 24 * 60 })
-	)
+	const from = date.startOf('day').plus({ minutes: timespan.from * 24 * 60 })
+	const to = date.startOf('day').plus({ minutes: timespan.to * 24 * 60 })
 
-	emits('create', newEvent)
-	events.value.push(newEvent)
+	createModal.fromDateField.value = from.toISODate() ?? ''
+	createModal.toDateField.value = to.toISODate() ?? ''
+	createModal.fromTimeField.value = from.toFormat('HH:mm')
+	createModal.toTimeField.value = to.toFormat('HH:mm')
+	createModal.open.value = true
+}
+
+function create() {
+	const from = dateFromFields(createModal.fromDateField.value, createModal.fromTimeField.value)
+	const to = dateFromFields(createModal.toDateField.value, createModal.toTimeField.value)
+
+	if (!from.isValid) {
+		toast.add({
+			title: 'Invalid `from` date format'
+		})
+	}
+
+	if (!to.isValid) {
+		toast.add({
+			title: 'Invalid `to` date format'
+		})
+	}
+
+	if (createModal.nameField.value.trim() === '') {
+		toast.add({
+			title: 'Name is required'
+		})
+	}
+
+	const event = new Event(createModal.nameField.value, from, to, createModal.descriptionField.value)
+	emits('create', event)
+	createModal.clear()
+	createModal.open.value = false
+	events.value.push(event)
+}
+
+function dateFromFields(date: string, time: string) {
+	return DateTime.fromFormat(`${date} ${time}`, 'yyyy-MM-dd HH:mm')
 }
 
 </script>
 
 <template>
 	<div class="w-full h-full flex flex-col">
+		<UModal v-model:open="createModal.open.value" title="Create Event"
+			description="Set name and change time of event before creation">
+			<template #body>
+				<div class="flex flex-col gap-2">
+					<UInput type="text" placeholder="Name" v-model="createModal.nameField.value" required />
+					<div class="flex flex-row gap-2">
+						<UInput class="grow" placeholder="2025-06-16" v-model="createModal.fromDateField.value"
+							icon="i-lucide-calendar" required />
+						<UInput class="grow" placeholder="15:34" v-model="createModal.fromTimeField.value"
+							icon="i-lucide-clock" required />
+					</div>
+					<div class="flex flex-row gap-2">
+						<UInput class="grow" placeholder="2025-06-16" v-model="createModal.toDateField.value"
+							icon="i-lucide-calendar" required />
+						<UInput class="grow" placeholder="15:34" v-model="createModal.toTimeField.value"
+							icon="i-lucide-clock" required />
+					</div>
+					<UTextarea type="text" placeholder="Description" v-model="createModal.descriptionField.value"
+						required />
+				</div>
+			</template>
+			<template #footer>
+				<UButton variant="solid" @click="create">
+					Create
+				</UButton>
+				<UButton variant="soft">
+					Cancel
+				</UButton>
+			</template>
+		</UModal>
 		<div class="calendar flex flex-row w-full flex-1 items-stretch divide-x divide-muted">
 			<CalendarHeader :seperators="seperators" />
 
 			<CalendarCollumn v-for="day in days" :seperators="seperators" :day="day.date" :events="day.events"
-				:date="date" v-model:draggedEvent="draggedEvent" @quick-create="quickCreate" />
+				:date="date" v-model:draggedEvent="draggedEvent" @quick-create="openCreateModal" />
 		</div>
 
 	</div>
diff --git a/web/utils/event.ts b/web/utils/event.ts
index d0ac1f7..7d407c3 100644
--- a/web/utils/event.ts
+++ b/web/utils/event.ts
@@ -6,7 +6,8 @@ export class Event {
 	constructor(
 		public readonly title: string,
 		public from: DateTime,
-		public to: DateTime
+		public to: DateTime,
+		public description: string
 	) { }
 
 
@@ -29,28 +30,29 @@ export class Event {
 	}
 
 	static fromSimple(event: SimpleEvent): Event {
-		return new Event(event.title, event.from, event.to)
+		return new Event(event.title, event.from, event.to, event.description)
 	}
 
 	static fromSerializable(event: SerializableEvent) {
-		return new Event(event.title, DateTime.fromISO(event.from), DateTime.fromISO(event.to))
+		return new Event(event.title, DateTime.fromISO(event.from), DateTime.fromISO(event.to), event.description)
 	}
 
-	static fromPercentDimensions(title: string, dimensions: EventDimensions, date: DateTime): Event {
+	static fromPercentDimensions(title: string, dimensions: EventDimensions, date: DateTime, description: string): Event {
 		return new Event(
 			title,
 			date.startOf('day').plus({ minutes: (dimensions.from / 100) * Event.MINUTES_IN_DAY }),
-			date.startOf('day').plus({ minutes: (dimensions.to / 100) * Event.MINUTES_IN_DAY })
+			date.startOf('day').plus({ minutes: (dimensions.to / 100) * Event.MINUTES_IN_DAY }),
+			description
 		)
 	}
 
-	static fromPixelDimensions(title: string, dimensions: EventDimensions, height: number, date: DateTime): Event {
+	static fromPixelDimensions(title: string, dimensions: EventDimensions, height: number, date: DateTime, description: string): Event {
 		const percentDimensions: EventDimensions = {
 			from: dimensions.from * 100 / height,
 			to: dimensions.to * 100 / height
 		}
 
-		return Event.fromPercentDimensions(title, percentDimensions, date)
+		return Event.fromPercentDimensions(title, percentDimensions, date, description)
 	}
 
 	static fromDraggedEvent(draggedEvent: DraggedEvent, height: number): Event {
@@ -59,7 +61,13 @@ export class Event {
 			to: draggedEvent.top + draggedEvent.height
 		}
 
-		return Event.fromPixelDimensions(draggedEvent.target.title, pixelDimensions, height, draggedEvent.date)
+		return Event.fromPixelDimensions(
+			draggedEvent.target.title,
+			pixelDimensions,
+			height,
+			draggedEvent.date,
+			draggedEvent.target.description
+		)
 	}
 
 	updateWithDraggedEvent(draggedEvent: DraggedEvent, height: number): Event {
@@ -76,7 +84,8 @@ export class Event {
 		return {
 			title: this.title,
 			from: this.from,
-			to: this.to
+			to: this.to,
+			description: this.description
 		}
 	}
 
@@ -84,7 +93,8 @@ export class Event {
 		return {
 			title: this.title,
 			from: this.from.toISO() ?? '',
-			to: this.to.toISO() ?? ''
+			to: this.to.toISO() ?? '',
+			description: this.description
 		}
 	}
 
@@ -119,12 +129,14 @@ export type SimpleEvent = {
 	title: string,
 	from: DateTime,
 	to: DateTime
+	description: string
 }
 
 export type SerializableEvent = {
 	title: string,
 	from: string,
 	to: string
+	description: string
 }
 
 export type CollissionWrapper = {

From c4daa88ea255f4b72b2b25c47c536ee6c05fa469 Mon Sep 17 00:00:00 2001
From: quirinecker <quirin.ecker@bajupa.com>
Date: Mon, 16 Jun 2025 18:20:04 +0200
Subject: [PATCH 6/9] added edit modal. info popover. create modal. delete
 functionality. delete modal

---
 web/bun.lock                                  |   9 +-
 web/components/ui/EventFormModal.vue          | 122 +++++++++++++++
 web/components/ui/calendar/Calendar.vue       | 141 +++++++-----------
 .../ui/calendar/CalendarCollumn.vue           |  16 +-
 web/components/ui/calendar/CalendarEvent.vue  |  35 ++++-
 web/package.json                              |   3 +-
 web/utils/event.ts                            |   9 ++
 7 files changed, 239 insertions(+), 96 deletions(-)
 create mode 100644 web/components/ui/EventFormModal.vue

diff --git a/web/bun.lock b/web/bun.lock
index c593807..27559b5 100644
--- a/web/bun.lock
+++ b/web/bun.lock
@@ -21,6 +21,7 @@
         "typescript": "^5.6.3",
         "vue": "^3.5.13",
         "vue-router": "^4.5.1",
+        "zod": "^3.25.64",
       },
     },
   },
@@ -2045,7 +2046,7 @@
 
     "zip-stream": ["zip-stream@6.0.1", "", { "dependencies": { "archiver-utils": "^5.0.0", "compress-commons": "^6.0.2", "readable-stream": "^4.0.0" } }, "sha512-zK7YHHz4ZXpW89AHXUPbQVGKI7uvkd3hzusTdotCg1UxyaVtg0zFJSTfW/Dq5f7OBBVnq6cZIaC8Ti4hb6dtCA=="],
 
-    "zod": ["zod@3.24.4", "", {}, "sha512-OdqJE9UDRPwWsrHjLN2F8bPxvwJBK22EHLWtanu0LSYr5YqzsaaW3RMgmjwr8Rypg5k+meEJdSPXJZXE/yqOMg=="],
+    "zod": ["zod@3.25.64", "", {}, "sha512-hbP9FpSZf7pkS7hRVUrOjhwKJNyampPgtXKc3AN6DsWtoHsg2Sb4SQaS4Tcay380zSwd2VPo9G9180emBACp5g=="],
 
     "zod-to-json-schema": ["zod-to-json-schema@3.24.5", "", { "peerDependencies": { "zod": "^3.24.1" } }, "sha512-/AuWwMP+YqiPbsJx5D6TfgRTc4kTLjsh5SOcd4bLsfUg2RcEXrFMJl1DGgdHy2aCfsIA/cr/1JM0xcB2GZji8g=="],
 
@@ -2077,6 +2078,8 @@
 
     "@mapbox/node-pre-gyp/detect-libc": ["detect-libc@2.0.4", "", {}, "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA=="],
 
+    "@modelcontextprotocol/sdk/zod": ["zod@3.24.4", "", {}, "sha512-OdqJE9UDRPwWsrHjLN2F8bPxvwJBK22EHLWtanu0LSYr5YqzsaaW3RMgmjwr8Rypg5k+meEJdSPXJZXE/yqOMg=="],
+
     "@netlify/functions/is-stream": ["is-stream@4.0.1", "", {}, "sha512-Dnz92NInDqYckGEUJv689RbRiTSEHCQ7wOVeALbkOz999YpqT46yMRIGtSNl2iCL1waAZSx40+h59NV/EwzV/A=="],
 
     "@netlify/zip-it-and-ship-it/@babel/types": ["@babel/types@7.26.10", "", { "dependencies": { "@babel/helper-string-parser": "^7.25.9", "@babel/helper-validator-identifier": "^7.25.9" } }, "sha512-emqcG3vHrpxUKTrxcblR36dcrcoRDvKmnL/dCL6ZsHaShW80qxCAcNhzQZrpeM765VzEos+xOi4s+r4IXzTwdQ=="],
@@ -2099,6 +2102,8 @@
 
     "@netlify/zip-it-and-ship-it/resolve": ["resolve@2.0.0-next.5", "", { "dependencies": { "is-core-module": "^2.13.0", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, "bin": { "resolve": "bin/resolve" } }, "sha512-U7WjGVG9sH8tvjW5SmGbQuui75FiyjAX72HX15DwBBwF9dNiQZRQAg9nnPhYy+TUnE0+VcrttuvNI8oSxZcocA=="],
 
+    "@netlify/zip-it-and-ship-it/zod": ["zod@3.24.4", "", {}, "sha512-OdqJE9UDRPwWsrHjLN2F8bPxvwJBK22EHLWtanu0LSYr5YqzsaaW3RMgmjwr8Rypg5k+meEJdSPXJZXE/yqOMg=="],
+
     "@nodelib/fs.scandir/@nodelib/fs.stat": ["@nodelib/fs.stat@4.0.0", "", {}, "sha512-ctr6bByzksKRCV0bavi8WoQevU6plSp2IkllIsEqaiKe2mwNNnaluhnRhcsgGZHrrHk57B3lf95MkLMO3STYcg=="],
 
     "@nuxt/cli/pkg-types": ["pkg-types@2.1.0", "", { "dependencies": { "confbox": "^0.2.1", "exsolve": "^1.0.1", "pathe": "^2.0.3" } }, "sha512-wmJwA+8ihJixSoHKxZJRBQG1oY8Yr9pGLzRmSsNms0iNWyHHAlZCa7mmKiFR10YPZuz/2k169JiS/inOjBCZ2A=="],
@@ -2191,6 +2196,8 @@
 
     "eslint/find-up": ["find-up@5.0.0", "", { "dependencies": { "locate-path": "^6.0.0", "path-exists": "^4.0.0" } }, "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng=="],
 
+    "eslint/zod": ["zod@3.24.4", "", {}, "sha512-OdqJE9UDRPwWsrHjLN2F8bPxvwJBK22EHLWtanu0LSYr5YqzsaaW3RMgmjwr8Rypg5k+meEJdSPXJZXE/yqOMg=="],
+
     "eslint-import-resolver-node/debug": ["debug@3.2.7", "", { "dependencies": { "ms": "^2.1.1" } }, "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ=="],
 
     "eslint-plugin-import-x/minimatch": ["minimatch@9.0.5", "", { "dependencies": { "brace-expansion": "^2.0.1" } }, "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow=="],
diff --git a/web/components/ui/EventFormModal.vue b/web/components/ui/EventFormModal.vue
new file mode 100644
index 0000000..3810012
--- /dev/null
+++ b/web/components/ui/EventFormModal.vue
@@ -0,0 +1,122 @@
+<script setup lang="ts">
+import { type SimpleEvent } from '#imports';
+import { DateTime } from 'luxon';
+import * as z from 'zod';
+
+const open = defineModel<boolean>('open', { required: true })
+
+const emit = defineEmits<{
+	(e: 'submnitted', event: SimpleEvent): void
+	(e: 'canceled'): void
+}>()
+
+const props = defineProps<{
+	action: 'create' | 'edit'
+	input: Partial<SimpleEvent>,
+}>()
+
+const toast = useToast()
+
+const titleField = ref('')
+const descriptionField = ref('')
+const fromTimeField = ref('')
+const fromDateField = ref('')
+const toTimeField = ref('')
+const toDateField = ref('')
+
+const modalTitle = computed(() => {
+	return props.action === 'create' ? 'Create Event' : 'Edit Event'
+})
+
+const modalDescription = computed(() => {
+	return props.action === 'create' ? 'Create event and set name, description and time' : 'Edit name, description and time'
+})
+
+watchEffect(() => {
+	titleField.value = props.input.title ?? ''
+	descriptionField.value = props.input.description ?? ''
+	fromTimeField.value = props.input.from?.toFormat('HH:mm') ?? ''
+	fromDateField.value = props.input.from?.toFormat('yyyy-MM-dd') ?? ''
+	toTimeField.value = props.input.to?.toFormat('HH:mm') ?? ''
+	toDateField.value = props.input.to?.toFormat('yyyy-MM-dd') ?? ''
+})
+
+const formSchema = z.object({
+	title: z.string().trim().min(1, { message: 'Title is required' }),
+	description: z.string().default(''),
+	from: z.string().datetime({ message: 'Invalid start date', local: true }),
+	to: z.string().datetime({ message: 'Invalid end date', local: true })
+})
+
+
+function submit() {
+	console.log({
+		from: dateStringFromFields(fromDateField.value, fromTimeField.value),
+		to: dateStringFromFields(toDateField.value, toTimeField.value)
+	})
+	const form = formSchema.safeParse({
+		title: titleField.value,
+		description: descriptionField.value,
+		from: dateStringFromFields(fromDateField.value, fromTimeField.value),
+		to: dateStringFromFields(toDateField.value, toTimeField.value)
+	})
+
+	if (form.error) {
+		for (const error of form.error.errors) {
+			toast.add({
+				title: error.message
+			})
+		}
+		return
+	}
+
+	emit('submnitted', {
+		title: form.data.title,
+		description: form.data.description,
+		from: DateTime.fromISO(form.data.from),
+		to: DateTime.fromISO(form.data.to)
+	})
+	open.value = false
+}
+
+function dateStringFromFields(date: string, time: string) {
+	return `${date}T${time}:00`
+}
+
+function cancel() {
+	emit('canceled')
+	open.value = false
+}
+
+</script>
+
+<template>
+	<UModal v-model:open="open" :title="modalTitle" :description="modalDescription">
+		<template #body>
+			<div class="flex flex-col gap-2">
+				<UInput type="text" placeholder="Name" v-model="titleField" required />
+				<div class="flex flex-row gap-2">
+					<UInput class="grow" placeholder="2025-06-16" v-model="fromDateField" icon="i-lucide-calendar"
+						required />
+					<UInput class="grow" placeholder="15:34" v-model="fromTimeField" icon="i-lucide-clock" required />
+				</div>
+				<div class="flex flex-row gap-2">
+					<UInput class="grow" placeholder="2025-06-16" v-model="toDateField" icon="i-lucide-calendar"
+						required />
+					<UInput class="grow" placeholder="15:34" v-model="toTimeField" icon="i-lucide-clock" required />
+				</div>
+				<UTextarea type="text" placeholder="Description" v-model="descriptionField" required />
+			</div>
+		</template>
+		<template #footer>
+			<UButton variant="solid" @click="submit">
+				{{ action === 'create' ? 'Create' : 'Edit' }}
+			</UButton>
+			<UButton variant="soft" @click="cancel">
+				Cancel
+			</UButton>
+		</template>
+	</UModal>
+</template>
+
+<style scoped></style>
diff --git a/web/components/ui/calendar/Calendar.vue b/web/components/ui/calendar/Calendar.vue
index 09ad52e..d9a8f33 100644
--- a/web/components/ui/calendar/Calendar.vue
+++ b/web/components/ui/calendar/Calendar.vue
@@ -2,34 +2,20 @@
 import { computed, ref } from 'vue';
 import CalendarHeader from './CalendarHeader.vue';
 import CalendarCollumn from './CalendarCollumn.vue';
-import { Event } from '~/utils/event';
+import { Event, type SimpleEvent } from '~/utils/event';
 import { DateTime } from 'luxon';
-import { UTextarea } from '#components';
+import EventFormModal from '../EventFormModal.vue';
 
 const events = defineModel<Event[]>('events', { required: true })
 const date = defineModel<DateTime>('date', { required: true })
 const draggedEvent = ref<DraggedEvent | undefined>()
+const createInput = ref<Partial<SimpleEvent>>({})
 const createModalOpened = ref(false)
-const createContext = ref<{ date: DateTime, timespan: Timespan } | undefined>(undefined)
-const createModal = {
-	open: ref(false),
-	fromTimeField: ref<string>(''),
-	toTimeField: ref<string>(''),
-	toDateField: ref<string>(''),
-	fromDateField: ref<string>(''),
-	nameField: ref<string>(''),
-	descriptionField: ref<string>(''),
-	clear: () => {
-		createModal.nameField.value = ''
-		createModal.fromDateField.value = ''
-		createModal.toDateField.value = ''
-		createModal.fromTimeField.value = ''
-		createModal.toTimeField.value = ''
-		createModal.descriptionField.value = ''
-	}
-}
-
-const toast = useToast()
+const editInput = ref<Partial<SimpleEvent>>({})
+const editContext = ref<{ event: Event }>()
+const editModalOpened = ref(false)
+const deleteModalOpened = ref(false)
+const deleteContext = ref<{ event: Event }>()
 
 type Day = {
 	date: DateTime
@@ -93,6 +79,8 @@ const days = computed<Day[]>(() => {
 
 const emits = defineEmits<{
 	(e: 'create', event: Event): void
+	(e: 'edit', event: Event): void
+	(e: 'delete', event: Event): void
 }>()
 
 const hour = (num: number) => {
@@ -110,93 +98,74 @@ const seperators = ref<Seperator[]>([
 ])
 
 function openCreateModal(date: DateTime, timespan: Timespan) {
-	createContext.value = {
-		date: date,
-		timespan: timespan
+	createInput.value = {
+		from: date.startOf('day').plus({ minutes: timespan.from * 24 * 60 }),
+		to: date.startOf('day').plus({ minutes: timespan.to * 24 * 60 }),
 	}
 
-	const from = date.startOf('day').plus({ minutes: timespan.from * 24 * 60 })
-	const to = date.startOf('day').plus({ minutes: timespan.to * 24 * 60 })
-
-	createModal.fromDateField.value = from.toISODate() ?? ''
-	createModal.toDateField.value = to.toISODate() ?? ''
-	createModal.fromTimeField.value = from.toFormat('HH:mm')
-	createModal.toTimeField.value = to.toFormat('HH:mm')
-	createModal.open.value = true
+	createModalOpened.value = true
 }
 
-function create() {
-	const from = dateFromFields(createModal.fromDateField.value, createModal.fromTimeField.value)
-	const to = dateFromFields(createModal.toDateField.value, createModal.toTimeField.value)
-
-	if (!from.isValid) {
-		toast.add({
-			title: 'Invalid `from` date format'
-		})
-	}
-
-	if (!to.isValid) {
-		toast.add({
-			title: 'Invalid `to` date format'
-		})
-	}
-
-	if (createModal.nameField.value.trim() === '') {
-		toast.add({
-			title: 'Name is required'
-		})
-	}
-
-	const event = new Event(createModal.nameField.value, from, to, createModal.descriptionField.value)
-	emits('create', event)
-	createModal.clear()
-	createModal.open.value = false
+function create(simple: SimpleEvent) {
+	const event = Event.fromSimple(simple)
 	events.value.push(event)
+	emits('create', event)
 }
 
-function dateFromFields(date: string, time: string) {
-	return DateTime.fromFormat(`${date} ${time}`, 'yyyy-MM-dd HH:mm')
+function openEditModal(event: Event) {
+	editInput.value = event.toSimple()
+	editContext.value = { event: event }
+	editModalOpened.value = true
+}
+
+function edit(simple: SimpleEvent) {
+	editContext.value?.event.updateWithSimple(simple)
+	if (editContext.value === undefined) return
+	emits('edit', editContext.value.event)
+}
+
+function openDeleteModal(event: Event) {
+	deleteContext.value = { event: event }
+	deleteModalOpened.value = true
+}
+
+function deleteEvent() {
+	if (deleteContext.value === undefined) return
+	emits('delete', deleteContext.value?.event)
+	events.value = events.value.filter(e => e.title !== deleteContext.value?.event.title)
+	deleteModalOpened.value = false
+}
+
+function moveEvent(event: Event) {
+	emits('edit', event)
 }
 
 </script>
 
 <template>
 	<div class="w-full h-full flex flex-col">
-		<UModal v-model:open="createModal.open.value" title="Create Event"
-			description="Set name and change time of event before creation">
-			<template #body>
-				<div class="flex flex-col gap-2">
-					<UInput type="text" placeholder="Name" v-model="createModal.nameField.value" required />
-					<div class="flex flex-row gap-2">
-						<UInput class="grow" placeholder="2025-06-16" v-model="createModal.fromDateField.value"
-							icon="i-lucide-calendar" required />
-						<UInput class="grow" placeholder="15:34" v-model="createModal.fromTimeField.value"
-							icon="i-lucide-clock" required />
-					</div>
-					<div class="flex flex-row gap-2">
-						<UInput class="grow" placeholder="2025-06-16" v-model="createModal.toDateField.value"
-							icon="i-lucide-calendar" required />
-						<UInput class="grow" placeholder="15:34" v-model="createModal.toTimeField.value"
-							icon="i-lucide-clock" required />
-					</div>
-					<UTextarea type="text" placeholder="Description" v-model="createModal.descriptionField.value"
-						required />
-				</div>
-			</template>
+		<EventFormModal action="create" @submnitted="event => create(event)" :input="createInput"
+			v-model:open="createModalOpened" />
+		<EventFormModal action="edit" @submnitted="event => edit(event)" :input="editInput"
+			v-model:open="editModalOpened" />
+
+		<UModal v-model:open="deleteModalOpened" title="Delete Event" description="Are you sure you want to delete this event?">
 			<template #footer>
-				<UButton variant="solid" @click="create">
-					Create
+				<UButton variant="solid" @click="deleteEvent">
+					Delete
 				</UButton>
-				<UButton variant="soft">
+				<UButton variant="solid" @click="deleteModalOpened = false">
 					Cancel
 				</UButton>
 			</template>
 		</UModal>
+
 		<div class="calendar flex flex-row w-full flex-1 items-stretch divide-x divide-muted">
 			<CalendarHeader :seperators="seperators" />
 
 			<CalendarCollumn v-for="day in days" :seperators="seperators" :day="day.date" :events="day.events"
-				:date="date" v-model:draggedEvent="draggedEvent" @quick-create="openCreateModal" />
+				:date="date" v-model:draggedEvent="draggedEvent" @quick-create="openCreateModal"
+				@edit="openEditModal" @delete="openDeleteModal" @moved="moveEvent" />
 		</div>
 
 	</div>
diff --git a/web/components/ui/calendar/CalendarCollumn.vue b/web/components/ui/calendar/CalendarCollumn.vue
index 9c591c2..5cbb2bc 100644
--- a/web/components/ui/calendar/CalendarCollumn.vue
+++ b/web/components/ui/calendar/CalendarCollumn.vue
@@ -15,6 +15,9 @@ const props = defineProps<{
 
 const emit = defineEmits<{
 	(e: 'quick-create', day: DateTime, event: EventDimensions): void,
+	(e: 'edit', event: Event): void
+	(e: 'moved', event: Event): void
+	(e: 'delete', event: Event): void
 }>()
 
 const isDragging = ref(false)
@@ -87,6 +90,13 @@ function dragover(e: DragEvent) {
 
 function dragDrop(_: DragEvent) {
 	draggedEvent.value?.target.updateWithDraggedEvent(draggedEvent.value, column.value?.offsetHeight ?? 0)
+
+	if (draggedEvent.value === undefined){
+		draggedEvent.value = undefined
+		return
+	}
+
+	emit('moved', draggedEvent.value.target)
 	draggedEvent.value = undefined
 }
 
@@ -96,7 +106,8 @@ function dragDrop(_: DragEvent) {
 	<div class="flex flex-col h-full grow">
 		<div class="flex justify-center items-center flex-col h-18 border-b-1 border-muted">
 			<div>{{ props.day.toFormat('ccc').toUpperCase() }}</div>
-			<UBadge class="rounded-full" v-if="date.startOf('day').equals(day.startOf('day'))">{{ props.day.day }}</UBadge>
+			<UBadge class="rounded-full" v-if="date.startOf('day').equals(day.startOf('day'))">{{ props.day.day }}
+			</UBadge>
 			<div v-else>{{ props.day.day }}</div>
 		</div>
 
@@ -109,7 +120,8 @@ function dragDrop(_: DragEvent) {
 				:style="{ height: `${height}px`, top: `${top}px` }"></div>
 
 			<div v-for="[index, column] in events.entries()" class="flex flex-row w-11/12 h-full absolute top-0">
-				<CalendarEvent v-for="event in column" :event="event" :columnIndex="index" @move="eventMove" />
+				<CalendarEvent v-for="event in column" :event="event" :columnIndex="index" @move="eventMove"
+					@edit="event => emit(`edit`, event)" @delete="event => emit(`delete`, event)" />
 			</div>
 
 			<div v-if="draggedEvent !== undefined && draggedEvent.date.equals(props.day)"
diff --git a/web/components/ui/calendar/CalendarEvent.vue b/web/components/ui/calendar/CalendarEvent.vue
index b548182..8802e6c 100644
--- a/web/components/ui/calendar/CalendarEvent.vue
+++ b/web/components/ui/calendar/CalendarEvent.vue
@@ -9,6 +9,8 @@ const props = defineProps<{
 
 const emit = defineEmits<{
 	(e: 'move', mouseEvent: MouseEvent, event: Event): void,
+	(e: 'edit', event: Event): void
+	(e: 'delete', event: Event): void
 }>()
 
 const visible = ref(true)
@@ -42,10 +44,31 @@ function dragStart(e: DragEvent) {
 </script>
 
 <template>
-	<div class="absolute rounded-lg h-0 top-20 bg-black opacity-45 p-2 flex flex-col z-10" @mousedown.stop
-		@mouseover.stop @mouseup.stop draggable="true" @dragstart="dragStart"
-		:style="{ top: `${top}%`, height: `${height}%`, left: `${left}%`, width: `${widht}%` }">
-		<div>{{ event.event.from.toFormat('HH:mm') }} - {{ event.event.to.toFormat('HH:mm') }}</div>
-		<div>{{ event.event.title }}</div>
-	</div>
+	<UPopover :content="{ side: 'right' }" arrow>
+		<div class="absolute rounded-lg h-0 top-20 bg-black opacity-45 p-2 flex flex-col z-10" @mousedown.stop
+			@mouseover.stop @mouseup.stop draggable="true" @dragstart="dragStart"
+			:style="{ top: `${top}%`, height: `${height}%`, left: `${left}%`, width: `${widht}%` }">
+			<div>{{ event.event.from.toFormat('HH:mm') }} - {{ event.event.to.toFormat('HH:mm') }}</div>
+			<div>{{ event.event.title }}</div>
+		</div>
+		<template #content>
+			<UCard class="w-xl">
+				<template #header>
+					<div class="flex flex-row justify-between items-center">
+						<h1>{{ event.event.title }}</h1>
+						<nav class="flex flex-row gap-2">
+							<UButton icon="i-lucide-pencil" @click="emit('edit', event.event)"></UButton>
+							<UButton icon="i-lucide-trash" @click="emit('delete', event.event)"></UButton>
+						</nav>
+					</div>
+				</template>
+				<template #default>
+					<div>{{ event.event.from.toFormat('HH:mm') }} - {{ event.event.to.toFormat('HH:mm') }}</div>
+					<div class="overflow-scroll pb-5">
+						{{ event.event.description }}
+					</div>
+				</template>
+			</UCard>
+		</template>
+	</UPopover>
 </template>
diff --git a/web/package.json b/web/package.json
index 6e42479..ab2d123 100644
--- a/web/package.json
+++ b/web/package.json
@@ -26,6 +26,7 @@
     "nuxt-app": "file:",
     "typescript": "^5.6.3",
     "vue": "^3.5.13",
-    "vue-router": "^4.5.1"
+    "vue-router": "^4.5.1",
+    "zod": "^3.25.64"
   }
 }
diff --git a/web/utils/event.ts b/web/utils/event.ts
index 7d407c3..6c73275 100644
--- a/web/utils/event.ts
+++ b/web/utils/event.ts
@@ -29,6 +29,15 @@ export class Event {
 		}
 	}
 
+	updateWithSimple(simple: SimpleEvent): Event {
+		this.title = simple.title
+		this.from = simple.from
+		this.to = simple.to
+		this.description = simple.description
+
+		return this
+	}
+
 	static fromSimple(event: SimpleEvent): Event {
 		return new Event(event.title, event.from, event.to, event.description)
 	}

From 7588661a595df0c6c4764361dedee5a2cc82b4d8 Mon Sep 17 00:00:00 2001
From: quirinecker <quirin.ecker@bajupa.com>
Date: Mon, 16 Jun 2025 19:51:31 +0200
Subject: [PATCH 7/9] added overflow for tasks and overflow shadow to all
 overflows. also minimum drag distance is now 10px

---
 web/assets/css/main.css                       |  7 ++
 web/components/ui/EventFormModal.vue          |  1 +
 web/components/ui/ListItem.vue                |  2 +-
 web/components/ui/Sidebar.vue                 | 55 ++++++++++------
 web/components/ui/calendar/Calendar.vue       | 14 +++-
 .../ui/calendar/CalendarCollumn.vue           |  7 ++
 web/components/ui/calendar/CalendarEvent.vue  |  2 +-
 web/pages/index.vue                           | 64 +++++++++----------
 web/utils/event.ts                            | 31 +++++++--
 9 files changed, 124 insertions(+), 59 deletions(-)

diff --git a/web/assets/css/main.css b/web/assets/css/main.css
index f59a066..7a2fbdf 100644
--- a/web/assets/css/main.css
+++ b/web/assets/css/main.css
@@ -1,6 +1,13 @@
 @import "tailwindcss";
 @import "@nuxt/ui";
 
+.overflow-shadow {
+	overflow-x: auto;
+	position: relative;
+	mask-image: linear-gradient(to right, rgba(0,0,0,1) 90%, rgba(0,0,0,0));
+	-webkit-mask-image: linear-gradient(to right, rgba(0,0,0,1) 90%, rgba(0,0,0,0));
+}
+
 :root {
   --ui-primary: #C02942;
 --ui-text-dimmed: var(--ui-color-neutral-400);
diff --git a/web/components/ui/EventFormModal.vue b/web/components/ui/EventFormModal.vue
index 3810012..666a10d 100644
--- a/web/components/ui/EventFormModal.vue
+++ b/web/components/ui/EventFormModal.vue
@@ -71,6 +71,7 @@ function submit() {
 	}
 
 	emit('submnitted', {
+		id: props.input.id,
 		title: form.data.title,
 		description: form.data.description,
 		from: DateTime.fromISO(form.data.from),
diff --git a/web/components/ui/ListItem.vue b/web/components/ui/ListItem.vue
index b16cc92..a115f61 100644
--- a/web/components/ui/ListItem.vue
+++ b/web/components/ui/ListItem.vue
@@ -3,7 +3,7 @@
 </script>
 
 <template>
-	<UCard class="[&>*]:p-3">
+	<UCard class="[&>*]:p-3 w-full">
 		<slot />
 	</UCard>
 </template>
diff --git a/web/components/ui/Sidebar.vue b/web/components/ui/Sidebar.vue
index d8f7ee7..5e0445e 100644
--- a/web/components/ui/Sidebar.vue
+++ b/web/components/ui/Sidebar.vue
@@ -75,19 +75,19 @@ const selectedDate = computed({
 })
 
 type Task = {
-  id: number
-  userid: string
-  title: string
-  description: string
-  done: number
-  estimated_time: string
-  due_date: string
-  created_at: string
-  updated_at: string
+	id: number
+	userid: string
+	title: string
+	description: string
+	done: number
+	estimated_time: string
+	due_date: string
+	created_at: string
+	updated_at: string
 }
 
 defineProps<{
-  todos: Task[]
+	todos: Task[]
 }>()
 
 
@@ -109,7 +109,7 @@ function editTodo() {
 </script>
 
 <template>
-	<UCard class="flex w-64 h-full">
+	<UCard class="flex w-64 h-full" :ui="{ body: 'w-full' }">
 		<div class="flex flex-col h-full w-full gap-5">
 			<header class="flex flex-col gap-2">
 				<Title1>Calendar</Title1>
@@ -120,20 +120,37 @@ function editTodo() {
 					<Title1>Todos</Title1>
 					<div class="flex gap-2 flex-col">
 						<ListItem v-for="todo in todos">
-							<div class="flex justify-between">
-								<span>
+							<div class="flex w-full gap-4 items-center">
+								<span class="grow overflow-scroll py-3 overflow-shadow">
 									{{ todo.title }}
 								</span>
 								<div class="flex gap-1">
 									<UButton size="xs" color="neutral" class="flex justify-center" @click="editTodo">
-										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path><path d="m15 5 4 4"></path></svg>
+										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
+											viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+											stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil">
+											<path
+												d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z">
+											</path>
+											<path d="m15 5 4 4"></path>
+										</svg>
 									</UButton>
-									<UButton size="xs" class="flex justify-center" color="primary" @click="() => deleteTodo(todo)">
-										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash-2"><path d="M3 6h18"></path><path d="M19 6v14c0 1-2 2-2 2H7c-1 0-2-1-2-2V6"></path><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"></path><line x1="10" x2="10" y1="11" y2="17"></line><line x1="14" x2="14" y1="11" y2="17"></line></svg>
+									<UButton size="xs" class="flex justify-center" color="primary"
+										@click="() => deleteTodo(todo)">
+										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
+											viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+											stroke-linecap="round" stroke-linejoin="round"
+											class="lucide lucide-trash-2">
+											<path d="M3 6h18"></path>
+											<path d="M19 6v14c0 1-2 2-2 2H7c-1 0-2-1-2-2V6"></path>
+											<path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"></path>
+											<line x1="10" x2="10" y1="11" y2="17"></line>
+											<line x1="14" x2="14" y1="11" y2="17"></line>
+										</svg>
 									</UButton>
 								</div>
 							</div>
-					</ListItem>
+						</ListItem>
 					</div>
 				</div>
 				<div class="flex">
@@ -157,4 +174,6 @@ function editTodo() {
 	</UCard>
 </template>
 
-<style scoped></style>
+<style scoped>
+
+</style>
diff --git a/web/components/ui/calendar/Calendar.vue b/web/components/ui/calendar/Calendar.vue
index d9a8f33..91f1499 100644
--- a/web/components/ui/calendar/Calendar.vue
+++ b/web/components/ui/calendar/Calendar.vue
@@ -132,7 +132,19 @@ function openDeleteModal(event: Event) {
 function deleteEvent() {
 	if (deleteContext.value === undefined) return
 	emits('delete', deleteContext.value?.event)
-	events.value = events.value.filter(e => e.title !== deleteContext.value?.event.title)
+	console.log(events.value)
+	events.value = events.value.filter(e => {
+		if (e.id === undefined || deleteContext.value?.event.id === undefined) {
+			return true
+		}
+
+		if (e.id === deleteContext.value?.event.id) {
+			return false
+		}
+
+		return true
+	})
+
 	deleteModalOpened.value = false
 }
 
diff --git a/web/components/ui/calendar/CalendarCollumn.vue b/web/components/ui/calendar/CalendarCollumn.vue
index 5cbb2bc..e644b96 100644
--- a/web/components/ui/calendar/CalendarCollumn.vue
+++ b/web/components/ui/calendar/CalendarCollumn.vue
@@ -62,6 +62,13 @@ function mouseup(_: MouseEvent) {
 
 	const timeFrom = Math.min(endY.value, startY.value) / column.value.offsetHeight
 	const timeTo = Math.max(endY.value, startY.value) / column.value.offsetHeight
+
+	if (timeTo * column.value.offsetHeight - timeFrom * column.value.offsetHeight <= 10) {
+		startY.value = 0
+		endY.value = 0
+		return
+	}
+
 	emit('quick-create', props.day, {
 		from: timeFrom,
 		to: timeTo
diff --git a/web/components/ui/calendar/CalendarEvent.vue b/web/components/ui/calendar/CalendarEvent.vue
index 8802e6c..0b97445 100644
--- a/web/components/ui/calendar/CalendarEvent.vue
+++ b/web/components/ui/calendar/CalendarEvent.vue
@@ -64,7 +64,7 @@ function dragStart(e: DragEvent) {
 				</template>
 				<template #default>
 					<div>{{ event.event.from.toFormat('HH:mm') }} - {{ event.event.to.toFormat('HH:mm') }}</div>
-					<div class="overflow-scroll pb-5">
+					<div class="overflow-scroll pb-5 overflow-shadow">
 						{{ event.event.description }}
 					</div>
 				</template>
diff --git a/web/pages/index.vue b/web/pages/index.vue
index 5f1b1f1..47e8371 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { Body } from '#components';
 import axios from 'axios';
 import { DateTime } from 'luxon';
 import MainContent from '~/components/ui/MainContent.vue';
@@ -11,35 +10,35 @@ const date = ref<DateTime>(DateTime.now())
 const events = ref<Event[]>([])
 
 const { data: eventsResponse } = await useAsyncData<SerializableEvent[]>(
-  'events',
-  () => axios.get('/events').then(res => res.data)
+	'events',
+	() => axios.get('/events').then(res => res.data)
 );
 
 onMounted(() => {
-  events.value = eventsResponse.value?.map(Event.fromSerializable) ?? []
+	events.value = eventsResponse.value?.map(Event.fromSerializable) ?? []
 })
 
 type Task = {
-  id: number
-  userid: string
-  title: string
-  description: string
-  done: number
-  estimated_time: string
-  due_date: string
-  created_at: string
-  updated_at: string
+	id: number
+	userid: string
+	title: string
+	description: string
+	done: number
+	estimated_time: string
+	due_date: string
+	created_at: string
+	updated_at: string
 }
 
 
 const { data: tasks, refresh } = await useAsyncData<Task[]>(
-    'tasks',
-    () => {
+	'tasks',
+	() => {
 		return axios.get("/tasks").then(result => {
 			console.log(result.data)
 			return result.data
 		})
-    }
+	}
 )
 
 async function postEvent(event: Event) {
@@ -49,30 +48,31 @@ async function postEvent(event: Event) {
 
 async function postTask(name: string) {
 	console.log('posting Task')
-  await axios.post('/task', {
-    title: name,
-    description: "",
-    done: false,
-    estimated_time: (new Date()).toISOString(), //TODO
-    due_date: (new Date()).toISOString(),
-  })
-  await refresh()
+	await axios.post('/task', {
+		title: name,
+		description: "",
+		done: false,
+		estimated_time: (new Date()).toISOString(), //TODO
+		due_date: (new Date()).toISOString(),
+	})
+	await refresh()
 }
 
 async function deleteTask(id: number) {
-  console.log('deleting Task')
-  await axios.delete(`/task/${id}`)
-  await refresh()
+	console.log('deleting Task')
+	await axios.delete(`/task/${id}`)
+	await refresh()
 }
 
 </script>
 
 <template>
-    <div class="h-screen w-screen p-4 flex flex-row gap-5">
-        <Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" @create-task="postTask" @delete-task="deleteTask"/>
-        <MainContent v-if="events !== null" v-model:events="events" v-model:date="date" @create-event="postEvent"/>
-    </div>
+	<div class="h-screen w-screen p-4 flex flex-row gap-5">
+		<Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" @create-task="postTask"
+			@delete-task="deleteTask" />
+		<MainContent v-if="events !== null" v-model:events="events" v-model:date="date" @create-event="postEvent" />
+	</div>
 </template>
 
 
-<style scoped></style>
\ No newline at end of file
+<style scoped></style>
diff --git a/web/utils/event.ts b/web/utils/event.ts
index 6c73275..358fb98 100644
--- a/web/utils/event.ts
+++ b/web/utils/event.ts
@@ -4,7 +4,8 @@ export class Event {
 	private static readonly MINUTES_IN_DAY = 24 * 60
 
 	constructor(
-		public readonly title: string,
+		public id: number | undefined,
+		public title: string,
 		public from: DateTime,
 		public to: DateTime,
 		public description: string
@@ -39,15 +40,28 @@ export class Event {
 	}
 
 	static fromSimple(event: SimpleEvent): Event {
-		return new Event(event.title, event.from, event.to, event.description)
+		return new Event(
+			event.id,
+			event.title,
+			event.from,
+			event.to,
+			event.description
+		)
 	}
 
 	static fromSerializable(event: SerializableEvent) {
-		return new Event(event.title, DateTime.fromISO(event.from), DateTime.fromISO(event.to), event.description)
+		return new Event(
+			event.id,
+			event.title,
+			DateTime.fromISO(event.from),
+			DateTime.fromISO(event.to),
+			event.description
+		)
 	}
 
-	static fromPercentDimensions(title: string, dimensions: EventDimensions, date: DateTime, description: string): Event {
+	static fromPercentDimensions(id: number | undefined, title: string, dimensions: EventDimensions, date: DateTime, description: string): Event {
 		return new Event(
+			id,
 			title,
 			date.startOf('day').plus({ minutes: (dimensions.from / 100) * Event.MINUTES_IN_DAY }),
 			date.startOf('day').plus({ minutes: (dimensions.to / 100) * Event.MINUTES_IN_DAY }),
@@ -55,13 +69,13 @@ export class Event {
 		)
 	}
 
-	static fromPixelDimensions(title: string, dimensions: EventDimensions, height: number, date: DateTime, description: string): Event {
+	static fromPixelDimensions(id: number | undefined, title: string, dimensions: EventDimensions, height: number, date: DateTime, description: string): Event {
 		const percentDimensions: EventDimensions = {
 			from: dimensions.from * 100 / height,
 			to: dimensions.to * 100 / height
 		}
 
-		return Event.fromPercentDimensions(title, percentDimensions, date, description)
+		return Event.fromPercentDimensions(id, title, percentDimensions, date, description)
 	}
 
 	static fromDraggedEvent(draggedEvent: DraggedEvent, height: number): Event {
@@ -71,6 +85,7 @@ export class Event {
 		}
 
 		return Event.fromPixelDimensions(
+			draggedEvent.target.id,
 			draggedEvent.target.title,
 			pixelDimensions,
 			height,
@@ -91,6 +106,7 @@ export class Event {
 
 	toSimple(): SimpleEvent {
 		return {
+			id: this.id,
 			title: this.title,
 			from: this.from,
 			to: this.to,
@@ -100,6 +116,7 @@ export class Event {
 
 	toSerializable(): SerializableEvent {
 		return {
+			id: this.id,
 			title: this.title,
 			from: this.from.toISO() ?? '',
 			to: this.to.toISO() ?? '',
@@ -135,6 +152,7 @@ export type EventDimensions = {
 }
 
 export type SimpleEvent = {
+	id: number | undefined,
 	title: string,
 	from: DateTime,
 	to: DateTime
@@ -142,6 +160,7 @@ export type SimpleEvent = {
 }
 
 export type SerializableEvent = {
+	id: number | undefined,
 	title: string,
 	from: string,
 	to: string

From 1c72ab279d8d869437cbb50de2a4981db4075d96 Mon Sep 17 00:00:00 2001
From: quirinecker <quirin.ecker@bajupa.com>
Date: Fri, 4 Jul 2025 16:43:59 +0200
Subject: [PATCH 8/9] added checkbox for todo. cleaned up code. added
 seperation between done and todo tasks

---
 web/components/ui/Sidebar.vue | 90 ++++++++++++++++-------------------
 web/pages/index.vue           |  4 +-
 2 files changed, 43 insertions(+), 51 deletions(-)

diff --git a/web/components/ui/Sidebar.vue b/web/components/ui/Sidebar.vue
index 5e0445e..dd3a118 100644
--- a/web/components/ui/Sidebar.vue
+++ b/web/components/ui/Sidebar.vue
@@ -4,24 +4,27 @@ import ListItem from './ListItem.vue';
 import Title1 from './Title1.vue';
 import type { DropdownMenuItem } from '@nuxt/ui';
 import { DateTime } from 'luxon';
+import type { USeparator } from '#components';
 
 const colorMode = useColorMode();
+
 const currentTheme = ref<'dark' | 'system' | 'light'>(colorMode.preference as 'dark' | 'system' | 'light');
 
-const isLight = computed(() => currentTheme.value === 'light');
-const isDark = computed(() => currentTheme.value === 'dark');
-const isSystem = computed(() => currentTheme.value === 'system');
-
-watch(currentTheme, () => {
-	console.log(currentTheme.value)
-	colorMode.preference = currentTheme.value;
-})
+const date = defineModel<DateTime>('date', { required: true })
+const tasks = defineModel<Task[]>('tasks', { required: true })
 
 const emits = defineEmits<{
 	(e: 'createTask', name: string): void
 	(e: 'deleteTask', id: number): void
+	(e: 'editTask', task: Task): void
 }>()
 
+const isLight = computed(() => currentTheme.value === 'light');
+const isDark = computed(() => currentTheme.value === 'dark');
+const isSystem = computed(() => currentTheme.value === 'system');
+const doneTasks = computed(() => tasks.value.filter(task => task.done))
+const todoTasks = computed(() => tasks.value.filter(task => !task.done))
+
 const dropDownItems = computed<DropdownMenuItem[][]>(() => [
 	[
 		{ label: "Profile", icon: "i-lucide-user" },
@@ -60,7 +63,6 @@ const dropDownItems = computed<DropdownMenuItem[][]>(() => [
 	]
 ])
 
-const date = defineModel<DateTime>('date', { required: true })
 
 const selectedDate = computed({
 	get() {
@@ -79,31 +81,26 @@ type Task = {
 	userid: string
 	title: string
 	description: string
-	done: number
+	done: boolean
 	estimated_time: string
 	due_date: string
 	created_at: string
 	updated_at: string
 }
 
-defineProps<{
-	todos: Task[]
-}>()
 
-
-function addTodo() {
+function addTask() {
 	const name = prompt("Todo name:")
 	console.log(name)
 	if (name !== null) {
 		emits('createTask', name)
 	}
 }
-function deleteTodo(todo: Task) {
-	console.log(todo.id)
+function deleteTask(todo: Task) {
 	emits('deleteTask', todo.id)
 }
-function editTodo() {
-
+function editTask(task: Task) {
+	emits('editTask', task)
 }
 
 </script>
@@ -119,42 +116,39 @@ function editTodo() {
 				<div class="flex flex-col gap-2">
 					<Title1>Todos</Title1>
 					<div class="flex gap-2 flex-col">
-						<ListItem v-for="todo in todos">
+						<ListItem v-for="task in todoTasks">
 							<div class="flex w-full gap-4 items-center">
-								<span class="grow overflow-scroll py-3 overflow-shadow">
-									{{ todo.title }}
+								<span
+									class="grow overflow-scroll py-3 overflow-shadow flex flex-row gap-2 items-center">
+									<UCheckbox v-model="task.done" @change="() => editTask(task)" />{{ task.title }}
 								</span>
 								<div class="flex gap-1">
-									<UButton size="xs" color="neutral" class="flex justify-center" @click="editTodo">
-										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
-											viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
-											stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil">
-											<path
-												d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z">
-											</path>
-											<path d="m15 5 4 4"></path>
-										</svg>
-									</UButton>
-									<UButton size="xs" class="flex justify-center" color="primary"
-										@click="() => deleteTodo(todo)">
-										<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
-											viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
-											stroke-linecap="round" stroke-linejoin="round"
-											class="lucide lucide-trash-2">
-											<path d="M3 6h18"></path>
-											<path d="M19 6v14c0 1-2 2-2 2H7c-1 0-2-1-2-2V6"></path>
-											<path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"></path>
-											<line x1="10" x2="10" y1="11" y2="17"></line>
-											<line x1="14" x2="14" y1="11" y2="17"></line>
-										</svg>
-									</UButton>
+									<UButton size="xs" color="neutral" class="flex justify-center" icon="mingcute:pencil-line"
+										@click="() => editTask(task)"/>
+									<UButton size="xs" color="primary" class="flex justify-center" icon="octicon:trashcan-16"
+										@click="() => deleteTask(task)" />
+								</div>
+							</div>
+						</ListItem>
+						<USeparator label="Done" v-if="todoTasks.length !== 0"/>
+						<ListItem v-for="task in doneTasks">
+							<div class="flex w-full gap-4 items-center">
+								<span
+									class="grow overflow-scroll py-3 overflow-shadow flex flex-row gap-2 items-center">
+									<UCheckbox v-model="task.done" @change="() => editTask(task)" />{{ task.title }}
+								</span>
+								<div class="flex gap-1">
+									<UButton size="xs" color="neutral" class="flex justify-center" icon="mingcute:pencil-line"
+										@click="() => editTask(task)"/>
+									<UButton size="xs" color="primary" class="flex justify-center"
+										@click="() => deleteTask(task)" icon="octicon:trashcan-16"/>
 								</div>
 							</div>
 						</ListItem>
 					</div>
 				</div>
 				<div class="flex">
-					<UButton size="xl" class="w-full flex justify-center" @click="addTodo">
+					<UButton size="xl" class="w-full flex justify-center" @click="addTask">
 						+
 					</UButton>
 				</div>
@@ -174,6 +168,4 @@ function editTodo() {
 	</UCard>
 </template>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/web/pages/index.vue b/web/pages/index.vue
index 47e8371..2719488 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -23,7 +23,7 @@ type Task = {
 	userid: string
 	title: string
 	description: string
-	done: number
+	done: boolean
 	estimated_time: string
 	due_date: string
 	created_at: string
@@ -68,7 +68,7 @@ async function deleteTask(id: number) {
 
 <template>
 	<div class="h-screen w-screen p-4 flex flex-row gap-5">
-		<Sidebar v-if="tasks !== null" :todos="tasks" v-model:date="date" @create-task="postTask"
+		<Sidebar v-if="tasks !== null" v-model:tasks="tasks" v-model:date="date" @create-task="postTask"
 			@delete-task="deleteTask" />
 		<MainContent v-if="events !== null" v-model:events="events" v-model:date="date" @create-event="postEvent" />
 	</div>

From bd2a1ae60c7abfe571f388ce2a7d7fb5c8013a81 Mon Sep 17 00:00:00 2001
From: quirinecker <quirin.ecker@bajupa.com>
Date: Fri, 4 Jul 2025 16:44:43 +0200
Subject: [PATCH 9/9] backend returns done with boolean type instead of number

---
 backend/src/main.ts | 131 +++++++++++++++++++++++---------------------
 1 file changed, 69 insertions(+), 62 deletions(-)

diff --git a/backend/src/main.ts b/backend/src/main.ts
index 3356dbe..7404d65 100644
--- a/backend/src/main.ts
+++ b/backend/src/main.ts
@@ -8,122 +8,129 @@ const db = drizzle("file:local.db");
 const app = express();
 const userId = "Detlef";
 
+type Prettify<T> = {
+	[K in keyof T]: T[K];
+} & {};
+
+type TaskResponse = Prettify<Omit<typeof task.$inferSelect, 'done'> & { done: boolean }>
+
 app.use(cors())
 app.use(express.json());
 
 app.get('/', (req, res) => {
-    res.send('Hello World');
+	res.send('Hello World');
 });
 
-app.get('/tasks', async(req, res) => {
-    const tasks = await db.select().from(task)
-    console.log(tasks)
-    res.send(tasks);
+app.get('/tasks', async (req, res) => {
+	const tasks: typeof task.$inferSelect[] = await db.select().from(task)
+	res.send(tasks.map<TaskResponse>(task => {
+		return { ...task, done: task.done === 1 }
+	}));
 });
 
-app.get('/events', async(req, res) => {
-    res.send(await db.select().from(event))
+app.get('/events', async (req, res) => {
+	res.send(await db.select().from(event))
 });
 
 app.get('/user/:id', (req, res) => {
-    const id = req.params['id'];
+	const id = req.params['id'];
 
-    if (id == null) {
-        res.status(400).send({error: 'Needs an user id'});
-        return;
-    }
+	if (id == null) {
+		res.status(400).send({ error: 'Needs an user id' });
+		return;
+	}
 
-    const user = {id: id, name: 'Cracker'}  //TODO
-    res.json(user);
+	const user = { id: id, name: 'Cracker' }  //TODO
+	res.json(user);
 
 });
 
-app.get('/task/:id', async(req, res) => {
+app.get('/task/:id', async (req, res) => {
 
-    const id = parseInt(req.params['id']);
+	const id = parseInt(req.params['id']);
 
-    if (id == null) {
-        res.status(400).send({error: 'Needs an id'});
-        return;
-    }
+	if (id == null) {
+		res.status(400).send({ error: 'Needs an id' });
+		return;
+	}
 
-    const returnedTask = await db.select().from(task).where(eq(task.id, id))
-    //
-    console.log(returnedTask)
-    res.json(returnedTask);
+	const returnedTask = await db.select().from(task).where(eq(task.id, id))
+	//
+	console.log(returnedTask)
+	res.json(returnedTask);
 });
 
 app.get('/event/:id', (req, res) => {
 
-    const id = req.params['id'];
+	const id = req.params['id'];
 
-    if (id == null) {
-        res.status(400).send({error: 'Needs an id'});
-        return;
-    }
+	if (id == null) {
+		res.status(400).send({ error: 'Needs an id' });
+		return;
+	}
 
-    const event = {id: id, name: 'Pary'}  //TODO
-    res.json(event);
+	const event = { id: id, name: 'Pary' }  //TODO
+	res.json(event);
 });
 
-app.post('/task', async(req, res) => {
+app.post('/task', async (req, res) => {
 
-    const newTask = req.body
-    newTask.userid = userId
+	const newTask = req.body
+	newTask.userid = userId
 
-    const returnedTask = await db.insert(task).values(newTask).returning()
-    console.log(returnedTask)
+	const returnedTask = await db.insert(task).values(newTask).returning()
+	console.log(returnedTask)
 
-    res.status(201).json(returnedTask);
+	res.status(201).json(returnedTask);
 });
 
-app.post('/event', async(req, res) => {
+app.post('/event', async (req, res) => {
 
-    const newEvent: typeof event.$inferInsert = req.body
-    newEvent.description = ""
-    newEvent.userid = userId
+	const newEvent: typeof event.$inferInsert = req.body
+	newEvent.description = ""
+	newEvent.userid = userId
 
-    const returnedEvent = await db.insert(event).values(newEvent).returning()
-    console.log(returnedEvent)
+	const returnedEvent = await db.insert(event).values(newEvent).returning()
+	console.log(returnedEvent)
 
-    res.status(201).json(returnedEvent);
+	res.status(201).json(returnedEvent);
 });
 
 app.put('/task', (req, res) => {
 
-    const updatedTask = req.body;
+	const updatedTask = req.body;
 
-    //Validate (having id)
+	//Validate (having id)
 
-    //const updatedTaskWithId = db.updateTask(updatedTask)
+	//const updatedTaskWithId = db.updateTask(updatedTask)
 
-    res.status(200).json(updatedTask);
+	res.status(200).json(updatedTask);
 });
 
 app.put('/event', (req, res) => {
-    const updatedEvent = req.body;
+	const updatedEvent = req.body;
 
-    //Validate (having id)
+	//Validate (having id)
 
-    //const updatedEventWithId = db.updateEvent(updatedEvent)
+	//const updatedEventWithId = db.updateEvent(updatedEvent)
 
-    res.status(200).json(updatedEvent);
+	res.status(200).json(updatedEvent);
 });
 
-app.delete('/task/:id', async(req, res) => {
-    const id = parseInt(req.params['id']);
+app.delete('/task/:id', async (req, res) => {
+	const id = parseInt(req.params['id']);
 
-    const success = await db.delete(task).where(eq(task.id, id))
-    res.send("Deleted");
+	const success = await db.delete(task).where(eq(task.id, id))
+	res.send("Deleted");
 });
 
-app.delete('/event/:id', async(req, res) => {
-    const id = parseInt(req.params['id']);
+app.delete('/event/:id', async (req, res) => {
+	const id = parseInt(req.params['id']);
 
-    const success = await db.delete(event).where(eq(event.id, id))
-    res.send("Deleted");
+	const success = await db.delete(event).where(eq(event.id, id))
+	res.send("Deleted");
 });
 
 app.listen(8080, () => {
-    console.log('Listening on port 8080');
-});
\ No newline at end of file
+	console.log('Listening on port 8080');
+});