Add direct messages page

The CSS isn't great right now, but you can go back and forth!  I'll make
it look nice another day.

3 files changed, 30 insertions, 0 deletions

diff --git a/src/routes/(app)/[username]/(profile)/+layout.svelte b/src/routes/(app)/[username]/(profile)/+layout.svelte
index b384344e..2e6657bd 100644
--- a/src/routes/(app)/[username]/(profile)/+layout.svelte
+++ b/src/routes/(app)/[username]/(profile)/+layout.svelte
@@ -140,6 +140,11 @@
           <iconify-icon noobserver icon="ph:pencil-bold" width="32"
           ></iconify-icon>
         </a>
+      {:else}
+        <a href="/dm/{subject.username}" class="btn contents">
+          <iconify-icon noobserver icon="ph:chat-bold" width="32"
+          ></iconify-icon>
+        </a>
       {/if}
       <!-- <a href={`/${subject.pubkey}/notes`}> -->
       <!--   <iconify-icon noobserver icon="ph:note-bold" width="32"></iconify-icon> -->
diff --git a/src/routes/(app)/dm/[recipient]/+page.server.ts b/src/routes/(app)/dm/[recipient]/+page.server.ts
new file mode 100644
index 00000000..e202d8b4
--- /dev/null
+++ b/src/routes/(app)/dm/[recipient]/+page.server.ts
@@ -0,0 +1,5 @@
+export function load({ params }) {
+    return {
+        recipient: params.recipient
+    };
+}
diff --git a/src/routes/(app)/dm/[recipient]/+page.svelte b/src/routes/(app)/dm/[recipient]/+page.svelte
new file mode 100644
index 00000000..fd539d12
--- /dev/null
+++ b/src/routes/(app)/dm/[recipient]/+page.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+ let { data } = $props();
+ import Icon from "$comp/Icon.svelte";
+</script>
+
+
+<div class="container">
+  <a
+    class="hover:opacity-80"
+    data-sveltekit-preload-data="false"
+    href="/{data.recipient}"
+  >
+    <Icon icon="arrow-left" style="w-10" />
+  </a>
+
+  <div class="space-y-2 mx-auto space-y-5 lg:max-w-xl xl:max-w-2xl lg:pl-10 mt-5 lg:mt-0">
+      <h1>Nostr Direct Messages</h1>
+      <p>You are sending messages to {data.recipient}.</p>
+  </div>
+</div>