create-nuxt-base 0.2.4 → 0.2.6

package/nuxt-base-template/package.json

@@ -25,46 +25,47 @@
     "postbuild": "cd .output/server/node_modules/tslib; npm pkg set 'exports[.].import.node'='./tslib.es6.mjs'"
   },
   "dependencies": {
-    "@egoist/tailwindcss-icons": "1.8.0",
-    "@iconify-json/bi": "1.1.23",
-    "@lenne.tech/nuxt-base": "3.9.0",
-    "@nuxt/image": "1.7.0",
-    "@vee-validate/yup": "4.12.8",
-    "@vueuse/core": "10.10.0",
-    "@vueuse/integrations": "10.10.0",
-    "@vueuse/nuxt": "10.10.0",
+    "@egoist/tailwindcss-icons": "1.8.1",
+    "@iconify-json/bi": "1.2.0",
+    "@lenne.tech/nuxt-base": "3.13.0",
+    "@nuxt/image": "1.8.0",
+    "@vee-validate/yup": "4.13.2",
+    "@vueuse/core": "11.0.3",
+    "@vueuse/integrations": "11.0.3",
+    "@vueuse/nuxt": "11.0.3",
     "ios-pwa-splash": "1.0.0",
-    "pinia": "2.1.7",
-    "tailwind-merge": "2.3.0",
-    "vee-validate": "4.12.8"
+    "pinia": "2.2.2",
+    "tailwind-merge": "2.5.2",
+    "vee-validate": "4.13.2"
   },
   "devDependencies": {
     "@lenne.tech/eslint-config-vue": "0.0.16",
-    "@nuxt/devtools": "1.3.2",
-    "@nuxt/test-utils": "3.13.1",
-    "@nuxtjs/color-mode": "3.4.1",
+    "@nuxt/devtools": "1.4.1",
+    "@nuxt/test-utils": "3.14.1",
+    "@nuxtjs/color-mode": "3.4.4",
     "@nuxtjs/google-fonts": "3.2.0",
-    "@nuxtjs/plausible": "1.0.0",
-    "@nuxtjs/sitemap": "5.2.0",
-    "@nuxtjs/tailwindcss": "6.12.0",
-    "@playwright/test": "1.44.1",
-    "@tailwindcss/forms": "0.5.7",
-    "@tailwindcss/typography": "0.5.13",
-    "@types/node": "20.12.12",
-    "@vitejs/plugin-vue": "5.0.4",
+    "@nuxtjs/plausible": "1.0.2",
+    "@nuxtjs/sitemap": "6.0.0",
+    "@nuxtjs/tailwindcss": "6.12.1",
+    "@playwright/test": "1.46.1",
+    "@tailwindcss/forms": "0.5.8",
+    "@tailwindcss/typography": "0.5.15",
+    "@types/node": "22.5.2",
+    "@vitejs/plugin-vue": "5.1.3",
     "@vue/test-utils": "2.4.6",
-    "eslint": "9.3.0",
-    "jsdom": "24.1.0",
-    "nuxt": "3.11.2",
-    "nuxt-simple-robots": "4.0.0-rc.17",
+    "eslint": "9.9.1",
+    "jsdom": "24.1.3",
+    "nuxt": "3.13.0",
+    "nuxt-simple-robots": "4.0.1",
     "ts-loader": "9.5.1",
-    "typescript": "5.4.5",
-    "vitest": "1.6.0"
+    "typescript": "5.5.4",
+    "vitest": "2.0.5"
   },
   "overrides": {
     "vue": "latest",
     "@nuxt/test-utils": {
-      "vitest": "$vitest"
+      "vitest": "$vitest",
+      "happy-dom": "13.0.0"
     },
     "@lenne.tech/eslint-config-vue": {
       "eslint": "$eslint"

package/nuxt-base-template/src/composables/use-form-helper.ts

@@ -0,0 +1,43 @@
+export function useFormHelper() {
+  const { close, open } = useModal();
+
+  function onReload(dirty: boolean, event: BeforeUnloadEvent) {
+    if (dirty) {
+      event.preventDefault();
+      event.returnValue = '';
+    }
+  }
+
+  async function onNavigate(dirty: boolean) {
+    if (dirty) {
+      const answer = await openConfirmModal();
+      if (!answer) {
+        return false;
+      }
+    }
+    return true;
+  }
+
+  function openConfirmModal() {
+    return new Promise((resolve) => {
+      open({
+        component: 'ModalConfirm', // TODO: Replace with correct component
+        confirm: (confirmed) => {
+          resolve(confirmed);
+          close();
+        },
+        data: {
+          text:
+            'Sind  Sie sich sicher, dass Sie den Vorgang abbrechen möchten?\n' +
+            'Es befinden sich ungesicherte Daten auf dieser Seite.',
+          title: 'Vorsicht, ungesicherte Daten!',
+        },
+      });
+    });
+  }
+
+  return {
+    onNavigate,
+    onReload,
+  };
+}

package/nuxt-base-template/src/layouts/default.vue

@@ -1,13 +1,8 @@
-<script setup lang="ts">
-import { useGlobalMutationLoading, useGlobalQueryLoading } from '@vue/apollo-composable';
-
-const queryLoading = useGlobalQueryLoading();
-const mutationLoading = useGlobalMutationLoading();
-</script>
+<script setup lang="ts"></script>
 
 <template>
   <div>
-    <NuxtLoadingIndicator :loading="queryLoading || mutationLoading" />
+    <NuxtLoadingIndicator />
     <slot></slot>
   </div>
 </template>

package/nuxt-base-template/src/middleware/logged-in.global.ts

@@ -0,0 +1,9 @@
+export default defineNuxtRouteMiddleware((to, from) => {
+  const { accessTokenState } = useAuthState();
+
+  if (to.fullPath === '/auth' || to.fullPath === '/auth/register') {
+    if (accessTokenState?.value) {
+      return navigateTo('/cms');
+    }
+  }
+});

package/nuxt-base-template/src/plugins/auth.server.ts

@@ -2,7 +2,7 @@ import { callWithNuxt, defineNuxtPlugin, useNuxtApp, useRuntimeConfig } from 'nu
 import { ofetch } from 'ofetch';
 
 export default defineNuxtPlugin({
-  enforce: 'post',
+  dependsOn: ['cookies', 'graphql-meta'], // from nuxt-base
   name: 'auth-server',
   async setup() {
     const _nuxt = useNuxtApp();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-nuxt-base",
-  "version": "0.2.4",
+  "version": "0.2.6",
   "description": "Starter to generate a configured environment with VueJS, Nuxt, Tailwind, Eslint, @lenne.tech/nuxt-base, Unit Tests, Cypress etc.",
   "main": "index.js",
   "bin": {
@@ -20,7 +20,7 @@
     "fs-extra": "11.2.0"
   },
   "devDependencies": {
-    "prettier": "3.2.5",
+    "prettier": "3.3.2",
     "standard-version": "9.5.0"
   }
 }

package/nuxt-base-template/src/composables/use-auth-fetch.ts

@@ -1,33 +0,0 @@
-import type { ExtractedRouteMethod, NitroFetchOptions, NitroFetchRequest, TypedInternalResponse } from 'nitropack';
-
-export function useAuthFetch<
-  DefaultT = unknown,
-  DefaultR extends NitroFetchRequest = NitroFetchRequest,
-  T = DefaultT,
-  R extends NitroFetchRequest = DefaultR,
-  O extends NitroFetchOptions<R> = NitroFetchOptions<R>
->(request: R, opts?: O): Promise<TypedInternalResponse<R, T, ExtractedRouteMethod<R, O>>> {
-  const { requestNewToken } = useAuth();
-  const { accessTokenState } = useAuthState();
-  const config = useRuntimeConfig();
-
-  // @ts-expect-error - because of nice types from ofetch <3
-  return $fetch(request, {
-    ...opts,
-    baseURL: config.public.apiUrl,
-    async onRequest(data: any) {
-      if (accessTokenState.value) {
-        data.options.headers = {
-          ...data.options.headers,
-          Authorization: `Bearer ${accessTokenState.value}`,
-        };
-      }
-    },
-    onResponseError: async () => {
-      await requestNewToken();
-    },
-    retry: 3,
-    retryDelay: 500,
-    retryStatusCodes: [401],
-  });
-}