From 804f2d711326048e208889468cc900d91c9ed37f Mon Sep 17 00:00:00 2001
From: oppiliappan <me@oppi.li>
Date: Fri, 17 Jul 2026 14:25:03 +0100
Subject: [PATCH] web/components: add tabs for profile, emails, notifs and
 sites

most of these are placeholders

Signed-off-by: oppiliappan <me@oppi.li>
---
 .../components/settings/tabs/EmailsTab.svelte | 12 +++++
 .../settings/tabs/NotificationsTab.svelte     | 13 +++++
 .../settings/tabs/ProfileTab.svelte           | 49 +++++++++++++++++++
 .../components/settings/tabs/SitesTab.svelte  |  4 ++
 4 files changed, 78 insertions(+)
 create mode 100644 web/src/lib/components/settings/tabs/EmailsTab.svelte
 create mode 100644 web/src/lib/components/settings/tabs/NotificationsTab.svelte
 create mode 100644 web/src/lib/components/settings/tabs/ProfileTab.svelte
 create mode 100644 web/src/lib/components/settings/tabs/SitesTab.svelte

diff --git a/web/src/lib/components/settings/tabs/EmailsTab.svelte b/web/src/lib/components/settings/tabs/EmailsTab.svelte
new file mode 100644
index 00000000..424f2bc8
--- /dev/null
+++ b/web/src/lib/components/settings/tabs/EmailsTab.svelte
@@ -0,0 +1,12 @@
+<div>
+	<h2 class="text-lg font-medium text-foreground-default">Email addresses</h2>
+	<p class="text-sm text-foreground-subtle">
+		Commits authored using emails listed here will be associated with your Tangled profile.
+	</p>
+	<!-- TODO: list, add and verify email addresses -->
+	<div
+		class="mt-2 flex items-center justify-center rounded border border-border-default p-4 text-sm text-foreground-subtle"
+	>
+		Coming soon
+	</div>
+</div>
diff --git a/web/src/lib/components/settings/tabs/NotificationsTab.svelte b/web/src/lib/components/settings/tabs/NotificationsTab.svelte
new file mode 100644
index 00000000..4af25d8a
--- /dev/null
+++ b/web/src/lib/components/settings/tabs/NotificationsTab.svelte
@@ -0,0 +1,13 @@
+<div>
+	<h2 class="text-lg font-medium text-foreground-default">Notification preferences</h2>
+	<p class="text-sm text-foreground-subtle">
+		Choose which notifications you want to receive when activity happens on your repositories and
+		profile.
+	</p>
+	<!-- TODO: notification preference toggles -->
+	<div
+		class="mt-2 flex items-center justify-center rounded border border-border-default p-4 text-sm text-foreground-subtle"
+	>
+		Coming soon
+	</div>
+</div>
diff --git a/web/src/lib/components/settings/tabs/ProfileTab.svelte b/web/src/lib/components/settings/tabs/ProfileTab.svelte
new file mode 100644
index 00000000..f6071ee7
--- /dev/null
+++ b/web/src/lib/components/settings/tabs/ProfileTab.svelte
@@ -0,0 +1,49 @@
+<script lang="ts">
+	import { getAuth } from "$lib/auth.svelte";
+	import { createBobbinClient } from "$lib/api/client";
+	import { resolveMiniDoc } from "$lib/api/identity";
+
+	const auth = getAuth();
+	const user = $derived(auth.currentUser);
+
+	let pds = $state<string | null>(null);
+
+	$effect(() => {
+		const did = user?.did;
+		if (!did) return;
+		const ctx = createBobbinClient({ serviceUrl: auth.bobbinUrl });
+		let cancelled = false;
+		resolveMiniDoc(ctx, did)
+			.then((doc) => {
+				if (!cancelled) pds = doc.pds ?? null;
+			})
+			.catch(() => {
+				if (!cancelled) pds = null;
+			});
+		return () => {
+			cancelled = true;
+		};
+	});
+</script>
+
+<div>
+	<h2 class="text-lg font-medium text-foreground-default">Profile</h2>
+	<p class="pb-2 text-sm text-foreground-subtle">
+		Your account information from your AT Protocol identity.
+	</p>
+
+	<div class="flex flex-col divide-y divide-border-default rounded border border-border-default">
+		<div class="flex flex-col gap-1 p-4">
+			<span class="text-sm text-foreground-subtle">Handle</span>
+			<span class="font-bold text-foreground-default">{user?.handle ?? "…"}</span>
+		</div>
+		<div class="flex flex-col gap-1 p-4">
+			<span class="text-sm text-foreground-subtle">Decentralized Identifier (DID)</span>
+			<span class="font-mono font-bold break-all text-foreground-default">{user?.did ?? "…"}</span>
+		</div>
+		<div class="flex flex-col gap-1 p-4">
+			<span class="text-sm text-foreground-subtle">Personal Data Server (PDS)</span>
+			<span class="font-bold break-all text-foreground-default">{pds ?? "…"}</span>
+		</div>
+	</div>
+</div>
diff --git a/web/src/lib/components/settings/tabs/SitesTab.svelte b/web/src/lib/components/settings/tabs/SitesTab.svelte
new file mode 100644
index 00000000..7b442d01
--- /dev/null
+++ b/web/src/lib/components/settings/tabs/SitesTab.svelte
@@ -0,0 +1,4 @@
+<div>
+	<h2 class="text-lg font-medium text-foreground-default">Git sites</h2>
+	<!-- TODO: claim and manage a static site subdomain -->
+</div>
-- 
2.51.2