finish hooking up currency selection

10 files changed, 66 insertions, 48 deletions

diff --git a/src/lib/socket.js b/src/lib/socket.js
index a30d4376..e85e8f15 100644
--- a/src/lib/socket.js
+++ b/src/lib/socket.js
@@ -1,5 +1,5 @@
 import { get } from 'svelte/store';
-import { rate, user, token, invoices, preferredCurrency, newPayment } from '$lib/store';
+import { rate, user, token, invoices, newPayment } from '$lib/store';
 import { success } from '$lib/utils';
 
 let interval, socket;
@@ -32,7 +32,6 @@ export const messages = (data) => ({
 
 	login() {
 		user.set(data);
-		preferredCurrency.set('USD');
 	}
 });
 
diff --git a/src/lib/store.js b/src/lib/store.js
index 8469dab7..18a8824f 100644
--- a/src/lib/store.js
+++ b/src/lib/store.js
@@ -30,12 +30,10 @@ const persistLocal = (key, defaultValue) => {
 export const rate = writable();
 export const rates = writable();
 export const selectedRate = writable();
-export const conversion = writable();
 export const user = writable();
 export const invoiceAmount = writable();
 export const invoiceAmountFiat = writable();
 export const token = persistSession('token');
 export const invoices = writable({});
-export const preferredCurrency = writable();
 export const newPayment = persistLocal('newPayment');
 export const colorTheme = writable('from-primary to-gradient');
diff --git a/src/lib/utils.js b/src/lib/utils.js
index 3f2f566e..a1bdf8d7 100644
--- a/src/lib/utils.js
+++ b/src/lib/utils.js
@@ -22,7 +22,7 @@ export const get = (url, headers = { accept: 'application/json' }) =>
 export const post = (url, body, headers) => {
 	headers = { ...headers, accept: 'application/json', 'content-type': 'application/json' };
 	return fetch(base + url, {
-    method: "POST",
+		method: 'POST',
 		body: JSON.stringify(body),
 		headers
 	})
@@ -44,7 +44,7 @@ export const post = (url, body, headers) => {
 export const put = (url, body, headers) => {
 	headers = { ...headers, 'content-type': 'application/json' };
 	return fetch(base + url, {
-    method: "PUT",
+		method: 'PUT',
 		body: JSON.stringify(body),
 		headers
 	});
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 4cf819fc..9ae32138 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -5,7 +5,7 @@
 	import '../app.css';
 	import { onMount } from 'svelte';
 	import { connect } from '$lib/socket';
-	import { user, token, rate, rates, selectedRate, conversion } from '$lib/store';
+	import { user, token, rate, rates, selectedRate } from '$lib/store';
 	import { page } from '$app/stores';
 	import { browser } from '$app/env';
 	import { goto } from '$app/navigation';
@@ -18,8 +18,7 @@
 	export let data;
 
 	$rates = data.rates;
-	$: $conversion = data.rates[data.user.currency] / $rate;
-	$: $selectedRate = $rate * $conversion;
+	$: $selectedRate = $rate * (data.rates[data.user.currency] / data.rates.USD);
 
 	let ready = false;
 
@@ -32,7 +31,6 @@
 		});
 
 		if (protectedRoutes.find((p) => $page.url.pathname.match(p))) {
-			console.log('TOKEN', $token);
 			if (!$token) {
 				goto('/login');
 				warning($_('error.signIn'));
diff --git a/src/routes/[username]/+page.server.js b/src/routes/[username]/+page.server.js
index 2520b0b1..9ae4af2d 100644
--- a/src/routes/[username]/+page.server.js
+++ b/src/routes/[username]/+page.server.js
@@ -18,5 +18,5 @@ export async function PUT({ request }) {
 	let { token } = cookie.parse(request.headers.get('cookie') || '');
 	let { user } = await request.json();
 	await post(`/user`, user, { authorization: `Bearer ${token}` });
-  console.log("put done")
+	console.log('put done');
 }
diff --git a/src/routes/[username]/dashboard/+page.svelte b/src/routes/[username]/dashboard/+page.svelte
index 9e09aa16..56aa0d6f 100644
--- a/src/routes/[username]/dashboard/+page.svelte
+++ b/src/routes/[username]/dashboard/+page.svelte
@@ -2,7 +2,7 @@
 	import { post, failure } from '$lib/utils';
 	import { tick } from 'svelte';
 	import { AppHeader, Icon } from '$comp';
-	import { rate, user, preferredCurrency } from '$lib/store';
+	import { selectedRate, user } from '$lib/store';
 	import { _ } from 'svelte-i18n';
 
 	let payreq = '',
@@ -26,24 +26,19 @@
 
 	$: btcPrice = new Intl.NumberFormat('en-US', {
 		style: 'currency',
-		currency: 'USD'
-	}).format($rate);
+		currency: $user.currency
+	}).format($selectedRate);
 
 	$: accountBalanceFiat = new Intl.NumberFormat('en-US', {
 		style: 'currency',
-		currency: 'USD'
-	}).format($user.account.balance * ($rate / 100000000));
+		currency: $user.currency
+	}).format($user.account.balance * ($selectedRate / 100000000));
 
 	$: accountBalanceBtc = $user.account.balance / 100000000;
 
 	$: accountBalanceSats = new Intl.NumberFormat('en-US', { maximumFractionDigits: 0 }).format(
 		$user.account.balance
 	);
-
-	$: feepayreq = new Intl.NumberFormat('en-US', {
-		style: 'currency',
-		currency: 'USD'
-	}).format(($user.account.balance * ($rate / 100000000)) / 100);
 </script>
 
 {#if $user}
@@ -64,8 +59,9 @@
 			{#if !withdrawing}
 				<span class="text-secondary mx-auto text-lg font-bold"
 					>{$_('user.dashboard.bitcoinPrice')}
-					<span class="text-black">{$rate ? btcPrice : $_('user.dashboard.fetchingRate')}</span>
-					{$preferredCurrency}
+					<span class="text-black"
+						>{$selectedRate ? btcPrice : $_('user.dashboard.fetchingRate')}</span
+					>
 				</span>
 
 				<span class="text-secondary block mt-1">{@html $_('user.dashboard.dataFromBinance')} </span>
@@ -75,7 +71,7 @@
 				</h3>
 
 				<span class="text-3xl font-bold block mb-1"
-					>{$rate ? accountBalanceFiat : $_('user.dashboard.fetchingRate')}</span
+					>{$selectedRate ? accountBalanceFiat : $_('user.dashboard.fetchingRate')}</span
 				>
 
 				<span class="text-secondary text-xl block">{accountBalanceSats} SAT</span>
diff --git a/src/routes/[username]/receive/+page.svelte b/src/routes/[username]/receive/+page.svelte
index 6d750d1b..2706ec86 100644
--- a/src/routes/[username]/receive/+page.svelte
+++ b/src/routes/[username]/receive/+page.svelte
@@ -2,7 +2,7 @@
 	// in the future we will want to allow users to set their fiat currency in the settings
 	import { AppHeader, Icon } from '$comp';
 	import { goto } from '$app/navigation';
-	import { invoiceAmount, invoiceAmountFiat, rate, user } from '$lib/store';
+	import { invoiceAmount, invoiceAmountFiat, selectedRate, user } from '$lib/store';
 	import { post, warning } from '$lib/utils';
 	import { page } from '$app/stores';
 	import { _, number } from 'svelte-i18n';
@@ -11,11 +11,13 @@
 	let amountFiat = 0;
 	let amountSats = 0;
 
-	$: amount = useFiat ? Math.round(amountFiat / ($rate / 100000000)) : amountSats;
+	$: amount = useFiat ? Math.round(amountFiat / ($selectedRate / 100000000)) : amountSats;
 
-	$: $invoiceAmount = parseInt(amountSats === 0 ? amountFiat / ($rate / 100000000) : amountSats);
+	$: $invoiceAmount = parseInt(
+		amountSats === 0 ? amountFiat / ($selectedRate / 100000000) : amountSats
+	);
 	$: $invoiceAmountFiat = parseInt(
-		amountFiat === 0 ? amountSats * ($rate / 100000000) : amountFiat
+		amountFiat === 0 ? amountSats * ($selectedRate / 100000000) : amountFiat
 	);
 	$: amountSatsFormatted = new Intl.NumberFormat('en-US', { maximumFractionDigits: 0 }).format(
 		amountSats
@@ -23,11 +25,11 @@
 
 	$: amountFiatConverted = new Intl.NumberFormat('en-US', {
 		style: 'currency',
-		currency: 'USD'
-	}).format(amountSats * ($rate / 100000000));
+		currency: $user.currency
+	}).format(amountSats * ($selectedRate / 100000000));
 
 	$: amountSatsConverted = new Intl.NumberFormat('en-US', { maximumFractionDigits: 0 }).format(
-		amountFiat / ($rate / 100000000)
+		amountFiat / ($selectedRate / 100000000)
 	);
 
 	const numPad = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '.', '0', '<'];
@@ -50,7 +52,7 @@
 						amountSats = 0;
 					}
 				}
-			} else if (value !== '.' && value !== '<' && parseInt(amountFiat + value) > $rate) {
+			} else if (value !== '.' && value !== '<' && parseInt(amountFiat + value) > $selectedRate) {
 				warning($_('user.receive.lessThan1BTCWarning'));
 			} else if (amountFiat !== 0 && amountFiat.match(/\.../)) {
 				return;
@@ -60,7 +62,7 @@
 		} else {
 			if (value === '.') {
 				return;
-			} else if (amountSats === 0 && value !== '<' && value !== '0') {
+			} else if (amountSats === '0' && value !== '<' && value !== '0') {
 				amountSats = value;
 			} else if (value === '<') {
 				if (amountSats !== 0) {
@@ -79,7 +81,11 @@
 	};
 
 	let submit = async () => {
-		let { id } = await post('/invoice', { amount, rate: $rate, username: $page.params.username });
+		let { id } = await post('/invoice', {
+			amount,
+			rate: $selectedRate,
+			username: $page.params.username
+		});
 		goto(`/invoice/${id}`);
 	};
 </script>
@@ -88,26 +94,47 @@
 	<AppHeader />
 
 	<div class="flex justify-center items-center mt-20 mb-3 px-3">
-		{#if $rate}
+		{#if $selectedRate}
 			<div class="space-y-5">
 				<!-- amounts -->
 				<div class="text-center">
 					<div class="text-5xl md:text-6xl font-semibold tracking-widest mb-1">
-						{useFiat ? `$${amountFiat}` : amountSatsFormatted}<span
-							class="tracking-normal text-base font-normal">{useFiat ? 'USD' : 'SAT'}</span
+						{useFiat
+							? `${
+									$user.currency === 'USD' ||
+									$user.currency === 'CAD' ||
+									$user.currency === 'AUD' ||
+									$user.currency === 'NZD' ||
+									$user.currency === 'MXN' ||
+									$user.currency === 'BRL' ||
+									$user.currency === 'HKD' ||
+									$user.currency === 'TWD'
+										? '$'
+										: $user.currency === 'JPY' || $user.currency === 'CNY'
+										? '¥'
+										: $user.currency === 'GBP'
+										? '£'
+										: $user.currency === 'EUR'
+										? '€'
+										: $user.currency === 'KRW'
+										? '₩'
+										: ''
+							  }${amountFiat}`
+							: amountSatsFormatted}<span class="tracking-normal text-base font-normal"
+							>{useFiat ? $user.currency : 'SAT'}</span
 						>
 					</div>
 					<span class="text-secondary mr-1"
-						>{useFiat ? `${amountSatsConverted} SAT` : `${amountFiatConverted} USD`}</span
+						>{useFiat ? `${amountSatsConverted} SAT` : amountFiatConverted}</span
 					>
 					<button
 						on:click={() => {
 							if (useFiat) {
-								amountSats = (amountFiat / ($rate / 100000000)).toFixed(0).toString();
+								amountSats = (amountFiat / ($selectedRate / 100000000)).toFixed(0).toString();
 							} else {
 								amountFiat =
-									(amountSats * ($rate / 100000000)).toFixed(2) > 0.0
-										? (amountSats * ($rate / 100000000)).toFixed(2).toString()
+									(amountSats * ($selectedRate / 100000000)).toFixed(2) > 0.0
+										? (amountSats * ($selectedRate / 100000000)).toFixed(2).toString()
 										: 0;
 							}
 							useFiat = !useFiat;
diff --git a/src/routes/[username]/transactions/+page.svelte b/src/routes/[username]/transactions/+page.svelte
index 1cc2611a..996b9b9a 100644
--- a/src/routes/[username]/transactions/+page.svelte
+++ b/src/routes/[username]/transactions/+page.svelte
@@ -31,7 +31,7 @@
 								<span class="block mb-1"
 									>{tx.amount > 0 ? '+' : ''}{new Intl.NumberFormat('en-US', {
 										style: 'currency',
-										currency: 'USD'
+										currency: tx.currency
 									}).format(tx.amount * (tx.rate / 100000000))}
 								</span>
 
diff --git a/src/routes/invoice/+server.js b/src/routes/invoice/+server.js
index 24fffb21..c77784d7 100644
--- a/src/routes/invoice/+server.js
+++ b/src/routes/invoice/+server.js
@@ -1,5 +1,6 @@
 import { json as json$1 } from '@sveltejs/kit';
 import { post } from '$lib/utils';
+import { user } from '$lib/store';
 
 let network = 'lightning';
 
@@ -7,7 +8,7 @@ export async function POST({ request }) {
 	let { amount, rate, username, text } = await request.json();
 	if (!text) ({ text } = await post('/lightning/invoice', { amount }));
 	let { uuid: id } = await post('/invoice', {
-		invoice: { amount, currency: 'USD', network, rate, text },
+		invoice: { amount, currency: user.currency, network, rate, text },
 		user: { username }
 	});
 
diff --git a/src/routes/invoice/[id]/+page.svelte b/src/routes/invoice/[id]/+page.svelte
index d7824710..f42aba04 100644
--- a/src/routes/invoice/[id]/+page.svelte
+++ b/src/routes/invoice/[id]/+page.svelte
@@ -1,7 +1,7 @@
 <script>
 	import { get, post, reverseFormat } from '$lib/utils';
 	import { browser } from '$app/env';
-	import { invoices, user, preferredCurrency } from '$lib/store';
+	import { invoices, user } from '$lib/store';
 	import { Icon, Image } from '$comp';
 	import { goto } from '$app/navigation';
 	import { onMount } from 'svelte';
@@ -26,7 +26,7 @@
 
 	$: tipAmountFormatted = new Intl.NumberFormat('en-US', {
 		style: 'currency',
-		currency: 'USD'
+		currency: $user.currency
 	}).format(tipAmount);
 
 	$: tipAmountSats = new Intl.NumberFormat('en-US', { maximumFractionDigits: 0 }).format(
@@ -50,7 +50,7 @@
 
 	$: totalAmountFormatted = new Intl.NumberFormat('en-US', {
 		style: 'currency',
-		currency: 'USD'
+		currency: $user.currency
 	}).format(amountFiat + parseFloat(tipAmount));
 
 	const amountFormatted = new Intl.NumberFormat('en-US', {
@@ -59,7 +59,7 @@
 
 	$: invoiceAmountFiatFormatted = new Intl.NumberFormat('en-US', {
 		style: 'currency',
-		currency: 'USD'
+		currency: $user.currency
 	}).format(amountFiat);
 
 	let customTipAmount;
@@ -296,7 +296,6 @@
 		<h1 class="text-3xl md:text-4xl font-bold mb-6">{$_('invoice.paymentSuccessful')}</h1>
 		<h2 class="text-2xl md:text-3xl font-semibold">
 			{totalAmountFormatted}
-			{$preferredCurrency}
 		</h2>
 		<h3 class="text-secondary md:text-lg mb-6 mt-1">({totalAmountSats} SAT)</h3>
 		<button class="bg-black text-white rounded-2xl w-20 py-3 font-bold" on:click={handleDoneClick}>