move to app layout

7 files changed, 0 insertions, 442 deletions

diff --git a/src/routes/invoice/[id]/+layout.server.js b/src/routes/invoice/[id]/+layout.server.js
deleted file mode 100644
index 690deda0..00000000
--- a/src/routes/invoice/[id]/+layout.server.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import Qr from 'qrcode-svg';
-import { get } from '$lib/utils';
-
-export async function load({ params }) {
-	let { id } = params;
-	let invoice = await get(`/invoice?uuid=${id}`);
-	let svg = new Qr({
-		content: invoice.text,
-		join: true,
-		container: 'svg-viewbox'
-	}).svg();
-
-	return { id, invoice, svg };
-}
diff --git a/src/routes/invoice/[id]/+layout.svelte b/src/routes/invoice/[id]/+layout.svelte
deleted file mode 100644
index 4fa864ce..00000000
--- a/src/routes/invoice/[id]/+layout.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<slot />
diff --git a/src/routes/invoice/[id]/+page.server.js b/src/routes/invoice/[id]/+page.server.js
deleted file mode 100644
index 1068f273..00000000
--- a/src/routes/invoice/[id]/+page.server.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import invoice from '$lib/invoice';
-
-export const actions = {
-	default: invoice
-};
diff --git a/src/routes/invoice/[id]/+page.svelte b/src/routes/invoice/[id]/+page.svelte
deleted file mode 100644
index 7a888d5c..00000000
--- a/src/routes/invoice/[id]/+page.svelte
+++ /dev/null
@@ -1,125 +0,0 @@
-<script>
-	import { back, copy, f, get, reverseFormat, s, sats } from '$lib/utils';
-	import { onMount, onDestroy } from 'svelte';
-	import { browser } from '$app/environment';
-	import { invoices, last } from '$lib/store';
-	import { Icon, Heart, Image, Qr } from '$comp';
-	import { goto } from '$app/navigation';
-	import { t } from '$lib/translations';
-	import screenfull from 'screenfull';
-
-	export let data;
-	$: refresh(data);
-	let { invoice, id, user, svg } = data;
-	let {
-		amount,
-		rate,
-		received,
-		prompt,
-		text,
-		tip,
-		user: { username, currency }
-	} = invoice;
-
-	let qr;
-	let tipPercent = 0;
-
-	let refresh = (data) => {
-		({ invoice, id } = data);
-		({
-			amount,
-			rate,
-			received,
-			prompt,
-			text,
-			tip,
-			user: { username, currency }
-		} = invoice);
-
-		tipPercent = (tip / amount) * 100;
-	};
-
-	$invoices[id] = { amount, id, rate, received, text, tip, username };
-	$: browser &&
-		$invoices[id]?.received >= $invoices[id]?.amount &&
-		goto(($invoices[id].memo === 'launch' && '/launch/purchase') || `/invoice/${id}/paid`);
-
-	$: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
-	$: tipAmount = ((tip * rate) / sats).toFixed(2);
-
-	let full = () => {
-		screenfull.toggle(qr);
-		let el = document.getElementById('qr');
-		el.style.width = '300px';
-		console.log('yes', el);
-	};
-</script>
-
-<button
-	class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80"
-	class:invisible={!user}
-	on:click={back}
->
-	<Icon icon="arrow-left" style="w-10" />
-</button>
-
-<div class="container mx-auto max-w-lg px-4 space-y-10 lg:space-y-0">
-	<div class="space-y-10 lg:space-y-0">
-		<div class="text-center">
-			<span class="text-secondary block text-2xl break-all"
-				>Scan to pay <a href="/{username}" class="text-black font-semibold hover:opacity-80"
-					>{username}</a
-				></span
-			>
-
-			<div id="qr" class="w-80 mx-auto" bind:this={qr} on:click={full}>
-				<div class="max-w-lg mx-auto">
-					{@html svg}
-				</div>
-			</div>
-
-			<div class="mb-10">
-				<button
-					class="flex rounded-full border py-2 px-5 font-bold hover:opacity-80 mb-2 mx-auto"
-					on:click={() => copy(text)}
-					><Icon icon="copy" style="mr-1" />
-					<div>Copy</div></button
-				>
-			</div>
-
-			<div class="px-5 space-y-3 w-80 mx-auto">
-				{#if invoice.tip}
-					<div class="flex justify-between">
-						<span class="font-semibold text-sm">{$t('invoice.invoice')}</span>
-						<span class="font-semibold text-sm"
-							>{f(amountFiat, currency)}
-							<span class="text-secondary font-normal">{`(${s(amount)} SAT)`}</span></span
-						>
-					</div>
-
-					<div class="flex justify-between">
-						<span class="font-semibold text-sm">{$t('invoice.tip')}</span>
-						<span class="font-semibold text-sm"
-							>{f(tipAmount, currency)}
-							<span class="text-secondary font-normal">{`(${s(tip)} SAT)`}</span></span
-						>
-					</div>
-				{/if}
-
-				<div class="flex flex-wrap justify-between">
-					<span class="font-bold mr-1">{$t('invoice.total')}</span>
-					<span class="font-bold"
-						>{f(amountFiat + parseFloat(tipAmount), currency)}
-						<span class="text-secondary font-normal">{`(${s(tip + amount)} SAT)`}</span></span
-					>
-				</div>
-			</div>
-		</div>
-	</div>
-</div>
-
-<style>
-	.full-shadow {
-		box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.25);
-	}
-</style>
diff --git a/src/routes/invoice/[id]/paid/+page.svelte b/src/routes/invoice/[id]/paid/+page.svelte
deleted file mode 100644
index d619b7ff..00000000
--- a/src/routes/invoice/[id]/paid/+page.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-	import { scale } from 'svelte/transition';
-	import { Icon } from '$comp';
-	import { toast } from '@zerodevx/svelte-toast';
-	import { browser } from '$app/environment';
-	import { t } from '$lib/translations';
-	import { f, s, sats } from '$lib/utils';
-	import { goto } from '$app/navigation';
-	import { invoices } from '$lib/store';
-
-	export let data;
-	let { invoice } = data;
-	let { amount, rate } = invoice;
-
-	toast.pop(0);
-
-	$: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
-
-	const handleDoneClick = () => {
-		delete $invoices[invoice.uuid];
-		goto(`/${invoice.user.username}/receive`);
-	};
-</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">{$t('invoice.paymentSuccessful')}</h1>
-	<h2 class="text-2xl md:text-3xl font-semibold">
-		{f(amountFiat, invoice.currency)}
-	</h2>
-	<h3 class="text-secondary md:text-lg mb-6 mt-1">({s(invoice.amount)} SAT)</h3>
-	<button
-		class="bg-black text-white rounded-2xl w-20 py-3 font-bold hover:opacity-80"
-		on:click={handleDoneClick}
-	>
-		{$t('invoice.done')}
-	</button>
-</div>
diff --git a/src/routes/invoice/[id]/tip/+page.server.js b/src/routes/invoice/[id]/tip/+page.server.js
deleted file mode 100644
index 1068f273..00000000
--- a/src/routes/invoice/[id]/tip/+page.server.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import invoice from '$lib/invoice';
-
-export const actions = {
-	default: invoice
-};
diff --git a/src/routes/invoice/[id]/tip/+page.svelte b/src/routes/invoice/[id]/tip/+page.svelte
deleted file mode 100644
index 12e8e257..00000000
--- a/src/routes/invoice/[id]/tip/+page.svelte
+++ /dev/null
@@ -1,252 +0,0 @@
-<script>
-	import { browser } from '$app/environment';
-	import { invoices } from '$lib/store';
-	import { copy, f, get, reverseFormat, s, sats } from '$lib/utils';
-	import { Icon } from '$comp';
-	import { goto } from '$app/navigation';
-	import { t } from '$lib/translations';
-	import { enhance } from '$app/forms';
-	import { tick } from 'svelte';
-
-	const tipAmounts = ['None', '10%', '15%', '20%'];
-	let showCustomAmount;
-
-	let customInput;
-	let customTipAmount;
-
-	let apply = async () => {
-		if (customTipAmount > 0) {
-			tipPercent = (customTipAmount / amountFiat) * 100;
-			showCustomAmount = false;
-		}
-	};
-
-	let active = (amount) =>
-		!customTipAmount && Math.round(tipPercent) === parseInt(amount.slice(0, 2));
-
-	const handleCustomTipAmount = (e) => {
-		tipPercent = 0;
-		customTipAmount = e.target.value;
-	};
-
-	let timeout;
-	const handleSlide = (e) => {
-		customTipAmount = '';
-		if (customInput) {
-			customInput.value = '';
-		}
-		tipPercent = e.target.value;
-
-		clearTimeout(timeout);
-		timeout = setTimeout(update, 800);
-	};
-
-	let submitting;
-	const handleTipButtonClick = async (amount) => {
-		submitting = true;
-		if (amount === 'None') {
-			tipPercent = 0;
-		} else {
-			tipPercent = parseInt(amount.slice(0, 2));
-		}
-
-		await tick();
-		submit.click();
-	};
-
-	let submit;
-	let update = async () => {
-		await tick();
-		//submit.click();
-	};
-
-	export let data;
-	$: refresh(data);
-	let { invoice, id, user } = data;
-	let {
-		amount,
-		rate,
-		received,
-		prompt,
-		text,
-		tip,
-		user: { username, currency }
-	} = invoice;
-
-	let qr;
-	let tipPercent = 0;
-
-	let fullscreen;
-
-	let refresh = (data) => {
-		({ invoice, id } = data);
-		({
-			amount,
-			rate,
-			received,
-			prompt,
-			text,
-			tip,
-			user: { username, currency }
-		} = invoice);
-
-		tipPercent = (tip / amount) * 100;
-	};
-
-	$: tip = Math.round((amount / 100) * tipPercent);
-
-	$invoices[id] = { amount, id, rate, received, text, tip, username };
-	$: browser &&
-		$invoices[id]?.received >= $invoices[id]?.amount &&
-		goto(($invoices[id].memo === 'launch' && '/launch/purchase') || `/invoice/${id}/paid`);
-
-	$: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
-
-	$: tipAmount = ((tip * rate) / sats).toFixed(2);
-
-	$: invoiceAmountFiatFormatted = f(amountFiat, currency);
-</script>
-
-<button
-	class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80"
-	class:invisible={!user}
-	on:click={() => goto(`/${username}/receive`)}
->
-	<Icon icon="arrow-left" style="w-10" />
-</button>
-
-<div class="container px-4 max-w-lg text-center mx-auto">
-	<form method="POST" use:enhance class:invisible={submitting}>
-		<input type="hidden" name="amount" value={amount} />
-		<input type="hidden" name="tip" value={tip} />
-		<input type="hidden" name="username" value={username} />
-		<input type="hidden" name="rate" value={rate} />
-		<input type="hidden" name="prompt" value="false" />
-
-		<h1 class="text-4xl font-semibold my-8">{$t('invoice.addTipq')}</h1>
-		{#if !showCustomAmount}
-			<div class="my-2 text-xl">{Math.round(tipPercent)}%</div>
-
-			<input
-				id="slider"
-				type="range"
-				min="0"
-				max="100"
-				value={tipPercent}
-				class="px-0 py-0 my-5"
-				style="--bgPercent: {tipPercent}%;"
-				on:input={handleSlide}
-			/>
-
-			<div class="flex mb-8 text-sm">
-				<div>
-					<span class="mr-1">
-						{f(amountFiat, currency)}
-						<span class="font-semibold">+{f(tipAmount, currency)}</span>
-					</span>
-				</div>
-
-				<div class="ml-auto">
-					{s(amount)}
-					<span class="font-semibold">+{s(tip)} SAT</span>
-				</div>
-			</div>
-
-			{#if tip}
-				<div>
-					<button type="button" on:click={() => submit.click()}>Next</button>
-					<button type="button" on:click={() => (tipPercent = 0)}>Reset</button>
-				</div>
-			{:else}
-				{#each tipAmounts as amount}
-					<button
-						type="button"
-						class:active={active(amount, tipPercent)}
-						on:click={() => handleTipButtonClick(amount)}>{amount}</button
-					>
-				{/each}
-			{/if}
-
-			<div>
-				<button type="button" on:click={() => (showCustomAmount = true)}>Custom</button>
-			</div>
-		{/if}
-
-		<button type="submit" bind:this={submit} />
-	</form>
-
-	{#if showCustomAmount}
-		<form on:submit|preventDefault={apply}>
-			<div class="relative">
-				<span
-					class="absolute top-[18px] left-5 font-semibold {!customTipAmount
-						? 'opacity-50'
-						: 'opacity-100'}">$</span
-				>
-				<input
-					bind:this={customInput}
-					type="number"
-					step="0.01"
-					on:input={(e) => handleCustomTipAmount(e)}
-					class="pl-10"
-					placeholder="Custom amount"
-					autofocus
-				/>
-				<button
-					type="submit"
-					class="w-full mt-2 bg-black text-white font-semibold py-3 px-7 rounded-2xl {!customTipAmount
-						? 'opacity-50'
-						: 'opacity-100 hover:opacity-80'}"
-					disabled={!customTipAmount}>Apply</button
-				>
-			</div>
-		</form>
-	{/if}
-</div>
-
-<style>
-	#slider {
-		-webkit-appearance: none;
-		width: 100%;
-		height: 6px;
-		border-radius: 5px;
-		background: linear-gradient(
-			to right,
-			black 0%,
-			black var(--bgPercent),
-			#f5f7fa var(--bgPercent),
-			#f5f7fa 100%
-		);
-		outline: none;
-	}
-
-	#slider:active {
-		background-color: black;
-	}
-
-	#slider::-webkit-slider-thumb {
-		-webkit-appearance: none;
-		appearance: none;
-		width: 30px;
-		height: 30px;
-		border-radius: 50%;
-		background: black;
-		cursor: pointer;
-	}
-
-	#slider::-moz-range-thumb {
-		width: 30px;
-		height: 30px;
-		border-radius: 50%;
-		background: black;
-		cursor: pointer;
-	}
-
-	.active {
-		@apply !bg-black !text-white;
-	}
-
-	.container button[type='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>