unique values

This commit is contained in:
@s.roertgen 2025-04-30 12:48:57 +02:00
parent 711f2a8e26
commit 4c17428efc

View file

@ -15,7 +15,7 @@
sanitizer: DOMPurify.sanitize
});
function submitComment() {
if(!$comment) {
if (!$comment) {
return;
}
const commentEvent = new NDKEvent($ndk, {
@ -27,10 +27,31 @@
comment.set('');
}
/**
* Filters an array of objects to keep only unique objects based on their id property
* @param {Array} array - The array of objects to filter
* @returns {Array} - A new array containing only unique objects by id
*/
function getUniqueById(array) {
// Create a Map to track unique objects by their id
const uniqueMap = new Map();
// Loop through the array and add each object to the map with its id as the key
// This automatically overrides any previous entries with the same id
array.forEach((item) => {
if (item && item.id !== undefined) {
uniqueMap.set(item.id, item);
}
});
// Convert the Map values back to an array
return Array.from(uniqueMap.values());
}
let comment = writable('');
let comments = writable([]);
let question = writable()
const [kind, pubkey, d] = data.id.split(":")
let question = writable();
const [kind, pubkey, d] = data.id.split(':');
const showReactions = writable(false);
$effect(() => {
@ -39,83 +60,83 @@
const sub = $ndk.subscribe({ kinds: [2222], '#E': [data.id] });
sub.on('event', (event) => {
console.log(event);
$comments = Array.from(new Set([...$comments, event]));
const unique = getUniqueById([...$comments, event]);
$comments = [...unique];
console.log(`${event.content}`);
});
const questionSub = $ndk.subscribe({ kinds: [Number(kind)], authors: [pubkey], "#d": [d] });
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"
}
});
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"])
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"
console.log('sent!', updatedEvent);
$showReactions = 'true';
}
</script>
<div class="main-layout mx-auto flex w-3/4 flex-col items-center justify-center">
{#if $question}
{#if $question.pubkey === $user.pubkey && $showReactions === false}
<button class="btn btn-primary mb-4" onclick={() => startReactions($question)}>Reaktionen/Voting aktivieren</button>
{/if}
<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} />
</div>
{#if $question}
{#if $question.pubkey === $user.pubkey && $showReactions === false}
<button class="btn btn-primary mb-4" onclick={() => startReactions($question)}
>Reaktionen/Voting aktivieren</button
>
{/if}
<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} />
</div>
<div class="mb-2 flex w-full flex-col items-center justify-center gap-2">
<h1 class="text-xl font-bold pt-15">Meine Idee hinzufügen</h1>
<MarkdownEditor bind:value={$comment} {carta} />
<button class="btn btn-primary mb-10 mt-5" onclick={() => submitComment()}>Hinzufügen</button>
</div>
{:else}
<p>Loading...</p>
{/if}
<div class="mb-2 flex w-full flex-col items-center justify-center gap-2">
<h1 class="pt-15 text-xl font-bold">Meine Idee hinzufügen</h1>
<MarkdownEditor bind:value={$comment} {carta} />
<button class="btn btn-primary mt-5 mb-10" onclick={() => submitComment()}>Hinzufügen</button>
</div>
{:else}
<p>Loading...</p>
{/if}
<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={event} showReactions={$showReactions} />
{/each}
{#each $comments.sort((a, b) => a.created_at - b.created_at).reverse() as event}
<Comment {event} showReactions={$showReactions} />
{/each}
{/key}
</div>
</div>
<style>
:global(.carta-input) {
height: 100px !important;
}
:global(.carta-editor) {
width: 100% !important;
}
.main-layout {
padding: 30px;
margin: auto;
width: 100vw;
max-width: 700px;
display: flex;
justify-content: center;
flex-direction: column;
gap: 5%;
height: 100%;
}
.question {
border-radius: 20px;
border-color: #ccc;
}
:global(.carta-input) {
height: 100px !important;
}
:global(.carta-editor) {
width: 100% !important;
}
.main-layout {
padding: 30px;
margin: auto;
width: 100vw;
max-width: 700px;
display: flex;
justify-content: center;
flex-direction: column;
gap: 5%;
height: 100%;
}
.question {
border-radius: 20px;
border-color: #ccc;
}
</style>