1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
|
<script lang="ts">
import { ndk } from '$lib/ndk';
import { wikiKind } from '$lib/consts';
import type { NDKEvent } from '@nostr-dev-kit/ndk';
import { onMount } from 'svelte';
import type { Tab } from '$lib/types';
import { tabBehaviour } from '$lib/state';
import { parsePlainText } from '$lib/articleParser';
import { next } from '$lib/utils';
export let query: string;
export let replaceSelf: (tab: Tab) => void;
export let createChild: (tab: Tab) => void;
let results: NDKEvent[] = [];
let tried = 0;
async function search(query: string) {
results = [];
const filter = { kinds: [wikiKind], '#d': [query] };
const events = await $ndk.fetchEvents(filter);
if (!events) {
tried = 1;
results = [];
return;
}
tried = 1;
results = Array.from(events);
}
onMount(async () => {
await search(query);
});
</script>
<article class="font-sans mx-auto p-2 lg:max-w-4xl">
<div class="prose">
<h1 class="mb-0">{query}</h1>
<p class="mt-0 mb-0">
There are {#if tried == 1}{results.length}{:else}...{/if} articles with the name "{query}"
</p>
</div>
{#each results as result}
<!-- svelte-ignore a11y-click-events-have-key-events a11y-no-static-element-interactions -->
<div
on:click={() => {
$tabBehaviour == 'child'
? createChild({ id: next(), type: 'article', data: result.id })
: replaceSelf({ id: next(), type: 'article', data: result.id });
}}
class="cursor-pointer px-4 py-5 bg-white border border-gray-300 hover:bg-slate-50 rounded-lg mt-2 min-h-[48px]"
>
<h1>
{result.tags.find((e) => e[0] == 'title')?.[0] &&
result.tags.find((e) => e[0] == 'title')?.[1]
? result.tags.find((e) => e[0] == 'title')?.[1]
: result.tags.find((e) => e[0] == 'd')?.[1]}
</h1>
<p class="text-xs">
<!-- implement published at? -->
<!-- {#if result.tags.find((e) => e[0] == "published_at")}
on {formatDate(result.tags.find((e) => e[0] == "published_at")[1])}
{/if} -->
{#await result.author?.fetchProfile()}
by <span class="text-gray-600 font-[600]">...</span>
{:then result}
by {result !== null && JSON.parse(Array.from(result)[0]?.content)?.name}
{/await}
</p>
<p class="text-xs">
{#if result.tags.find((e) => e[0] == 'summary')?.[0] && result.tags.find((e) => e[0] == 'summary')?.[1]}
{result.tags
.find((e) => e[0] == 'summary')?.[1]
.slice(
0,
192
)}{#if String(result.tags.find((e) => e[0] == 'summary')?.[1])?.length > 192}...{/if}
{:else}
{result.content.length <= 192
? parsePlainText(result.content.slice(0, 189))
: parsePlainText(result.content.slice(0, 189)) + '...'}
{/if}
</p>
</div>
{/each}
{#if tried == 1}
<div class="px-4 py-5 bg-white border border-gray-300 rounded-lg mt-2 min-h-[48px]">
<p class="mb-2">
{results.length < 1 ? "Can't find this article" : "Didn't find what you are looking for?"}
</p>
<button
on:click={() => {
$tabBehaviour == 'child'
? createChild({ id: next(), type: 'editor', data: { title: query } })
: replaceSelf({ id: next(), type: 'editor', data: { title: query } });
}}
class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
>
Create this article!
</button>
<button
on:click={() =>
$tabBehaviour == 'replace'
? replaceSelf({ id: next(), type: 'settings' })
: createChild({ id: next(), type: 'settings' })}
class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
>
Add more relays
</button>
</div>
{:else}
<div class="px-4 py-5 rounded-lg mt-2 min-h-[48px]">Loading...</div>
{/if}
</article>
|
