Browse Source

feat(RepoPage): nip34 rename `git_server` `clone`

- update repo event tags to reflect nip34
- refactor: move RepoSummary interface and default into type.ts

the notable visible change is to use `clone` tag in place of
`git_server`

non-nip34 tags are supported: `unique_commit` and `maintainers`.
these enable desirable functionality to be maintained.
master
DanConwayDev 2 years ago
parent
commit
e06c1075e0
No known key found for this signature in database
GPG Key ID: 68E15486D73F75E1
  1. BIN
      __snapshots__/repo-details--long-and-no-spaces.png
  2. BIN
      __snapshots__/repo-details--long-details.png
  3. BIN
      __snapshots__/repo-details--no-clone.png
  4. BIN
      __snapshots__/repo-details--no-description.png
  5. BIN
      __snapshots__/repo-details--no-maintainers-or-relays.png
  6. BIN
      __snapshots__/repo-details--no-maintainers.png
  7. BIN
      __snapshots__/repo-details--no-name-or-description.png
  8. BIN
      __snapshots__/repo-details--no-relays.png
  9. BIN
      __snapshots__/repo-details--no-tags.png
  10. BIN
      __snapshots__/repo-details--one-maintainer-s-profile-has-no-display-name-or-name.png
  11. BIN
      __snapshots__/repo-details--one-maintainer-s-profile-not-loaded.png
  12. BIN
      __snapshots__/repo-details--one-maintainer-s-profile-only-has-display-name-but-no-name.png
  13. BIN
      __snapshots__/repo-details--short-details.png
  14. 64
      __snapshots__/repo-details.test.js.snap
  15. 22
      src/lib/components/RepoSummaryCard.svelte
  16. 7
      src/lib/components/ReposSummaryList.svelte
  17. 2
      src/lib/components/repo/RepoDetails.stories.svelte
  18. 10
      src/lib/components/repo/RepoDetails.svelte
  19. 3
      src/lib/components/repo/RepoHeader.svelte
  20. 25
      src/lib/components/repo/type.ts
  21. 14
      src/lib/components/repo/vectors.ts
  22. 3
      src/lib/stores/repo.ts
  23. 5
      src/lib/wrappers/ReposRecent.svelte

BIN
__snapshots__/repo-details--long-and-no-spaces.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 59 KiB

BIN
__snapshots__/repo-details--long-details.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 72 KiB

After

Width:  |  Height:  |  Size: 71 KiB

BIN
__snapshots__/repo-details--no-clone.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

BIN
__snapshots__/repo-details--no-description.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 37 KiB

BIN
__snapshots__/repo-details--no-maintainers-or-relays.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 19 KiB

BIN
__snapshots__/repo-details--no-maintainers.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
__snapshots__/repo-details--no-name-or-description.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 37 KiB

BIN
__snapshots__/repo-details--no-relays.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 31 KiB

BIN
__snapshots__/repo-details--no-tags.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 36 KiB

BIN
__snapshots__/repo-details--one-maintainer-s-profile-has-no-display-name-or-name.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 40 KiB

BIN
__snapshots__/repo-details--one-maintainer-s-profile-not-loaded.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 38 KiB

BIN
__snapshots__/repo-details--one-maintainer-s-profile-only-has-display-name-but-no-name.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 43 KiB

BIN
__snapshots__/repo-details--short-details.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

64
__snapshots__/repo-details.test.js.snap

@ -25,7 +25,7 @@ exports[`Repo/Details Long Details smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -125,7 +125,7 @@ exports[`Repo/Details Long and No Spaces smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -201,10 +201,14 @@ exports[`Repo/Details Long and No Spaces smoke-test 1`] = `
</div> </div>
`; `;
exports[`Repo/Details No Description smoke-test 1`] = ` exports[`Repo/Details No Clone smoke-test 1`] = `
<div class="prose w-full max-w-md"> <div class="prose w-full max-w-md">
<div> <h4>
</div> description
</h4>
<p class="my-2 break-words text-sm">
short description
</p>
<div> <div>
<div class="badge badge-secondary mr-2"> <div class="badge badge-secondary mr-2">
svelte svelte
@ -220,15 +224,8 @@ exports[`Repo/Details No Description smoke-test 1`] = `
</div> </div>
</div> </div>
<div> <div>
<h4> <div>
git server </div>
</h4>
<a href="github.com/example/example"
target="_blank"
class="link link-primary my-2 break-words"
>
github.com/example/example
</a>
</div> </div>
<div> <div>
<h4> <h4>
@ -297,14 +294,10 @@ exports[`Repo/Details No Description smoke-test 1`] = `
</div> </div>
`; `;
exports[`Repo/Details No Git Server smoke-test 1`] = ` exports[`Repo/Details No Description smoke-test 1`] = `
<div class="prose w-full max-w-md"> <div class="prose w-full max-w-md">
<h4> <div>
description </div>
</h4>
<p class="my-2 break-words text-sm">
short description
</p>
<div> <div>
<div class="badge badge-secondary mr-2"> <div class="badge badge-secondary mr-2">
svelte svelte
@ -320,8 +313,15 @@ exports[`Repo/Details No Git Server smoke-test 1`] = `
</div> </div>
</div> </div>
<div> <div>
<div> <h4>
</div> clone
</h4>
<a href="github.com/example/example"
target="_blank"
class="link link-primary my-2 break-words"
>
github.com/example/example
</a>
</div> </div>
<div> <div>
<h4> <h4>
@ -414,7 +414,7 @@ exports[`Repo/Details No Maintainers or Relays smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -458,7 +458,7 @@ exports[`Repo/Details No Maintainers smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -508,7 +508,7 @@ exports[`Repo/Details No Name or Description smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -608,7 +608,7 @@ exports[`Repo/Details No Relays smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -686,7 +686,7 @@ exports[`Repo/Details No Tags smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -786,7 +786,7 @@ exports[`Repo/Details One Maintainer's Profile Has No displayName or Name smoke-
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -882,7 +882,7 @@ exports[`Repo/Details One Maintainer's Profile Not Loaded smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -979,7 +979,7 @@ exports[`Repo/Details One Maintainer's Profile Only Has displayName But No Name
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"
@ -1079,7 +1079,7 @@ exports[`Repo/Details Short Details smoke-test 1`] = `
</div> </div>
<div> <div>
<h4> <h4>
git server clone
</h4> </h4>
<a href="github.com/example/example" <a href="github.com/example/example"
target="_blank" target="_blank"

22
src/lib/components/RepoSummaryCard.svelte

@ -1,22 +1,8 @@
<script lang="ts" context="module">
export interface Args {
name: string
description: string
repo_id: string
loading?: boolean
created_at: number
}
export const defaults: Args = {
name: '',
repo_id: '',
description: '',
loading: false,
created_at: 0,
}
</script>
<script lang="ts"> <script lang="ts">
export let { name, description, repo_id: repo_id, loading } = defaults import { summary_defaults } from './repo/type'
export let { name, description, repo_id, maintainers, loading } =
summary_defaults
let short_name: string let short_name: string
$: { $: {
if (name.length > 45) short_name = name.slice(0, 45) + '...' if (name.length > 45) short_name = name.slice(0, 45) + '...'

7
src/lib/components/ReposSummaryList.svelte

@ -1,10 +1,9 @@
<script lang="ts"> <script lang="ts">
import RepoSummaryCard, { import type { RepoSummary } from './repo/type'
type Args as RepoSummaryCardArgs, import RepoSummaryCard from '$lib/components/RepoSummaryCard.svelte'
} from '$lib/components/RepoSummaryCard.svelte'
export let title: string = '' export let title: string = ''
export let repos: RepoSummaryCardArgs[] = [] export let repos: RepoSummary[] = []
export let loading: boolean = false export let loading: boolean = false
</script> </script>

2
src/lib/components/repo/RepoDetails.stories.svelte

@ -27,7 +27,7 @@
<Story name="No Tags" args={vectors.NoTags} /> <Story name="No Tags" args={vectors.NoTags} />
<Story name="No Git Server" args={vectors.NoGitServer} /> <Story name="No Clone" args={vectors.NoGitServer} />
<Story name="No Maintainers" args={vectors.NoMaintainers} /> <Story name="No Maintainers" args={vectors.NoMaintainers} />

10
src/lib/components/repo/RepoDetails.svelte

@ -6,7 +6,7 @@
repo_id, repo_id,
name, name,
description, description,
git_server, clone,
tags, tags,
maintainers, maintainers,
relays, relays,
@ -41,16 +41,16 @@
{#if loading} {#if loading}
<div class="skeleton my-3 h-5 w-20"></div> <div class="skeleton my-3 h-5 w-20"></div>
<div class="badge skeleton my-2 block w-60"></div> <div class="badge skeleton my-2 block w-60"></div>
{:else if git_server.length == 0} {:else if clone.length == 0}
<div /> <div />
{:else} {:else}
<h4>git server</h4> <h4>clone</h4>
<a <a
href={git_server} href={clone}
target="_blank" target="_blank"
class="link link-primary my-2 break-words" class="link link-primary my-2 break-words"
> >
{git_server} {clone}
</a> </a>
{/if} {/if}
</div> </div>

3
src/lib/components/repo/RepoHeader.svelte

@ -4,9 +4,10 @@
export let { export let {
repo_id, repo_id,
unique_commit,
name, name,
description, description,
git_server, clone,
tags, tags,
maintainers, maintainers,
relays, relays,

25
src/lib/components/repo/type.ts

@ -1,10 +1,11 @@
import type { User } from '../users/type' import { defaults as user_defaults, type User } from '../users/type'
export interface Repo { export interface Repo {
repo_id: string repo_id: string
unique_commit: string | undefined
name: string name: string
description: string description: string
git_server: string clone: string
tags: string[] tags: string[]
maintainers: User[] maintainers: User[]
relays: string[] relays: string[]
@ -12,11 +13,29 @@ export interface Repo {
} }
export const defaults: Repo = { export const defaults: Repo = {
repo_id: '', repo_id: '',
unique_commit: '',
name: '', name: '',
description: '', description: '',
git_server: '', clone: '',
tags: [], tags: [],
maintainers: [], maintainers: [],
relays: [], relays: [],
loading: true, loading: true,
} }
export interface RepoSummary {
name: string
description: string
repo_id: string
maintainers: User[]
loading?: boolean
created_at: number
}
export const summary_defaults: RepoSummary = {
name: '',
repo_id: '',
description: '',
maintainers: [{ ...user_defaults }],
loading: false,
created_at: 0,
}

14
src/lib/components/repo/vectors.ts

@ -1,28 +1,28 @@
import type { Args as SummaryCardArgs } from '../RepoSummaryCard.svelte'
import { UserVectors, withName } from '../users/vectors' import { UserVectors, withName } from '../users/vectors'
import type { Repo } from './type' import type { Repo, RepoSummary } from './type'
export const RepoSummaryCardArgsVectors = { export const RepoSummaryCardArgsVectors = {
Short: { Short: {
name: 'Short Name', name: 'Short Name',
description: 'short description', description: 'short description',
} as SummaryCardArgs, } as RepoSummary,
Long: { Long: {
name: 'Long Name that goes on and on and on and on and on and on and on and on and on', name: 'Long Name that goes on and on and on and on and on and on and on and on and on',
description: description:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis quis nisl eget turpis congue molestie. Nulla vitae purus nec augue accumsan facilisis sed sed ligula. Vestibulum sed risus lacinia risus lacinia molestie. Ut lorem quam, consequat eget tempus in, rhoncus vel nunc. Duis efficitur a leo vel sodales. Nam id fermentum lacus. Etiam nec placerat velit. Praesent ac consectetur est. Aenean iaculis commodo enim.', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis quis nisl eget turpis congue molestie. Nulla vitae purus nec augue accumsan facilisis sed sed ligula. Vestibulum sed risus lacinia risus lacinia molestie. Ut lorem quam, consequat eget tempus in, rhoncus vel nunc. Duis efficitur a leo vel sodales. Nam id fermentum lacus. Etiam nec placerat velit. Praesent ac consectetur est. Aenean iaculis commodo enim.',
} as SummaryCardArgs, } as RepoSummary,
LongNoSpaces: { LongNoSpaces: {
name: 'LongNameLongNameLongNameLongNameLongNameLongNameLongNameLongName', name: 'LongNameLongNameLongNameLongNameLongNameLongNameLongNameLongName',
description: description:
'LoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsum>', 'LoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsumLoremipsum>',
} as SummaryCardArgs, } as RepoSummary,
} }
const base: Repo = { const base: Repo = {
repo_id: '9ee507fc4357d7ee16a5d8901bedcd103f23c17d', repo_id: '9ee507fc4357d7ee16a5d8901bedcd103f23c17d',
unique_commit: '9ee507fc4357d7ee16a5d8901bedcd103f23c17d',
name: 'Short Name', name: 'Short Name',
description: 'short description', description: 'short description',
git_server: 'github.com/example/example', clone: 'github.com/example/example',
tags: ['svelte', 'nostr', 'code-collaboration', 'git'], tags: ['svelte', 'nostr', 'code-collaboration', 'git'],
relays: ['relay.damus.io', 'relay.snort.social', 'relayable.org'], relays: ['relay.damus.io', 'relay.snort.social', 'relayable.org'],
maintainers: [ maintainers: [
@ -50,7 +50,7 @@ export const RepoDetailsArgsVectors = {
NoNameOrDescription: { ...base, name: '', description: '' } as Repo, NoNameOrDescription: { ...base, name: '', description: '' } as Repo,
NoDescription: { ...base, description: '' } as Repo, NoDescription: { ...base, description: '' } as Repo,
NoTags: { ...base, tags: [] } as Repo, NoTags: { ...base, tags: [] } as Repo,
NoGitServer: { ...base, git_server: '' } as Repo, NoGitServer: { ...base, clone: '' } as Repo,
MaintainersOneProfileNotLoaded: { MaintainersOneProfileNotLoaded: {
...base, ...base,
maintainers: [ maintainers: [

3
src/lib/stores/repo.ts

@ -48,9 +48,10 @@ export const ensureSelectedRepo = async (repo_id: string): Promise<Repo> => {
selected_repo.set({ selected_repo.set({
loading: false, loading: false,
repo_id: event.replaceableDTag(), repo_id: event.replaceableDTag(),
unique_commit: event.getMatchingTags('r'),
name: event.tagValue('name') || '', name: event.tagValue('name') || '',
description: event.tagValue('description') || '', description: event.tagValue('description') || '',
git_server: event.tagValue('git-server') || '', clone: event.tagValue('clone') || '',
tags: event.getMatchingTags('t') || [], tags: event.getMatchingTags('t') || [],
maintainers: event.getMatchingTags('p').map( maintainers: event.getMatchingTags('p').map(
(t: string[]) => (t: string[]) =>

5
src/lib/wrappers/ReposRecent.svelte

@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import type { Args } from '$lib/components/RepoSummaryCard.svelte'
import ReposSummaryList from '$lib/components/ReposSummaryList.svelte' import ReposSummaryList from '$lib/components/ReposSummaryList.svelte'
import type { RepoSummary } from '$lib/components/repo/type'
import { repo_kind } from '$lib/kinds' import { repo_kind } from '$lib/kinds'
import { ndk } from '$lib/stores/ndk' import { ndk } from '$lib/stores/ndk'
import type { NDKEvent } from '@nostr-dev-kit/ndk' import type { NDKEvent } from '@nostr-dev-kit/ndk'
@ -8,7 +8,7 @@
export let limit: number = 10 export let limit: number = 10
let repos: Args[] = [] let repos: RepoSummary[] = []
let loading: boolean = true let loading: boolean = true
let sub = ndk.subscribe({ let sub = ndk.subscribe({
kinds: [repo_kind], kinds: [repo_kind],
@ -37,6 +37,7 @@
name: event.tagValue('name') || '', name: event.tagValue('name') || '',
description: event.tagValue('description') || '', description: event.tagValue('description') || '',
repo_id: event.replaceableDTag(), repo_id: event.replaceableDTag(),
maintainers: [],
created_at: event.created_at || 0, created_at: event.created_at || 0,
}, },
] ]

Loading…
Cancel
Save