From ea0ce4c4e85b0a6041f19b9c55a002808bd37f29 Mon Sep 17 00:00:00 2001
From: DanConwayDev <DanConwayDev@protonmail.com>
Date: Tue, 27 Feb 2024 15:24:30 +0000
Subject: [PATCH] feat: create new issue

add the basic ability to create a new issue for a repository
---
 src/lib/components/events/Compose.svelte      |  3 +-
 src/lib/wrappers/ComposeIssue.svelte          | 78 +++++++++++++++++++
 src/routes/repo/[repo_id]/+page.svelte        |  3 +
 .../repo/[repo_id]/issues/new/+page.svelte    | 63 +++++++++++++++
 src/routes/repo/[repo_id]/issues/new/+page.ts |  5 ++
 5 files changed, 151 insertions(+), 1 deletion(-)
 create mode 100644 src/lib/wrappers/ComposeIssue.svelte
 create mode 100644 src/routes/repo/[repo_id]/issues/new/+page.svelte
 create mode 100644 src/routes/repo/[repo_id]/issues/new/+page.ts

diff --git a/src/lib/components/events/Compose.svelte b/src/lib/components/events/Compose.svelte
index 9620ee6..3fef282 100644
--- a/src/lib/components/events/Compose.svelte
+++ b/src/lib/components/events/Compose.svelte
@@ -2,6 +2,7 @@
   import { login } from '$lib/stores/users'
 
   export let sendReply: (content: string) => void = () => {}
+  export let placeholder = 'reply...'
   export let submitting = false
   export let logged_in = false
   let submit = () => {
@@ -16,7 +17,7 @@
     disabled={submitting}
     bind:value={content}
     class="textarea textarea-primary w-full"
-    placeholder="reply..."
+    {placeholder}
   ></textarea>
   <div class="flex">
     <div class="flex-auto"></div>
diff --git a/src/lib/wrappers/ComposeIssue.svelte b/src/lib/wrappers/ComposeIssue.svelte
new file mode 100644
index 0000000..4548c8f
--- /dev/null
+++ b/src/lib/wrappers/ComposeIssue.svelte
@@ -0,0 +1,78 @@
+<script lang="ts">
+  import { base_relays, ndk } from '$lib/stores/ndk'
+  import { NDKEvent, NDKRelaySet } from '@nostr-dev-kit/ndk'
+  import { issue_kind, repo_kind } from '$lib/kinds'
+  import { getUserRelays, logged_in_user } from '$lib/stores/users'
+  import Compose from '$lib/components/events/Compose.svelte'
+  import type { RepoEvent } from '$lib/components/repo/type'
+
+  export let repo_event: RepoEvent
+
+  let submitting = false
+  let submitted = false
+  let edit_mode = false
+  $: {
+    edit_mode = !submitted
+  }
+
+  async function sendIssue(content: string) {
+    if (!$logged_in_user) return
+    let event = new NDKEvent(ndk)
+    event.kind = issue_kind
+
+    if (repo_event.unique_commit) {
+      event.tags.push(['r', repo_event.unique_commit])
+    }
+    event.tags.push([
+      'a',
+      `${repo_kind}:${repo_event.maintainers[0].hexpubkey}:${repo_event.identifier}`,
+      repo_event.relays[0] || '',
+      'root',
+    ])
+    repo_event.maintainers.forEach((m) => event.tags.push(['p', m.hexpubkey]))
+    // TODO nip-10 reply chain p tags
+    event.content = content
+    submitting = true
+    let relays = [
+      ...(repo_event.relays.length > 3
+        ? repo_event.relays
+        : [...base_relays].concat(repo_event.relays)),
+    ]
+    try {
+      event.sign()
+    } catch {
+      alert('failed to sign event')
+    }
+    try {
+      let user_relays = await getUserRelays($logged_in_user.hexpubkey)
+      relays = [
+        ...relays,
+        ...(user_relays.ndk_relays
+          ? user_relays.ndk_relays.writeRelayUrls
+          : []),
+      ]
+    } catch {
+      alert('failed to get user relays')
+    }
+    try {
+      let _ = await event.publish(NDKRelaySet.fromRelayUrls(relays, ndk))
+      submitting = false
+      submitted = true
+      setTimeout(() => {
+        submitted = false
+      }, 5000)
+    } catch {}
+  }
+</script>
+
+{#if edit_mode}
+  <Compose
+    sendReply={sendIssue}
+    {submitting}
+    logged_in={!!$logged_in_user}
+    placeholder="title on first line..."
+  />
+{/if}
+{#if submitted}
+  <div>sent!</div>
+{/if}
diff --git a/src/routes/repo/[repo_id]/+page.svelte b/src/routes/repo/[repo_id]/+page.svelte
index ba3fead..e7f4267 100644
--- a/src/routes/repo/[repo_id]/+page.svelte
+++ b/src/routes/repo/[repo_id]/+page.svelte
@@ -133,6 +133,9 @@
             proposals_or_issues={$issue_summaries.summaries}
             loading={$issue_summaries.loading}
           />
+          <a class="btn btn-success my-3" href="/repo/{identifier}/issues/new">
+            create issue
+          </a>
         {/if}
       </div>
       <div class="prose ml-2 hidden w-1/3 md:flex">
diff --git a/src/routes/repo/[repo_id]/issues/new/+page.svelte b/src/routes/repo/[repo_id]/issues/new/+page.svelte
new file mode 100644
index 0000000..ad96894
--- /dev/null
+++ b/src/routes/repo/[repo_id]/issues/new/+page.svelte
@@ -0,0 +1,63 @@
+<script lang="ts">
+  import RepoDetails from '$lib/wrappers/RepoDetails.svelte'
+  import {
+    ensureSelectedRepoCollection,
+    selected_repo_collection,
+    selected_repo_event,
+  } from '$lib/stores/repo'
+  import RepoHeader from '$lib/components/repo/RepoHeader.svelte'
+  import Container from '$lib/components/Container.svelte'
+  import ComposeIssue from '$lib/wrappers/ComposeIssue.svelte'
+
+  export let data: { repo_id: string }
+  let identifier = data.repo_id
+
+  ensureSelectedRepoCollection(identifier)
+  let repo_error = false
+
+  let waited_5_secs = false
+  setTimeout(() => {
+    waited_5_secs = true
+  }, 5000)
+
+  $: {
+    repo_error =
+      !$selected_repo_collection.loading &&
+      waited_5_secs &&
+      $selected_repo_event.name.length === 0
+  }
+</script>
+
+{#if repo_error}
+  <Container>
+    <div role="alert" class="alert alert-error m-auto mt-6 w-full max-w-xs">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        class="h-6 w-6 shrink-0 stroke-current"
+        fill="none"
+        viewBox="0 0 24 24"
+        ><path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
+        /></svg
+      >
+      <span>Error! cannot find repository event</span>
+    </div>
+  </Container>
+{:else}
+  <RepoHeader {...$selected_repo_event} />
+
+  <Container>
+    <div class="mt-2 md:flex">
+      <div class="prose md:mr-2 md:w-2/3">
+        <h4>Create Issue</h4>
+        <ComposeIssue repo_event={$selected_repo_event} />
+      </div>
+      <div class="prose ml-2 hidden w-1/3 md:flex">
+        <RepoDetails repo_id={identifier} />
+      </div>
+    </div>
+  </Container>
+{/if}
diff --git a/src/routes/repo/[repo_id]/issues/new/+page.ts b/src/routes/repo/[repo_id]/issues/new/+page.ts
new file mode 100644
index 0000000..c70bf13
--- /dev/null
+++ b/src/routes/repo/[repo_id]/issues/new/+page.ts
@@ -0,0 +1,5 @@
+export const load = ({ params }: { params: { repo_id: string } }) => {
+  return {
+    repo_id: decodeURIComponent(params.repo_id),
+  }
+}