show public url and qr on settings page

3 files changed, 16 insertions, 2 deletions

diff --git a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
index 0ab11b32..8c67a0f1 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
@@ -3,6 +3,7 @@
 	import { colorTheme, avatar, banner } from '$lib/store';
 	import { Icon } from '$comp';
 	import { t } from '$lib/translations';
+	import { page } from '$app/stores';
 
 	export let user;
 	let { id } = user;
@@ -60,6 +61,9 @@
 	};
 
 	if (!user.display) user.display = user.username;
+
+	$: url = `${$page.url.host}/${user.username}`;
+	$: full = `${$page.url.protocol}//${url}`;
 </script>
 
 <div class="relative">
@@ -72,6 +76,12 @@
 	>
 		@coinos.io
 	</div>
+	<div class="my-2 flex gap-2">
+		<div class="ml-auto text-gray-400">{url}</div>
+		<a href={`/qr/${encodeURIComponent(full)}`}>
+			<Icon icon="qr" style="invert" />
+		</a>
+	</div>
 </div>
 
 <div>
diff --git a/src/routes/(app)/qr/[text]/+page.server.js b/src/routes/(app)/qr/[text]/+page.server.js
index 9dd2b24d..3ab0725f 100644
--- a/src/routes/(app)/qr/[text]/+page.server.js
+++ b/src/routes/(app)/qr/[text]/+page.server.js
@@ -4,5 +4,5 @@ export async function load({ params }) {
 	let { text } = params;
 	let src = Qr.drawImg(text, { size: 600 });
 
-	return { src };
+	return { src, text };
 }
diff --git a/src/routes/(app)/qr/[text]/+page.svelte b/src/routes/(app)/qr/[text]/+page.svelte
index 555f919c..d903da0e 100644
--- a/src/routes/(app)/qr/[text]/+page.svelte
+++ b/src/routes/(app)/qr/[text]/+page.svelte
@@ -1,7 +1,11 @@
 <script>
 	import { Qr } from '$comp';
 	export let data;
-	let { src } = data;
+	let { src, text } = data;
 </script>
 
 <Qr {src} />
+
+<div class="text-center w-full font-bold">
+  {text}
+</div>