chore: Upgrade Node and Nuxt (#6240)

frontend/composables/api/use-app-info.ts

@@ -1,16 +1,13 @@
-import { useAsyncKey } from "../use-utils";
 import type { AppInfo } from "~/lib/api/types/admin";
 
 export function useAppInfo(): Ref<AppInfo | null> {
-  const appInfo = ref<null | AppInfo>(null);
-
   const i18n = useI18n();
   const { $axios } = useNuxtApp();
   $axios.defaults.headers.common["Accept-Language"] = i18n.locale.value;
 
-  useAsyncData(useAsyncKey(), async () => {
+  const { data: appInfo } = useAsyncData("app-info", async () => {
     const data = await $axios.get<AppInfo>("/api/app/about");
-    appInfo.value = data.data;
+    return data.data;
   });
 
   return appInfo;

frontend/eslint.config.mjs

@@ -1,10 +1,10 @@
 // @ts-check
-import stylisticJs from "@stylistic/eslint-plugin-js";
+import stylistic from "@stylistic/eslint-plugin";
 import withNuxt from "./.nuxt/eslint.config.mjs";
 
 export default withNuxt({
   plugins: {
-    "@stylistic/js": stylisticJs,
+    "@stylistic": stylistic,
   },
   // Your custom configs here
   rules: {
@@ -14,11 +14,13 @@ export default withNuxt({
     "object-curly-newline": "off",
     "consistent-list-newline": "off",
     "vue/first-attribute-linebreak": "off",
-    "@stylistic/js/no-tabs": ["error", { allowIndentationTabs: true }],
     "@stylistic/no-tabs": ["error", { allowIndentationTabs: true }],
     "@stylistic/no-mixed-spaces-and-tabs": ["error", "smart-tabs"],
     "vue/max-attributes-per-line": "off",
     "vue/html-indent": "off",
     "vue/html-closing-bracket-newline": "off",
+    // TODO: temporarily off to get this PR in without a crazy diff
+    "@stylistic/indent": "off",
+    "@stylistic/operator-linebreak": "off",
   },
 });

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mealie",
-"version": "3.2.1",
+  "version": "3.2.1",
   "private": true,
   "scripts": {
     "dev": "nuxt dev",
@@ -21,17 +21,17 @@
     "@mdi/js": "^7.4.47",
     "@nuxt/fonts": "^0.11.4",
     "@nuxtjs/i18n": "^9.2.1",
-    "@sidebase/nuxt-auth": "0.10.0",
-    "@vite-pwa/nuxt": "0.10.6",
+    "@sidebase/nuxt-auth": "^1.1.0",
+    "@vite-pwa/nuxt": "^0.10.6",
     "@vueuse/core": "^12.7.0",
     "axios": "^1.8.1",
     "date-fns": "^4.1.0",
     "fuse.js": "^7.1.0",
-    "isomorphic-dompurify": "^2.22.0",
+    "isomorphic-dompurify": "^2.28.0",
     "json-editor-vue": "^0.18.1",
     "marked": "^15.0.12",
     "next-auth": "~4.24.0",
-    "nuxt": "^3.15.4",
+    "nuxt": "^3.19.2",
     "vite": "^6.2.0",
     "vue-advanced-cropper": "^2.8.9",
     "vue-draggable-plus": "^0.6.0",
@@ -39,11 +39,11 @@
     "vuetify-nuxt-module": "^0.18.3"
   },
   "devDependencies": {
-    "@nuxt/eslint": "1.2.0",
+    "@nuxt/eslint": "^1.2.0",
     "@nuxt/types": "^2.18.1",
     "@nuxtjs/eslint-config-typescript": "^12.1.0",
     "@nuxtjs/eslint-module": "^4.1.0",
-    "@stylistic/eslint-plugin-js": "^4.2.0",
+    "@stylistic/eslint-plugin": "^5.4.0",
     "@types/sortablejs": "^1.15.8",
     "eslint": "^9.22.0",
     "eslint-config-prettier": "^10.0.2",
@@ -54,7 +54,7 @@
     "lint-staged": "^15.4.3",
     "prettier": "^3.5.2",
     "sass-embedded": "^1.85.1",
-    "typescript": "5.3",
+    "typescript": "^5.3",
     "vite-plugin-commonjs": "^0.10.4",
     "vitest": "^3.0.7"
   },

frontend/pages/login.vue

@@ -110,7 +110,7 @@
           </v-card-actions>
 
           <div
-            v-if="allowOidc && allowPasswordLogin"
+            v-if="appInfoLoaded && allowOidc && allowPasswordLogin"
             class="d-flex my-4 justify-center align-center"
             width="80%"
           >
@@ -126,7 +126,7 @@
             </span>
           </div>
           <v-card-actions
-            v-if="allowOidc"
+            v-if="appInfoLoaded && allowOidc"
             class="justify-center"
           >
             <div class="max-button">
@@ -270,6 +270,7 @@ export default defineNuxtComponent({
 
     const { passwordIcon, inputType, togglePasswordShow } = usePasswordField();
 
+    const appInfoLoaded = computed(() => appInfo.value !== null);
     const allowSignup = computed(() => appInfo.value?.allowSignup || false);
     const allowOidc = computed(() => appInfo.value?.enableOidc || false);
     const oidcRedirect = computed(() => appInfo.value?.oidcRedirect || false);
@@ -277,7 +278,7 @@ export default defineNuxtComponent({
     const allowPasswordLogin = computed(() => appInfo.value?.allowPasswordLogin ?? true);
 
     whenever(
-      () => allowOidc.value && oidcRedirect.value && !isCallback() && !isDirectLogin() /* && !$auth.check().valid */,
+      () => appInfoLoaded.value && allowOidc.value && oidcRedirect.value && !isCallback() && !isDirectLogin() /* && !$auth.check().valid */,
       () => oidcAuthenticate(),
       { immediate: true },
     );
@@ -359,6 +360,7 @@ export default defineNuxtComponent({
       isDark,
       form,
       loggingIn,
+      appInfoLoaded,
       allowSignup,
       allowPasswordLogin,
       allowOidc,

frontend/plugins/axios.ts

@@ -6,16 +6,15 @@ export default defineNuxtPlugin(() => {
   const axiosInstance = axios.create({
     // timeout removed to allow backend to handle timeouts
     baseURL: "/", // api calls already pass with /api
-    headers: {
-      Authorization: "Bearer " + useCookie(tokenName).value,
-    },
     withCredentials: true,
   });
 
-  // Add request interceptor
   axiosInstance.interceptors.request.use(
     (config) => {
-      // You can add auth tokens or other headers here
+      const token = useCookie(tokenName).value;
+      if (token) {
+        config.headers.Authorization = `Bearer ${token}`;
+      }
       return config;
     },
     (error) => {