menu buttons

4 files changed, 48 insertions, 31 deletions

diff --git a/src/routes/(app)/[username]/+page.svelte b/src/routes/(app)/[username]/+page.svelte
index 94440ef7..35f16dc9 100644
--- a/src/routes/(app)/[username]/+page.svelte
+++ b/src/routes/(app)/[username]/+page.svelte
@@ -6,7 +6,7 @@
 	import { t } from '$lib/translations';
 	export let data;
 
-	let { subject } = data;
+	let { user, subject } = data;
 
 	let lightningAddress = `${data?.username}@coinos.io`;
 
@@ -37,26 +37,28 @@
 </script>
 
 <div class="container px-4 flex flex-wrap">
-	<div class="p-10 pt-20">
+	<div class="w-full pt-20 space-y-5">
 		<h1 class="text-3xl font-bold">{subject.username}</h1>
 
 		<p class="text-secondary w-64 mb-4">
 			{subject.address && subject.address !== 'null' ? subject.address : ''}
 		</p>
 
-		<div class="menu">
-			<button on:click={() => (followed = !followed)}>
-				{$t('user.' + (followed ? 'following' : 'follow'))}
-			</button>
-
-			<a href={`/${subject.username}/receive`}>
-				<button> Pay </button>
-			</a>
+		{#if user?.username !== subject.username}
+      <a href={`/${subject.username}/receive`}>
+        <button
+     class="w-full md:w-40 mt-2 text-black hover:bg-black hover:text-white font-semibold py-3 px-5 rounded-full border border-black"
+     >
+     Pay
+        </button>
+      </a>
 
-			<a href={`/${subject.username}/request`}>
-				<button>Request invoice</button>
-			</a>
-		</div>
+      <a href={`/${subject.username}/request`}>
+        <button class="w-full md:w-40 mt-2 bg-black text-white font-semibold py-3 px-5 rounded-full"
+                >Request invoice</button
+              >
+      </a>
+		{/if}
 	</div>
 
 	<div class="space-y-5 md:mt-20 mx-auto w-[350px]">
@@ -82,9 +84,3 @@
 		</p>
 	</div>
 </div>
-
-<style>
-	.menu button {
-		@apply w-full mt-2 bg-primary text-black hover:bg-black hover:text-white font-semibold py-5 px-7 rounded-2xl;
-	}
-</style>
diff --git a/src/routes/(app)/[username]/request/+page.server.js b/src/routes/(app)/[username]/request/+page.server.js
index 443bc978..a1d156e5 100644
--- a/src/routes/(app)/[username]/request/+page.server.js
+++ b/src/routes/(app)/[username]/request/+page.server.js
@@ -1,3 +1,4 @@
+import { redirect } from "@sveltejs/kit";
 import { auth, post } from '$lib/utils';
 
 export let load = ({ params }) => {
@@ -5,8 +6,9 @@ export let load = ({ params }) => {
 } 
 
 export const actions = {
-	default: async ({ cookies, request }) => {
+	default: async ({ cookies, request, url }) => {
 		let form = Object.fromEntries(await request.formData());
-		return { request: await post('/requests', form, auth(cookies)) };
+		await post('/requests', form, auth(cookies));
+    throw redirect(307, url.href + '/sent');
 	}
 };
diff --git a/src/routes/(app)/[username]/request/+page.svelte b/src/routes/(app)/[username]/request/+page.svelte
index 51c92877..32b03eaa 100644
--- a/src/routes/(app)/[username]/request/+page.svelte
+++ b/src/routes/(app)/[username]/request/+page.svelte
@@ -14,19 +14,16 @@
 </button>
 
 <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold mb-8">Request an invoice</h1>
-{#if form}
-  {JSON.stringify(form)}
-{/if}
 
-<div class="container max-w-lg px-4">
-	<form method="POST" use:enhance>
-    <input name="requester_id" value={user.id} />
-    <input name="recipient" value={subject.username} />
+<div class="container max-w-lg px-4 flex mx-auto">
+  <form method="POST" use:enhance>
+    <input type="hidden" name="requester_id" value={user.id} />
+    <input type="hidden" name="recipient" value={subject.username} />
 
-		<textarea name="note" placeholder="Note" class="w-full p-4 border rounded-xl h-48" />
+		<textarea name="memo" placeholder="(Optional) message. You might use this field to identify yourself or your order" class="w-full p-4 border rounded-xl h-48" />
 
 		<button type="submit" class="bg-black text-white border rounded-full px-6 py-2 font-bold">
-			Submit
+		Go	
 		</button>
 	</form>
 </div>
diff --git a/src/routes/(app)/[username]/request/sent/+page.svelte b/src/routes/(app)/[username]/request/sent/+page.svelte
new file mode 100644
index 00000000..47d930bf
--- /dev/null
+++ b/src/routes/(app)/[username]/request/sent/+page.svelte
@@ -0,0 +1,22 @@
+<script>
+	import { scale } from 'svelte/transition';
+	import { Icon } from '$comp';
+
+  export let data;
+  let { subject } = data;
+</script>
+
+<div class="container px-4 text-center mx-auto">
+	<div class="flex w-full py-20 max-w-[200px] mx-auto" in:scale={{ start: 0.5 }}>
+		<Icon icon="check" style="mx-auto" />
+	</div>
+	<h1 class="text-3xl md:text-4xl font-bold mb-6">Request sent</h1>
+
+  <a href={`/${subject.username}`}>
+	<button
+		class="bg-black text-white rounded-2xl w-20 py-3 font-bold hover:opacity-80"
+	>
+		Done
+	</button>
+    </a>
+</div>