From d75806a91aeadbc3a0dc72530dab8b73515271a7 Mon Sep 17 00:00:00 2001 From: Florian <45694132+flo-bit@users.noreply.github.com> Date: Thu, 23 Apr 2026 20:52:33 +0200 Subject: [PATCH] some imrpovements, cleanup --- .../_base/BaseCard/BaseEditingCard.svelte | 37 +-- src/lib/components/DatePicker.svelte | 244 --------------- src/lib/components/DateTimePicker.svelte | 73 ----- .../{website => components}/Pronouns.svelte | 1 + src/lib/components/TimePicker.svelte | 101 ------- .../modals/MobileWarningModal.svelte | 30 ++ src/lib/helper.ts | 5 - src/lib/website/Account.svelte | 76 ----- src/lib/website/CardSettingsSidebar.svelte | 220 ++++++++++++++ src/lib/website/CustomDomainModal.svelte | 280 ------------------ src/lib/website/EditTopBar.svelte | 152 ++++++++++ src/lib/website/EditableProfile.svelte | 2 +- src/lib/website/EditableWebsite.svelte | 185 ++++++------ src/lib/website/EmbeddedCard.svelte | 177 ----------- src/lib/website/FloatingEditButton.svelte | 94 ------ src/lib/website/MobileSelectionBar.svelte | 74 +++++ src/lib/website/PageSwitcherBar.svelte | 37 +++ src/lib/website/Profile.svelte | 10 +- src/lib/website/SectionsModal.svelte | 140 --------- src/lib/website/SectionsSidebar.svelte | 253 +++++++--------- src/lib/website/Website.svelte | 5 +- .../website/settings/SettingsOverlay.svelte | 2 +- .../[[actor=actor]]/(pages)/+page.svelte | 6 - .../(pages)/p/[[page]]/+page.svelte | 6 - .../card/[rkey]/+page.server.ts | 16 - .../[[actor=actor]]/card/[rkey]/+page.svelte | 7 - .../card/[rkey]/type/[type]/+page.server.ts | 60 ---- .../card/[rkey]/type/[type]/+page.svelte | 7 - 28 files changed, 716 insertions(+), 1584 deletions(-) delete mode 100644 src/lib/components/DatePicker.svelte delete mode 100644 src/lib/components/DateTimePicker.svelte rename src/lib/{website => components}/Pronouns.svelte (98%) delete mode 100644 src/lib/components/TimePicker.svelte create mode 100644 src/lib/components/modals/MobileWarningModal.svelte delete mode 100644 src/lib/website/Account.svelte create mode 100644 src/lib/website/CardSettingsSidebar.svelte delete mode 100644 src/lib/website/CustomDomainModal.svelte create mode 100644 src/lib/website/EditTopBar.svelte delete mode 100644 src/lib/website/EmbeddedCard.svelte delete mode 100644 src/lib/website/FloatingEditButton.svelte create mode 100644 src/lib/website/MobileSelectionBar.svelte create mode 100644 src/lib/website/PageSwitcherBar.svelte delete mode 100644 src/lib/website/SectionsModal.svelte delete mode 100644 src/routes/[[actor=actor]]/card/[rkey]/+page.server.ts delete mode 100644 src/routes/[[actor=actor]]/card/[rkey]/+page.svelte delete mode 100644 src/routes/[[actor=actor]]/card/[rkey]/type/[type]/+page.server.ts delete mode 100644 src/routes/[[actor=actor]]/card/[rkey]/type/[type]/+page.svelte diff --git a/src/lib/cards/_base/BaseCard/BaseEditingCard.svelte b/src/lib/cards/_base/BaseCard/BaseEditingCard.svelte index 80a1449..f3234a9 100644 --- a/src/lib/cards/_base/BaseCard/BaseEditingCard.svelte +++ b/src/lib/cards/_base/BaseCard/BaseEditingCard.svelte @@ -177,7 +177,6 @@ onsetsize?.(w, h); } - let settingsPopoverOpen = $state(false); let changePopoverOpen = $state(false); const changeOptions = $derived(AllCardDefinitions.filter((def) => def.canChange?.(item))); @@ -312,7 +311,7 @@
set size to 2x2 {/if} - - {#if cardDef.settingsComponent} - - {#snippet child({ props })} - - {/snippet} - { - settingsPopoverOpen = false; - }} - /> - - {/if}
diff --git a/src/lib/components/DatePicker.svelte b/src/lib/components/DatePicker.svelte deleted file mode 100644 index b3a0332..0000000 --- a/src/lib/components/DatePicker.svelte +++ /dev/null @@ -1,244 +0,0 @@ - - - -
- - {#snippet children({ segments })} - {#each segments as segment, i (segment.part + i)} - {#if segment.part === 'literal'} - {segment.value} - {:else} - - {segment.value} - - {/if} - {/each} - {/snippet} - - - - - - - -
- - - - {#snippet children({ months, weekdays })} - - - - - - - -
- - -
- - - - - - - - - {#each months as month (month.value.month)} - - - - {#each weekdays as weekday, i (i)} - - {weekday} - - {/each} - - - - - {#each month.weeks as week, weekIndex (weekIndex)} - - {#each week as day (day.toString())} - - - {#snippet children({ selected, disabled, day: dayText })} -
- {dayText} - {#if day.day === todayDay && day.month === todayMonth && day.year === todayYear} - - {/if} -
- {/snippet} - - - {/each} - - {/each} - - - {/each} - {/snippet} - - - diff --git a/src/lib/components/DateTimePicker.svelte b/src/lib/components/DateTimePicker.svelte deleted file mode 100644 index df75172..0000000 --- a/src/lib/components/DateTimePicker.svelte +++ /dev/null @@ -1,73 +0,0 @@ - - -
- -
- -
-
diff --git a/src/lib/website/Pronouns.svelte b/src/lib/components/Pronouns.svelte similarity index 98% rename from src/lib/website/Pronouns.svelte rename to src/lib/components/Pronouns.svelte index e571640..0be30fd 100644 --- a/src/lib/website/Pronouns.svelte +++ b/src/lib/components/Pronouns.svelte @@ -85,6 +85,7 @@ d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8.8-2.685a4.5 4.5 0 0 1 1.13-1.897L16.863 4.487Zm0 0L19.5 7.125" /> + Edit pronouns {/if} diff --git a/src/lib/components/TimePicker.svelte b/src/lib/components/TimePicker.svelte deleted file mode 100644 index e9b565f..0000000 --- a/src/lib/components/TimePicker.svelte +++ /dev/null @@ -1,101 +0,0 @@ - - - -
- - {#snippet children({ segments })} - {#each segments as segment, i (segment.part + i)} - {#if segment.part === 'literal'} - {segment.value} - {:else} - - {segment.value} - - {/if} - {/each} - {/snippet} - - - - - -
- diff --git a/src/lib/components/modals/MobileWarningModal.svelte b/src/lib/components/modals/MobileWarningModal.svelte new file mode 100644 index 0000000..8636b98 --- /dev/null +++ b/src/lib/components/modals/MobileWarningModal.svelte @@ -0,0 +1,30 @@ + + + +
+ + + +

Mobile Editing

+

+ Mobile editing is currently experimental. For the best experience, use a desktop browser. +

+ +
+ diff --git a/src/lib/helper.ts b/src/lib/helper.ts index 8e35f7c..8cc681a 100644 --- a/src/lib/helper.ts +++ b/src/lib/helper.ts @@ -49,11 +49,6 @@ export function cardsEqual(a: Item, b: Item) { ); } -/** @deprecated No longer needed — Contrail keeps data fresh via notify() */ -export async function refreshData(_data: { updatedAt?: number; handle: string }) { - // no-op: Contrail indexes are updated immediately on writes -} - export function getName(data: WebsiteData): string { return data.publication?.name || data.profile.displayName || data.handle; } diff --git a/src/lib/website/Account.svelte b/src/lib/website/Account.svelte deleted file mode 100644 index 615e57e..0000000 --- a/src/lib/website/Account.svelte +++ /dev/null @@ -1,76 +0,0 @@ - - -{#if user.isLoggedIn && user.profile} -
- - - {#snippet child({ props })} - - {/snippet} - -
- {#if user.profile} - - {/if} - - -
- - - - -
-{/if} diff --git a/src/lib/website/CardSettingsSidebar.svelte b/src/lib/website/CardSettingsSidebar.svelte new file mode 100644 index 0000000..4b118a4 --- /dev/null +++ b/src/lib/website/CardSettingsSidebar.svelte @@ -0,0 +1,220 @@ + + + diff --git a/src/lib/website/CustomDomainModal.svelte b/src/lib/website/CustomDomainModal.svelte deleted file mode 100644 index fb88426..0000000 --- a/src/lib/website/CustomDomainModal.svelte +++ /dev/null @@ -1,280 +0,0 @@ - - - - - - {#if step === 'current'} -

- Custom Domain -

- -
- {currentDomain} -
- -
- - - -
- {:else if step === 'input'} -

- Custom Domain -

- - - -
- - -
- {:else if step === 'instructions'} -

- Set up your domain -

- -

- Add a CNAME record for your domain pointing to: -

- -
- blento-proxy.fly.dev - -
- -
- - -
- {:else if step === 'verifying'} -

- Verifying... -

- -

- Checking DNS records and verifying your domain. -

- -
- - - - - Verifying... -
- {:else if step === 'removing'} -

- Removing... -

- -
- - - - - Removing domain... -
- {:else if step === 'success'} -

- Domain verified! -

- -

- Your custom domain {domain} has been set up successfully. -

- -
- -
- {:else if step === 'error'} -

- Verification failed -

- -

- {errorMessage} -

- {#if errorHint} -

- {errorHint} -

- {/if} - -
- - -
- {/if} - diff --git a/src/lib/website/EditTopBar.svelte b/src/lib/website/EditTopBar.svelte new file mode 100644 index 0000000..cd0c7e9 --- /dev/null +++ b/src/lib/website/EditTopBar.svelte @@ -0,0 +1,152 @@ + + +{#if dev || (user.isLoggedIn && user.profile?.did === data.did)} +
+
+ + {#snippet child({ props })} + + {/snippet} + +
+ +
+ + + + {name} + + +
+
+ + + + +
+
+{/if} diff --git a/src/lib/website/EditableProfile.svelte b/src/lib/website/EditableProfile.svelte index f5fa0c0..f62fe6f 100644 --- a/src/lib/website/EditableProfile.svelte +++ b/src/lib/website/EditableProfile.svelte @@ -5,7 +5,7 @@ import MarkdownTextEditor from '$lib/components/MarkdownTextEditor.svelte'; import { Avatar } from '@foxui/core'; import MadeWithBlento from './MadeWithBlento.svelte'; - import Pronouns from './Pronouns.svelte'; + import Pronouns from '../components/Pronouns.svelte'; let { data = $bindable(), hideBlento = false }: { data: WebsiteData; hideBlento?: boolean } = $props(); diff --git a/src/lib/website/EditableWebsite.svelte b/src/lib/website/EditableWebsite.svelte index 69ee963..8fcbe98 100644 --- a/src/lib/website/EditableWebsite.svelte +++ b/src/lib/website/EditableWebsite.svelte @@ -18,15 +18,17 @@ import { AllCardDefinitions, CardDefinitionsByType } from '../cards'; import { tick, type Component } from 'svelte'; import type { CardDefinition, CreationModalComponentProps } from '../cards/types'; + import { dev } from '$app/environment'; import { env } from '$env/dynamic/public'; import { setIsCoarse, setIsMobile, setSelectedCardId, setSelectCard } from './context'; import Context from './Context.svelte'; import Head from './Head.svelte'; - import Account from './Account.svelte'; import SettingsOverlay from './settings/SettingsOverlay.svelte'; - import EditBar from './EditBar.svelte'; + import CardSettingsSidebar from './CardSettingsSidebar.svelte'; + import EditTopBar from './EditTopBar.svelte'; + import MobileSelectionBar from './MobileSelectionBar.svelte'; + import PageSwitcherBar from './PageSwitcherBar.svelte'; import SaveModal from './SaveModal.svelte'; - import FloatingEditButton from './FloatingEditButton.svelte'; import { user } from '$lib/atproto'; import * as TID from '@atcute/tid'; import { launchConfetti } from '@foxui/visual'; @@ -41,6 +43,7 @@ import { SectionDefinitionsByType } from '$lib/sections'; import { isSectionsEditingEnabled } from '$lib/sections/feature-flag'; import type { SectionRecord } from '$lib/types'; + import MobileWarningModal from '$lib/components/modals/MobileWarningModal.svelte'; let { data @@ -128,6 +131,26 @@ selectedCardId = id; }); + let cardSettingsOpen = $state(false); + $effect(() => { + if (!selectedCard) { + cardSettingsOpen = false; + } else if (!isMobile) { + cardSettingsOpen = true; + } + }); + + function resizeSelectedCard(w: number, h: number) { + if (!selectedCard) return; + const section = sections.find((s) => s.id === selectedCard!.sectionId); + const def = section ? SectionDefinitionsByType[section.sectionType] : undefined; + if (def?.resizeItem) { + def.resizeItem(selectedCard, items, w, h, isMobile); + } + onLayoutChanged(); + } + + // svelte-ignore state_referenced_locally let activeSectionId = $state(sections[0]?.id); let gridContainer = $derived( activeSectionId ? gridRefs.get(activeSectionId) : gridRefs.values().next().value @@ -301,8 +324,6 @@ hasUnsavedChanges = true; } - let linkValue = $state(''); - function addLink(url: string, specificCardDef?: CardDefinition) { let link = validateLink(url); if (!link) { @@ -386,13 +407,15 @@ baseColor={data.publication?.preferences?.baseColor} /> - + + + {#if sectionsEditingEnabled} - - +
{#if !getHideProfileSection(data)} - + {/if}
- { - requestAddCard(); - }} - {selectedCard} - {isMobile} - {isCoarse} - ondeselect={() => { - selectedCardId = null; - }} - ondelete={() => { - if (selectedCard) { - const section = sections.find((s) => s.id === selectedCard!.sectionId); - const def = section ? SectionDefinitionsByType[section.sectionType] : undefined; - if (def?.deleteItem) { - items = def.deleteItem(selectedCardId!, items, selectedCard.sectionId!); - } else { - items = items.filter((it) => it.id !== selectedCardId); - } - onLayoutChanged(); - selectedCardId = null; - } - }} - onsetsize={(w: number, h: number) => { - if (selectedCard) { - const section = sections.find((s) => s.id === selectedCard!.sectionId); - const def = section ? SectionDefinitionsByType[section.sectionType] : undefined; - if (def?.resizeItem) { - def.resizeItem(selectedCard, items, w, h, isMobile); - } - onLayoutChanged(); - } - }} - allowRotate={(() => { - if (!selectedCard) return false; - const section = sections.find((s) => s.id === selectedCard.sectionId); - const def = section ? SectionDefinitionsByType[section.sectionType] : undefined; - const cardDef = CardDefinitionsByType[selectedCard.cardType]; - return !!def?.allowRotate && cardDef?.allowRotate !== false; - })()} - onrotate={(delta: number) => { - if (selectedCard) { - selectedCard.rotation = (selectedCard.rotation ?? 0) + delta; - onLayoutChanged(); - } - }} - sidebarOpen={showSectionsSidebar} + - + {#if dev || (user.isLoggedIn && user.profile?.did === data.did)} + + {/if} - + diff --git a/src/lib/website/EmbeddedCard.svelte b/src/lib/website/EmbeddedCard.svelte deleted file mode 100644 index 343c869..0000000 --- a/src/lib/website/EmbeddedCard.svelte +++ /dev/null @@ -1,177 +0,0 @@ - - - - - - - {@html themeScript} - - - - - - -
-
-
- - - -
-
-
- - - diff --git a/src/lib/website/FloatingEditButton.svelte b/src/lib/website/FloatingEditButton.svelte deleted file mode 100644 index 6c7fbbd..0000000 --- a/src/lib/website/FloatingEditButton.svelte +++ /dev/null @@ -1,94 +0,0 @@ - - -{#if isOwnPage && !isEditPage} - -{:else if showLoginOnEditPage} -
- -
-{:else if showLoginOnBlento} -
- -
-{:else if showEditBlentoButton} -
- -
-{/if} diff --git a/src/lib/website/MobileSelectionBar.svelte b/src/lib/website/MobileSelectionBar.svelte new file mode 100644 index 0000000..e9feae7 --- /dev/null +++ b/src/lib/website/MobileSelectionBar.svelte @@ -0,0 +1,74 @@ + + +{#if visible && (dev || (user.isLoggedIn && user.profile?.did === data.did))} +
+ +
+ + +
+ +
+{/if} diff --git a/src/lib/website/PageSwitcherBar.svelte b/src/lib/website/PageSwitcherBar.svelte new file mode 100644 index 0000000..6f292ca --- /dev/null +++ b/src/lib/website/PageSwitcherBar.svelte @@ -0,0 +1,37 @@ + + +{#if dev || (user.isLoggedIn && user.profile?.did === data.did)} +
+ + +
+{/if} diff --git a/src/lib/website/Profile.svelte b/src/lib/website/Profile.svelte index 071ea86..65b2f7e 100644 --- a/src/lib/website/Profile.svelte +++ b/src/lib/website/Profile.svelte @@ -7,14 +7,12 @@ import { qrOverlay } from '$lib/components/qr/qrOverlay.svelte'; import MadeWithBlento from './MadeWithBlento.svelte'; import { Avatar } from '@foxui/core'; - import Pronouns from './Pronouns.svelte'; + import Pronouns from '../components/Pronouns.svelte'; let { - data, - hideBlento = false + data }: { data: WebsiteData; - hideBlento?: boolean; } = $props(); const renderer = new marked.Renderer(); @@ -92,8 +90,6 @@
- {#if !hideBlento} -