feat(auth): enable users to delete their account #164

template/auth/delete_account.templ

@@ -0,0 +1,16 @@
+package auth
+
+templ DeleteAccountComp() {
+	<main class="h-full flex items-center justify-center">
+		<div class="card bg-neutral text-neutral-content w-96">
+			<div class="card-body items-center text-center">
+				<h2 class="card-title">Delete Account</h2>
+				<p>Do you really want to delete all your data? This cannot be undone!</p>
+				<div class="card-actions justify-end mt-4">
+					<a href="/" class="btn btn-ghost">Cancel</a>
+					<button hx-get="/api/auth/delete-account" class="btn btn-primary">Delete Account</button>
+				</div>
+			</div>
+		</div>
+	</main>
+}

template/auth/user.templ

@@ -3,8 +3,30 @@ package auth
 templ UserComp(user string) {
 	<div id="user-info" class="flex gap-5 items-center">
 		if user != "" {
-			<a hx-get="/api/auth/signout" hx-target="#user-info" class="btn btn-sm">Sign Out</a>
-			<p>{ user }</p>
+			<div class="group inline-block relative">
+				<button
+					class="font-semibold py-2 px-4 inline-flex items-center"
+				>
+					<span class="mr-1">{ user }</span>
+					<svg
+						class="fill-current h-4 w-4"
+						xmlns="http://www.w3.org/2000/svg"
+						viewBox="0 0 20 20"
+					>
+						<path
+							d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"
+						></path>
+					</svg>
+				</button>
+				<div class="absolute hidden group-hover:block w-full">
+					<ul class="menu bg-base-300 rounded-box w-fit float-right mr-4 p-3">
+						<li class="mb-1">
+							<a hx-get="/api/auth/signout" hx-target="#user-info">Sign Out</a>
+						</li>
+						<li><a href="/auth/delete-account" class="text-error">Delete Account</a></li>
+					</ul>
+				</div>
+			</div>
 		} else {
 			<a href="/auth/signup" class="btn btn-sm">Sign Up</a>
 			<a href="/auth/signin" class="btn btn-sm">Sign In</a>