From ce0d910036ffc4cd163a17cbcc17c2e1e53d89ae Mon Sep 17 00:00:00 2001 From: eti Date: Wed, 2 Sep 2026 23:52:41 +0200 Subject: [PATCH] web: put the hand-made forms back on the field components Signed-off-by: eti --- .../components/profile/ProfileEditForm.svelte | 67 +++++++------------ .../lib/components/profile/VouchButton.svelte | 66 +++++++++++++----- .../profile/tabs/RepoListTab.svelte | 15 +++-- .../components/repo/RepoCreationForm.svelte | 13 ++-- .../lib/components/strings/StringForm.svelte | 27 ++++---- .../settings/profile/handle/+page.svelte | 22 +++--- 6 files changed, 113 insertions(+), 97 deletions(-) diff --git a/web/src/lib/components/profile/ProfileEditForm.svelte b/web/src/lib/components/profile/ProfileEditForm.svelte index f04172a94..3753ddb57 100644 --- a/web/src/lib/components/profile/ProfileEditForm.svelte +++ b/web/src/lib/components/profile/ProfileEditForm.svelte @@ -5,6 +5,10 @@ import MapPin from "$icon/map-pin"; import X from "$icon/x"; import Button from "$lib/components/ui/Button.svelte"; + import Checkbox from "$lib/components/ui/Checkbox.svelte"; + import Field from "$lib/components/ui/Field.svelte"; + import Input from "$lib/components/ui/Input.svelte"; + import Textarea from "$lib/components/ui/Textarea.svelte"; import { getAuth } from "$lib/auth.svelte"; import { putProfile } from "$lib/api/profile"; import type { ProfileRecord } from "$lib/api/records"; @@ -31,9 +35,6 @@ value: (seed?.links?.[index] as string | undefined) ?? "" })) ); - const inputClass = - "w-full rounded border border-border-default bg-background-default px-2 py-1 outline-none focus:border-border-strong focus:ring-1 focus:ring-border-strong"; - const save = createAction( async (event: SubmitEvent) => { event.preventDefault(); @@ -58,51 +59,33 @@
-
- - -
+ + {#snippet children({ id })} + + /> {/if} diff --git a/web/src/lib/components/profile/tabs/RepoListTab.svelte b/web/src/lib/components/profile/tabs/RepoListTab.svelte index 6fc064245..ca43d0036 100644 --- a/web/src/lib/components/profile/tabs/RepoListTab.svelte +++ b/web/src/lib/components/profile/tabs/RepoListTab.svelte @@ -4,6 +4,7 @@ import { resolve } from "$app/paths"; import { getAuth } from "$lib/auth.svelte"; import { createBobbinClient } from "$lib/api/client"; + import Input from "$lib/components/ui/Input.svelte"; import RepoCard from "$lib/components/repo/RepoCard.svelte"; import PagedList from "../PagedList.svelte"; import { createOffsetPager, discoveredPageCount, pageCount } from "../pagination.svelte"; @@ -25,6 +26,8 @@ const auth = getAuth(); let searchQuery = $derived(page.url.searchParams.get("q") ?? ""); + let queryValue = $derived(searchQuery); + const hasQuery = $derived(queryValue.length > 0); const pager = createOffsetPager( untrack(() => initial), PROFILE_PAGE_LIMIT, @@ -63,16 +66,18 @@
- diff --git a/web/src/lib/components/repo/RepoCreationForm.svelte b/web/src/lib/components/repo/RepoCreationForm.svelte index 7da01ab3c..f2fa6e03b 100644 --- a/web/src/lib/components/repo/RepoCreationForm.svelte +++ b/web/src/lib/components/repo/RepoCreationForm.svelte @@ -135,15 +135,14 @@ {user?.handle ?? "…"}
-

@@ -159,14 +158,12 @@ > Description -

{[...description].length}/140 characters @@ -198,13 +195,11 @@ > Default branch -

The primary branch where development happens. Common choices are "main" diff --git a/web/src/lib/components/strings/StringForm.svelte b/web/src/lib/components/strings/StringForm.svelte index 27db31059..a4b309139 100644 --- a/web/src/lib/components/strings/StringForm.svelte +++ b/web/src/lib/components/strings/StringForm.svelte @@ -3,8 +3,12 @@ import type { Did } from "@atcute/lexicons/syntax"; import { now as tidNow } from "@atcute/tid"; import Button from "$lib/components/ui/Button.svelte"; + import Card from "$lib/components/ui/Card.svelte"; + import Input from "$lib/components/ui/Input.svelte"; import Spinner from "$lib/components/ui/Spinner.svelte"; + import Textarea from "$lib/components/ui/Textarea.svelte"; import ErrorAlert from "$lib/components/ui/Error.svelte"; + import Separator from "$lib/components/ui/Separator.svelte"; import ArrowUp from "$icon/arrow-up"; import X from "$icon/x"; import { getAuth } from "$lib/auth.svelte"; @@ -70,49 +74,48 @@ }); -

+
- -
- + class="typography-monospace-small" + />
{lineCount} line{lineCount !== 1 ? "s" : ""} - · + {byteCount} byte{byteCount !== 1 ? "s" : ""}
@@ -154,4 +157,4 @@
{/if} -
+ diff --git a/web/src/routes/settings/profile/handle/+page.svelte b/web/src/routes/settings/profile/handle/+page.svelte index 62db2b92c..63f79a934 100644 --- a/web/src/routes/settings/profile/handle/+page.svelte +++ b/web/src/routes/settings/profile/handle/+page.svelte @@ -3,7 +3,6 @@ import { resolve } from "$app/paths"; import Button from "$lib/components/ui/Button.svelte"; import Input from "$lib/components/ui/Input.svelte"; - import { inputField } from "$lib/components/ui/inputField"; import Toggle from "$lib/components/ui/Toggle.svelte"; import DrillDown from "$lib/components/settings/DrillDown.svelte"; import SettingsList from "$lib/components/settings/SettingsList.svelte"; @@ -34,19 +33,14 @@ {#if ownDomain} {:else} -
- - - {SUFFIX} - -
+ {/if} -- 2.51.2