API and TUI Updates

frontend/package.json

@@ -14,7 +14,7 @@
 	"devDependencies": {
 		"@internationalized/date": "^3.11.0",
 		"@lucide/svelte": "^0.561.0",
-		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/adapter-static": "^3.0.10",
 		"@sveltejs/kit": "^2.50.2",
 		"@sveltejs/vite-plugin-svelte": "^6.2.4",
 		"@tailwindcss/forms": "^0.5.11",

frontend/src/lib/api.ts

@@ -181,6 +181,19 @@ export async function redeployProject(id: string, commit?: string): Promise<bool
 	}
 }
 
+export async function stopProject(id: string): Promise<boolean> {
+	try {
+		await fetchWithAuth(`/api/projects/${id}/stop`, {
+			method: "POST",
+		});
+		toast.success("Project stopped successfully");
+		return true;
+	} catch (e: any) {
+		toast.error(e.message);
+		return false;
+	}
+}
+
 export async function listProjects(): Promise<Project[] | null> {
 	try {
 		return await fetchWithAuth("/api/projects");

frontend/src/routes/+layout.ts

@@ -1 +1,2 @@
+export const prerender = false;
 export const ssr = false;

frontend/src/routes/projects/[id]/+page.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { onMount, tick } from "svelte";
 	import { page } from "$app/stores";
-	import { getProject, type Project, redeployProject } from "$lib/api";
+	import { getProject, type Project, redeployProject, stopProject } from "$lib/api";
 	import { Button } from "$lib/components/ui/button";
 	import { Card } from "$lib/components/ui/card";
 	import {
@@ -15,6 +15,7 @@
 		Check,
 		Copy,
 		GitCommit,
+		Square,
 	} from "@lucide/svelte";
 	import { toast } from "svelte-sonner";
 
@@ -70,6 +71,15 @@
 		}
 	}
 
+	async function handleStop() {
+		if (!project) return;
+		toast.info("Stopping project...");
+		const success = await stopProject(project.id.toString());
+		if (success) {
+			setTimeout(loadProject, 1000);
+		}
+	}
+
 	function selectDeployment(deployment: any) {
 		if (activeDeploymentId === deployment.id) return;
 
@@ -180,6 +190,16 @@
 							<Play class="h-3.5 w-3.5 mr-2" /> Redeploy
 						{/if}
 					</Button>
+					{#if status === "live" || status === "building"}
+						<Button
+							variant="outline"
+							size="sm"
+							class="h-8"
+							onclick={handleStop}
+						>
+							<Square class="h-3.5 w-3.5 mr-2" /> Stop
+						</Button>
+					{/if}
 					<Button
 						href={latestDeployment?.url}
 						target="_blank"

frontend/svelte.config.js

@@ -1,9 +1,13 @@
-import adapter from '@sveltejs/adapter-auto';
+import adapter from '@sveltejs/adapter-static';
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
 	kit: {
-		adapter: adapter(),
+		adapter: adapter({
+			pages: '../backend/dist',
+			assets: '../backend/dist',
+			fallback: 'index.html'
+		}),
 		alias: {
 			// "@/*": "./path/to/lib/*",
 		}