Initial commit: full-stack Bun + Elysia + React template

Elysia.js API with session-based auth (email/password + Google OAuth), role system (USER/ADMIN/SUPER_ADMIN), Prisma + PostgreSQL, React 19 with Mantine UI, TanStack Router, dark theme, and comprehensive test suite (unit, integration, E2E with Lightpanda). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-01 10:12:19 +08:00
commit 08a1054e3c
57 changed files with 3732 additions and 0 deletions
--- a/index.html
+++ b/index.html
@@ -0,0 +1,69 @@
+<!doctype html>
+<html lang="id" data-mantine-color-scheme="dark">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="color-scheme" content="dark" />
+    <base href="/" />
+    <link rel="icon" type="image/svg+xml" href="/src/logo.svg" />
+    <title>My App</title>
+    <style>
+      /* Prevent white flash — dark background immediately */
+      html, body {
+        margin: 0;
+        padding: 0;
+        background-color: #242424;
+        color: #c1c2c5;
+      }
+
+      /* Splash screen */
+      #splash {
+        position: fixed;
+        inset: 0;
+        z-index: 9999;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background-color: #242424;
+        transition: opacity 0.3s ease;
+      }
+      #splash.fade-out {
+        opacity: 0;
+        pointer-events: none;
+      }
+      .splash-content {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 24px;
+      }
+      .splash-spinner {
+        width: 40px;
+        height: 40px;
+        border: 3px solid #3a3a3a;
+        border-top-color: #339af0;
+        border-radius: 50%;
+        animation: spin 0.8s linear infinite;
+      }
+      .splash-text {
+        font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+        font-size: 14px;
+        color: #909296;
+        letter-spacing: 0.5px;
+      }
+      @keyframes spin {
+        to { transform: rotate(360deg); }
+      }
+    </style>
+  </head>
+  <body>
+    <div id="splash">
+      <div class="splash-content">
+        <div class="splash-spinner"></div>
+        <div class="splash-text">Loading...</div>
+      </div>
+    </div>
+    <div id="root"></div>
+    <script type="module" src="/src/frontend.tsx"></script>
+  </body>
+</html>