From 7fb3d6f120e1c049433f0fd84352413911d40659 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Sat, 8 Mar 2025 09:27:41 +0100 Subject: [PATCH 1/9] open #133 active user data --- src/lib/components/Login.svelte | 12 +++++ .../components/util/CopyToClipboard.svelte | 29 +++++++++++ src/lib/components/util/InlineProfile.svelte | 49 +++++++++++++++++++ 3 files changed, 90 insertions(+) create mode 100644 src/lib/components/util/CopyToClipboard.svelte create mode 100644 src/lib/components/util/InlineProfile.svelte diff --git a/src/lib/components/Login.svelte b/src/lib/components/Login.svelte index 84af5db..61b6ffa 100644 --- a/src/lib/components/Login.svelte +++ b/src/lib/components/Login.svelte @@ -3,11 +3,15 @@ import { activePubkey, loginWithExtension, logout, ndkInstance, ndkSignedIn, persistLogin } from '$lib/ndk'; import { Avatar, Button, Popover, Tooltip } from 'flowbite-svelte'; import { ArrowRightToBracketOutline } from 'flowbite-svelte-icons'; + import CopyToClipboard from "$components/util/CopyToClipboard.svelte"; let profile = $state(null); let pfp = $derived(profile?.image); let username = $derived(profile?.name); let tag = $derived(profile?.name); + let npub = $state(undefined); + + const externalProfileDestination = 'https://nostree.me/' let signInFailed = $state(false); @@ -19,6 +23,7 @@ .then(userProfile => { profile = userProfile; }); + npub = $ndkInstance.activeUser?.npub; } }); @@ -42,6 +47,11 @@ logout($ndkInstance.activeUser!); profile = null; } + + function shortenNpub(long: string|undefined) { + if (!long) return ''; + return long.slice(0, 8) + '…' + long.slice(-4); + } {#if $ndkSignedIn} @@ -61,6 +71,8 @@

{username}

@{tag}

+ + View profile
+ + + Copied! + +
diff --git a/src/lib/components/util/InlineProfile.svelte b/src/lib/components/util/InlineProfile.svelte new file mode 100644 index 0000000..9725194 --- /dev/null +++ b/src/lib/components/util/InlineProfile.svelte @@ -0,0 +1,49 @@ + + +{#if loading} + +{:else if pubkey} + + {username} +{:else} + Not found +{/if} \ No newline at end of file From a6edcdfda36078491ec31ee36f52dcf875fb88b0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Thu, 13 Mar 2025 18:37:12 +0100 Subject: [PATCH 2/9] closes #77 closes #189 closes #133 available actions moved to ... menu, profiles, details --- src/app.css | 2 +- src/lib/components/Login.svelte | 90 ++------ src/lib/components/PublicationHeader.svelte | 107 +++------- src/lib/components/util/CardActions.svelte | 194 ++++++++++++++++++ .../components/util/CopyToClipboard.svelte | 34 ++- src/lib/components/util/InlineProfile.svelte | 6 +- src/lib/components/util/Profile.svelte | 101 +++++++++ src/styles/publications.css | 19 +- 8 files changed, 386 insertions(+), 167 deletions(-) create mode 100644 src/lib/components/util/CardActions.svelte create mode 100644 src/lib/components/util/Profile.svelte diff --git a/src/app.css b/src/app.css index 79fee31..6ca56d5 100644 --- a/src/app.css +++ b/src/app.css @@ -106,7 +106,7 @@ /* Modal */ div.modal-leather > div { - @apply bg-primary-0 dark:bg-primary-1000 border-b-[1px] border-gray-800 dark:border-gray-500; + @apply bg-primary-0 dark:bg-primary-1000 border-b-[1px] border-primary-100 dark:border-primary-600; } div.modal-leather > div > h1, diff --git a/src/lib/components/Login.svelte b/src/lib/components/Login.svelte index 61b6ffa..2d77763 100644 --- a/src/lib/components/Login.svelte +++ b/src/lib/components/Login.svelte @@ -2,8 +2,7 @@ import { type NDKUserProfile } from '@nostr-dev-kit/ndk'; import { activePubkey, loginWithExtension, logout, ndkInstance, ndkSignedIn, persistLogin } from '$lib/ndk'; import { Avatar, Button, Popover, Tooltip } from 'flowbite-svelte'; - import { ArrowRightToBracketOutline } from 'flowbite-svelte-icons'; - import CopyToClipboard from "$components/util/CopyToClipboard.svelte"; + import Profile from "$components/util/Profile.svelte"; let profile = $state(null); let pfp = $derived(profile?.image); @@ -11,8 +10,6 @@ let tag = $derived(profile?.name); let npub = $state(undefined); - const externalProfileDestination = 'https://nostree.me/' - let signInFailed = $state(false); $effect(() => { @@ -43,78 +40,31 @@ } } - async function handleSignOutClick() { - logout($ndkInstance.activeUser!); - profile = null; - } - - function shortenNpub(long: string|undefined) { - if (!long) return ''; - return long.slice(0, 8) + '…' + long.slice(-4); - } -{#if $ndkSignedIn} - - {#key username || tag} +
+ {#if $ndkSignedIn} + + {:else} + -
-
-

{username}

-

@{tag}

- - View profile -
-
- -
+
+ +
- {/key} -{:else} - - -
- - -
-
-{/if} + {/if} +
diff --git a/src/lib/components/PublicationHeader.svelte b/src/lib/components/PublicationHeader.svelte index 6986ee0..952b7aa 100644 --- a/src/lib/components/PublicationHeader.svelte +++ b/src/lib/components/PublicationHeader.svelte @@ -2,10 +2,11 @@ import { ndkInstance } from '$lib/ndk'; import { neventEncode } from '$lib/utils'; import type { NDKEvent } from '@nostr-dev-kit/ndk'; - import { naddrEncode, type AddressPointer } from 'nostr-tools/nip19'; import { standardRelays } from '../consts'; - import { Card, Button, Modal, Tooltip } from 'flowbite-svelte'; - import { ClipboardCheckOutline, ClipboardCleanOutline, CodeOutline, ShareNodesOutline } from 'flowbite-svelte-icons'; + import { Card, Img } from "flowbite-svelte"; + import CardActions from "$components/util/CardActions.svelte"; + import Profile from "$components/util/Profile.svelte"; + import InlineProfile from "$components/util/InlineProfile.svelte"; const { event } = $props<{ event: NDKEvent }>(); @@ -25,83 +26,41 @@ let title: string = $derived(event.getMatchingTags('title')[0]?.[1]); let author: string = $derived(event.getMatchingTags('author')[0]?.[1] ?? 'unknown'); let version: string = $derived(event.getMatchingTags('version')[0]?.[1] ?? '1'); - - let eventIdCopied: boolean = $state(false); - let jsonModalOpen: boolean = $state(false); - let shareLinkCopied: boolean = $state(false); - - function copyEventId() { - console.debug("copyEventID"); - const relays: string[] = standardRelays; - const nevent = neventEncode(event, relays); - - navigator.clipboard.writeText(nevent); - - eventIdCopied = true; - } - - function viewJson() { - console.debug("viewJSON"); - jsonModalOpen = true; - } - - function shareNjump() { - const relays: string[] = standardRelays; - const dTag : string | undefined = event.dTag; - - if (typeof dTag === 'string') { - const opts: AddressPointer = { - identifier: dTag, - pubkey: event.pubkey, - kind: 30040, - relays - }; - const naddr = naddrEncode(opts); - console.debug(naddr); - navigator.clipboard.writeText(`https://njump.me/${naddr}`); - shareLinkCopied = true; - } - - else { - console.log('dTag is undefined'); - } - } + let image: string = $derived(event.getMatchingTags('image')[0]?.[1] ?? null); + let authorPubkey: string = $derived(event.getMatchingTags('p')[0]?.[1] ?? null); {#if title != null && href != null} - -
- -

{title}

-

by {author}

- {#if version != '1'} -

version: {version}

- {/if} -
-
- - shareLinkCopied = false}> - {#if shareLinkCopied} - - {:else} - Share via NJump - {/if} - - - eventIdCopied = false}> - {#if eventIdCopied} - - {:else} - Copy event ID + + {#if image != null} +
+ +
+ {/if} + - - {JSON.stringify(event.rawEvent())} -
{/if} diff --git a/src/lib/components/util/CardActions.svelte b/src/lib/components/util/CardActions.svelte new file mode 100644 index 0000000..7f70608 --- /dev/null +++ b/src/lib/components/util/CardActions.svelte @@ -0,0 +1,194 @@ + + +
+ + + + {#if isOpen} + + + + {/if} + + +
+ {JSON.stringify(event.rawEvent())} +
+
+ + +
+ {#if image} +
+ +
+ {/if} +
+

{title}

+

by + {#if originalAuthor !== null} + + {:else} + {author} + {/if} +

+

Version: {version}

+
+
+ + {#if summary} +
+

{summary}

+
+ {/if} + +
+

Index author:

+
+ +
+ {#if type !== null} +
Publication type: {type}
+ {/if} + {#if language !== null} +
Language: {language}
+ {/if} + +
+ +
+
diff --git a/src/lib/components/util/CopyToClipboard.svelte b/src/lib/components/util/CopyToClipboard.svelte index 33872d2..9e72c79 100644 --- a/src/lib/components/util/CopyToClipboard.svelte +++ b/src/lib/components/util/CopyToClipboard.svelte @@ -1,29 +1,27 @@ -
- - {displayText} - - - Copied! - -
+ + {#if copied} + Copied! + {:else} + {displayText} + {/if} + \ No newline at end of file diff --git a/src/lib/components/util/InlineProfile.svelte b/src/lib/components/util/InlineProfile.svelte index 9725194..507b3d8 100644 --- a/src/lib/components/util/InlineProfile.svelte +++ b/src/lib/components/util/InlineProfile.svelte @@ -3,9 +3,9 @@ import { type NDKUserProfile } from '@nostr-dev-kit/ndk'; import { ndkInstance } from '$lib/ndk'; - let { pubkey } = $props(); + let { pubkey, title = null } = $props(); - const externalProfileDestination = 'https://nostree.me/' + const externalProfileDestination = 'https://njump.me/' let loading = $state(true); let npub = $state(''); @@ -43,7 +43,7 @@ class='h-6 w-6 mx-1 cursor-pointer inline' src={pfp} alt={username} /> - {username} + {username} {:else} Not found {/if} \ No newline at end of file diff --git a/src/lib/components/util/Profile.svelte b/src/lib/components/util/Profile.svelte new file mode 100644 index 0000000..fd23c9f --- /dev/null +++ b/src/lib/components/util/Profile.svelte @@ -0,0 +1,101 @@ + + +
+ {#if profile} +
+ + {#key username || tag} + +
+
+ {#if username} +

{username}

+ {#if isNav}

@{tag}

{/if} + {/if} + +
+
+
+ {/key} +
+ {/if} +
diff --git a/src/styles/publications.css b/src/styles/publications.css index a48919a..b2b2847 100644 --- a/src/styles/publications.css +++ b/src/styles/publications.css @@ -90,7 +90,7 @@ .videoblock .title, .olist .title, .ulist .title { - @apply my-2; + @apply my-2 font-thin text-lg; } .note-leather li p { @@ -115,6 +115,10 @@ @apply text-sm; } + .leading-normal.first-letter\:text-7xl .quoteblock { + min-height: 108px; + } + /* admonition */ .note-leather .admonitionblock .title { @apply font-semibold; @@ -128,6 +132,10 @@ @apply flex flex-col; } + .note-leather .admonitionblock p:has(code) { + @apply my-3; + } + .note-leather .admonitionblock { @apply rounded overflow-hidden border; } @@ -212,4 +220,13 @@ .videoblock .content video { @apply w-full h-full; } + + /* audio */ + .audioblock .content { + @apply my-3; + } + + .audioblock .content audio { + @apply w-full; + } } \ No newline at end of file From d84cb6ee125679469e8197542a1346933ce17824 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Thu, 13 Mar 2025 19:21:10 +0100 Subject: [PATCH 3/9] Change order of actions --- src/lib/components/util/CardActions.svelte | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/lib/components/util/CardActions.svelte b/src/lib/components/util/CardActions.svelte index 7f70608..13ce549 100644 --- a/src/lib/components/util/CardActions.svelte +++ b/src/lib/components/util/CardActions.svelte @@ -110,6 +110,11 @@ From 9391b8e678912ba2a288c84e070376c512c72200 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Thu, 13 Mar 2025 20:30:12 +0100 Subject: [PATCH 4/9] Add some tags --- src/app.css | 6 +++--- src/lib/components/util/CardActions.svelte | 14 +++++++++++++- tailwind.config.cjs | 1 + 3 files changed, 17 insertions(+), 4 deletions(-) diff --git a/src/app.css b/src/app.css index 6ca56d5..463b498 100644 --- a/src/app.css +++ b/src/app.css @@ -36,7 +36,7 @@ /* Card */ div.card-leather { @apply shadow-none text-primary-1000 border-s-4 bg-highlight border-primary-200 has-[:hover]:border-primary-700; - @apply dark:bg-primary-1000 dark:border-primary-800 dark:has-[:hover]:border-primary-500; + @apply dark:bg-primary-1000 dark:border-primary-800 dark:has-[:hover]:bg-primary-950 dark:has-[:hover]:border-primary-500; } div.card-leather h1, @@ -106,7 +106,7 @@ /* Modal */ div.modal-leather > div { - @apply bg-primary-0 dark:bg-primary-1000 border-b-[1px] border-primary-100 dark:border-primary-600; + @apply bg-primary-0 dark:bg-primary-950 border-b-[1px] border-primary-100 dark:border-primary-600; } div.modal-leather > div > h1, @@ -119,7 +119,7 @@ } div.modal-leather button { - @apply bg-primary-0 hover:bg-primary-0 dark:bg-primary-1000 dark:hover:bg-primary-1000 text-gray-800 hover:text-primary-400 dark:text-gray-300 dark:hover:text-primary-500; + @apply bg-primary-0 hover:bg-primary-0 dark:bg-primary-950 dark:hover:bg-primary-950 text-gray-800 hover:text-primary-400 dark:text-gray-300 dark:hover:text-primary-500; } /* Navbar */ diff --git a/src/lib/components/util/CardActions.svelte b/src/lib/components/util/CardActions.svelte index 13ce549..41f0c1c 100644 --- a/src/lib/components/util/CardActions.svelte +++ b/src/lib/components/util/CardActions.svelte @@ -27,6 +27,9 @@ let summary: string = $derived(event.getMatchingTags('summary')[0]?.[1] ?? null); let type: string = $derived(event.getMatchingTags('type')[0]?.[1] ?? null); let language: string = $derived(event.getMatchingTags('l')[0]?.[1] ?? null); + let source: string = $derived(event.getMatchingTags('source')[0]?.[1] ?? null); + let publisher: string = $derived(event.getMatchingTags('published_by')[0]?.[1] ?? null); + let identifier: string = $derived(event.getMatchingTags('i')[0]?.[1] ?? null); let isOpen = $state(false); @@ -180,13 +183,22 @@

Index author:

-
+
+ {#if source !== null} +
Source: {source}
+ {/if} {#if type !== null}
Publication type: {type}
{/if} {#if language !== null}
Language: {language}
{/if} + {#if publisher !== null} +
Published by: {publisher}
+ {/if} + {#if identifier !== null} +
{identifier}
+ {/if}
diff --git a/tailwind.config.cjs b/tailwind.config.cjs index e9f0183..380981b 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -24,6 +24,7 @@ const config = { 700: '#574229', 800: '#342718', 900: '#231a10', + 950: '#17110A', 1000: '#110d08', }, success: { From b1fe9d8d53dfd146e7395b2e80240c999e3a3a69 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Sat, 15 Mar 2025 08:54:13 +0100 Subject: [PATCH 5/9] Fix about page --- src/routes/about/+page.svelte | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte index b16db6d..9e4ee80 100644 --- a/src/routes/about/+page.svelte +++ b/src/routes/about/+page.svelte @@ -5,15 +5,15 @@
About -

Alexandria is a reader and writer for curated publications (in Asciidoc), and will eventually also support long-form articles (Markdown) and wiki pages (Asciidoc). It is produced by the GitCitadel project team.

+

Alexandria is a reader and writer for curated publications (in Asciidoc), and will eventually also support long-form articles (Markdown) and wiki pages (Asciidoc). It is produced by the GitCitadel project team.

-

Please submit support issues on the project repo page and follow us on GitHub and Geyserfund.

+

Please submit support issues on the project repo page and follow us on GitHub and Geyserfund.

-

We are easiest to contact over our Nostr address npub1s3ht77dq4zqnya8vjun5jp3p44pr794ru36d0ltxu65chljw8xjqd975wz.

+

We are easiest to contact over our Nostr address npub1s3h…75wz.

Overview -

Alexandria opens up to the landing page, where the user can: login (top-right), select whether to only view the publications hosted on the thecitadel document relay or add in their own relays, and scroll/search the publications.

+

Alexandria opens up to the landing page, where the user can: login (top-right), select whether to only view the publications hosted on the thecitadel document relay or add in their own relays, and scroll/search the publications.

Landing page

Relay selection

From 7ce41bbeb97fc09d502287e9082419ee4c79d6f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Sat, 15 Mar 2025 08:57:10 +0100 Subject: [PATCH 6/9] Fix #133 make anon profiles better, include avatar in the link --- src/lib/components/util/InlineProfile.svelte | 28 +++++++++++++------- 1 file changed, 19 insertions(+), 9 deletions(-) diff --git a/src/lib/components/util/InlineProfile.svelte b/src/lib/components/util/InlineProfile.svelte index 507b3d8..4b9efe3 100644 --- a/src/lib/components/util/InlineProfile.svelte +++ b/src/lib/components/util/InlineProfile.svelte @@ -1,12 +1,13 @@ {#if loading} - -{:else if pubkey} - {shortenNpub(npub)} +{:else if npub } + + - {username} + {username ?? shortenNpub(npub)} + {:else} - Not found + {title ?? pubkey} {/if} \ No newline at end of file From 3a9c92b59fc662004dc4298cd2dd77f1411e8037 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Sat, 15 Mar 2025 08:58:08 +0100 Subject: [PATCH 7/9] Fix #189 change hover color of thin fonts --- src/app.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/app.css b/src/app.css index 463b498..358d034 100644 --- a/src/app.css +++ b/src/app.css @@ -48,6 +48,10 @@ @apply text-gray-800 hover:text-primary-400 dark:text-gray-300 dark:hover:text-primary-500; } + div.card-leather .font-thin { + @apply text-gray-900 hover:text-primary-600 dark:text-gray-200 dark:hover:text-primary-200; + } + /* Content */ main { @apply max-w-full; From 98fd412c184310e2d05940855df22066ca164233 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Sat, 15 Mar 2025 08:59:32 +0100 Subject: [PATCH 8/9] Fix #77 preserve ratio of book cover thumbnail --- src/lib/components/PublicationHeader.svelte | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/lib/components/PublicationHeader.svelte b/src/lib/components/PublicationHeader.svelte index 952b7aa..ac4269a 100644 --- a/src/lib/components/PublicationHeader.svelte +++ b/src/lib/components/PublicationHeader.svelte @@ -33,9 +33,9 @@ {#if title != null && href != null} - {#if image != null} -
- + {#if image} +
+
{/if}
From 309028a187ea919561fb301c3ceefb7cd8c07ca9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= Date: Fri, 28 Mar 2025 20:36:29 +0100 Subject: [PATCH 9/9] close #206 remove PfPs --- src/lib/components/PublicationHeader.svelte | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/lib/components/PublicationHeader.svelte b/src/lib/components/PublicationHeader.svelte index ac4269a..f9ded78 100644 --- a/src/lib/components/PublicationHeader.svelte +++ b/src/lib/components/PublicationHeader.svelte @@ -5,7 +5,6 @@ import { standardRelays } from '../consts'; import { Card, Img } from "flowbite-svelte"; import CardActions from "$components/util/CardActions.svelte"; - import Profile from "$components/util/Profile.svelte"; import InlineProfile from "$components/util/InlineProfile.svelte"; const { event } = $props<{ event: NDKEvent }>(); @@ -55,11 +54,8 @@ {/if}
-
+
-
- -