wip: start refactoring with nuxt

.pre-commit-config.yaml

@@ -6,7 +6,6 @@ repos:
     hooks:
       - id: trailing-whitespace
       - id: end-of-file-fixer
-      - id: check-yaml
       - id: check-added-large-files
   - repo: https://github.com/psf/black
     rev: 22.10.0
@@ -18,21 +17,3 @@ repos:
       - id: isort
         args:
           - "--profile=black"
-
-  # hooks for the frontend
-  - repo: local
-    hooks:
-      - id: frontend-lint
-        name: frontend-lint
-        description: run linters for frontend
-        types_or: [ javascript, ts, vue ]
-        language: system
-        pass_filenames: false
-        entry: yarn run --cwd=src/mafiasi_link_shortener/frontend/mafiasi_link_shortener lint
-      - id: frontend-typecheck
-        name: frontend-typecheck
-        description: run typescript typecheck for frontend
-        types_or: [ ts, vue ]
-        language: system
-        pass_filenames: false
-        entry: yarn run --cwd=src/mafiasi_link_shortener/frontend/mafiasi_link_shortener type-check

src/mafiasi_link_shortener/frontend/link_shortener_gui/.gitignore

@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example

src/mafiasi_link_shortener/frontend/link_shortener_gui/.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

src/mafiasi_link_shortener/frontend/link_shortener_gui/README.md

@@ -0,0 +1,75 @@
+# Nuxt 3 Minimal Starter
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

src/mafiasi_link_shortener/frontend/link_shortener_gui/app.config.ts

@@ -0,0 +1,5 @@
+export default defineAppConfig({
+    mafiasi: {
+        openidScopes: "openid shortlinks"
+    }
+})

src/mafiasi_link_shortener/frontend/link_shortener_gui/composables/apiClient.ts

@@ -0,0 +1,17 @@
+import {Configuration, LinksApi} from "~/utils/apiClient";
+
+async function useApiConfig(): Promise<Configuration> {
+    const config = useRuntimeConfig();
+    const userManager = useUserManager();
+
+    return new Configuration({
+        basePath: config.public.apiBase,
+        headers: {
+            "Authorization": `Bearer ${(await userManager.getUser())!.access_token}`,
+        }
+    })
+}
+
+export async function useLinksApi(): Promise<LinksApi> {
+    return new LinksApi(await useApiConfig())
+}

src/mafiasi_link_shortener/frontend/link_shortener_gui/nuxt.config.ts

@@ -0,0 +1,12 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+    extends: ["nuxt_layer_mafiasi"],
+    app: {
+        baseURL: "/app",
+    },
+    runtimeConfig: {
+        public: {
+            apiBase: ""
+        }
+    }
+})

src/mafiasi_link_shortener/frontend/mafiasi_link_shortener/openapitools.json → src/mafiasi_link_shortener/frontend/link_shortener_gui/openapitools.json

@@ -2,6 +2,6 @@
   "$schema": "./node_modules/@openapitools/openapi-generator-cli/config.schema.json",
   "spaces": 2,
   "generator-cli": {
-    "version": "6.2.1"
+    "version": "7.1.0"
   }
 }

src/mafiasi_link_shortener/frontend/link_shortener_gui/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "nuxt-app",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev --dotenv .env.dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare",
+    "gen-api-client": "openapi-generator-cli generate -g typescript-fetch -i http://localhost:8000/api/schema -o utils/apiClient/"
+  },
+  "devDependencies": {
+    "@nuxt/devtools": "latest",
+    "@openapitools/openapi-generator-cli": "^2.7.0",
+    "nuxt": "^3.8.1",
+    "vue": "^3.3.8",
+    "vue-router": "^4.2.5"
+  },
+  "dependencies": {
+    "nuxt_layer_mafiasi": "github:fsinfuhh/nuxt_layer_mafiasi"
+  }
+}

src/mafiasi_link_shortener/frontend/link_shortener_gui/pages/index.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+definePageMeta({
+  middleware: ["authenticated"],
+})
+
+const api = await useLinksApi();
+
+const links = await api.linksList();
+</script>
+
+<template>
+  <UContainer>
+    <h1>{{ links }}</h1>
+  </UContainer>
+</template>