feat: support custom headers for sanctum client instance

.github/workflows/validation.yml

@@ -52,7 +52,7 @@ jobs:
 
             - name: Run TypeCheck
               run: |
-                  ${{ env.script_command }} types
+                  ${{ env.script_command }} test:types
 
             - name: Run tests
               run: |

package.json

@@ -23,17 +23,17 @@
     "dist"
   ],
   "scripts": {
-    "prepack": "nuxt-module-build",
+    "prepack": "nuxt-module-build build",
     "dev": "nuxi dev playground",
     "dev:build": "nuxi build playground",
-    "dev:prepare": "nuxt-module-build --stub && nuxt-module-build prepare && nuxi prepare playground",
+    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
     "lint": "eslint .",
     "fmt": "prettier --write .",
     "fmt:check": "prettier --check .",
-    "types": "nuxi typecheck",
     "test": "vitest run",
     "test:watch": "vitest watch",
-    "validate": "npm run fmt:check && npm run lint && npm run types && npm run test",
+    "test:types": "nuxi typecheck",
+    "validate": "npm run fmt:check && npm run lint && npm run test:types && npm run test",
     "release": "npm run validate && npm run prepack && changelogen --release && npm publish && git push"
   },
   "dependencies": {
@@ -42,8 +42,8 @@
   },
   "devDependencies": {
     "@nuxt/devtools": "latest",
-    "@nuxt/eslint-config": "^0.2.0",
-    "@nuxt/module-builder": "^0.5.5",
+    "@nuxt/eslint-config": "^0.3.13",
+    "@nuxt/module-builder": "^0.7.0",
     "@nuxt/schema": "^3.9.0",
     "@nuxt/test-utils": "^3.9.0",
     "@types/node": "^20.11.13",
@@ -52,15 +52,16 @@
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-prettier": "^5.0.0",
     "h3": "^1.10.1",
+    "nitropack": "^2.9.6",
     "nuxi": "^3.10.0",
-    "nuxt": "^3.10.0",
+    "nuxt": "^3.11.2",
     "prettier": "^3.0.3",
-    "typescript": "^5.2.2",
+    "typescript": "^5.4.5",
     "vite": "^4.4.9",
     "vitest": "^1.2.2",
     "vue": "^3.3.4",
     "vue-router": "^4.2.5",
-    "vue-tsc": "^1.8.26"
+    "vue-tsc": "^2.0.19"
   },
   "packageManager": "[email protected]"
-}
+}

playground/app.config.ts

@@ -0,0 +1,26 @@
+import type { FetchContext } from 'ofetch';
+import type { ConsolaInstance } from 'consola';
+import type { NuxtApp } from '#app';
+import { defineAppConfig } from '#imports';
+
+export default defineAppConfig({
+    sanctum: {
+        interceptors: {
+            onRequest: async (
+                app: NuxtApp,
+                ctx: FetchContext,
+                logger: ConsolaInstance
+            ) => {
+                logger.debug(`custom onRequest interceptor (${ctx.request})`);
+            },
+
+            onResponse: async (
+                app: NuxtApp,
+                ctx: FetchContext,
+                logger: ConsolaInstance
+            ) => {
+                logger.debug(`custom onResponse interceptor (${ctx.request})`);
+            },
+        },
+    },
+});

playground/nuxt.config.ts

@@ -3,7 +3,7 @@ export default defineNuxtConfig({
     ssr: true,
     typescript: {
         strict: true,
-        typeCheck: true,
+        typeCheck: false, // disabled due to https://github.com/vuejs/language-tools/issues/3969
     },
 
     modules: ['../src/module'],

playground/pages/login.vue

@@ -48,6 +48,7 @@ async function onFormSubmit() {
             <input
                 id="email"
                 v-model="credentials.email"
+                autocomplete="username"
                 type="text"
                 name="email"
             />

playground/server/tsconfig.json

@@ -1,3 +1,3 @@
 {
-    "extends": "../.nuxt/tsconfig.server.json",
+    "extends": "../.nuxt/tsconfig.server.json"
 }

playground/tsconfig.json

@@ -1,4 +1,3 @@
 {
-    "extends": "./.nuxt/tsconfig.json",
-    "exclude": ["../dist"],
+    "extends": "./.nuxt/tsconfig.json"
 }

src/config.ts

@@ -0,0 +1,31 @@
+import type { SanctumModuleOptions } from './runtime/types';
+
+export const defaultModuleOptions: Partial<SanctumModuleOptions> = {
+    userStateKey: 'sanctum.user.identity',
+    redirectIfAuthenticated: false,
+    endpoints: {
+        csrf: '/sanctum/csrf-cookie',
+        login: '/login',
+        logout: '/logout',
+        user: '/api/user',
+    },
+    csrf: {
+        cookie: 'XSRF-TOKEN',
+        header: 'X-XSRF-TOKEN',
+    },
+    client: {
+        retry: false,
+    },
+    redirect: {
+        keepRequestedRoute: false,
+        onLogin: '/',
+        onLogout: '/',
+        onAuthOnly: '/login',
+        onGuestOnly: '/',
+    },
+    globalMiddleware: {
+        enabled: false,
+        allow404WithoutAuth: true,
+    },
+    logLevel: 3,
+};

src/index.d.ts

@@ -1,12 +1,17 @@
 import type {
     SanctumModuleOptions,
     SanctumGlobalMiddlewarePageMeta,
+    SanctumAppConfig,
 } from './runtime/types';
 
 declare module 'nuxt/schema' {
     interface PublicRuntimeConfig {
         sanctum: Partial<SanctumModuleOptions>;
     }
+
+    interface AppConfig {
+        sanctum?: SanctumAppConfig;
+    }
 }
 
 declare module '#app' {

src/module.ts

@@ -8,63 +8,36 @@ import {
 } from '@nuxt/kit';
 import { defu } from 'defu';
 import type { SanctumModuleOptions } from './runtime/types';
+import { defaultModuleOptions } from './config';
 
 type DeepPartial<T> = {
     [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
 };
 
-const LOGGER_NAME = 'nuxt-auth-sanctum';
+const MODULE_NAME = 'nuxt-auth-sanctum';
 
 export default defineNuxtModule<DeepPartial<SanctumModuleOptions>>({
     meta: {
-        name: 'nuxt-auth-sanctum',
+        name: MODULE_NAME,
         configKey: 'sanctum',
         compatibility: {
             nuxt: '^3.9.0',
         },
     },
 
-    defaults: {
-        userStateKey: 'sanctum.user.identity',
-        redirectIfAuthenticated: false,
-        endpoints: {
-            csrf: '/sanctum/csrf-cookie',
-            login: '/login',
-            logout: '/logout',
-            user: '/api/user',
-        },
-        csrf: {
-            cookie: 'XSRF-TOKEN',
-            header: 'X-XSRF-TOKEN',
-        },
-        client: {
-            retry: false,
-        },
-        redirect: {
-            keepRequestedRoute: false,
-            onLogin: '/',
-            onLogout: '/',
-            onAuthOnly: '/login',
-            onGuestOnly: '/',
-        },
-        globalMiddleware: {
-            enabled: false,
-            allow404WithoutAuth: true,
-        },
-        logLevel: 3,
-    },
+    defaults: defaultModuleOptions,
 
     setup(options, nuxt) {
         const resolver = createResolver(import.meta.url);
 
-        const runtimeConfigOverrides =
-            nuxt.options.runtimeConfig.public.sanctum;
-
-        const sanctumConfig = defu(runtimeConfigOverrides as any, options);
+        const sanctumConfig = defu(
+            nuxt.options.runtimeConfig.public.sanctum as any,
+            options
+        );
 
         nuxt.options.runtimeConfig.public.sanctum = sanctumConfig;
 
-        const logger = useLogger(LOGGER_NAME, {
+        const logger = useLogger(MODULE_NAME, {
             level: sanctumConfig.logLevel,
         });
 

src/runtime/composables/useSanctumAppConfig.ts

@@ -0,0 +1,6 @@
+import { useAppConfig } from '#app';
+import type { SanctumAppConfig } from '../types';
+
+export const useSanctumAppConfig = (): SanctumAppConfig => {
+    return (useAppConfig().sanctum ?? {}) as SanctumAppConfig;
+};