From 6d2599e12908cd3bcea3b2771517663c13c7471a Mon Sep 17 00:00:00 2001
From: ithiame <133223073+ithiame@users.noreply.github.com>
Date: Fri, 6 Dec 2024 23:38:52 +0000
Subject: [PATCH] =?UTF-8?q?=20=F0=9F=A6=8B=20Add=20(optional)=20be-BOP=20l?=
 =?UTF-8?q?ogo=20on=20PoS=20QR=20code=20#1614=20(#1619)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Christophe GERARD <50206014+Tirodem@users.noreply.github.com>
Co-authored-by: coyotte508 <coyotte508@protonmail.com>
---
 assets/bebop-b.svg                            | 41 +++++++++++++++++++
 src/lib/server/runtime-config.ts              |  4 ++
 .../config/+page.server.ts                    |  2 +
 .../config/+page.svelte                       |  9 ++++
 .../payment/[paymentId]/qrcode/+server.ts     | 40 +++++++++++++++++-
 src/routes/(app)/pos/session/+page.server.ts  |  4 +-
 src/routes/(app)/pos/session/+page.svelte     |  2 +-
 7 files changed, 98 insertions(+), 4 deletions(-)
 create mode 100644 assets/bebop-b.svg

diff --git a/assets/bebop-b.svg b/assets/bebop-b.svg
new file mode 100644
index 000000000..e46e13d53
--- /dev/null
+++ b/assets/bebop-b.svg
@@ -0,0 +1,41 @@
+<svg
+   viewBox="0 0 370.82057 561.73657"
+   width="370.82059"
+   height="561.73657">
+  <defs
+     id="defs888">
+    <style
+       id="style886">
+      .cls-1 {
+        fill: #31a5dc;
+      }
+
+      .cls-1, .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #003760;
+      }
+    </style>
+  </defs>
+  <g
+     id="g912"
+     transform="translate(0.00245553,-9.1165246e-4)">
+    <g
+       id="g908">
+      <path
+         class="cls-2"
+         d="m 288.49,221.88 c -28.33,-18.71 -62.42,-29.69 -99.69,-30.78 -37.71,-1.11 -75.46,-0.9 -113.24,-0.61 1.53,32.1 13.42,57.87 34.77,76.35 9.6,-0.02 19.67,-0.06 30.76,-0.06 17.6,1.09 39.18,-2.14 60.49,1.55 13.82,2.41 26.27,6.59 37.25,12.58 22.55,12.2 38.95,31.85 48.4,58.73 0.36,-0.23 0.74,-0.48 1.09,-0.73 24,-16.55 42.79,-35.8 56.23,-57.49 -13.92,-24.13 -33.07,-44.37 -56.06,-59.53 z"
+         id="path904" />
+      <path
+         class="cls-2"
+         d="M 289.32,529.15 C 212.45,582.08 110,569.25 47.6,499.98 16.13,465.05 0.44,423.58 0.13,376.51 -0.06,349.65 0.09,322.8 0.09,295.97 c 0,-32.22 0.1,-64.45 -0.09,-96.66 -0.02,-1.62 0.08,-3 0.38,-4.14 0.71,-2.98 2.71,-4.41 7.47,-4.39 22.89,0.06 45.79,-0.15 68.7,-0.29 1.53,32.1 13.42,57.87 34.77,76.35 -9.34,0 -18.23,-0.02 -27.11,-0.17 -5.96,-0.08 -8.44,1.49 -8.38,7.94 0.19,20.2 -0.15,40.42 -0.17,60.62 -0.02,15.18 0.17,30.36 0.88,45.52 2.23,46.74 26.39,80.06 69.79,96.94 42.75,16.63 82.6,8.29 115.42,-23.83 32.55,-31.87 41.47,-71.31 26.5,-114.1 -0.02,-0.04 -0.02,-0.08 -0.04,-0.13 0.36,-0.23 0.74,-0.48 1.09,-0.73 24,-16.55 42.79,-35.8 56.23,-57.49 11.99,20.72 20.09,44.32 23.41,70.07 9.57,74.01 -17.62,134.97 -79.64,177.68 z"
+         id="path906" />
+    </g>
+    <path
+       class="cls-1"
+       d="M 368.96,161.22 C 356.97,68.65 283.27,3.58 189.8,0.85 129.2,-0.94 68.5,0.68 7.86,0.53 1.26,0.51 -0.04,3.24 0,9.06 c 0.19,32.21 0.08,64.44 0.08,96.65 0,26.83 -0.15,53.69 0.04,80.52 0.02,3 0.1,5.98 0.25,8.94 0.71,-2.98 2.71,-4.41 7.47,-4.39 22.89,0.06 45.79,-0.15 68.7,-0.29 v -0.02 c -1.68,-35.3 -0.38,-70.74 -0.71,-106.12 -0.06,-6.45 2.41,-8.04 8.38,-7.94 17.99,0.27 36.01,0.1 57.87,0.1 17.6,1.09 39.18,-2.16 60.49,1.55 42.2,7.33 71.66,31.39 85.69,71.43 8.97,25.64 9.36,50.06 1.22,72.38 -5.42,14.93 -14.66,28.93 -27.72,41.72 -7.01,6.84 -14.32,12.62 -21.94,17.3 -28.03,17.24 -59.86,19.61 -93.48,6.53 -13.59,-5.29 -25.3,-12.2 -35.02,-20.6 -9.34,0 -18.23,-0.02 -27.11,-0.17 -5.96,-0.08 -8.44,1.49 -8.38,7.94 0.19,20.2 -0.15,40.42 -0.17,60.62 61.88,45.82 146.5,49.24 212.55,4.41 0.36,-0.23 0.74,-0.48 1.09,-0.73 24,-16.55 42.79,-35.8 56.23,-57.49 21.33,-34.37 29.29,-74.81 23.41,-120.19 z"
+       id="path910" />
+  </g>
+</svg>
diff --git a/src/lib/server/runtime-config.ts b/src/lib/server/runtime-config.ts
index 29a0c3baa..8dbbef1e9 100644
--- a/src/lib/server/runtime-config.ts
+++ b/src/lib/server/runtime-config.ts
@@ -179,6 +179,7 @@ const baseConfig = {
 		'wss://nos.lol',
 		'wss://relay.snort.social'
 	],
+	removeBebopLogoPOS: false,
 	contactModes: ['email', 'nostr'],
 	posTouchTag: [] as Tag['_id'][],
 	hideCreditCardQrCode: false,
@@ -317,6 +318,9 @@ if (!building) {
 }
 process.on('SIGINT', () => {
 	changeStream?.close().catch(console.error);
+
+	// Todo: keep track of everything instead and close ASAP
+	setTimeout(() => process.exit(0), 8000);
 });
 
 async function refresh(item?: ChangeStreamDocument<RuntimeConfigItem>): Promise<void> {
diff --git a/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.server.ts b/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.server.ts
index 49a60bd94..d6c807d8a 100644
--- a/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.server.ts
+++ b/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.server.ts
@@ -36,6 +36,7 @@ export async function load(event) {
 		disableLanguageSelector: runtimeConfig.disableLanguageSelector,
 		defaultOnLocation: runtimeConfig.defaultOnLocation,
 		cartPreviewInteractive: runtimeConfig.cartPreviewInteractive,
+		removeBebopLogoPOS: runtimeConfig.removeBebopLogoPOS,
 		overwriteCreditCardSvgColor: runtimeConfig.overwriteCreditCardSvgColor,
 		hideCreditCardQrCode: runtimeConfig.hideCreditCardQrCode
 	};
@@ -93,6 +94,7 @@ export const actions = {
 				disableLanguageSelector: z.boolean({ coerce: true }),
 				contactModes: z.string().array(),
 				cartPreviewInteractive: z.boolean({ coerce: true }),
+				removeBebopLogoPOS: z.boolean({ coerce: true }),
 				hideCreditCardQrCode: z.boolean({ coerce: true }),
 				overwriteCreditCardSvgColor: z.boolean({ coerce: true })
 			})
diff --git a/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.svelte b/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.svelte
index 5b286a04c..d6ad33ae7 100644
--- a/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.svelte
+++ b/src/routes/(app)/admin[[hash=admin_hash]]/config/+page.svelte
@@ -205,6 +205,15 @@
 		/>
 		Default enable "this is a fully-paid on-location physical order"
 	</label>
+	<label class="checkbox-label">
+		<input
+			type="checkbox"
+			name="removeBebopLogoPOS"
+			class="form-checkbox"
+			checked={data.removeBebopLogoPOS}
+		/>
+		Remove be-BOP logo from POS QR code
+	</label>
 
 	{#if hasCartLimitProductLine}
 		<label class="form-label">
diff --git a/src/routes/(app)/order/[id]/payment/[paymentId]/qrcode/+server.ts b/src/routes/(app)/order/[id]/payment/[paymentId]/qrcode/+server.ts
index 951ac9a20..72561098d 100644
--- a/src/routes/(app)/order/[id]/payment/[paymentId]/qrcode/+server.ts
+++ b/src/routes/(app)/order/[id]/payment/[paymentId]/qrcode/+server.ts
@@ -1,9 +1,17 @@
 import { collections } from '$lib/server/database';
+import { rootDir } from '$lib/server/root-dir';
 import { bitcoinPaymentQrCodeString } from '$lib/types/Order';
 import { error } from '@sveltejs/kit';
 import qrcode from 'qrcode';
+import { readFileSync } from 'node:fs';
+import { join } from 'node:path';
+import { building } from '$app/environment';
 
-export async function GET({ params }) {
+const bebopLogoSvg = building ? '' : readFileSync(join(rootDir, 'assets/bebop-b.svg'), 'utf-8');
+
+const BEBOP_LOGO_RATIO = 0.2;
+
+export async function GET({ params, url }) {
 	const order = await collections.orders.findOne({ _id: params.id });
 
 	if (!order) {
@@ -28,7 +36,35 @@ export async function GET({ params }) {
 			? bitcoinPaymentQrCodeString(payment.address, payment.price.amount, payment.price.currency)
 			: payment.address;
 
-	return new Response(await qrcode.toString(address, { type: 'svg' }), {
+	let qrcodeString = (await qrcode.toString(address, { type: 'svg' })).trim();
+
+	const showLogo = url.searchParams.get('logo') === 'true';
+
+	if (showLogo) {
+		const viewBox = qrcodeString.match(/viewBox="([^"]+)"/)?.[1];
+		const logoViewBox = bebopLogoSvg.match(/viewBox="([^"]+)"/)?.[1];
+		const logoWidgth = Number(bebopLogoSvg.match(/width="([^"]+)"/)?.[1]);
+		const logoHeight = Number(bebopLogoSvg.match(/height="([^"]+)"/)?.[1]);
+
+		if (viewBox && logoViewBox && !isNaN(logoWidgth) && !isNaN(logoHeight)) {
+			const [x, y, width, height] = viewBox.split(' ').map(Number);
+			// add logo to SVG
+
+			const logoScale = Math.max(width / logoWidgth, height / logoHeight) * BEBOP_LOGO_RATIO;
+			const logoX = x + (width - Number(logoWidgth) * logoScale) / 2;
+			const logoY = y + (height - Number(logoHeight) * logoScale) / 2;
+
+			const logoSvg = `<g transform="translate(${logoX},${logoY}) scale(${logoScale})">${bebopLogoSvg}</g>`;
+			const whiteRectBg = `<rect x="${logoX}" y="${logoY}" width="${
+				logoWidgth * logoScale
+			}" height="${logoHeight * logoScale}" fill="white"/>`;
+			if (qrcodeString.endsWith('</svg>')) {
+				qrcodeString = qrcodeString.slice(0, -'</svg>'.length) + whiteRectBg + logoSvg + '</svg>';
+			}
+		}
+	}
+
+	return new Response(qrcodeString, {
 		headers: { 'content-type': 'image/svg+xml' },
 		status: 200
 	});
diff --git a/src/routes/(app)/pos/session/+page.server.ts b/src/routes/(app)/pos/session/+page.server.ts
index b0fbd0ac5..501fbd892 100644
--- a/src/routes/(app)/pos/session/+page.server.ts
+++ b/src/routes/(app)/pos/session/+page.server.ts
@@ -1,6 +1,7 @@
 import { collections } from '$lib/server/database';
 import { redirect } from '@sveltejs/kit';
 import { formatCart, formatOrder } from './formatCartOrder.js';
+import { runtimeConfig } from '$lib/server/runtime-config.js';
 
 export const load = async ({ locals }) => {
 	if (!locals.user) {
@@ -22,6 +23,7 @@ export const load = async ({ locals }) => {
 	return {
 		cart: formattedCart,
 		order: order && formatOrder(order),
-		layoutReset: true
+		layoutReset: true,
+		removeBebopLogoPOS: runtimeConfig.removeBebopLogoPOS
 	};
 };
diff --git a/src/routes/(app)/pos/session/+page.svelte b/src/routes/(app)/pos/session/+page.svelte
index 034758938..bb415c869 100644
--- a/src/routes/(app)/pos/session/+page.svelte
+++ b/src/routes/(app)/pos/session/+page.svelte
@@ -153,7 +153,7 @@
 			<div class="flex flex-col items-center gap-3">
 				<h1 class="text-3xl text-center">{t('order.singleTitle', { number: order?.number })}</h1>
 				<img
-					src="/order/{order?._id}/payment/{payment?.id}/qrcode"
+					src="/order/{order?._id}/payment/{payment?.id}/qrcode?logo={!data.removeBebopLogoPOS}"
 					alt="QR code"
 					class="h-96 w-96"
 				/>