Merge pull request #13 from MichaelHolley/develop

MichaelHolley · web-flow · commit 5af4bbaeca8e · 2025-01-14T17:18:14.000+01:00
Develop into main
diff --git a/README.md b/README.md
@@ -3,11 +3,9 @@
 
 # HabitKit
 
-[![Build & Publish](https://github.com/MichaelHolley/HabitKit/actions/workflows/nixpacks_publish.yml/badge.svg?branch=main)](https://github.com/MichaelHolley/HabitKit/actions/workflows/nixpacks_publish.yml)
-
 A simple and intuitive app to track, build, and maintain your habits for a better you!
 
-![image](https://github.com/user-attachments/assets/1fcd0733-f82f-474f-a1b5-844f9167aae8)
+![image](https://github.com/user-attachments/assets/aa915619-9d38-40d7-bbe8-a5d9110f86f6)
 
 ## Running locally
 
diff --git a/prisma/migrations/20250114155107_adddescription/migration.sql b/prisma/migrations/20250114155107_adddescription/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE `Habit` ADD COLUMN `description` VARCHAR(255) NULL;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
@@ -30,12 +30,13 @@ model Session {
 }
 
 model Habit {
-  id        String   @id @default(uuid())
-  name      String
-  userId    String
-  createdAt DateTime @default(now())
-  updatedAt DateTime @updatedAt
-  dates     Json
+  id          String   @id @default(uuid())
+  name        String
+  description String?  @db.VarChar(255)
+  userId      String
+  createdAt   DateTime @default(now())
+  updatedAt   DateTime @updatedAt
+  dates       Json
 
   user User @relation(fields: [userId], references: [id])
 }
diff --git a/src/lib/server/habit.ts b/src/lib/server/habit.ts
@@ -35,10 +35,11 @@ export const updateDates = async (id: string, userId: string, dates: string[]) =
 	});
 };
 
-export const createHabit = async (name: string, userId: string) => {
+export const createHabit = async (name: string, userId: string, description?: string) => {
 	return await prisma.habit.create({
 		data: {
-			name: name as string,
+			name: name,
+			description: description,
 			userId: userId,
 			dates: []
 		}
diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte
@@ -12,10 +12,12 @@
 		<a href="/create" class="btn btn-outline btn-primary btn-sm">+ Track New</a>
 	</div>
 
-	<div class="my-6">
-		<h3 class="mb-2 text-xl">Last 30 Days</h3>
-		<LastXDays summary={data.summary} />
-	</div>
+	{#if data.summary.length > 0}
+		<div class="my-6">
+			<h3 class="mb-2 text-xl">Last 30 Days</h3>
+			<LastXDays summary={data.summary} />
+		</div>
+	{/if}
 
 	<div class="my-6">
 		<div class="flex flex-row flex-wrap justify-start gap-6">
diff --git a/src/routes/(app)/[id]/+page.svelte b/src/routes/(app)/[id]/+page.svelte
@@ -2,6 +2,7 @@
 	import { enhance } from '$app/forms';
 	import HabitActivityHistory from '$lib/components/Habit/HabitActivityHistory.svelte';
 	import NavigateBackButton from '$lib/components/NavigateBackButton.svelte';
+	import dayjs from 'dayjs';
 	import type { PageData } from './$types';
 
 	let { data }: { data: PageData } = $props();
@@ -12,15 +13,18 @@
 	<NavigateBackButton backUrl="/" />
 </div>
 
-<h2 class="mb-3 text-3xl">{data.habit?.name}</h2>
-<div class="grid gap-x-3 text-start text-xs">
-	<p class="text-neutral-400">Created:</p>
-	<p class="text-neutral-400">
-		{data.habit?.createdAt.toLocaleString('de', { dateStyle: 'medium', timeStyle: 'short' })}
+<div class="mb-3">
+	<h2 class="text-3xl">{data.habit?.name}</h2>
+	<p class="text-xs text-neutral-400">{data.habit?.description}</p>
+</div>
+<div class="grid gap-x-3 text-xs text-neutral-400">
+	<p>Created:</p>
+	<p>
+		{dayjs(data.habit?.createdAt).format('DD MMM YYYY - HH:mm')}
 	</p>
-	<p class="text-neutral-400">Updated:</p>
-	<p class="text-neutral-400">
-		{data.habit?.updatedAt.toLocaleString('de', { dateStyle: 'medium', timeStyle: 'short' })}
+	<p>Updated:</p>
+	<p>
+		{dayjs(data.habit?.updatedAt).format('DD MMM YYYY - HH:mm')}
 	</p>
 </div>
 
@@ -40,8 +44,10 @@
 		use:enhance
 		class="flex max-w-md grow flex-col items-end gap-3"
 	>
-		<label class="flex w-full flex-col gap-1 text-sm">
-			Date
+		<label class="form-control w-full text-sm">
+			<div class="label">
+				<span class="label-text">Date</span>
+			</div>
 			<input name="date" type="date" class="input input-bordered" required />
 		</label>
 
diff --git a/src/routes/(app)/create/+page.server.ts b/src/routes/(app)/create/+page.server.ts
@@ -6,12 +6,13 @@ export const actions: Actions = {
 	createHabit: async (event) => {
 		const formData = await event.request.formData();
 		const name = formData.get('name');
+		const description = formData.get('description');
 
 		if (!event.locals.user) {
 			return redirect(302, '/');
 		}
 
-		const habit = await createHabit(name as string, event.locals.user.id);
+		const habit = await createHabit(name as string, event.locals.user.id, description as string);
 
 		return redirect(302, `/${habit.id}`);
 	}
diff --git a/src/routes/(app)/create/+page.svelte b/src/routes/(app)/create/+page.svelte
@@ -5,11 +5,18 @@
 <div class="max-w-md">
 	<h3 class="pb-4 text-3xl">Create Habit</h3>
 	<form method="POST" action="?/createHabit" use:enhance class="flex flex-col items-end gap-3">
-		<label class="flex w-full flex-col gap-1 text-sm">
-			Name
-			<input name="name" class="input input-bordered" />
+		<label class="form-control w-full text-sm">
+			<div class="label">
+				<span class="label-text">Name</span>
+			</div>
+			<input name="name" class="input input-bordered" required />
+		</label>
+		<label class="form-control w-full text-sm">
+			<div class="label">
+				<span class="label-text">Description (optional)</span>
+			</div>
+			<input name="description" class="input input-bordered" />
 		</label>
-
 		<button class="btn btn-primary w-fit">+ Create</button>
 	</form>
 </div>
diff --git a/src/routes/auth/+page.svelte b/src/routes/auth/+page.svelte
@@ -11,13 +11,17 @@
 		<p>Keep track of your habits and goals</p>
 	</div>
 	<form method="POST" action="?/login" use:enhance class="flex flex-col gap-3">
-		<label class="flex flex-col gap-1 text-sm">
-			Username
-			<input name="username" class="input input-bordered" />
+		<label class="form-control w-full text-sm">
+			<div class="label">
+				<span class="label-text">Username</span>
+			</div>
+			<input name="username" class="input input-bordered" required />
 		</label>
-		<label class="flex flex-col gap-1 text-sm">
-			Password
-			<input type="password" name="password" class="input input-bordered" />
+		<label class="form-control w-full text-sm">
+			<div class="label">
+				<span class="label-text">Password</span>
+			</div>
+			<input type="password" name="password" class="input input-bordered" required />
 		</label>
 		<button class="btn btn-primary">Login</button>
 		<button class="btn btn-outline btn-primary" formaction="?/register">Register</button>

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+-- AlterTable`
	`2`	+ALTER TABLE `Habit` ADD COLUMN `description` VARCHAR(255) NULL;
Original file line number	Diff line number	Diff line change
`@@ -6,12 +6,13 @@ export const actions: Actions = {`
`6`	`6`	`createHabit: async (event) => {`
`7`	`7`	`const formData = await event.request.formData();`
`8`	`8`	`const name = formData.get('name');`
	`9`	`+ const description = formData.get('description');`
`9`	`10`
`10`	`11`	`if (!event.locals.user) {`
`11`	`12`	`return redirect(302, '/');`
`12`	`13`	`}`
`13`	`14`
`14`		`- const habit = await createHabit(name as string, event.locals.user.id);`
	`15`	`+ const habit = await createHabit(name as string, event.locals.user.id, description as string);`
`15`	`16`
`16`	`17`	return redirect(302, `/${habit.id}`);
`17`	`18`	`}`