From 26b42153ce4ccfd96063cb4581341c42075f05aa Mon Sep 17 00:00:00 2001
From: gsovereignty <gsovereignty@proton.me>
Date: Wed, 14 Aug 2024 20:21:03 +0800
Subject: [PATCH] problem: users can accidentally buy testnet merits

---
 src/components/AssociateBitcoinAddress.svelte |   2 +-
 src/components/Heading.svelte                 |  10 +-
 src/lib/event_helpers/rockets.ts              |   3 +
 src/routes/buymerits/+page.svelte             | 122 +++++++++++-------
 4 files changed, 90 insertions(+), 47 deletions(-)

diff --git a/src/components/AssociateBitcoinAddress.svelte b/src/components/AssociateBitcoinAddress.svelte
index 958e92d..77a402f 100644
--- a/src/components/AssociateBitcoinAddress.svelte
+++ b/src/components/AssociateBitcoinAddress.svelte
@@ -76,7 +76,7 @@
 <Heading title="Sponsor a Contributor" />
 Contributors who need Sats are able to list their Merits for sale, to sponsor them simply buy some of
 their Merits.
-<Card.Root>
+<Card.Root class="m-2 mb-4">
 	<Card.Header><Card.Title>Your Bitcoin Addresses</Card.Title></Card.Header>
 	<Card.Content>
 		<div class="m-2 flex">
diff --git a/src/components/Heading.svelte b/src/components/Heading.svelte
index a795978..744b69a 100644
--- a/src/components/Heading.svelte
+++ b/src/components/Heading.svelte
@@ -1,11 +1,17 @@
 <script lang="ts">
-	export let title: string | undefined;
+	export let title: string | undefined = undefined;
 </script>
 
 {#if title}
 	<div class="my-4 flex items-center">
-		<h1 class="scroll-m-20 text-xl font-semibold tracking-tight md:text-3xl">
+		<h1 class="scroll-m-20 text-xl font-semibold md:text-3xl">
 			{title}
 		</h1>
 	</div>
+{:else}
+	<div class="my-4 flex items-center">
+		<h1 class="scroll-m-20 text-xl font-semibold md:text-3xl">
+			<slot />
+		</h1>
+	</div>
 {/if}
diff --git a/src/lib/event_helpers/rockets.ts b/src/lib/event_helpers/rockets.ts
index e37138b..03a83b2 100644
--- a/src/lib/event_helpers/rockets.ts
+++ b/src/lib/event_helpers/rockets.ts
@@ -9,6 +9,9 @@ import { BloomFilter } from 'bloomfilter';
 
 export class Rocket {
 	Event: NDKEvent;
+	Testnet(): boolean {
+		return this.Name().toLowerCase().includes('test');
+	}
 	ATag(): NDKTag {
 		return ['a', `31108:${this.Event.pubkey}:${this.Event.dTag}`];
 	}
diff --git a/src/routes/buymerits/+page.svelte b/src/routes/buymerits/+page.svelte
index b1b1c47..9de9f50 100644
--- a/src/routes/buymerits/+page.svelte
+++ b/src/routes/buymerits/+page.svelte
@@ -15,11 +15,15 @@
 	import BuyAmr from '../../components/BuyAMR.svelte';
 	import { goto } from '$app/navigation';
 	import { base } from '$app/paths';
+	import * as Card from '@/components/ui/card';
+	import { Badge } from '@/components/ui/badge';
 	let rocketEvents = $ndk.storeSubscribe([{ kinds: [31108 as number] }], { subId: 'all_rockets' });
 	onDestroy(() => {
 		rocketEvents?.unsubscribe();
 	});
 
+	let dev = false;
+
 	let rockets = derived(rocketEvents, ($rocketEvents) => {
 		let m = new Map<string, NDKEvent>();
 		for (let e of $rocketEvents) {
@@ -134,6 +138,10 @@
 	});
 
 	transactions.subscribe((t) => {});
+
+	function getRocketClass(rocket: Rocket): string {
+		return rocket.Testnet() ? 'dark:border-red-600' : '';
+	}
 </script>
 
 {#if $nostrocket}<AssociateBitcoinAddress rocket={$nostrocket} />
@@ -142,51 +150,77 @@
 {#if $currentUser}
 	{#each $pendingSales as [rocket, amr] (rocket.Event.id)}
 		{#if amr.length > 0}
-			<Heading title={`ROCKET: ${rocket.Name()}`} />
-			<Table.Root>
-				<Table.Header>
-					<Table.Row>
-						<Table.Head class="w-[10px]">Seller</Table.Head>
-						<Table.Head class="w-[10px]">AMR</Table.Head>
-						<Table.Head class="w-[10px]">Merits</Table.Head>
-						<Table.Head class="w-[150px] text-right">Current Price (sats)</Table.Head>
-						<Table.Head>Status</Table.Head>
-						<Table.Head>Receiving Address</Table.Head>
-						<Table.Head></Table.Head>
-					</Table.Row>
-				</Table.Header>
-				<Table.Body>
-					{#each amr as p (p.AMRIDs)}
-						<Table.Row>
-							<Table.Cell
-								><Avatar
-									ndk={$ndk}
-									pubkey={p.Owner}
-									class="aspect-square w-10 flex-none rounded-full object-cover"
-								/></Table.Cell
+			<Card.Root class={getRocketClass(rocket)}>
+				<Card.CardHeader>
+					<div class="flex flex-nowrap place-items-stretch">
+						<h3 class=" mr-auto text-nowrap text-2xl">
+							{`ROCKET: ${rocket.Name().toUpperCase()}`}
+						</h3>
+						{#if rocket.Testnet()}<Badge
+								variant="destructive"
+								class="flex h-8 shrink-0 items-center justify-center rounded-sm"
 							>
-							<Table.Cell
-								>{p.AMRIDs.length > 1 ? 'multiple' : p.AMRIDs[0].substring(0, 12)}</Table.Cell
-							>
-							<Table.Cell>{p.Merits}</Table.Cell>
-							<Table.Cell class="text-right">{p.Merits}</Table.Cell>
-							<Table.Cell
-								>{p.Status(rocket, $bitcoinTip.height, $transactions.get(p.RxAddress))}</Table.Cell
-							>
-							<Table.Cell
-								on:click={() => {
-									console.log($transactions.get(p.RxAddress)?.From());
-								}}>{p.RxAddress}</Table.Cell
-							>
-							<Table.Cell
-								>{#if p.Status(rocket, $bitcoinTip.height, $transactions.get(p.RxAddress)) == 'OPEN'}<BuyAmr
-										auction={p}
-									/>{/if}</Table.Cell
-							>
-						</Table.Row>
-					{/each}
-				</Table.Body>
-			</Table.Root>
+								<span
+									on:click={() => {
+										dev = true;
+										alert(
+											'dev mode enabled, refresh page if this was unintentional or you may lose sats'
+										);
+									}}>TESTNET</span
+								>
+							</Badge>{/if}
+					</div>
+					<Heading></Heading>
+					<Table.Root>
+						<Table.Header>
+							<Table.Row>
+								<Table.Head class="w-[10px]">Seller</Table.Head>
+								<Table.Head class="w-[10px]">AMR</Table.Head>
+								<Table.Head class="w-[10px]">Merits</Table.Head>
+								<Table.Head class="w-[150px] text-right">Current Price (sats)</Table.Head>
+								<Table.Head>Status</Table.Head>
+								<Table.Head>Receiving Address</Table.Head>
+								<Table.Head></Table.Head>
+							</Table.Row>
+						</Table.Header>
+						<Table.Body>
+							{#each amr as p (p.AMRIDs)}
+								<Table.Row>
+									<Table.Cell
+										><Avatar
+											ndk={$ndk}
+											pubkey={p.Owner}
+											class="aspect-square w-10 flex-none rounded-full object-cover"
+										/></Table.Cell
+									>
+									<Table.Cell
+										>{p.AMRIDs.length > 1 ? 'multiple' : p.AMRIDs[0].substring(0, 12)}</Table.Cell
+									>
+									<Table.Cell>{p.Merits}</Table.Cell>
+									<Table.Cell class="text-right">{p.Merits}</Table.Cell>
+									<Table.Cell
+										>{p.Status(
+											rocket,
+											$bitcoinTip.height,
+											$transactions.get(p.RxAddress)
+										)}</Table.Cell
+									>
+									<Table.Cell
+										on:click={() => {
+											console.log($transactions.get(p.RxAddress)?.From());
+										}}>{p.RxAddress}</Table.Cell
+									>
+									<Table.Cell
+										>{#if p.Status(rocket, $bitcoinTip.height, $transactions.get(p.RxAddress)) == 'OPEN' && (!rocket.Testnet() || dev)}<BuyAmr
+												auction={p}
+											/>{/if}</Table.Cell
+									>
+								</Table.Row>
+							{/each}
+						</Table.Body>
+					</Table.Root>
+				</Card.CardHeader>
+			</Card.Root>
 		{/if}
 	{/each}
 {:else}<Login />{/if}