mirror of
https://github.com/lukaszraczylo/traefik-llmgateway.git
synced 2026-10-13 04:58:50 +00:00
Vue 3 + TypeScript + Pinia + Tailwind v4 + shadcn-vue + Chart.js admin panel source under webui/, built with Vite. Views: Overview (providers, redis/cache/retry status, model aliases), Usage (per-user/per-group/total tables with tokensIn/tokensOut/cost + limits), Charts (scope selector, req/tokens(stacked in-out)/cost metric tabs, 24h/30d/12mo window switcher, fed by GET /admin/api/usage/history). Pinia stores: auth (sessionStorage key gate, x-api-key header, 401/403 re-prompt), dashboard (5s poll), history (fetch-on-selection + 30s refresh). Design: deliberate neutral warm-neutral palette with a signature teal accent (no default Inter/purple-gradient/glassmorphism), real typographic hierarchy via the platform UI/mono font stacks (zero external assets - no Google Fonts), dark+light via prefers-color-scheme (no class toggle, no theme switcher). Charts: zero-based bars, honest axes, Okabe-Ito colorblind-safe series, tokens-in/out as a distinguishable stacked pair. vite.config.ts: base '/admin/' (matches admin.go's route layout) and build.modulePreload.polyfill:false (no inline bootstrap script, so the tightened admin CSP needs no 'unsafe-inline'). Code-split: Chart.js (ChartsView) loads lazily, not in the initial bundle. generate.mjs reads dist/ after `vite build` and writes ../admin_assets_gen.go (not committed by this change) - base64-encodes every asset, decoded once at package-var init; documented rationale in the script's own header comment. Hygiene: webui/go.mod walls webui/ off from the repo root's `go build`/ `vet`/`test ./...` (npm's node_modules bundles a stray .go file that would otherwise be swept in); tools/yaegi-check/main.go excludes webui/ from its GOPATH copy for the same reason. webui/ export-ignored (.gitattributes) from release source tarballs; webui/node_modules/ gitignored. tsconfig.app.json/tsconfig.node.json's JSONC comments dropped (TS itself is fine with either; the global pre-commit JSON validator is not) - no config values changed.
32 lines
1.3 KiB
TypeScript
32 lines
1.3 KiB
TypeScript
import { fileURLToPath, URL } from 'node:url'
|
|
|
|
import tailwindcss from '@tailwindcss/vite'
|
|
import vue from '@vitejs/plugin-vue'
|
|
import { defineConfig } from 'vite'
|
|
|
|
// https://vite.dev/config/
|
|
export default defineConfig({
|
|
// admin.go serves this build's index.html at GET /admin and every hashed
|
|
// asset at GET /admin/assets/{hashedname} — the base must match so the
|
|
// emitted index.html's own <script>/<link> references resolve correctly
|
|
// regardless of what path the browser first loaded the page from.
|
|
base: '/admin/',
|
|
plugins: [vue(), tailwindcss()],
|
|
resolve: {
|
|
alias: {
|
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
|
},
|
|
},
|
|
build: {
|
|
// No inline bootstrap script in the emitted index.html (admin.go's CSP
|
|
// ships script-src 'self' with no 'unsafe-inline' — see the Go-side
|
|
// asset-serving comment for the full rationale): Vite's module-preload
|
|
// polyfill is otherwise inlined as a <script> tag, which that CSP would
|
|
// block. Disabling it leaves only <link rel="modulepreload"> hints,
|
|
// which need no script-src allowance at all. The admin panel only ever
|
|
// targets current evergreen browsers (native ES module support), so the
|
|
// polyfill has nothing to do here anyway.
|
|
modulePreload: { polyfill: false },
|
|
},
|
|
})
|