Merge remote-tracking branch 'origin/addressable-events'

# Conflicts:
#	src/lib/components/Comment.svelte
#	src/routes/+page.svelte
#	src/routes/q/[id]/+page.svelte

src/lib/components/Comment.svelte

@@ -1,5 +1,5 @@
 <script>
-	let { event } = $props();
+	let { event, showReactions } = $props();
 
 	import { onMount } from 'svelte';
 	import { NDKEvent } from '@nostr-dev-kit/ndk';
@@ -10,6 +10,9 @@
 	import 'carta-md/default.css'; /* Default theme */
 	import DOMPurify from 'dompurify';
 
+    console.log("show reactions", showReactions)
+
+
 	// Create a new instance of Carta (you might also want to add a sanitizer if you're processing user input)
 	let carta = new Carta({
 		sanitizer: DOMPurify.sanitize
@@ -61,7 +64,7 @@
 			<span>👍 {$reactions.length}</span>
 			<span class="thanks">Danke für deinen Vote!</span>
             <!-- <button onclick={() => deleteVote()} class="btn">Vote zurückziehen</button> -->
-		{:else}
+		{:else if showReactions === "true"}
 			<button onclick={() => sendReaction()} class="like">👍</button>
 			<span>{$reactions.length}</span>
 		{/if}

src/lib/index.js

@@ -32,6 +32,9 @@ export async function login() {
             userStore.set(signedUser)
 
             window.localStorage.setItem('nostrPrivateKey', JSON.stringify(privateKey.privateKey));
+            ndk.signer = signer;
+            console.log("ndk signer", ndk)
+            ndkStore.set(ndk)
         }
     }
 }

src/routes/+page.svelte

@@ -20,6 +20,7 @@
 	let timer = 0;
 	let votingEnabled = false;
 	let sessionId = '';
+	let event = writable();
 
 	async function joinSession() {
 		console.log('join ' + sessionId);
@@ -35,14 +36,14 @@
 	}
 	async function postQuestion() {
 		questionShortId = 10000000 + Math.floor(Math.random() * 90000000);
-		const event = new NDKEvent($ndk, {
-			kind: 1342,
+		$event = new NDKEvent($ndk, {
+			kind: 30342,
 			content: $question,
 			tags: [['d', questionShortId + '']]
 		});
-		await event.publish();
-		console.log("event id", event.id)
-		$questionId = event.id;
+		await $event.publishReplaceable();
+		console.log("event id", $event.id)
+		$questionId = `${$event.kind}:${$event.pubkey}:${$event.dTag}`;
 		$qrCodeUrl = await QRCode.toDataURL(`${window.location.origin}/q/${$questionId}`, {
 			width: 800,
 		});
@@ -59,7 +60,6 @@
 		}, 1000);
 	}
 
-
 	$effect(() => {
 		if ($ndkReady) {
 			if ($ndk.activeUser) {

src/routes/q/[id]/+page.svelte

@@ -29,6 +29,9 @@
 
 	let comment = writable('');
 	let comments = writable([]);
+	let question = writable()
+	const [kind, pubkey, d] = data.id.split(":")
+	const showReactions = writable(false);
 
 	$effect(() => {
 		if ($ndkReady) {
@@ -38,17 +41,39 @@
 				$comments = [...$comments, event];
 				console.log(`${event.content}`);
 			});
+
+			const questionSub = $ndk.subscribe({ kinds: [Number(kind)],  authors: [pubkey], "#d": [d]		 });
+			questionSub.on('event', (event) => {
+				$question = event;
+				if ($question?.tags.find(t => t[0] === "reactions")[1] === "true") {
+				console.log("reactions enabled")
+				$showReactions = "true"
+			}
+
+							});
+
 		}
 	});
+
+	async function startReactions(event) {
+		console.log("start reactions", event)
+		let updatedEvent = new NDKEvent($ndk, event )
+		console.log("updated event", updatedEvent)
+		updatedEvent.tags.push(['reactions', "true"])
+		await updatedEvent.publishReplaceable();
+		console.log("sent!", updatedEvent)
+		$showReactions = "true"
+	}
 </script>
 
+
 <div class="main-layout mx-auto flex w-3/4 flex-col items-center justify-center">
-	{#key $ndkReady}
-		{#await $ndk.fetchEvent(data.id) then question}
-			{#if question}
+			{#if $question}
+			<button class="btn" onclick={() => startReactions($question)}>Start Reaktionen</button>
+
 				<div class="question mb-4 w-full rounded border p-4 text-xl">
 					<h2 class="text-xl font-bold">Frage / Thema:</h2>
-					<Markdown {carta} value={question.content} />
+					<Markdown {carta} value={$question.content} />
 				</div>
 
 				<div class="mb-2 flex w-full flex-col items-center justify-center gap-2">
@@ -59,15 +84,13 @@
 			{:else}
 				<p>Loading...</p>
 			{/if}
-		{:catch error}
-			<p>Error fetching question: {error.message}</p>
-		{/await}
-	{/key}
 
 	<div class="mx-auto flex w-full flex-col items-center justify-center gap-5">
+		{#key $showReactions}
 		{#each $comments.sort((a, b) => a.created_at - b.created_at).reverse() as event}
-			<Comment {event} />
+			<Comment event={event} showReactions={$showReactions}  />
 		{/each}
+		{/key}
 	</div>
 </div>