I am using adal to authenticate in Azure and I am using this example https://github.com/hakim-ali/adal-nuxt-portal/blob/main/pages/index.vue.

I was thinking if there is a way to create auth middleware limiting access to pages and using this.$adal?.isAuthenticated().

At this point I've got adal set as plugin:

adal.js

import { Adal } from './adal-plugin/index'
import { environment } from '~/environment'

export default ({ app, error, $axios }, inject) => {
  inject(
    'adal',
    new Adal({
      config: {
        tenant: environment.tenant,
        clientId: environment.clientId,
        redirectUri: environment.redirectUri,
        cacheLocation: environment.cacheLocation
      }
    })
  )
}

in nuxt.config.js

  plugins: [{ src: '@/plugins/adal', ssr: false, mode: 'client' }],

in middleware authenticated.js

export default function (context) {
  if (!this.$adal.isAuthenticated()) {
    context.redirect('/login')
  }
}

and I'm getting the following error: Cannot read property '$adal' of undefined

Any help would be much appreciated