Merge pull request #1 from temporalio/admin

Add Admin page to set/reset limit, fix layout

.github/workflows/docker-publish.yml

@@ -2,21 +2,21 @@ name: Docker
 
 on:
   push:
-    branches: [ "main" ]
+    branches: ['main']
   pull_request:
-    branches: [ "main" ]
+    branches: ['main']
 
 jobs:
   build-and-push-image:
     runs-on: ubuntu-latest
     permissions:
       contents: read
       packages: write
-    
+
     steps:
       - name: Setup Docker buildx
         uses: docker/setup-buildx-action@v3
-      
+
       - name: Log into registry ghcr.io
         if: github.event_name != 'pull_request'
         uses: docker/login-action@v3

src/lib/components/logo.svelte

@@ -45,8 +45,8 @@
 		text-anchor: middle;
 		paint-order: stroke fill;
 		stroke: #000;
-		stroke-width: 16px;
-		letter-spacing: -10px;
+		stroke-width: 12px;
+		letter-spacing: -8px;
 		font-weight: 600;
 		text-transform: uppercase;
 	}

src/lib/components/status-badge.svelte

@@ -38,4 +38,8 @@
 	.customerActionRequired {
 		background-color: lightcoral;
 	}
+
+	.failed {
+		background-color: lightcoral;
+	}
 </style>

src/routes/admin/+page.server.ts

@@ -0,0 +1,7 @@
+import { env } from '$env/dynamic/private';
+
+export const load = async () => {
+	const response = await fetch(`${env.FRAUD_API_URL}/limit`);
+	const { limit } = await response.json();
+	return { limit };
+};

src/routes/admin/+page.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+	import { invalidateAll } from '$app/navigation';
+
+	export let data;
+
+	$: ({ limit } = data);
+
+	$: newLimit = limit || 0;
+
+	const onReset = async () => {
+		await fetch('/api/reset', { method: 'POST' });
+		await invalidateAll();
+	};
+
+	const onLimit = async () => {
+		await fetch('/api/limit', { method: 'POST', body: JSON.stringify({ limit: newLimit }) });
+		await invalidateAll();
+	};
+</script>
+
+<div class="flex items-center justify-start">
+	<h1>Fraud Check</h1>
+	<p>
+		Limit: <strong
+			>{limit
+				? (limit / 100).toLocaleString('en-US', { style: 'currency', currency: 'USD' })
+				: 'Unlimited'}</strong
+		>
+	</p>
+	<input type="number" bind:value={newLimit} />
+	<button on:click={onLimit}>Set Limit</button>
+	<button on:click={onReset}>Reset</button>
+</div>

src/routes/api/limit/+server.ts

@@ -0,0 +1,16 @@
+import { json, type RequestHandler } from '@sveltejs/kit';
+import { env } from '$env/dynamic/private';
+
+export const POST: RequestHandler = async ({ request }) => {
+	const { limit } = await request.json();
+
+	try {
+		const response = await fetch(`${env.FRAUD_API_URL}/limit`, {
+			method: 'POST',
+			body: JSON.stringify({ limit })
+		});
+		return json({ status: 'ok', body: response });
+	} catch (e) {
+		return json({ status: 'error' });
+	}
+};

src/routes/api/reset/+server.ts

@@ -0,0 +1,13 @@
+import { json, type RequestHandler } from '@sveltejs/kit';
+import { env } from '$env/dynamic/private';
+
+export const POST: RequestHandler = async () => {
+	try {
+		const response = await fetch(`${env.FRAUD_API_URL}/reset`, {
+			method: 'POST'
+		});
+		return json({ status: 'ok', body: response });
+	} catch (e) {
+		return json({ status: 'error' });
+	}
+};