(ts) convert used nuxt plugins

nuxt.config.ts

@@ -167,12 +167,12 @@ const nuxtConfig: NuxtConfig = {
     ],
     plugins: [
         { src: '~/plugins/polyfill.ts', mode: 'client' },
-        { src: '~/plugins/axios.js' },
+        { src: '~/plugins/axios.ts' },
         { src: '~/plugins/globals.ts' },
         { src: '~/plugins/auth.ts' },
-        { src: '~/plugins/datepicker.js', mode: 'client' },
+        { src: '~/plugins/datepicker.ts', mode: 'client' },
-        { src: '~/plugins/track.js', mode: 'client' },
+        { src: '~/plugins/track.ts', mode: 'client' },
-        { src: '~/plugins/browserDetect.js' },
+        { src: '~/plugins/browserDetect.ts' },
     ],
     components: true,
     buildModules: [

plugins/axios.ts

@@ -1,4 +1,6 @@
-export default function ({ $axios, app }) {
+import type { Plugin } from '@nuxt/types';
+
+const plugin: Plugin = ({ $axios, app }) => {
     $axios.onRequest((config) => {
         const token = app.$csrfToken();
 
@@ -8,4 +10,6 @@ export default function ({ $axios, app }) {
 
         return config;
     });
-}
+};
+
+export default plugin;

plugins/browserDetect.ts

@@ -1,9 +1,11 @@
+import type { Plugin } from '@nuxt/types';
+
 const SAFARI_REGEX = /^((?!chrome|android).)*safari/i;
 
-export default ({ req }, inject) => {
+const plugin: Plugin = ({ req }, inject) => {
     inject('isSafari', () => {
         if (process.server && req) {
-            return SAFARI_REGEX.test(req.headers['user-agent']);
+            return SAFARI_REGEX.test(req.headers['user-agent']!);
         }
 
         if (process.client) {
@@ -13,3 +15,5 @@ export default ({ req }, inject) => {
         return false;
     });
 };
+
+export default plugin;

plugins/datepicker.ts

@@ -1,6 +1,9 @@
 import Vue from 'vue';
 import VuejsDatePicker from 'vuejs-datepicker';
+import type { Plugin } from '@nuxt/types';
 
-export default () => {
+const plugin: Plugin = () => {
     Vue.component('Datepicker', VuejsDatePicker);
 };
+
+export default plugin;

plugins/track.ts

@@ -1,32 +1,44 @@
 import * as Sentry from '@sentry/vue';
+import type { Plugin } from '@nuxt/types';
+import type Plausible from 'plausible-tracker';
 
-function defaultHandler({ plausible, to }) {
+interface PlausibleContext {
+    plausible: ReturnType<typeof Plausible>;
+    to: URL;
+    from: URL;
+}
+
+const defaultHandler = ({ plausible, to }: PlausibleContext): void => {
     console.debug('[analytics] Tracking default handler: %O', to);
     plausible.trackPageview({
         url: to.toString(),
     });
-}
+};
-/**
+
- * @param {(value: URL) => URL} redactor
+const redact = (
- * @param {(ctx) => void} base
+    redactor: (v: URL) => URL,
- * @return {(ctx) => void}
+    base: (ctx: PlausibleContext) => void = defaultHandler,
- */
+): (ctx: PlausibleContext) => void => {
-function redact(redactor, base = defaultHandler) {
     return (ctx) => base({
         ...ctx,
         to: redactor(ctx.to),
     });
+};
+
+interface TrackerOverride {
+    test(path: string): boolean;
+    handling(ctx: PlausibleContext): void;
 }
 
 const USER_AT = /^\/@.+/;
 const USER_SUBPAGE = /^\/(u|card)\/.*/;
 
-const TRACKER_OVERRIDES = [
+const TRACKER_OVERRIDES: TrackerOverride[] = [
     {
-        test(v) {
+        test(v: string): boolean {
             return USER_AT.test(v) || USER_SUBPAGE.test(v);
         },
-        handling: redact((v) => {
+        handling: redact((v: URL): URL => {
             let pathname = v.pathname;
             if (USER_AT.test(pathname)) {
                 pathname = pathname.replace(USER_AT, '/@--redacted--');
@@ -40,24 +52,16 @@ const TRACKER_OVERRIDES = [
     },
 ];
 
-export const plugin = function ({ app }) {
+const plugin: Plugin = ({ app }) => {
     const plausible = app.$plausible;
 
-    app.router.afterEach((to, from) => {
+    app.router?.afterEach((to, from) => {
         let handler = defaultHandler;
         for (const trackerOverride of TRACKER_OVERRIDES) {
             if (!trackerOverride.test(to.fullPath)) {
                 continue;
             }
-
-            if (trackerOverride.handling === false) {
-                // console.debug("[analytics] Page is blocked from tracking");
-                return;
-            } else if (typeof trackerOverride.handling === 'function') {
             handler = trackerOverride.handling;
-            } else {
-                throw new Error('Tracking override handling is invalid');
-            }
             break;
         }
 

plugins/vuejs-datepicker.d.ts

@@ -0,0 +1,3 @@
+declare module 'vuejs-datepicker' {
+    export = unknown;
+}

tsconfig.json

@@ -21,7 +21,8 @@
             "@nuxt/typescript-build",
             "@nuxtjs/axios",
             "@nuxtjs/sentry",
-            "@types/node"
+            "@types/node",
+            "vue-plausible"
         ]
     },
     "exclude": [