clean up request flow, update translations and deps

23 files changed, 209 insertions, 148 deletions

diff --git a/src/components/Footer.svelte b/src/components/Footer.svelte
index bd5e5d2c..362c0512 100644
--- a/src/components/Footer.svelte
+++ b/src/components/Footer.svelte
@@ -26,8 +26,8 @@
 					<button
 						class="bg-black text-white border rounded-full px-6 py-4 font-bold hover:opacity-80 text-lg"
 					>
-          {$t('nav.startInSeconds')}
-          </button>
+						{$t('nav.startInSeconds')}
+					</button>
 				</a>
 			</div>
 			<LocaleSelector style="p-2 rounded-md text-center hover:opacity-80 cursor-pointer" />
diff --git a/src/components/Invoice.svelte b/src/components/Invoice.svelte
index bf6e5f7b..accb4c27 100644
--- a/src/components/Invoice.svelte
+++ b/src/components/Invoice.svelte
@@ -1,4 +1,5 @@
 <script>
+	import { t } from '$lib/translations';
 	import { f, sat, sats } from '$lib/utils';
 	import { fly } from 'svelte/transition';
 	import { Avatar, Icon } from '$comp';
@@ -12,7 +13,8 @@
 				<div class="flex">
 					<Avatar user={$invoice.user.username} size={12} />
 					<h1 class="my-auto">
-						<b>{$invoice.user.username}</b> sent an invoice for
+						<b>{$invoice.user.username}</b>
+						{$t('transactions.isRequesting')}
 						<b>{f(($invoice.amount * $invoice.rate) / sats, $invoice.currency)}</b>
 						{sat($invoice.amount)}
 					</h1>
@@ -20,8 +22,8 @@
 			</div>
 			<div class="mx-auto my-auto flex gap-2">
 				<a href={`/invoice/${$invoice.uuid}/tip`}>
-					<button class="text-lg rounded-full border py-3 px-7 font-bold hover:opacity-80 w-40">
-						Pay
+					<button class="rounded-full border py-2 px-4 font-bold hover:opacity-80 w-32">
+						{$t('transactions.pay')}
 					</button>
 				</a>
 			</div>
diff --git a/src/components/Request.svelte b/src/components/Request.svelte
index 642d7159..ab0b886a 100644
--- a/src/components/Request.svelte
+++ b/src/components/Request.svelte
@@ -1,4 +1,5 @@
 <script>
+	import { t } from '$lib/translations';
 	import { fly } from 'svelte/transition';
 	import { Avatar, Icon } from '$comp';
 	import { request, requestRedirect } from '$lib/store';
@@ -15,13 +16,16 @@
 			<div class="my-auto mx-auto">
 				<div class="flex">
 					<Avatar user={$request.requester} size={12} />
-					<h1 class="my-auto"><b>{$request.requester.username}</b> is ready to pay</h1>
+					<h1 class="my-auto">
+						<b>{$request.requester.username}</b>
+						{$t('transactions.readyToPay')}
+					</h1>
 				</div>
 			</div>
 			<div class="mx-auto my-auto flex gap-2">
 				<a href={`/${user.username}/receive/${$request.id}`}>
 					<button class="rounded-full border py-2 px-4 font-bold hover:opacity-80 w-32">
-						Invoice
+						{$t('transactions.invoice')}
 					</button>
 				</a>
 			</div>
diff --git a/src/lib/invoice.js b/src/lib/invoice.js
index dbcb837b..6a6ce6a0 100644
--- a/src/lib/invoice.js
+++ b/src/lib/invoice.js
@@ -2,7 +2,7 @@ import { auth, get, post } from '$lib/utils';
 import { redirect } from '@sveltejs/kit';
 
 export default async ({ cookies, request, url }) => {
-  console.log("WHAT")
+	console.log('WHAT');
 	let form = await request.formData();
 
 	let rates = await get('/rates');
@@ -23,11 +23,13 @@ export default async ({ cookies, request, url }) => {
 	let { uuid } = await post('/invoice', { invoice, user }, auth(cookies));
 
 	if (request_id) {
-    console.log("WHAT", request_id, url.pathname.endsWith("tip"))
-		if (url.pathname.endsWith('tip')) throw redirect(307, `/send/${uuid}`);
-    console.log("HERE WE GO")
+		if (url.pathname.endsWith('tip')) {
+			console.log('HUH', url.pathname);
+			throw redirect(307, `/send/${uuid}`);
+		}
+
+		console.log('NUH');
 		throw redirect(307, `/${user.username}/request/${request_id}`);
-    console.log("NO GO")
 	}
 
 	if (invoice.prompt) {
diff --git a/src/locales/en.json b/src/locales/en.json
index 87118504..776f545c 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -144,7 +144,6 @@
 		"failed": "Login failed"
 	},
 	"nav": {
-		"scan": "Scan",
 		"profile": "Profile",
 		"startInSeconds": "Start in Seconds",
 		"account": "Account",
@@ -161,11 +160,16 @@
 		"update1": ""
 	},
 	"user": {
+		"bitcoin": "Bitcoin",
+		"lightning": "Lightning",
 		"unfollow": "Unfollow",
 		"following": "Following",
 		"follow": "Follow",
 		"remove": "Remove",
 		"scanToPayBTC": "Scan to pay with bitcoin",
+    "this": "This",
+    "lightningAddress": "lightning address",
+    "likeAnEmail": "is like an email for bitcoin. You can publish it on your website or business cards and use it multiple times.",
 		"dashboard": {
 			"go": "Go",
 			"dashboard": "Dashboard",
@@ -178,13 +182,20 @@
 			"send": "Send",
 			"receive": "Receive",
 			"withdraw": "Send",
-      "deposit": "Deposit",
-      "voucher": "Voucher"
+			"deposit": "Deposit",
+			"voucher": "Voucher"
 		},
 		"receive": {
 			"lessThan1BTCWarning": "Please enter an amount less than 1 bitcoin.",
 			"showQR": "Show QR"
 		},
+		"send": {
+			"contacts": "Contacts",
+			"scan": "Scan",
+			"paste": "Paste",
+			"next": "Next",
+			"placeholder": "Paste a bitcoin address, lightning invoice or coinos username"
+		},
 		"settings": {
 			"bannerImage": "Banner Image",
 			"profileImage": "Profile Image",
@@ -218,10 +229,10 @@
 			"twofaDescription": "Add an extra level of security to your device by enableing 2-factor authentication.",
 			"twofaSetup": "Set up 2FA",
 			"twofaDisable": "Disable 2FA",
-      "select": "Select",
-      "verifyPIN": "Verify PIN",
-      "enablePIN": "Enable PIN",
-      "disablePIN": "Disable PIN"
+			"select": "Select",
+			"verifyPIN": "Verify PIN",
+			"enablePIN": "Enable PIN",
+			"disablePIN": "Disable PIN"
 		},
 		"support": {
 			"header": "Support",
@@ -229,34 +240,37 @@
 			"accountName": "Account Name",
 			"message": "Message",
 			"send": "Send"
-		},
-		"transactions": {
-			"header": "Transactions",
-			"AMOUNT": "AMOUNT",
-			"TYPE": "TYPE",
-			"TIME": "TIME",
-			"sent": "Sent",
-			"received": "Received",
-			"empty": "No transactions yet.",
-			"send": "Send",
-      "next": "Next",
-      "sendersChoice": "Sender's choice",
-      "sendTo": "Send to",
-      "to": "to"
 		}
 	},
-  "transactions": {
-    "header": "Transactions",
-    "AMOUNT": "AMOUNT",
-    "TYPE": "TYPE",
-    "TIME": "TIME",
-    "sent": "Sent",
-    "received": "Received",
-    "empty": "No transactions yet.",
-    "send": "Send",
-    "next": "Next",
-    "sendersChoice": "Sender's choice",
-    "sendTo": "Send to",
-    "to": "to"
-  }
+	"transactions": {
+		"header": "Transactions",
+		"AMOUNT": "AMOUNT",
+		"TYPE": "TYPE",
+		"TIME": "TIME",
+		"sent": "Sent",
+		"received": "Received",
+		"empty": "No transactions yet.",
+		"send": "Send",
+		"next": "Next",
+		"sendersChoice": "Sender's choice",
+		"sendTo": "Send to",
+		"to": "to",
+		"pay": "Pay",
+		"requesting": "is requesting",
+		"sentInvoiceTo": "Sent invoice to",
+		"sentRequestTo": "Sent request to",
+		"pleasePay": "Please pay",
+    "day": "Day",
+    "week": "Week",
+    "month": "Month",
+    "all": "All",
+    "export": "Export",
+    "invoice": "Invoice",
+    "readyToPay": "is ready to pay",
+    "describeOrder": "Use this field to describe your order",
+    "requestAnInvoice": "Request an invoice",
+    "submit": "Submit",
+    "isRequesting": "is requesting",
+    "awaiting": "Awaiting"
+	}
 }
diff --git a/src/locales/es.json b/src/locales/es.json
index 068d93a5..d72d5d92 100644
--- a/src/locales/es.json
+++ b/src/locales/es.json
@@ -4,7 +4,7 @@
 		"pageNotFound": "La página no existe."
 	},
 	"about": {
-		"header": "About",
+		"header": "Sobre",
 		"p1": "coinos es una aplicación de código abierto para pagos con bitcoin. Su desarrollo comezó en Vancouver allá por Septiembre de 2012 como una solución para que comerciantes locales puedan aceptar pagos con bitcoin.",
 		"p3": "Si lo desea, puede descargar el código fuente de Coinos para ejecutar su propia instancia y tenerla conectada a sus propios nodos bitcoin y lightning. Estaremos encantados de ayudarle a en un proveedor de pagos y en un custodio benevolente para su comunidad.",
 		"p4": "Las transferencias entre cuentas de usuario en nuestro servidor son realizadas off-chain, esto hace que sean instantáneas, ilimitadas, y gratuitas.",
@@ -53,7 +53,7 @@
 		"signIn": "Por favor inicie sesión para continuar."
 	},
 	"faq": {
-		"header": "FAQ",
+		"header": "PMF",
 		"cost": {
 			"question": "Cuanto cuesta?",
 			"answer": "Coinos es gratis. No hay costos de registro ni mantenimiento. Puede enviar y recibir pagos de forma ilimitada por medio de Lightning Network sin costo alguno. Sin embargo, si quieres tus fondos hacia  una dirección de bitcoin on-chain existe una tarifa del 0,1%."
@@ -96,7 +96,10 @@
 		"addTip": "Agregar propina",
 		"addTipq": "Agregar propina?",
 		"done": "Listo",
-		"paymentSuccessful": "Pago exitoso!"
+		"paymentSuccessful": "Pago exitoso!",
+		"invoice": "Factura",
+		"total": "Total",
+		"tip": "Propina"
 	},
 	"jobs": {
 		"header": "Empleos",
@@ -141,6 +144,7 @@
 		"failed": "Inicio de sesión fallido"
 	},
 	"nav": {
+    "profile": "Perfil",
 		"startInSeconds": "Comience de inmediato",
 		"account": "Cuenta",
 		"signIn": "Iniciar sesión",
@@ -155,9 +159,17 @@
 		"update1": ""
 	},
 	"user": {
+		"bitcoin": "Bitcoin",
+		"lightning": "Relámpago",
+		"invoice": "Factura",
+		"unfollow": "Dejar de seguir",
+		"following": "Siguiendo",
 		"follow": "Seguir",
 		"remove": "Eliminar",
 		"scanToPayBTC": "Escanea para pagar en bitcoin",
+    "this": "Esta",
+    "lightningAddress": "dirección relámpago",
+    "likeAnEmail": "es como un correo electrónico para bitcoin. Puede publicarlo en su sitio web o tarjetas de presentación y usarlo varias veces.",
 		"dashboard": {
 			"dashboard": "Tablero",
 			"accountBalance": "Saldo",
@@ -168,12 +180,21 @@
 			"optionalNote": "Nota (Opcional)",
 			"send": "Enviar",
 			"receive": "Recibir un pago",
-			"withdraw": "Retirar"
+			"withdraw": "Retirar",
+			"deposit": "Depósito",
+			"voucher": "Vale"
 		},
 		"receive": {
 			"lessThan1BTCWarning": "Ingrese una cantidad menor a 1 bitcoin.",
 			"showQR": "Ver QR"
 		},
+		"send": {
+			"contacts": "Contactos",
+			"scan": "Escanear",
+			"paste": "Pegar",
+			"next": "Próxima",
+			"placeholder": "Pegue una dirección de bitcoin, una factura relámpago o un nombre de usuario de coinos"
+		},
 		"settings": {
 			"bannerImage": "Imagen de portada",
 			"profileImage": "Imagen de perfil",
@@ -206,7 +227,11 @@
 			"twofa": "Autenticación de 2 factores",
 			"twofaDescription": "Agregue un nivel extra de seguridad a su cuenta con la autenticación de 2 factores (2FA).",
 			"twofaSetup": "Configurar 2FA",
-			"twofaDisable": "Desactivar 2FA"
+			"twofaDisable": "Desactivar 2FA",
+			"select": "Seleccione",
+			"verifyPIN": "Verificar PIN",
+			"enablePIN": "Habilitar PIN",
+			"disablePIN": "Deshabilitar PIN"
 		},
 		"support": {
 			"header": "Soporte",
@@ -214,15 +239,37 @@
 			"accountName": "Nombre de cuenta",
 			"message": "Mensaje",
 			"send": "Enviar"
-		},
-		"transactions": {
-			"header": "Historial de transacciones",
-			"AMOUNT": "MONTO",
-			"TYPE": "TIPO",
-			"TIME": "HORA",
-			"sent": "Enviada",
-			"received": "Recibida",
-			"empty": "Aún no hay transacciones."
 		}
+	},
+	"transactions": {
+		"header": "Historial de transacciones",
+		"AMOUNT": "MONTO",
+		"TYPE": "TIPO",
+		"TIME": "HORA",
+		"sent": "Enviada",
+		"received": "Recibida",
+		"empty": "No hay transacciones.",
+		"send": "Enviar",
+		"next": "Próxima",
+		"sendersChoice": "Elección del remitente",
+		"sendTo": "Enviar a",
+		"to": "a",
+		"pay": "Pagar",
+		"requesting": "está solicitando",
+		"sentInvoiceTo": "Factura enviada a",
+		"sentRequestTo": "Solicitud enviada a",
+		"pleasePay": "Por favor pague",
+    "day": "Dia",
+    "week": "Semana",
+    "month": "Mes",
+    "all": "Todo",
+    "export": "Exportar",
+    "invoice": "Factura",
+    "readyToPay": "está listo para pagar",
+    "describeOrder": "Utilice este campo para describir su pedido",
+    "requestAnInvoice": "Solicitar una factura",
+    "submit": "Enviar",
+    "isRequesting": "está solicitando",
+    "awaiting": "Esperando"
 	}
 }
diff --git a/src/routes/(app)/[username]/+page.svelte b/src/routes/(app)/[username]/+page.svelte
index 35606958..932ec777 100644
--- a/src/routes/(app)/[username]/+page.svelte
+++ b/src/routes/(app)/[username]/+page.svelte
@@ -24,7 +24,7 @@
 					<button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-40">
 						<div class="mx-auto flex">
 							<div style="mr-1">⚡️</div>
-							<div>Lightning</div>
+							<div>{$t('user.lightning')}</div>
 						</div>
 					</button>
 				</a>
@@ -35,7 +35,7 @@
 					<button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-40">
 						<div class="mx-auto flex">
 							<img src="/images/bitcoin.svg" class="w-5 my-auto mr-1" />
-							<div>Bitcoin</div>
+							<div>{$t('user.bitcoin')}</div>
 						</div>
 					</button>
 				</a>
@@ -47,7 +47,7 @@
 						<button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-40">
 							<div class="mx-auto flex">
 								<Icon icon="support" style="mr-1" />
-								<div>Invoice</div>
+								<div>{$t('user.invoice')}</div>
 							</div>
 						</button>
 					</a>
@@ -71,13 +71,13 @@
 
 			{#if user?.username === subject.username}
 				<p class="text-secondary mb-1">
-					This <a
+        {$t("user.this")} <a
 						href="https://lightningaddress.com"
 						class="underline"
 						target="_blank"
-						rel="noreferrer">lightning address</a
-					> is like an email for bitcoin. You can publish it on your website or business cards and use
-					it multiple times.
+      rel="noreferrer">{$t("user.lightningAddress")}</a
+    > {$t("user.likeAnEmail")}
+					
 				</p>
 			{/if}
 		</div>
diff --git a/src/routes/(app)/[username]/dashboard/+page.svelte b/src/routes/(app)/[username]/dashboard/+page.svelte
index eb4b99ae..112162ad 100644
--- a/src/routes/(app)/[username]/dashboard/+page.svelte
+++ b/src/routes/(app)/[username]/dashboard/+page.svelte
@@ -71,7 +71,7 @@
 	<div class="grid sm:grid-cols-2 gap-2 text-lg">
 		<a href="/send">
 			<button class="rounded-full border py-4 px-5 font-bold hover:opacity-80 w-full"
-				>{$t('user.dashboard.withdraw')}</button
+				>{$t('user.dashboard.send')}</button
 			>
 		</a>
 		<a href={`/${user.username}/receive`}>
@@ -110,7 +110,7 @@
 								<div class="flex">
 									<Avatar user={requester} size={20} />
 									<div class="my-auto text-left">
-										<p class="text-secondary">Awaiting</p>
+                    <p class="text-secondary">{$t("transactions.awaiting")}</p>
 										<p class="ml-1 text-lg break-words">{requester.username}</p>
 									</div>
 								</div>
@@ -131,26 +131,26 @@
 
 	<div>
 		{#each requests as { id, invoice, memo, requester: r }}
-      <a href={`/${user.username}/receive/${id}`}>
-			<div class="border-b p-2 last:border-b-0 hover:bg-gray-100">
-				<div class="flex">
-					<div>
-						<div class="flex">
-							<Avatar user={r} size={20} />
-							<div class="my-auto text-left">
-								<p class="ml-1 text-lg break-words">{r.username}</p>
-								<p class="ml-1 text-secondary">{memo}</p>
+			<a href={`/${user.username}/receive/${id}`}>
+				<div class="border-b p-2 last:border-b-0 hover:bg-gray-100">
+					<div class="flex">
+						<div>
+							<div class="flex">
+								<Avatar user={r} size={20} />
+								<div class="my-auto text-left">
+									<p class="ml-1 text-lg break-words">{r.username}</p>
+									<p class="ml-1 text-secondary">{memo}</p>
+								</div>
 							</div>
 						</div>
-					</div>
 						<div class="whitespace-nowrap my-auto ml-auto flex gap-2">
-			<button class="rounded-full border py-2 px-4 font-bold hover:opacity-80 w-full"
-				>Invoice</button
-			>
+							<button class="rounded-full border py-2 px-4 font-bold hover:opacity-80 w-full"
+								>Invoice</button
+							>
 						</div>
+					</div>
 				</div>
-			</div>
-      </a>
+			</a>
 		{/each}
 	</div>
 </div>
diff --git a/src/routes/(app)/[username]/receive/[...param]/+page.svelte b/src/routes/(app)/[username]/receive/[...param]/+page.svelte
index cb69b06a..9e9f4f66 100644
--- a/src/routes/(app)/[username]/receive/[...param]/+page.svelte
+++ b/src/routes/(app)/[username]/receive/[...param]/+page.svelte
@@ -43,7 +43,7 @@
 			class="bg-black text-white rounded-xl w-full h-[48px] flex justify-center items-center font-semibold
 				opacity-100 hover:opacity-80"
 		>
-			{amount ? 'Next' : "Sender's choice"}
+			{amount ? $t("transactions.next") : $t("transactions.sendersChoice")}
 		</button>
 	</div>
 </form>
diff --git a/src/routes/(app)/[username]/request/+page.server.js b/src/routes/(app)/[username]/request/+page.server.js
index 44c9d3a7..4515666f 100644
--- a/src/routes/(app)/[username]/request/+page.server.js
+++ b/src/routes/(app)/[username]/request/+page.server.js
@@ -2,7 +2,7 @@ import { redirect } from '@sveltejs/kit';
 import { auth, post } from '$lib/utils';
 
 export let load = ({ locals }) => {
-  console.log("YO")
+	console.log('YO');
 	if (!locals.user) throw redirect(307, '/login');
 };
 
diff --git a/src/routes/(app)/[username]/request/+page.svelte b/src/routes/(app)/[username]/request/+page.svelte
index 1e62ea00..bbbb514c 100644
--- a/src/routes/(app)/[username]/request/+page.svelte
+++ b/src/routes/(app)/[username]/request/+page.svelte
@@ -1,4 +1,5 @@
 <script>
+	import { t } from '$lib/translations';
 	import { enhance } from '$app/forms';
 	import { Icon } from '$comp';
 	import { back } from '$lib/utils';
@@ -14,7 +15,7 @@
 </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">Request an invoice</h1>
+  <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">{$t("transactions.requestAnInvoice")}</h1>
 
 	<form action="?/create" method="POST" use:enhance class="space-y-5">
 		<input type="hidden" name="requester_id" value={user.id} />
@@ -22,7 +23,7 @@
 
 		<textarea
 			name="memo"
-			placeholder="Use this field to describe your order"
+   placeholder={$t("transactions.describeOrder")}
 			class="w-full p-4 border rounded-xl h-48"
 		/>
 
@@ -31,7 +32,7 @@
 				type="submit"
 				class="bg-black text-white border rounded-full px-6 py-2 font-bold mx-auto"
 			>
-				Submit
+        {$t("transactions.submit")}
 			</button>
 		</div>
 	</form>
diff --git a/src/routes/(app)/[username]/request/[id]/+page.server.js b/src/routes/(app)/[username]/request/[id]/+page.server.js
index 8245bef6..7beabfe6 100644
--- a/src/routes/(app)/[username]/request/[id]/+page.server.js
+++ b/src/routes/(app)/[username]/request/[id]/+page.server.js
@@ -10,10 +10,13 @@ export let load = async ({ cookies, depends, locals: { user }, params }) => {
 
 	if (invoice) {
 		let { amount, received, uuid } = invoice;
-		if ((received && !amount) || received >= amount) throw redirect(307, `/send/${uuid}`);
+		if (
+			request.recipient.username === user.username &&
+			((received && !amount) || received >= amount)
+		)
+			throw redirect(307, `/invoice/${uuid}/paid`);
 
-		if (request.requester.username === user.username)
-			throw redirect(307, `/send/${request.invoice.uuid}`);
+		if (request.requester.username === user.username) throw redirect(307, `/send/${uuid}`);
 	}
 
 	return { request };
diff --git a/src/routes/(app)/[username]/request/[id]/+page.svelte b/src/routes/(app)/[username]/request/[id]/+page.svelte
index 0f979284..7dd10e09 100644
--- a/src/routes/(app)/[username]/request/[id]/+page.svelte
+++ b/src/routes/(app)/[username]/request/[id]/+page.svelte
@@ -1,4 +1,5 @@
 <script>
+	import { t } from '$lib/translations';
 	import { Avatar } from '$comp';
 	import { f, sat, sats } from '$lib/utils';
 	import { request as req, requestRedirect } from '$lib/store';
@@ -20,7 +21,7 @@
 	<div class="text-center mb-8 space-y-5">
 		{#if request.recipient_id === user.id}
 			<p class="text-5xl break-words">
-				<span class="text-xl md:text-2xl">Sent invoice to</span>
+				<span class="text-xl md:text-2xl">{$t('transactions.sentInvoiceTo')}</span>
 			</p>
 			<div class="flex p-1 gap-2 justify-center">
 				<Avatar user={request.requester} size={20} />
@@ -34,7 +35,7 @@
 			</div>
 		{:else}
 			<p class="text-5xl break-words">
-				<span class="text-xl md:text-2xl">Sent request to</span>
+				<span class="text-xl md:text-2xl">{$t('transactions.sentRequestTo')}</span>
 			</p>
 			<div class="flex p-1 gap-2 justify-center">
 				<Avatar user={request.recipient} size={20} />
diff --git a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
index 24e26566..4551ccec 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
@@ -165,7 +165,7 @@
 				type="button"
 				class="border rounded-2xl font-bold w-24 text-center px-0 py-2 hover:opacity-80"
 				on:click={() => select('profile')}
-        on:keydown={() => select('profile')}>{$t("user.settings.select")}</button
+				on:keydown={() => select('profile')}>{$t('user.settings.select')}</button
 			>
 			<input
 				type="file"
@@ -220,7 +220,7 @@
 		type="button"
 		class="border rounded-2xl font-bold w-24 text-center px-0 py-2 hover:opacity-80"
 		on:click={() => select('banner')}
-      on:keydown={() => select('banner')}>{$t("user.settings.select")}</button
+		on:keydown={() => select('banner')}>{$t('user.settings.select')}</button
 	>
 	<input
 		type="file"
diff --git a/src/routes/(app)/[username]/settings/[...tab]/_security.svelte b/src/routes/(app)/[username]/settings/[...tab]/_security.svelte
index fc83e6f3..f4c04329 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_security.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_security.svelte
@@ -126,7 +126,9 @@
 <div>
 	<input type="hidden" name="newpin" value={pin} />
 
-	<span class="font-bold mb-1">{verifying ? $t("user.settings.verifyPIN"): $t("user.settings.securityPIN")}</span>
+	<span class="font-bold mb-1"
+		>{verifying ? $t('user.settings.verifyPIN') : $t('user.settings.securityPIN')}</span
+	>
 	<p class="text-secondary mb-1">
 		{$t('user.settings.securityPINDescription')}
 	</p>
@@ -157,7 +159,8 @@
 		</div>
 	{:else}
 		<button type="button" class="primary" on:click={togglePin}
-			><Icon icon="lock" style="mr-1" /> {user.haspin ? $t("user.settings.disablePIN") : $t("user.settings.enablePIN")}</button
+			><Icon icon="lock" style="mr-1" />
+			{user.haspin ? $t('user.settings.disablePIN') : $t('user.settings.enablePIN')}</button
 		>
 	{/if}
 </div>
diff --git a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
index 7f4410cc..48e710fe 100644
--- a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
+++ b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
@@ -15,10 +15,10 @@
 	let change = ({ target: { value } }) => goto(value);
 
 	let presets = [
-		{ title: 'Day', start: sub(new Date(), { days: 1 }), end: null },
-		{ title: 'Week', start: sub(new Date(), { days: 7 }), end: null },
-		{ title: 'Month', start: sub(new Date(), { months: 1 }), end: null },
-		{ title: 'All', start: sub(new Date(), { years: 5 }), end: null }
+		{ title: $t('transactions.day'), start: sub(new Date(), { days: 1 }), end: null },
+		{ title: $t('transactions.week'), start: sub(new Date(), { days: 7 }), end: null },
+		{ title: $t('transactions.month'), start: sub(new Date(), { months: 1 }), end: null },
+		{ title: $t('transactions.all'), start: sub(new Date(), { years: 5 }), end: null }
 	];
 
 	$: selection = start
@@ -66,42 +66,23 @@
 
 <div class="mt-24 mb-20">
 	<h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold mb-10">
-		{$t('user.transactions.header')}
+		{$t('transactions.header')}
 	</h1>
 
 	<div class="container w-full mx-auto text-lg px-4 max-w-xl space-y-5">
-		<div class="flex text-md text-secondary flex-wrap relative">
-			<Icon icon="clock" style="absolute left-4 top-4 opacity-50 md:hidden" />
-			<select
-				class="md:hidden bg-white border rounded-full text-center w-36 h-14"
-				on:change={change}
-			>
-				{#each presets as { start, end, title }, i}
-					<option
-						selected={selection === i}
-						value={`/${user.username}/transactions/${getUnixTime(start) + '/'}1`}>{title}</option
-					>
-				{/each}
-			</select>
-			<div class="hidden md:block flex">
+		<div class="flex text-md text-secondary relative">
+			<div class="mx-auto flex justify-center w-full gap-1">
 				{#each presets as { start, end, title }, i}
 					<a
 						class:active={selection === i}
 						href={`/${user.username}/transactions/${getUnixTime(start) + '/'}1`}
 					>
-						<button class="rounded-full border px-4 hover:opacity-80 h-14 w-20">
+						<button class="text-sm md:text-lg rounded-full border py-2 px-4 hover:opacity-80 min-w-[72px]">
 							<div class="my-auto">{title}</div>
 						</button>
 					</a>
 				{/each}
 			</div>
-			<button
-				class="ml-auto rounded-full border px-4 w-36 hover:opacity-80 flex h-14"
-				on:click={csv}
-			>
-				<Icon icon="save" style="opacity-50 mr-2 my-auto" />
-				<div class="my-auto">Export</div>
-			</button>
 		</div>
 
 		<div class="flex flex-wrap justify-center mb-8">
@@ -178,9 +159,13 @@
 					</div>
 				</div>
 			{:else}
-				<p class="text-secondary text-lg text-center">{$t('user.transactions.empty')}</p>
+				<p class="text-secondary text-lg text-center">{$t('transactions.empty')}</p>
 			{/each}
 		</div>
+		<button class="ml-auto rounded-full border py-2 px-4 w-36 hover:opacity-80 flex mx-auto" on:click={csv}>
+			<Icon icon="save" style="opacity-50 mr-2 my-auto" />
+			<div class="my-auto">{$t('transactions.export')}</div>
+		</button>
 	</div>
 </div>
 
diff --git a/src/routes/(app)/invoice/[id]/+page.svelte b/src/routes/(app)/invoice/[id]/+page.svelte
index b0ec9a6a..c2c28a6c 100644
--- a/src/routes/(app)/invoice/[id]/+page.svelte
+++ b/src/routes/(app)/invoice/[id]/+page.svelte
@@ -79,7 +79,7 @@
 
 <div class="container mx-auto max-w-lg px-4 space-y-2 sm:space-y-5">
 	<div>
-		<h1 class="text-secondary text-center text-xl">Please pay</h1>
+    <h1 class="text-secondary text-center text-xl">{$t("transactions.pleasePay")}</h1>
 
 		<div class="flex w-full">
 			<div class="mx-auto">
diff --git a/src/routes/(app)/ln/[lnurl]/+page.svelte b/src/routes/(app)/ln/[lnurl]/+page.svelte
index 95534759..8fb915e8 100644
--- a/src/routes/(app)/ln/[lnurl]/+page.svelte
+++ b/src/routes/(app)/ln/[lnurl]/+page.svelte
@@ -39,7 +39,7 @@
 				{#if loading}
 					<Spinner />
 				{:else}
-          {$t('transactions.send')}
+					{$t('transactions.send')}
 				{/if}
 			</button>
 		</div>
diff --git a/src/routes/(app)/send/[...text]/+page.server.js b/src/routes/(app)/send/[...text]/+page.server.js
index fcfb33a3..dd2619ac 100644
--- a/src/routes/(app)/send/[...text]/+page.server.js
+++ b/src/routes/(app)/send/[...text]/+page.server.js
@@ -8,7 +8,7 @@ let parse = async (t, host) => {
 
 	let amount, user, uuid;
 
-  t = t.toLowerCase();
+	t = t.toLowerCase();
 
 	t.startsWith('bitcoin:') &&
 		({
diff --git a/src/routes/(app)/send/[...text]/+page.svelte b/src/routes/(app)/send/[...text]/+page.svelte
index 7c81bd74..e620fef4 100644
--- a/src/routes/(app)/send/[...text]/+page.svelte
+++ b/src/routes/(app)/send/[...text]/+page.svelte
@@ -1,6 +1,6 @@
 <script>
 	import { page } from '$app/stores';
-    import { fly } from 'svelte/transition';
+	import { fly } from 'svelte/transition';
 	import { enhance } from '$app/forms';
 	import { tick } from 'svelte';
 	import { browser } from '$app/environment';
@@ -17,7 +17,7 @@
 	let w;
 
 	let el, textarea, text;
-	let placeholder = 'Paste a bitcoin address, lightning invoice or coinos username';
+	let placeholder = $t('user.send.placeholder');
 
 	$: $page && setTimeout(() => w > 800 && textarea?.focus(), 0);
 	let keypress = (e) => e.key === 'Enter' && (e.preventDefault() || el.click());
@@ -31,9 +31,9 @@
 
 <AppHeader {data} />
 <div class="container px-4 max-w-lg mx-auto space-y-5 mt-20">
-  <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">
-				{$t('transactions.send')}
-  </h1>
+	<h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">
+		{$t('transactions.send')}
+	</h1>
 
 	<form method="POST" use:enhance>
 		{#if form?.error}
@@ -60,7 +60,7 @@
 					class="flex border rounded-full px-6 py-2 font-bold hover:opacity-80 mr-1"
 				>
 					<Icon icon="scan" style="mr-2 w-6 my-auto" />
-					<div class="my-auto">Scan</div>
+					<div class="my-auto">{$t('user.send.scan')}</div>
 				</button>
 			</a>
 
@@ -70,7 +70,7 @@
 				on:click={paste}
 			>
 				<Icon icon="paste" style="mr-2 w-6 my-auto" />
-				<div class="my-auto">Paste</div>
+				<div class="my-auto">{$t('user.send.paste')}</div>
 			</button>
 
 			<button
@@ -80,14 +80,14 @@
 					? 'opacity-50'
 					: 'opacity-100 hover:opacity-80'} bg-black text-white border rounded-full px-6 py-2 font-bold"
 			>
-				Next
+				{$t('user.send.next')}
 			</button>
 		</div>
 	</form>
 
 	{#if contacts.length}
 		<div class="space-y-5">
-			<h1 class="px-3 md:px-0 text-xl font-semibold mt-10">Contacts</h1>
+			<h1 class="px-3 md:px-0 text-xl font-semibold mt-10">{$t('user.send.contacts')}</h1>
 			<div>
 				{#each contacts as c}
 					<a href={`/send/user/${c.username}`}>
diff --git a/src/routes/(app)/send/[uuid=uuid]/+page.svelte b/src/routes/(app)/send/[uuid=uuid]/+page.svelte
index 6c54f487..23e8a73e 100644
--- a/src/routes/(app)/send/[uuid=uuid]/+page.svelte
+++ b/src/routes/(app)/send/[uuid=uuid]/+page.svelte
@@ -46,15 +46,14 @@
 <div class="container px-4 mt-20 max-w-xl mx-auto">
 	{#if amount}
 		<div class="text-center mb-8">
-      <h1 class="text-xl md:text-2xl text-secondary mb-2">
-        
-					{$t('transactions.send')}
-        </h1>
+			<h1 class="text-xl md:text-2xl text-secondary mb-2">
+				{$t('transactions.send')}
+			</h1>
 			<p class="text-6xl break-words mb-4">
 				{fiat ? f(amountFiat, currency) : '⚡️' + s(amount)}
 			</p>
 
-			<h1 class="text-xl md:text-2xl text-secondary mb-2">to</h1>
+      <h1 class="text-xl md:text-2xl text-secondary mb-2">{$t("transactions.to")}</h1>
 
 			<div class="flex p-1 gap-2 justify-center">
 				<Avatar user={recipient} size={'20'} />
@@ -91,7 +90,7 @@
 					class="opacity-100 hover:opacity-80'} rounded-2xl border py-3 font-bold mx-auto mt-2 bg-black text-white px-4 w-24"
 					on:click={setAmount}
 				>
-					Next
+        {$t("transactions.next")}
 				</button>
 			{/if}
 		</div>
diff --git a/src/routes/(app)/send/bitcoin/[address]/[...amount]/+page.svelte b/src/routes/(app)/send/bitcoin/[address]/[...amount]/+page.svelte
index 87401749..f2643918 100644
--- a/src/routes/(app)/send/bitcoin/[address]/[...amount]/+page.svelte
+++ b/src/routes/(app)/send/bitcoin/[address]/[...amount]/+page.svelte
@@ -33,7 +33,7 @@
 
 <div class="container px-4 mt-20 max-w-xl mx-auto">
 	<div class="text-center mb-8">
-    <h1 class="text-3xl md:text-4xl font-semibold mb-2">{$t("transactions.sendTo")}</h1>
+		<h1 class="text-3xl md:text-4xl font-semibold mb-2">{$t('transactions.sendTo')}</h1>
 		<p class="text-lg text-secondary">{address}</p>
 	</div>
 	<Numpad bind:amount {currency} />
@@ -51,7 +51,7 @@
 				{#if loading}
 					<Spinner />
 				{:else}
-          {$t('transactions.send')}
+					{$t('transactions.send')}
 				{/if}
 			</button>
 		</div>
diff --git a/src/routes/(app)/send/lightning/[payreq]/+page.svelte b/src/routes/(app)/send/lightning/[payreq]/+page.svelte
index 46dd71d1..bba2ea45 100644
--- a/src/routes/(app)/send/lightning/[payreq]/+page.svelte
+++ b/src/routes/(app)/send/lightning/[payreq]/+page.svelte
@@ -42,7 +42,7 @@
 			<p class="text-6xl break-words mb-4">
 				{s(amount)} <span class="text-xl md:text-2xl text-secondary">sats</span>
 			</p>
-        <h1 class="text-xl md:text-2xl text-secondary mb-2">{$t('transactions.to')}</h1>
+			<h1 class="text-xl md:text-2xl text-secondary mb-2">{$t('transactions.to')}</h1>
 			<p class="text-6xl break-words">{alias}</p>
 		</div>