Transition to Svelte 5 + shadcn (#315)

* Start Svelte 5 migration

* Update pnpm-lock.yaml

* Update svelte

* More Svelte5 + shadcn conversion

* More conversion towards shadcn-ui

* Update dependencies

* Enable single bundle builds

* More fixes

* Improve UI more

* pnpm run format

* oops

* Replace rest of fontawesome icons with lucide

* Update dependencies

* Finish Svelte5 transition

* Some more minor final UI tweaks

* Maybe fix tests

Author: hhvrc

data/.gitkeep

@@ -7,7 +7,12 @@ node_modules
 .env.*
 !.env.example
 
-# Ignore files for PNPM, NPM and YARN
+# Package Managers
 pnpm-lock.yaml
 package-lock.json
 yarn.lock
+
+# Generated or imported files
+/components.json
+/src/lib/_fbs
+/src/lib/components/ui

frontend/.eslintignore

@@ -1,10 +1,24 @@
-.DS_Store
+test-results
 node_modules
-/build
+
+# Output
+.output
+.vercel
+.netlify
+.wrangler
 /.svelte-kit
-/package
+/build
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Env
 .env
 .env.*
 !.env.example
+!.env.test
+
+# Vite
 vite.config.js.timestamp-*
 vite.config.ts.timestamp-*

frontend/.eslintrc.cjs

@@ -1 +1 @@
-engine-strict=true
+engine-strict=true

frontend/.gitignore

@@ -7,7 +7,12 @@ node_modules
 .env.*
 !.env.example
 
-# Ignore files for PNPM, NPM and YARN
+# Package Managers
 pnpm-lock.yaml
 package-lock.json
 yarn.lock
+
+# Generated or imported files
+/components.json
+/src/lib/_fbs
+/src/lib/components/ui

frontend/.npmrc

@@ -5,8 +5,7 @@
   "singleQuote": true,
   "trailingComma": "es5",
   "printWidth": 100,
-  "plugins": ["prettier-plugin-svelte"],
-  "pluginSearchDirs": ["."],
+  "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
   "overrides": [
     { "files": "*.svelte", "options": { "parser": "svelte" } },
     { "files": "package*.json", "options": { "tabWidth": 2, "useTabs": true } }

frontend/.prettierignore

@@ -0,0 +1,17 @@
+{
+	"$schema": "https://next.shadcn-svelte.com/schema.json",
+	"style": "default",
+	"tailwind": {
+		"config": "tailwind.config.ts",
+		"css": "src\\app.tcss",
+		"baseColor": "slate"
+	},
+	"aliases": {
+		"components": "$lib/components",
+		"utils": "$lib/utils",
+		"ui": "$lib/components/ui",
+		"hooks": "$lib/hooks"
+	},
+	"typescript": true,
+	"registry": "https://next.shadcn-svelte.com/registry"
+}

frontend/.prettierrc

@@ -0,0 +1,6 @@
+import { expect, test } from '@playwright/test';
+
+test('home page has expected h3', async ({ page }) => {
+  await page.goto('/');
+  await expect(page.locator('h3')).toBeVisible();
+});

frontend/components.json

@@ -0,0 +1,34 @@
+import prettier from 'eslint-config-prettier';
+import js from '@eslint/js';
+import { includeIgnoreFile } from '@eslint/compat';
+import svelte from 'eslint-plugin-svelte';
+import globals from 'globals';
+import { fileURLToPath } from 'node:url';
+import ts from 'typescript-eslint';
+const gitignorePath = fileURLToPath(new URL('./.gitignore', import.meta.url));
+
+export default ts.config(
+  includeIgnoreFile(gitignorePath),
+  js.configs.recommended,
+  ...ts.configs.recommended,
+  ...svelte.configs['flat/recommended'],
+  prettier,
+  ...svelte.configs['flat/prettier'],
+  {
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.node,
+      },
+    },
+  },
+  {
+    files: ['**/*.svelte'],
+
+    languageOptions: {
+      parserOptions: {
+        parser: ts.parser,
+      },
+    },
+  }
+);