feat: Reinitialize frontend with SvelteKit and TypeScript

- Delete old Vite+Svelte frontend
- Initialize new SvelteKit project with TypeScript
- Configure Tailwind CSS v4 + DaisyUI
- Implement JWT authentication with auto-refresh
- Create login page with form validation (Zod)
- Add protected route guards
- Update Docker configuration for single-stage build
- Add E2E tests with Playwright (6/11 passing)
- Fix Svelte 5 reactivity with $state() runes

Known issues:
- 5 E2E tests failing (timing/async issues)
- Token refresh implementation needs debugging
- Validation error display timing
This commit is contained in:
2026-02-17 16:19:59 -05:00
parent 54df6018f5
commit de2d83092e
28274 changed files with 3816354 additions and 90 deletions

7
frontend/node_modules/@sveltejs/adapter-node/LICENSE generated vendored Normal file
View File

@@ -0,0 +1,7 @@
Copyright (c) 2020 [these people](https://github.com/sveltejs/kit/graphs/contributors)
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

15
frontend/node_modules/@sveltejs/adapter-node/README.md generated vendored Normal file
View File

@@ -0,0 +1,15 @@
# @sveltejs/adapter-node
[Adapter](https://svelte.dev/docs/kit/adapters) for SvelteKit apps that generates a standalone Node server.
## Docs
[Docs](https://svelte.dev/docs/kit/adapter-node)
## Changelog
[The Changelog for this package is available on GitHub](https://github.com/sveltejs/kit/blob/main/packages/adapter-node/CHANGELOG.md).
## License
[MIT](LICENSE)

View File

@@ -0,0 +1,12 @@
import http from 'node:http';
declare global {
namespace App {
export interface Platform {
/**
* The original Node request object (https://nodejs.org/api/http.html#class-httpincomingmessage)
*/
req: http.IncomingMessage;
}
}
}

View File

@@ -0,0 +1,94 @@
import process from 'node:process';
/* global ENV_PREFIX */
const expected = new Set([
'SOCKET_PATH',
'HOST',
'PORT',
'ORIGIN',
'XFF_DEPTH',
'ADDRESS_HEADER',
'PROTOCOL_HEADER',
'HOST_HEADER',
'PORT_HEADER',
'BODY_SIZE_LIMIT',
'SHUTDOWN_TIMEOUT',
'IDLE_TIMEOUT',
'KEEP_ALIVE_TIMEOUT',
'HEADERS_TIMEOUT'
]);
const expected_unprefixed = new Set(['LISTEN_PID', 'LISTEN_FDS']);
if (ENV_PREFIX) {
for (const name in process.env) {
if (name.startsWith(ENV_PREFIX)) {
const unprefixed = name.slice(ENV_PREFIX.length);
if (!expected.has(unprefixed)) {
throw new Error(
`You should change envPrefix (${ENV_PREFIX}) to avoid conflicts with existing environment variables — unexpectedly saw ${name}`
);
}
}
}
}
/**
* @param {string} name
* @param {any} fallback
*/
function env(name, fallback) {
const prefix = expected_unprefixed.has(name) ? '' : ENV_PREFIX;
const prefixed = prefix + name;
return prefixed in process.env ? process.env[prefixed] : fallback;
}
const integer_regexp = /^\d+$/;
/**
* Throw a consistently-structured parsing error for environment variables.
* @param {string} name
* @param {any} value
* @param {string} description
* @returns {never}
*/
function parsing_error(name, value, description) {
throw new Error(
`Invalid value for environment variable ${name}: ${JSON.stringify(value)} (${description})`
);
}
/**
* Check the environment for a timeout value (non-negative integer) in seconds.
* @param {string} name
* @param {number} [fallback]
* @returns {number | undefined}
*/
function timeout_env(name, fallback) {
const raw = env(name, fallback);
if (!raw) {
return fallback;
}
if (!integer_regexp.test(raw)) {
parsing_error(name, raw, 'should be a non-negative integer');
}
const parsed = Number.parseInt(raw, 10);
// We don't technically need to check `Number.isNaN` because the value already passed the regexp test.
// However, just in case there's some new codepath introduced somewhere down the line, it's probably good
// to stick this in here.
if (Number.isNaN(parsed)) {
parsing_error(name, raw, 'should be a non-negative integer');
}
if (parsed < 0) {
parsing_error(name, raw, 'should be a non-negative integer');
}
return parsed;
}
export { env, timeout_env };

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,345 @@
import http from 'node:http';
import process from 'node:process';
import { handler } from 'HANDLER';
import { env, timeout_env } from 'ENV';
import { setImmediate } from 'node:timers';
import * as qs from 'node:querystring';
/**
* @param {string|RegExp} input The route pattern
* @param {boolean} [loose] Allow open-ended matching. Ignored with `RegExp` input.
*/
function parse$1(input, loose) {
if (input instanceof RegExp) return { keys:false, pattern:input };
var c, o, tmp, ext, keys=[], pattern='', arr = input.split('/');
arr[0] || arr.shift();
while (tmp = arr.shift()) {
c = tmp[0];
if (c === '*') {
keys.push(c);
pattern += tmp[1] === '?' ? '(?:/(.*))?' : '/(.*)';
} else if (c === ':') {
o = tmp.indexOf('?', 1);
ext = tmp.indexOf('.', 1);
keys.push( tmp.substring(1, !!~o ? o : !!~ext ? ext : tmp.length) );
pattern += !!~o && !~ext ? '(?:/([^/]+?))?' : '/([^/]+?)';
if (!!~ext) pattern += (!!~o ? '?' : '') + '\\' + tmp.substring(ext);
} else {
pattern += '/' + tmp;
}
}
return {
keys: keys,
pattern: new RegExp('^' + pattern + (loose ? '(?=$|\/)' : '\/?$'), 'i')
};
}
const MAP = {
"": 0,
GET: 1,
HEAD: 2,
PATCH: 3,
OPTIONS: 4,
CONNECT: 5,
DELETE: 6,
TRACE: 7,
POST: 8,
PUT: 9,
};
class Trouter {
constructor() {
this.routes = [];
this.all = this.add.bind(this, '');
this.get = this.add.bind(this, 'GET');
this.head = this.add.bind(this, 'HEAD');
this.patch = this.add.bind(this, 'PATCH');
this.options = this.add.bind(this, 'OPTIONS');
this.connect = this.add.bind(this, 'CONNECT');
this.delete = this.add.bind(this, 'DELETE');
this.trace = this.add.bind(this, 'TRACE');
this.post = this.add.bind(this, 'POST');
this.put = this.add.bind(this, 'PUT');
}
use(route, ...fns) {
let handlers = [].concat.apply([], fns);
let { keys, pattern } = parse$1(route, true);
this.routes.push({ keys, pattern, method: '', handlers, midx: MAP[''] });
return this;
}
add(method, route, ...fns) {
let { keys, pattern } = parse$1(route);
let handlers = [].concat.apply([], fns);
this.routes.push({ keys, pattern, method, handlers, midx: MAP[method] });
return this;
}
find(method, url) {
let midx = MAP[method];
let isHEAD = (midx === 2);
let i=0, j=0, k, tmp, arr=this.routes;
let matches=[], params={}, handlers=[];
for (; i < arr.length; i++) {
tmp = arr[i];
if (tmp.midx === midx || tmp.midx === 0 || (isHEAD && tmp.midx===1) ) {
if (tmp.keys === false) {
matches = tmp.pattern.exec(url);
if (matches === null) continue;
if (matches.groups !== void 0) for (k in matches.groups) params[k]=matches.groups[k];
tmp.handlers.length > 1 ? (handlers=handlers.concat(tmp.handlers)) : handlers.push(tmp.handlers[0]);
} else if (tmp.keys.length > 0) {
matches = tmp.pattern.exec(url);
if (matches === null) continue;
for (j=0; j < tmp.keys.length;) params[tmp.keys[j]]=matches[++j];
tmp.handlers.length > 1 ? (handlers=handlers.concat(tmp.handlers)) : handlers.push(tmp.handlers[0]);
} else if (tmp.pattern.test(url)) {
tmp.handlers.length > 1 ? (handlers=handlers.concat(tmp.handlers)) : handlers.push(tmp.handlers[0]);
}
} // else not a match
}
return { params, handlers };
}
}
/**
* @typedef ParsedURL
* @type {import('.').ParsedURL}
*/
/**
* @typedef Request
* @property {string} url
* @property {ParsedURL} _parsedUrl
*/
/**
* @param {Request} req
* @returns {ParsedURL|void}
*/
function parse(req) {
let raw = req.url;
if (raw == null) return;
let prev = req._parsedUrl;
if (prev && prev.raw === raw) return prev;
let pathname=raw, search='', query;
if (raw.length > 1) {
let idx = raw.indexOf('?', 1);
if (idx !== -1) {
search = raw.substring(idx);
pathname = raw.substring(0, idx);
if (search.length > 1) {
query = qs.parse(search.substring(1));
}
}
}
return req._parsedUrl = { pathname, search, query, raw };
}
function onError(err, req, res) {
let code = typeof err.status === 'number' && err.status;
code = res.statusCode = (code && code >= 100 ? code : 500);
if (typeof err === 'string' || Buffer.isBuffer(err)) res.end(err);
else res.end(err.message || http.STATUS_CODES[code]);
}
const mount = fn => fn instanceof Polka ? fn.attach : fn;
class Polka extends Trouter {
constructor(opts={}) {
super();
this.parse = parse;
this.server = opts.server;
this.handler = this.handler.bind(this);
this.onError = opts.onError || onError; // catch-all handler
this.onNoMatch = opts.onNoMatch || this.onError.bind(null, { status: 404 });
this.attach = (req, res) => setImmediate(this.handler, req, res);
}
use(base, ...fns) {
if (base === '/') {
super.use(base, fns.map(mount));
} else if (typeof base === 'function' || base instanceof Polka) {
super.use('/', [base, ...fns].map(mount));
} else {
super.use(base,
(req, _, next) => {
if (typeof base === 'string') {
let len = base.length;
base.startsWith('/') || len++;
req.url = req.url.substring(len) || '/';
req.path = req.path.substring(len) || '/';
} else {
req.url = req.url.replace(base, '') || '/';
req.path = req.path.replace(base, '') || '/';
}
if (req.url.charAt(0) !== '/') {
req.url = '/' + req.url;
}
next();
},
fns.map(mount),
(req, _, next) => {
req.path = req._parsedUrl.pathname;
req.url = req.path + req._parsedUrl.search;
next();
}
);
}
return this; // chainable
}
listen() {
(this.server = this.server || http.createServer()).on('request', this.attach);
this.server.listen.apply(this.server, arguments);
return this;
}
handler(req, res, next) {
let info = this.parse(req), path = info.pathname;
let obj = this.find(req.method, req.path=path);
req.url = path + info.search;
req.originalUrl = req.originalUrl || req.url;
req.query = info.query || {};
req.search = info.search;
req.params = obj.params;
if (path.length > 1 && path.indexOf('%', 1) !== -1) {
for (let k in req.params) {
try { req.params[k] = decodeURIComponent(req.params[k]); }
catch (e) { /* malform uri segment */ }
}
}
let i=0, arr=obj.handlers.concat(this.onNoMatch), len=arr.length;
let loop = async () => res.finished || (i < len) && arr[i++](req, res, next);
(next = next || (err => err ? this.onError(err, req, res, next) : loop().catch(next)))(); // init
}
}
function polka (opts) {
return new Polka(opts);
}
const path = env('SOCKET_PATH', false);
const host = env('HOST', '0.0.0.0');
const port = env('PORT', !path && '3000');
const shutdown_timeout = parseInt(env('SHUTDOWN_TIMEOUT', '30'));
const idle_timeout = parseInt(env('IDLE_TIMEOUT', '0'));
const listen_pid = parseInt(env('LISTEN_PID', '0'));
const listen_fds = parseInt(env('LISTEN_FDS', '0'));
// https://www.freedesktop.org/software/systemd/man/latest/sd_listen_fds.html
const SD_LISTEN_FDS_START = 3;
if (listen_pid !== 0 && listen_pid !== process.pid) {
throw new Error(`received LISTEN_PID ${listen_pid} but current process id is ${process.pid}`);
}
if (listen_fds > 1) {
throw new Error(
`only one socket is allowed for socket activation, but LISTEN_FDS was set to ${listen_fds}`
);
}
const socket_activation = listen_pid === process.pid && listen_fds === 1;
let requests = 0;
/** @type {NodeJS.Timeout | void} */
let shutdown_timeout_id;
/** @type {NodeJS.Timeout | void} */
let idle_timeout_id;
// Initialize the HTTP server here so that we can set properties before starting to listen.
// Otherwise, polka delays creating the server until listen() is called. Settings these
// properties after the server has started listening could lead to race conditions.
const httpServer = http.createServer();
const keep_alive_timeout = timeout_env('KEEP_ALIVE_TIMEOUT');
if (keep_alive_timeout !== undefined) {
// Convert the keep-alive timeout from seconds to milliseconds (the unit Node.js expects).
httpServer.keepAliveTimeout = keep_alive_timeout * 1000;
}
const headers_timeout = timeout_env('HEADERS_TIMEOUT');
if (headers_timeout !== undefined) {
// Convert the headers timeout from seconds to milliseconds (the unit Node.js expects).
httpServer.headersTimeout = headers_timeout * 1000;
}
const server = polka({ server: httpServer }).use(handler);
if (socket_activation) {
server.listen({ fd: SD_LISTEN_FDS_START }, () => {
console.log(`Listening on file descriptor ${SD_LISTEN_FDS_START}`);
});
} else {
server.listen({ path, host, port }, () => {
console.log(`Listening on ${path || `http://${host}:${port}`}`);
});
}
/** @param {'SIGINT' | 'SIGTERM' | 'IDLE'} reason */
function graceful_shutdown(reason) {
if (shutdown_timeout_id) return;
// If a connection was opened with a keep-alive header close() will wait for the connection to
// time out rather than close it even if it is not handling any requests, so call this first
httpServer.closeIdleConnections();
httpServer.close((error) => {
// occurs if the server is already closed
if (error) return;
if (shutdown_timeout_id) {
clearTimeout(shutdown_timeout_id);
}
if (idle_timeout_id) {
clearTimeout(idle_timeout_id);
}
// @ts-expect-error custom events cannot be typed
process.emit('sveltekit:shutdown', reason);
});
shutdown_timeout_id = setTimeout(() => httpServer.closeAllConnections(), shutdown_timeout * 1000);
}
httpServer.on(
'request',
/** @param {import('node:http').IncomingMessage} req */
(req) => {
requests++;
if (socket_activation && idle_timeout_id) {
idle_timeout_id = clearTimeout(idle_timeout_id);
}
req.on('close', () => {
requests--;
if (shutdown_timeout_id) {
// close connections as soon as they become idle, so they don't accept new requests
httpServer.closeIdleConnections();
}
if (requests === 0 && socket_activation && idle_timeout) {
idle_timeout_id = setTimeout(() => graceful_shutdown('IDLE'), idle_timeout * 1000);
}
});
}
);
process.on('SIGTERM', graceful_shutdown);
process.on('SIGINT', graceful_shutdown);
export { host, path, port, server };

View File

@@ -0,0 +1,32 @@
import buffer from 'node:buffer';
import { webcrypto } from 'node:crypto';
// `buffer.File` was added in Node 18.13.0 while the `File` global was added in Node 20.0.0
const File = /** @type {import('node:buffer') & { File?: File}} */ (buffer).File;
/** @type {Record<string, any>} */
const globals = {
crypto: webcrypto,
File
};
// exported for dev/preview and node environments
/**
* Make various web APIs available as globals:
* - `crypto`
* - `File`
*/
function installPolyfills() {
for (const name in globals) {
if (name in globalThis) continue;
Object.defineProperty(globalThis, name, {
enumerable: true,
configurable: true,
writable: true,
value: globals[name]
});
}
}
installPolyfills();

View File

@@ -0,0 +1,15 @@
import { Adapter } from '@sveltejs/kit';
import './ambient.js';
declare global {
const ENV_PREFIX: string;
const PRECOMPRESS: boolean;
}
interface AdapterOptions {
out?: string;
precompress?: boolean;
envPrefix?: string;
}
export default function plugin(options?: AdapterOptions): Adapter;

128
frontend/node_modules/@sveltejs/adapter-node/index.js generated vendored Normal file
View File

@@ -0,0 +1,128 @@
import { readFileSync, writeFileSync } from 'node:fs';
import { fileURLToPath } from 'node:url';
import { rollup } from 'rollup';
import { nodeResolve } from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import json from '@rollup/plugin-json';
/**
* @template T
* @template {keyof T} K
* @typedef {Partial<Omit<T, K>> & Required<Pick<T, K>>} PartialExcept
*/
/**
* We use a custom `Builder` type here to support the minimum version of SvelteKit.
* @typedef {PartialExcept<import('@sveltejs/kit').Builder, 'log' | 'rimraf' | 'mkdirp' | 'config' | 'prerendered' | 'routes' | 'createEntries' | 'findServerAssets' | 'generateFallback' | 'generateEnvModule' | 'generateManifest' | 'getBuildDirectory' | 'getClientDirectory' | 'getServerDirectory' | 'getAppPath' | 'writeClient' | 'writePrerendered' | 'writePrerendered' | 'writeServer' | 'copy' | 'compress'>} Builder2_4_0
*/
const files = fileURLToPath(new URL('./files', import.meta.url).href);
/** @type {import('./index.js').default} */
export default function (opts = {}) {
const { out = 'build', precompress = true, envPrefix = '' } = opts;
return {
name: '@sveltejs/adapter-node',
/** @param {Builder2_4_0} builder */
async adapt(builder) {
const tmp = builder.getBuildDirectory('adapter-node');
builder.rimraf(out);
builder.rimraf(tmp);
builder.mkdirp(tmp);
builder.log.minor('Copying assets');
builder.writeClient(`${out}/client${builder.config.kit.paths.base}`);
builder.writePrerendered(`${out}/prerendered${builder.config.kit.paths.base}`);
if (precompress) {
builder.log.minor('Compressing assets');
await Promise.all([
builder.compress(`${out}/client`),
builder.compress(`${out}/prerendered`)
]);
}
builder.log.minor('Building server');
builder.writeServer(tmp);
writeFileSync(
`${tmp}/manifest.js`,
[
`export const manifest = ${builder.generateManifest({ relativePath: './' })};`,
`export const prerendered = new Set(${JSON.stringify(builder.prerendered.paths)});`,
`export const base = ${JSON.stringify(builder.config.kit.paths.base)};`
].join('\n\n')
);
const pkg = JSON.parse(readFileSync('package.json', 'utf8'));
/** @type {Record<string, string>} */
const input = {
index: `${tmp}/index.js`,
manifest: `${tmp}/manifest.js`
};
if (builder.hasServerInstrumentationFile?.()) {
input['instrumentation.server'] = `${tmp}/instrumentation.server.js`;
}
// we bundle the Vite output so that deployments only need
// their production dependencies. Anything in devDependencies
// will get included in the bundled code
const bundle = await rollup({
input,
external: [
// dependencies could have deep exports, so we need a regex
...Object.keys(pkg.dependencies || {}).map((d) => new RegExp(`^${d}(\\/.*)?$`))
],
plugins: [
nodeResolve({
preferBuiltins: true,
exportConditions: ['node']
}),
// @ts-ignore https://github.com/rollup/plugins/issues/1329
commonjs({ strictRequires: true }),
// @ts-ignore https://github.com/rollup/plugins/issues/1329
json()
]
});
await bundle.write({
dir: `${out}/server`,
format: 'esm',
sourcemap: true,
chunkFileNames: 'chunks/[name]-[hash].js'
});
builder.copy(files, out, {
replace: {
ENV: './env.js',
HANDLER: './handler.js',
MANIFEST: './server/manifest.js',
SERVER: './server/index.js',
SHIMS: './shims.js',
ENV_PREFIX: JSON.stringify(envPrefix),
PRECOMPRESS: JSON.stringify(precompress)
}
});
if (builder.hasServerInstrumentationFile?.()) {
builder.instrument?.({
entrypoint: `${out}/index.js`,
instrumentation: `${out}/server/instrumentation.server.js`,
module: {
exports: ['path', 'host', 'port', 'server']
}
});
}
},
supports: {
read: () => true,
instrumentation: () => true
}
};
}

View File

@@ -0,0 +1,62 @@
{
"name": "@sveltejs/adapter-node",
"version": "5.5.3",
"description": "Adapter for SvelteKit apps that generates a standalone Node server",
"keywords": [
"adapter",
"deploy",
"hosting",
"node.js",
"svelte",
"sveltekit"
],
"repository": {
"type": "git",
"url": "git+https://github.com/sveltejs/kit.git",
"directory": "packages/adapter-node"
},
"license": "MIT",
"homepage": "https://svelte.dev/docs/kit/adapter-node",
"type": "module",
"exports": {
".": {
"types": "./index.d.ts",
"import": "./index.js"
},
"./package.json": "./package.json"
},
"types": "index.d.ts",
"files": [
"files",
"index.js",
"index.d.ts",
"ambient.d.ts"
],
"devDependencies": {
"@polka/url": "^1.0.0-next.28",
"@sveltejs/vite-plugin-svelte": "^6.0.0-next.3",
"@types/node": "^18.19.119",
"polka": "^1.0.0-next.28",
"sirv": "^3.0.2",
"typescript": "^5.3.3",
"vitest": "^4.0.0",
"@sveltejs/kit": "^2.51.0"
},
"dependencies": {
"@rollup/plugin-commonjs": "^29.0.0",
"@rollup/plugin-json": "^6.1.0",
"@rollup/plugin-node-resolve": "^16.0.0",
"rollup": "^4.9.5"
},
"peerDependencies": {
"@sveltejs/kit": "^2.4.0"
},
"scripts": {
"dev": "rollup -cw",
"build": "rollup -c",
"test": "vitest run",
"check": "tsc",
"lint": "prettier --check .",
"format": "pnpm lint --write"
}
}