fix: lint-error

components/pages/events/index.vue

@@ -1,10 +1,10 @@
 <template>
   <div :key="isAuthenticated">
-    <span v-text="isAuthenticated"/>
+    <span v-text="isAuthenticated" />
     <v-container fluid grid-list-md class="app-fade-in" :key="range">
       <v-layout row wrap v-if="!isAuthenticated">
         <v-flex xs12>
-          <p><b v-text="$t('events.login')"/></p>
+          <p><b v-text="$t('events.login')" /></p>
         </v-flex>
       </v-layout>
       <v-layout row wrap>
@@ -17,11 +17,10 @@
             <v-tooltip top slot="append-outer">
               <template v-slot:activator="{ on }">
                 <v-icon v-on="on" v-on:click="fetchAddress()"
-                >mdi-crosshairs-gps
+                  >mdi-crosshairs-gps
-                </v-icon
+                </v-icon>
-                >
               </template>
-              <span v-text="$t('origins.fetchAddress')"/>
+              <span v-text="$t('origins.fetchAddress')" />
             </v-tooltip>
             <v-tooltip top slot="prepend" v-if="isAuthenticated">
               <template v-slot:activator="{ on }">
@@ -29,11 +28,10 @@
                   v-on="on"
                   :disabled="!origin"
                   v-on:click="saveOrigin(origin)"
-                >mdi-bookmark-plus-outline
+                  >mdi-bookmark-plus-outline
-                </v-icon
+                </v-icon>
-                >
               </template>
-              <span v-text="$t('origins.save')"/>
+              <span v-text="$t('origins.save')" />
             </v-tooltip>
           </v-text-field>
         </v-flex>
@@ -80,168 +78,180 @@
 </template>
 
 <script>
-  import { useMutations, useRouter } from '@u3u/vue-hooks'
+import { useMutations, useRouter } from '@u3u/vue-hooks'
-  import { computed, ref, watch } from '@vue/composition-api'
+import { computed, ref, watch } from '@vue/composition-api'
-  import { useAuth } from '../../../plugins/auth'
+import { useMutation, useQuery, useResult } from '@vue/apollo-composable'
+import { useAuth } from '../../../plugins/auth'
 
-  import List from './List'
+import List from './List'
-  import { useMutation, useQuery, useResult } from '@vue/apollo-composable'
+import {
-  import {
+  fetchAddress,
-    fetchAddress,
+  findEvents,
-    findEvents,
+  saveOrigin,
-    saveOrigin,
+  toggleIgnoreBand,
-    toggleIgnoreBand,
+  toggleIgnoreCity,
-    toggleIgnoreCity,
+  toggleIgnoreDanceHall,
-    toggleIgnoreDanceHall,
+  toggleIgnoreMunicipality,
-    toggleIgnoreMunicipality,
+  toggleIgnoreState
-    toggleIgnoreState
+} from '../../../utils/graph-client'
-  } from '../../../utils/graph-client'
+import { useTranslation } from '../../../plugins/i18n'
-  import { useTranslation } from '../../../plugins/i18n'
 
-  export default {
+export default {
-    components: {
+  components: {
-      List
+    List
-    },
+  },
-    setup() {
+  setup() {
-      const { setTitle } = useMutations(['setTitle'])
+    const { setTitle } = useMutations(['setTitle'])
-      const { t } = useTranslation()
+    const { t } = useTranslation()
-      setTitle(t('app.links.events'))
+    setTitle(t('app.links.events'))
-      const { loading: authLoading, isAuthenticated } = useAuth()
+    const { loading: authLoading, isAuthenticated } = useAuth()
-      const { route, router } = useRouter()
+    const { route, router } = useRouter()
-      const range = computed({
+    const range = computed({
-        get: () => route.value.query.range || 'ONE_WEEK',
+      get: () => route.value.query.range || 'ONE_WEEK',
-        set: value => router.push(`/?range=${value}`)
+      set: value => router.push(`/?range=${value}`)
-      })
+    })
-      const enabled = ref(false)
+    const enabled = ref(false)
-      const { result: data, refetch } = useQuery(findEvents, { includeOrigins: false }, () => ({ enabled: enabled.value }))
+    const { result: data, refetch } = useQuery(
-      const events = useResult(data, [], result => result.events)
+      findEvents,
-      const origins = useResult(data, [], result => result.origins)
+      { includeOrigins: false },
-      watch(
+      () => ({ enabled: enabled.value })
-        range,
+    )
-        r => {
+    const events = useResult(data, [], result => result.events)
-          enabled.value = true
+    const origins = useResult(data, [], result => result.origins)
-          console.log('isAuthenticated', isAuthenticated.value)
+    watch(
-          refetch({
+      range,
-            range: r,
+      r => {
-            includeOrigins: isAuthenticated.value || false
-          })
-        },
-        { lazy: false }
-      )
-      const submitting = ref(true)
-      const ranges = [
-        { name: '1 vecka', value: 'ONE_WEEK' },
-        { name: '2 veckor', value: 'TWO_WEEKS' },
-        { name: '1 månad', value: 'ONE_MONTH' },
-        { name: '1 kvartal', value: 'ONE_QUARTER' },
-        { name: '1 år', value: 'ONE_YEAR' }
-      ]
-      const snackbar = ref({ active: false, color: 'success', text: '' })
-
-      const origin = ref('')
-      const fetchEvents = () => {
-        const originsTemp = [...(origins.value || [])]
-        if (origin.value) {
-          originsTemp.push(origin.value)
-        }
         enabled.value = true
+        console.log('isAuthenticated', isAuthenticated.value)
         refetch({
-          range: range.value,
+          range: r,
-          origins: originsTemp,
           includeOrigins: isAuthenticated.value || false
         })
+      },
+      { lazy: false }
+    )
+    const submitting = ref(true)
+    const ranges = [
+      { name: '1 vecka', value: 'ONE_WEEK' },
+      { name: '2 veckor', value: 'TWO_WEEKS' },
+      { name: '1 månad', value: 'ONE_MONTH' },
+      { name: '1 kvartal', value: 'ONE_QUARTER' },
+      { name: '1 år', value: 'ONE_YEAR' }
+    ]
+    const snackbar = ref({ active: false, color: 'success', text: '' })
+
+    const origin = ref('')
+    const fetchEvents = () => {
+      const originsTemp = [...(origins.value || [])]
+      if (origin.value) {
+        originsTemp.push(origin.value)
       }
+      enabled.value = true
+      refetch({
+        range: range.value,
+        origins: originsTemp,
+        includeOrigins: isAuthenticated.value || false
+      })
+    }
 
-      const { mutate: doToggleIgnoreBand } = useMutation(toggleIgnoreBand)
+    const { mutate: doToggleIgnoreBand } = useMutation(toggleIgnoreBand)
-      const { mutate: doToggleIgnoreDanceHall } = useMutation(toggleIgnoreDanceHall)
+    const { mutate: doToggleIgnoreDanceHall } = useMutation(
-      const { mutate: doToggleIgnoreCity } = useMutation(toggleIgnoreCity)
+      toggleIgnoreDanceHall
-      const { mutate: doToggleIgnoreMunicipality } = useMutation(toggleIgnoreMunicipality)
+    )
-      const { mutate: doToggleIgnoreState } = useMutation(toggleIgnoreState)
+    const { mutate: doToggleIgnoreCity } = useMutation(toggleIgnoreCity)
+    const { mutate: doToggleIgnoreMunicipality } = useMutation(
+      toggleIgnoreMunicipality
+    )
+    const { mutate: doToggleIgnoreState } = useMutation(toggleIgnoreState)
 
-      const toggleIgnoreSuccess = name => {
+    const toggleIgnoreSuccess = name => {
-        return () => {
+      return () => {
-          fetchEvents()
+        fetchEvents()
-          snackbar.value.color = 'success'
+        snackbar.value.color = 'success'
-          snackbar.value.text = `${name} har dolts`
+        snackbar.value.text = `${name} har dolts`
-          snackbar.value.active = true
+        snackbar.value.active = true
-        }
-      }
-
-      const toggleIgnoreFailed = name => {
-        return () => {
-          snackbar.value.color = 'error'
-          snackbar.value.text = `${name} kunde inte döljas`
-          snackbar.value.active = true
-        }
-      }
-
-      const toggleIgnore = (type, name) => {
-        switch (type) {
-          case 'band':
-            doToggleIgnoreBand({ name })
-              .then(toggleIgnoreSuccess(name))
-              .catch(toggleIgnoreFailed)
-            break
-          case 'danceHall':
-            doToggleIgnoreDanceHall({ name })
-              .then(toggleIgnoreSuccess(name))
-              .catch(toggleIgnoreFailed)
-            break
-          case 'city':
-            doToggleIgnoreCity({ name })
-              .then(toggleIgnoreSuccess(name))
-              .catch(toggleIgnoreFailed)
-            break
-          case 'municipality':
-            doToggleIgnoreMunicipality({ name })
-              .then(toggleIgnoreSuccess(name))
-              .catch(toggleIgnoreFailed)
-            break
-          case 'state':
-            doToggleIgnoreState({ name })
-              .then(toggleIgnoreSuccess(name))
-              .catch(toggleIgnoreFailed)
-            break
-          default:
-        }
-      }
-
-      const { mutate: doSaveOrigin } = useMutation(saveOrigin)
-      const addressEnabled = ref(false)
-      const { result: address, refetch: doFetchAddress } = useQuery(fetchAddress, {}, () => ({ enabled: addressEnabled.value }))
-      const fetchAddressFn = () => {
-        if (window.navigator) {
-          window.navigator.geolocation.getCurrentPosition(pos => {
-            addressEnabled.value = true
-            doFetchAddress({
-              latlng: `${pos.coords.latitude},${pos.coords.longitude}`
-            }).then(() => {
-              origin.value = address.value.address
-            })
-          })
-        }
-      }
-      const saveOriginFn = o =>
-        doSaveOrigin({ origin: o }).then(() => {
-          origin.value = ''
-          fetchEvents()
-        })
-
-      return {
-        authLoading,
-        isAuthenticated,
-        range,
-        events,
-        origins,
-        query: fetchEvents,
-        submitting,
-        ranges,
-        snackbar,
-        toggleIgnore,
-        origin,
-        fetchAddress: fetchAddressFn,
-        saveOrigin: saveOriginFn
       }
     }
+
+    const toggleIgnoreFailed = name => {
+      return () => {
+        snackbar.value.color = 'error'
+        snackbar.value.text = `${name} kunde inte döljas`
+        snackbar.value.active = true
+      }
+    }
+
+    const toggleIgnore = (type, name) => {
+      switch (type) {
+        case 'band':
+          doToggleIgnoreBand({ name })
+            .then(toggleIgnoreSuccess(name))
+            .catch(toggleIgnoreFailed)
+          break
+        case 'danceHall':
+          doToggleIgnoreDanceHall({ name })
+            .then(toggleIgnoreSuccess(name))
+            .catch(toggleIgnoreFailed)
+          break
+        case 'city':
+          doToggleIgnoreCity({ name })
+            .then(toggleIgnoreSuccess(name))
+            .catch(toggleIgnoreFailed)
+          break
+        case 'municipality':
+          doToggleIgnoreMunicipality({ name })
+            .then(toggleIgnoreSuccess(name))
+            .catch(toggleIgnoreFailed)
+          break
+        case 'state':
+          doToggleIgnoreState({ name })
+            .then(toggleIgnoreSuccess(name))
+            .catch(toggleIgnoreFailed)
+          break
+        default:
+      }
+    }
+
+    const { mutate: doSaveOrigin } = useMutation(saveOrigin)
+    const addressEnabled = ref(false)
+    const { result: address, refetch: doFetchAddress } = useQuery(
+      fetchAddress,
+      {},
+      () => ({ enabled: addressEnabled.value })
+    )
+    const fetchAddressFn = () => {
+      if (window.navigator) {
+        window.navigator.geolocation.getCurrentPosition(pos => {
+          addressEnabled.value = true
+          doFetchAddress({
+            latlng: `${pos.coords.latitude},${pos.coords.longitude}`
+          }).then(() => {
+            origin.value = address.value.address
+          })
+        })
+      }
+    }
+    const saveOriginFn = o =>
+      doSaveOrigin({ origin: o }).then(() => {
+        origin.value = ''
+        fetchEvents()
+      })
+
+    return {
+      authLoading,
+      isAuthenticated,
+      range,
+      events,
+      origins,
+      query: fetchEvents,
+      submitting,
+      ranges,
+      snackbar,
+      toggleIgnore,
+      origin,
+      fetchAddress: fetchAddressFn,
+      saveOrigin: saveOriginFn
+    }
   }
+}
 </script>

components/pages/filters/index.vue

@@ -59,6 +59,7 @@
 <script>
 import { ref } from '@vue/composition-api'
 import { useMutations } from '@u3u/vue-hooks'
+import { useMutation, useQuery, useResult } from '@vue/apollo-composable'
 import {
   fetchFilters,
   toggleIgnoreBand,
@@ -69,7 +70,6 @@ import {
 } from '~/utils/graph-client'
 
 import List from './List'
-import { useMutation, useQuery, useResult } from '@vue/apollo-composable'
 import { useAuth } from '../../../plugins/auth'
 import { useTranslation } from '../../../plugins/i18n'
 
@@ -89,11 +89,15 @@ export default {
     const municipalities = useResult(data, [], result => result.municipalities)
     const states = useResult(data, [], result => result.states)
     const snackbar = ref({ active: false, color: 'success', text: '' })
-    const {mutate: doToggleIgnoreBand} = useMutation(toggleIgnoreBand)
+    const { mutate: doToggleIgnoreBand } = useMutation(toggleIgnoreBand)
-    const {mutate: doToggleIgnoreDanceHall} = useMutation(toggleIgnoreDanceHall)
+    const { mutate: doToggleIgnoreDanceHall } = useMutation(
-    const {mutate: doToggleIgnoreCity} = useMutation(toggleIgnoreCity)
+      toggleIgnoreDanceHall
-    const {mutate: doToggleIgnoreMunicipality} = useMutation(toggleIgnoreMunicipality)
+    )
-    const {mutate: doToggleIgnoreState} = useMutation(toggleIgnoreState)
+    const { mutate: doToggleIgnoreCity } = useMutation(toggleIgnoreCity)
+    const { mutate: doToggleIgnoreMunicipality } = useMutation(
+      toggleIgnoreMunicipality
+    )
+    const { mutate: doToggleIgnoreState } = useMutation(toggleIgnoreState)
 
     const toggleIgnoreSuccess = name => {
       return () => {

components/pages/origins/index.vue

@@ -11,11 +11,10 @@
             <v-tooltip top slot="append-outer">
               <template v-slot:activator="{ on }">
                 <v-icon v-on="on" v-on:click="fetchAddress()"
-                >mdi-crosshairs-gps
+                  >mdi-crosshairs-gps
-                </v-icon
+                </v-icon>
-                >
               </template>
-              <span v-text="$t('origins.fetchAddress')"/>
+              <span v-text="$t('origins.fetchAddress')" />
             </v-tooltip>
             <v-tooltip top slot="prepend">
               <template v-slot:activator="{ on }">
@@ -23,11 +22,10 @@
                   v-on="on"
                   :disabled="!origin"
                   v-on:click="saveOrigin(origin)"
-                >mdi-bookmark-plus-outline
+                  >mdi-bookmark-plus-outline
-                </v-icon
+                </v-icon>
-                >
               </template>
-              <span v-text="$t('origins.save')"/>
+              <span v-text="$t('origins.save')" />
             </v-tooltip>
           </v-text-field>
         </v-flex>
@@ -38,10 +36,10 @@
             <v-tooltip top slot="prepend">
               <template v-slot:activator="{ on }">
                 <v-icon v-on="on" v-on:click="removeOrigin(origin)"
-                >mdi-delete-outline
+                  >mdi-delete-outline
                 </v-icon>
               </template>
-              <span v-text="$t('origins.remove')"/>
+              <span v-text="$t('origins.remove')" />
             </v-tooltip>
             <span>{{ origin }}</span>
           </v-flex>
@@ -59,55 +57,63 @@
 </template>
 
 <script>
-  import { ref } from '@vue/composition-api'
+import { ref } from '@vue/composition-api'
-  import { useMutations } from '@u3u/vue-hooks'
+import { useMutations } from '@u3u/vue-hooks'
-  import { fetchAddress, findOrigins, removeOrigin, saveOrigin } from '../../../utils/graph-client'
+import { useMutation, useQuery, useResult } from '@vue/apollo-composable'
-  import { useMutation, useQuery, useResult } from '@vue/apollo-composable'
+import {
-  import { useAuth } from '../../../plugins/auth'
+  fetchAddress,
-  import { useTranslation } from '../../../plugins/i18n'
+  findOrigins,
+  removeOrigin,
+  saveOrigin
+} from '../../../utils/graph-client'
+import { useAuth } from '../../../plugins/auth'
+import { useTranslation } from '../../../plugins/i18n'
 
-  export default {
+export default {
-    setup() {
+  setup() {
-      const { setTitle } = useMutations(['setTitle'])
+    const { setTitle } = useMutations(['setTitle'])
-      const { t } = useTranslation()
+    const { t } = useTranslation()
-      setTitle(t('app.links.origins'))
+    setTitle(t('app.links.origins'))
-      const { isAuthenticated } = useAuth()
+    const { isAuthenticated } = useAuth()
-      const { result: data, loading, refetch } = useQuery(findOrigins)
+    const { result: data, loading, refetch } = useQuery(findOrigins)
-      const origins = useResult(data, [])
+    const origins = useResult(data, [])
-      const snackbar = ref({ active: false, color: 'success', text: '' })
+    const snackbar = ref({ active: false, color: 'success', text: '' })
-      const {mutate: doSaveOrigin} = useMutation(saveOrigin)
+    const { mutate: doSaveOrigin } = useMutation(saveOrigin)
-      const {mutate: doRemoveOrigin} = useMutation(removeOrigin)
+    const { mutate: doRemoveOrigin } = useMutation(removeOrigin)
-      const enabled = ref(false)
+    const enabled = ref(false)
-      const { refetch: doFetchAddress } = useQuery(fetchAddress, {}, () => ({ enabled: enabled.value }))
+    const { refetch: doFetchAddress } = useQuery(fetchAddress, {}, () => ({
-      const origin = ref('')
+      enabled: enabled.value
-      const fetchAddressFn = () => {
+    }))
-        if (window.navigator) {
+    const origin = ref('')
-          window.navigator.geolocation.getCurrentPosition(pos => {
+    const fetchAddressFn = () => {
-            enabled.value = true
+      if (window.navigator) {
-            doFetchAddress({ latlng: `${pos.coords.latitude},${pos.coords.longitude}` })
+        window.navigator.geolocation.getCurrentPosition(pos => {
-              .then(res => {
+          enabled.value = true
-                origin.value = res.address
+          doFetchAddress({
-              })
+            latlng: `${pos.coords.latitude},${pos.coords.longitude}`
+          }).then(res => {
+            origin.value = res.address
           })
-        }
-      }
-      const saveOriginFn = o =>
-        doSaveOrigin({ origin: o }).then(() => {
-          refetch()
-          origin.value = ''
         })
-      const removeOriginFn = o =>
-        doRemoveOrigin({ origin: o }).then(() => refetch())
-      return {
-        isAuthenticated,
-        loading,
-        origins,
-        snackbar,
-        origin,
-        saveOrigin: saveOriginFn,
-        removeOrigin: removeOriginFn,
-        fetchAddress: fetchAddressFn
       }
     }
+    const saveOriginFn = o =>
+      doSaveOrigin({ origin: o }).then(() => {
+        refetch()
+        origin.value = ''
+      })
+    const removeOriginFn = o =>
+      doRemoveOrigin({ origin: o }).then(() => refetch())
+    return {
+      isAuthenticated,
+      loading,
+      origins,
+      snackbar,
+      origin,
+      saveOrigin: saveOriginFn,
+      removeOrigin: removeOriginFn,
+      fetchAddress: fetchAddressFn
+    }
   }
+}
 </script>

nuxt.config.js

@@ -18,9 +18,7 @@ export default {
       }
     }
   },
-  buildModules: [
+  buildModules: ['nuxt-composition-api'],
-    'nuxt-composition-api'
-  ],
   css: ['vuetify/dist/vuetify.css', '~/assets/scss/global.scss'],
   env: {
     graphqlApi: process.env.GRAPHQL_API

plugins/apollo.js

@@ -1,13 +1,16 @@
 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 { provide } from '@vue/composition-api'
-import introspectionQueryResultData from '../fragmentTypes.json'
 import { onGlobalSetup } from 'nuxt-composition-api'
 import { DefaultApolloClient } from '@vue/apollo-composable'
 import Vue from 'vue'
+import introspectionQueryResultData from '../fragmentTypes.json'
+import { useAuth } from './auth'
 
 const apiUrl = process.env.graphqlApi || '/query'
 
@@ -21,7 +24,7 @@ const httpLink = createHttpLink({
   uri: apiUrl
 })
 
-const getToken = async (options) => {
+const getToken = async options => {
   const { getTokenSilently } = useAuth()
   return getTokenSilently.value(options)
 }

plugins/auth.js

@@ -10,6 +10,7 @@ let instance
 const params = new URL(window.location).searchParams
 const domain = params.get('domain') || 'unbound.eu.auth0.com'
 
+// eslint-disable-next-line import/prefer-default-export
 export const useAuth = (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
   if (instance) {
     return toRefs(instance)
@@ -105,14 +106,12 @@ export const useAuth = (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
   instance.auth0Client = createAuth0Client(options)
   instance.auth0Client.then(client => {
     instance.loading = true
-    // instance.auth0Client = client
     try {
       // If the user is returning to the app after authentication..
       if (
         window.location.search.includes('code=') &&
         window.location.search.includes('state=')
       ) {
-        console.log('location search', window.location.search)
         // handle the redirect and retrieve tokens
         client
           .handleRedirectCallback()
@@ -123,6 +122,7 @@ export const useAuth = (onRedirectCallback = DEFAULT_REDIRECT_CALLBACK) => {
             // Initialize our internal authentication state
             fetchUser()
           })
+          // eslint-disable-next-line no-console
           .catch(e => console.error('error handling redirect callback', e))
       } else {
         fetchUser()