nostr feed

4 files changed, 54 insertions, 4 deletions

diff --git a/src/routes/(app)/feed/+page.svelte b/src/routes/(app)/feed/+page.svelte
new file mode 100644
index 00000000..196763f6
--- /dev/null
+++ b/src/routes/(app)/feed/+page.svelte
@@ -0,0 +1,49 @@
+<script>
+	import { fade } from 'svelte/transition';
+	import { Avatar, Icon } from '$comp';
+	import { format, parseISO } from 'date-fns';
+	import { t } from '$lib/translations';
+	import { events } from '$lib/store';
+	import VirtualScroll from 'svelte-virtual-scroll-list';
+	import { browser } from '$app/environment';
+	import runners from '$lib/runners';
+
+	export let data;
+	let { user } = data;
+	let runner = () => runners[Math.floor(Math.random() * runners.length)];
+
+	$: length = $events?.q?.length;
+	$: sorted = Object.values($events)
+		.filter((ev) => ev?.pubkey)
+		.sort((a, b) => b.seen - a.seen);
+</script>
+
+<div class="mt-24 mb-20">
+	<h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold mb-10">Nostr</h1>
+
+	<div class="container w-full mx-auto text-lg px-4 max-w-2xl space-y-5">
+		<div class="vs">
+			{#if browser}
+				<VirtualScroll data={sorted} key="id" let:data pageMode={true}>
+					<div class="grid grid-cols-3 border-b pb-5" :key={data.id} use:fade>
+						<div class="my-auto text-secondary">
+							<div class="flex">
+								<div class="my-auto">
+									<Avatar size={20} src={`/api/public/runners/${runner()}`} />
+								</div>
+								<div class="my-auto ml-1">
+									{data.pubkey.substr(0, 6)}<br />
+									<span class="text-sm">{format(new Date(data.seen * 1000), 'h:mm aaa')}</span>
+								</div>
+							</div>
+						</div>
+
+						<div class="my-auto col-span-2">
+							<div class="text-secondary break-words">{data.content}</div>
+						</div>
+					</div>
+				</VirtualScroll>
+			{/if}
+		</div>
+	</div>
+</div>
diff --git a/src/routes/(static)/+layout.svelte b/src/routes/(static)/+layout.svelte
index 2eb47149..a7a1ab22 100644
--- a/src/routes/(static)/+layout.svelte
+++ b/src/routes/(static)/+layout.svelte
@@ -1,3 +1,3 @@
 <main class="container flex px-10 md:px-40 mx-auto">
-<slot />
+	<slot />
 </main>
diff --git a/src/routes/(static)/docs/+page.svelte b/src/routes/(static)/docs/+page.svelte
index 5361c87e..0e11decb 100644
--- a/src/routes/(static)/docs/+page.svelte
+++ b/src/routes/(static)/docs/+page.svelte
@@ -1,5 +1,6 @@
 <h1>API Examples</h1>
-<pre><code class="whitespace-pre-wrap">{`
+<pre><code class="whitespace-pre-wrap"
+		>{`
 api="https://coinos.io/api"
 json="Content-Type: application/json"
 
@@ -71,4 +72,5 @@ fee=$(echo $tx | jq -r .tx.fee)
 
 curl -s "$api/bitcoin/send" -H "$json" -H "$auth" -d '{"address": "bc1qqc9azhdjjpdxenrndt8cw4tw9del5pyrjn0wln", "tx": { "hex": "'$hex'", "fee": "'$fee'" }}' | jq -r '{ amount, fee, balance: (.account.balance)}'
 echo ""
-`}</code></pre>
+`}</code
+	></pre>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index bf191b7f..2db2854a 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -17,7 +17,6 @@
 	export let data;
 	let { user } = data;
 	let { locations } = data;
-	console.log('LOCATIONS', locations);
 
 	let howItWorks;
 	let faq;