add message field to user profile pages

4 files changed, 52 insertions, 7 deletions

diff --git a/src/routes/(app)/[username]/+layout.server.js b/src/routes/(app)/[username]/+layout.server.js
index a907f7de..f5bf338e 100644
--- a/src/routes/(app)/[username]/+layout.server.js
+++ b/src/routes/(app)/[username]/+layout.server.js
@@ -5,7 +5,7 @@ export let load = async ({ params: { username } }) => {
 	try {
 		return { subject: await get(`/users/${username}`) };
 	} catch (e) {
-		if (username.length === 64) return { subject: { username } };
+		if (username.length === 64) return { subject: { username, pubkey: username } };
 		throw error(500, 'Unable to retrieve user account data');
 	}
 };
diff --git a/src/routes/(app)/[username]/+page.server.js b/src/routes/(app)/[username]/+page.server.js
index 547f754f..442b4eb5 100644
--- a/src/routes/(app)/[username]/+page.server.js
+++ b/src/routes/(app)/[username]/+page.server.js
@@ -2,10 +2,9 @@ import { get } from '$lib/utils';
 import Qr from 'qrcode-base64';
 
 export async function load({ params, parent, url }) {
-	let { user } = await parent();
-	let pubkey;
-	if (user) ({ pubkey } = user);
-	else pubkey = params.username;
+	let { subject } = await parent();
+	let { pubkey } = subject;
+	if (!pubkey) pubkey = params.username;
 
 	let { username } = params;
 	let text = `${encodeURI(username)}@${url.hostname}`;
@@ -18,5 +17,10 @@ export async function load({ params, parent, url }) {
 		console.log(e);
 	}
 
+	events.map((e) => {
+		e.seen = e.created_at;
+		e.user = subject;
+	});
+
 	return { events, src, text };
 }
diff --git a/src/routes/(app)/[username]/+page.svelte b/src/routes/(app)/[username]/+page.svelte
index 837257ef..22e40a9c 100644
--- a/src/routes/(app)/[username]/+page.svelte
+++ b/src/routes/(app)/[username]/+page.svelte
@@ -116,7 +116,7 @@
 				<input
 					name="message"
 					bind:value={message}
-					placeholder="What's on your mind?"
+					placeholder="What's happening?"
 					class="w-full my-5 max-w-lg mx-auto"
 				/>
 			</form>
@@ -126,7 +126,7 @@
 			{#if events.length}
 				<Feed {events} />
 			{:else}
-				<div class="text-center">You haven't posted anything yet</div>
+        <div class="text-center text-2xl mt-20">Nothing here yet. Post your first <a href="https://github.com/nostr-protocol/nostr#nostr---notes-and-other-stuff-transmitted-by-relays" class="underline">nostr</a> note!</div>
 			{/if}
 		</div>
 	</div>
diff --git a/src/routes/(app)/[username]/message/+page.svelte b/src/routes/(app)/[username]/message/+page.svelte
new file mode 100644
index 00000000..c8a57b79
--- /dev/null
+++ b/src/routes/(app)/[username]/message/+page.svelte
@@ -0,0 +1,41 @@
+<script>
+	import { t } from '$lib/translations';
+	import { enhance } from '$app/forms';
+	import { Icon } from '$comp';
+	import { back } from '$lib/utils';
+
+	export let data;
+	export let form;
+
+	let { subject, user } = data;
+</script>
+
+<button class="ml-5 md:ml-20 mt-10 hover:opacity-80" on:click={back}>
+	<Icon icon="arrow-left" style="w-10" />
+</button>
+
+<div class="container max-w-lg px-4 mx-auto mt-10 space-y-5">
+	<h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">
+		{$t('transactions.sendMessage')}
+	</h1>
+
+	<form action="?/create" method="POST" use:enhance class="space-y-5">
+		<input type="hidden" name="requester_id" value={user.id} />
+		<input type="hidden" name="recipient" value={subject.username} />
+
+		<textarea
+			name="memo"
+			placeholder={$t('transactions.sendMessage')}
+			class="w-full p-4 border rounded-xl h-48"
+		/>
+
+		<div class="w-full flex">
+			<button
+				type="submit"
+				class="bg-black text-white border rounded-full px-6 py-2 font-bold mx-auto"
+			>
+				{$t('transactions.submit')}
+			</button>
+		</div>
+	</form>
+</div>