syntaxbullet/AuroraBot-discord
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: fix frontend

Browse Source
This commit is contained in:
syntaxbullet
2026-01-08 17:01:36 +01:00
parent d37059d50f
commit 05f27ca604
2 changed files with 69 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
web/src/index.html
View File

@@ -10,6 +10,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script type="module" src="./frontend.tsx"></script>
</body> </body>
</html> </html>

98
web/src/server.ts
View File

@@ -4,7 +4,8 @@
* This allows the server to be started in-process from the main application. * This allows the server to be started in-process from the main application.
*/ */
import { serve } from "bun"; import { serve, spawn, type Subprocess } from "bun";
import { join, resolve, dirname } from "path";
export interface WebServerConfig { export interface WebServerConfig {
port?: number; port?: number;
@@ -20,32 +21,78 @@ export interface WebServerInstance {
/** /**
* Creates and starts the web server. * Creates and starts the web server.
* *
* IMPORTANT: This function must be called from within the web project directory * Automatically handles building the frontend:
* or the bundler won't resolve paths correctly. Use `startWebServerFromRoot` * - In development: Spawns 'bun run build.ts --watch'
* if calling from the main application. * - In production: Assumes 'dist' is already built (or builds once)
*/ */
export async function createWebServer(config: WebServerConfig = {}): Promise<WebServerInstance> { export async function createWebServer(config: WebServerConfig = {}): Promise<WebServerInstance> {
const { port = 3000, hostname = "localhost" } = config; const { port = 3000, hostname = "localhost" } = config;
// Dynamic import of the HTML to ensure bundler context is correct // Resolve directories
const index = await import("./index.html"); // server.ts is in web/src/, so we go up one level to get web/
const currentDir = dirname(new URL(import.meta.url).pathname);
const webRoot = resolve(currentDir, "..");
const distDir = join(webRoot, "dist");
// Manage build process in development
let buildProcess: Subprocess | undefined;
const isDev = process.env.NODE_ENV !== "production";
if (isDev) {
console.log("🛠️ Starting Web Bundler in Watch Mode...");
try {
buildProcess = spawn(["bun", "run", "build.ts", "--watch"], {
cwd: webRoot,
stdout: "inherit",
stderr: "inherit",
});
} catch (error) {
console.error("Failed to start build process:", error);
}
}
const server = serve({ const server = serve({
port, port,
hostname, hostname,
routes: { async fetch(req) {
// Serve index.html for all unmatched routes (SPA catch-all) const url = new URL(req.url);
"/*": index.default,
// API routes
if (url.pathname === "/api/health") {
return Response.json({ status: "ok", timestamp: Date.now() });
}
// Static File Serving
let pathName = url.pathname;
if (pathName === "/") pathName = "/index.html";
"/api/health": () => Response.json({ status: "ok", timestamp: Date.now() }), // Construct safe file path
// Remove leading slash to join correctly
const safePath = join(distDir, pathName.replace(/^\//, ""));
// Security check: ensure path is within distDir
if (!safePath.startsWith(distDir)) {
return new Response("Forbidden", { status: 403 });
}
const fileRef = Bun.file(safePath);
if (await fileRef.exists()) {
return new Response(fileRef);
}
// SPA Fallback: Serve index.html for unknown non-file routes
// If the path looks like a file (has extension), return 404
// Otherwise serve index.html
const parts = pathName.split("/");
const lastPart = parts[parts.length - 1];
if (lastPart?.includes(".")) {
return new Response("Not Found", { status: 404 });
}
return new Response(Bun.file(join(distDir, "index.html")));
}, },
development: process.env.NODE_ENV !== "production" && { development: isDev,
hmr: true,
console: true,
},
}); });
const url = `http://${hostname}:${port}`; const url = `http://${hostname}:${port}`;
@@ -54,6 +101,9 @@ export async function createWebServer(config: WebServerConfig = {}): Promise<Web
server, server,
url, url,
stop: async () => { stop: async () => {
if (buildProcess) {
buildProcess.kill();
}
server.stop(true); server.stop(true);
}, },
}; };
@@ -61,25 +111,13 @@ export async function createWebServer(config: WebServerConfig = {}): Promise<Web
/** /**
* Starts the web server from the main application root. * Starts the web server from the main application root.
* Handles the working directory context switch needed for bundler resolution. * Kept for backward compatibility, but assumes webProjectPath is handled internally or ignored
* in favor of relative path resolution from this file.
*/ */
export async function startWebServerFromRoot( export async function startWebServerFromRoot(
webProjectPath: string, webProjectPath: string,
config: WebServerConfig = {} config: WebServerConfig = {}
): Promise<WebServerInstance> { ): Promise<WebServerInstance> {
const originalCwd = process.cwd(); // Current implementation doesn't need CWD switching thanks to absolute path resolution
return createWebServer(config);
try {
// Change to web project directory for correct bundler resolution
process.chdir(webProjectPath);
const instance = await createWebServer(config);
console.log(`🌐 Web server running at ${instance.url}`);
return instance;
} finally {
// Restore original working directory
process.chdir(originalCwd);
}
} }