fix: eslint errors

components/pages/events/Event/index.vue

@@ -70,7 +70,12 @@
           >{{ event.danceHall.state }}</v-flex
         >
       </v-layout>
-      <v-layout row wrap v-for="distance in event.distances" :key="distance.origin">
+      <v-layout
+        row
+        wrap
+        v-for="distance in event.distances"
+        :key="distance.origin"
+      >
         <v-flex xs12 sm6>
           <v-icon>mdi-home</v-icon>
           <span

components/pages/events/index.vue

@@ -61,7 +61,7 @@
         </v-flex>
       </v-layout>
       <list
-        :events="events || []"
+        :events="events || []"
         :has-user="isAuthenticated"
         :toggleIgnore="toggleIgnore"
       />
@@ -79,7 +79,7 @@
 <script>
 import { useRouter, useMutations } from '@u3u/vue-hooks'
 import { computed, ref, watch } from '@vue/composition-api'
-import { useAuth } from '../../../plugins/auth'
+import useAuth from '../../../plugins/auth'
 
 import List from './List'
 import { useLazyQuery, useMutation, useResult } from '../../../plugins/apollo'
@@ -110,8 +110,8 @@ export default {
       set: value => router.push(`/?range=${value}`)
     })
     const [query, { data }] = useLazyQuery(findEvents)
-    const events = useResult(data, [], data => data.events)
+    const events = useResult(data, [], result => result.events)
-    const origins = useResult(data, [], data => data.origins)
+    const origins = useResult(data, [], result => result.origins)
     watch(
       () => range.value,
       r => {

components/pages/filters/index.vue

@@ -70,7 +70,7 @@ import {
 
 import List from './List'
 import { useMutation, useQuery, useResult } from '../../../plugins/apollo'
-import { useAuth } from '../../../plugins/auth'
+import useAuth from '../../../plugins/auth'
 import { useTranslation } from '../../../plugins/i18n'
 
 export default {
@@ -83,11 +83,11 @@ export default {
     setTitle(t('app.links.filters'))
     const { isAuthenticated } = useAuth()
     const { data, loading, refetch } = useQuery(fetchFilters)
-    const bands = useResult(data, [], data => data.bands)
+    const bands = useResult(data, [], result => result.bands)
-    const cities = useResult(data, [], data => data.cities)
+    const cities = useResult(data, [], result => result.cities)
-    const danceHalls = useResult(data, [], data => data.danceHalls)
+    const danceHalls = useResult(data, [], result => result.danceHalls)
-    const municipalities = useResult(data, [], data => data.municipalities)
+    const municipalities = useResult(data, [], result => result.municipalities)
-    const states = useResult(data, [], data => data.states)
+    const states = useResult(data, [], result => result.states)
     const snackbar = ref({ active: false, color: 'success', text: '' })
     const [doToggleIgnoreBand] = useMutation(toggleIgnoreBand)
     const [doToggleIgnoreDanceHall] = useMutation(toggleIgnoreDanceHall)

components/pages/origins/index.vue

@@ -65,8 +65,13 @@ import {
   removeOrigin,
   saveOrigin
 } from '../../../utils/graph-client'
-import { useLazyQuery, useMutation, useQuery, useResult } from '../../../plugins/apollo'
+import {
-import { useAuth } from '../../../plugins/auth'
+  useLazyQuery,
+  useMutation,
+  useQuery,
+  useResult
+} from '../../../plugins/apollo'
+import useAuth from '../../../plugins/auth'
 import { useTranslation } from '../../../plugins/i18n'
 
 export default {

layouts/default.vue

@@ -100,7 +100,7 @@ import dayjs from 'dayjs'
 import sv from 'dayjs/locale/sv'
 import { setDarkMode } from '../utils/localStorage'
 import Themed from './components/themed'
-import { useAuth } from '../plugins/auth'
+import useAuth from '../plugins/auth'
 
 export default {
   components: {

middleware/auth.js

@@ -1,6 +1,6 @@
-import { useAuth } from '../plugins/auth'
+import useAuth from '../plugins/auth'
 
-export default async ({app: { router }}) => {
+export default async ({ app: { router } }) => {
   const onRedirectCallback = appState => {
     router.push(
       appState && appState.targetUrl

nuxt.config.js

@@ -106,15 +106,13 @@ export default {
     '~/plugins/vue-numeral-filter.js'
   ],
   router: {
-    middleware: [
+    middleware: ['auth']
-      'auth'
-    ],
   },
   sentry: {
     dsn: 'https://da2e8d42185a4013909d49955432a116@sentry.io/5187660',
-    config: {}, // Additional config
+    config: {} // Additional config
   },
   vuetify: {
     optionsPath: './vuetify.options.js'
-  },
+  }
 }

plugins/apollo.js

@@ -1,9 +1,13 @@
+/* eslint no-shadow: ["error", { "allow": ["options"] }] */
 import { ApolloClient } from 'apollo-client'
-import { InMemoryCache, IntrospectionFragmentMatcher } from 'apollo-cache-inmemory'
+import {
+  InMemoryCache,
+  IntrospectionFragmentMatcher
+} from 'apollo-cache-inmemory'
 import { createHttpLink } from 'apollo-link-http'
 import { setContext } from 'apollo-link-context'
-import { useAuth } from './auth'
 import { computed, reactive, toRefs } from '@vue/composition-api'
+import useAuth from './auth'
 import introspectionQueryResultData from '../fragmentTypes.json'
 
 const fragmentMatcher = new IntrospectionFragmentMatcher({
@@ -20,7 +24,7 @@ const httpLink = createHttpLink({
   uri: apiUrl
 })
 
-const getToken = async (options) => {
+const getToken = async options => {
   const { getTokenSilently } = useAuth()
   return getTokenSilently.value(options)
 }
@@ -47,60 +51,72 @@ instance = new ApolloClient({
 
 const merge = (target, ...source) => {
   const sources = source instanceof Array ? source : [source]
-  return sources.reduce((acc, source) => {
+  return sources.reduce((acc, src) => {
-    for (const key of Object.keys(source)) {
+    Object.keys(src).forEach(key => {
-      if (source[key] instanceof Object) Object.assign(source[key], merge(acc[key], source[key]))
+      if (src[key] instanceof Object)
-    }
+        Object.assign(src[key], merge(acc[key], src[key]))
-    return Object.assign(acc, source)
+    })
+    return Object.assign(acc, src)
   }, target || {})
 }
 
 export const useMutation = (mutation, options) => {
   const opts = options
-  const doMutate = options => new Promise((resolve, reject) => {
-    out.loading = true
-    instance.mutate({
-      mutation,
-      ...opts,
-      ...options
-    })
-      .then(result => {
-        out.loading = false
-        out.data = result.data
-        resolve(result)
-      })
-      .catch(e => {
-        out.loading = false
-        out.error = e
-        reject(e)
-      })
-  })
   const out = reactive({
     data: {},
     error: null,
     loading: false
   })
+  const doMutate = options =>
+    new Promise((resolve, reject) => {
+      out.loading = true
+      instance
+        .mutate({
+          mutation,
+          ...opts,
+          ...options
+        })
+        .then(result => {
+          out.loading = false
+          out.data = result.data
+          resolve(result)
+        })
+        .catch(e => {
+          out.loading = false
+          out.error = e
+          reject(e)
+        })
+    })
   return [doMutate, toRefs(out)]
 }
 
 export const useLazyQuery = (query, options) => {
   const opts = options
   let watchedQuery = null
-  const doQuery = options => new Promise((resolve, reject) => {
+  const out = reactive({
-    out.loading = true
+    data: {},
-    const effectiveOptions = merge({ query }, opts || {}, options || {})
+    error: null,
-    watchedQuery = instance.watchQuery(effectiveOptions)
+    loading: false
-    watchedQuery.subscribe(({ loading, data }) => {
-      out.loading = loading
-      out.data = data || {}
-      out.error = null
-      resolve(data)
-    }, error => {
-      out.loading = false
-      out.error = error
-      reject(error)
-    })
   })
+  const doQuery = options =>
+    new Promise((resolve, reject) => {
+      out.loading = true
+      const effectiveOptions = merge({ query }, opts || {}, options || {})
+      watchedQuery = instance.watchQuery(effectiveOptions)
+      watchedQuery.subscribe(
+        ({ loading, data }) => {
+          out.loading = loading
+          out.data = data || {}
+          out.error = null
+          resolve(data)
+        },
+        error => {
+          out.loading = false
+          out.error = error
+          reject(error)
+        }
+      )
+    })
   const refetch = variables => {
     doQuery({
       variables: {
@@ -114,17 +130,15 @@ export const useLazyQuery = (query, options) => {
       watchedQuery.stopPolling()
     }
   }
-  const out = reactive({
+  return [
-    data: {},
+    doQuery,
-    error: null,
+    {
-    loading: false
+      ...toRefs(out),
-  })
+      refetch,
-  return [doQuery, {
+      startPolling,
-    ...toRefs(out),
+      stopPolling
-    refetch,
+    }
-    startPolling,
+  ]
-    stopPolling
-  }]
 }
 
 export const useQuery = (query, options) => {
@@ -135,24 +149,23 @@ export const useQuery = (query, options) => {
 
 export const useResult = (result, defaultValue, pick) => {
   return computed(() => {
-    const value = result.value
+    const { value } = result
     if (value) {
       if (pick) {
         try {
           return pick(value)
         } catch (e) {
           // Silent error
+          return defaultValue
         }
-
       } else {
         const keys = Object.keys(value)
         if (keys.length === 1) {
           // Automatically take the only key in result data
           return value[keys[0]]
-        } else {
-          // Return entire result data
-          return value
         }
+        // Return entire result data
+        return value
       }
     } else {
       return defaultValue

plugins/auth.js

@@ -7,10 +7,10 @@ const DEFAULT_REDIRECT_CALLBACK = () =>
 
 let instance
 
-const params = (new URL(window.location)).searchParams
+const params = new URL(window.location).searchParams
 const domain = params.get('domain') || 'unbound.eu.auth0.com'
 
-export const useAuth = (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
+export default (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
   if (instance) {
     return toRefs(instance)
   }
@@ -42,15 +42,21 @@ export const useAuth = (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
         instance.popupOpen = false
       }
 
-      instance.user = await instance.auth0Client.then(client => client.getUser())
+      instance.user = await instance.auth0Client.then(client =>
+        client.getUser()
+      )
       instance.isAuthenticated = true
     },
     /** Handles the callback when logging in using a redirect */
     handleRedirectCallback: async () => {
       instance.loading = true
       try {
-        await instance.auth0Client.then(client => client.handleRedirectCallback())
+        await instance.auth0Client.then(client =>
-        instance.user = await instance.auth0Client.then(client => client.getUser())
+          client.handleRedirectCallback()
+        )
+        instance.user = await instance.auth0Client.then(client =>
+          client.getUser()
+        )
         instance.isAuthenticated = true
       } catch (e) {
         instance.error = e
@@ -87,46 +93,46 @@ export const useAuth = (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
       .then(client => client.isAuthenticated())
       .then(a => {
         instance.isAuthenticated = a
-        instance.auth0Client
+        instance.auth0Client.then(client =>
-          .then(client => client.getUser()
+          client.getUser().then(u => {
-            .then(u => {
+            instance.user = u
-              instance.user = u
+            instance.loading = false
-              instance.loading = false
+          })
-            }))
+        )
       })
   }
-// Create a new instance of the SDK client using members of the given options object
+  // Create a new instance of the SDK client using members of the given options object
   instance.auth0Client = createAuth0Client(options)
-  instance.auth0Client
+  instance.auth0Client.then(client => {
-    .then(client => {
+    instance.loading = true
-      instance.loading = true
+    // instance.auth0Client = client
-      // instance.auth0Client = client
+    try {
-      try {
+      // If the user is returning to the app after authentication..
-        // If the user is returning to the app after authentication..
+      if (
-        if (
+        window.location.search.includes('code=') &&
-          window.location.search.includes('code=') &&
+        window.location.search.includes('state=')
-          window.location.search.includes('state=')
+      ) {
-        ) {
+        console.log('location search', window.location.search)
-          console.log('location search', window.location.search)
+        // handle the redirect and retrieve tokens
-          // handle the redirect and retrieve tokens
+        client
-          client.handleRedirectCallback()
+          .handleRedirectCallback()
-            .then(appState => {
+          .then(appState => {
-              // Notify subscribers that the redirect callback has happened, passing the appState
+            // Notify subscribers that the redirect callback has happened, passing the appState
-              // (useful for retrieving any pre-authentication state)
+            // (useful for retrieving any pre-authentication state)
-              onRedirectCallback(appState)
+            onRedirectCallback(appState)
-              // Initialize our internal authentication state
+            // Initialize our internal authentication state
-              fetchUser()
+            fetchUser()
-            })
+          })
-            .catch(e => console.error('error handling redirect callback', e))
+          .catch(e => console.error('error handling redirect callback', e))
-        } else {
+      } else {
-          fetchUser()
+        fetchUser()
-        }
-      } catch (e) {
-        instance.error = e
-      } finally {
-        instance.loading = false
       }
-    })
+    } catch (e) {
+      instance.error = e
+    } finally {
+      instance.loading = false
+    }
+  })
 
   return toRefs(instance)
 }