WIP

client/stores/auth.js

@@ -1,53 +1,64 @@
-import { defineStore } from 'pinia'
+import {defineStore} from 'pinia'
 import axios from 'axios'
-import Cookies from 'js-cookie'
 
 export const useAuthStore = defineStore('auth', {
-  state: () => ({
-    user: null,
-    token: Cookies.get('token'),
-
-    // For admin impersonation
-    admin_token: Cookies.get('admin_token') ?? null
-  }),
+  state: () => {
+    return {
+      token: null,
+      admin_token: null,
+      user: null,
+    }
+  },
   getters: {
     check: (state) => (state.user !== null && state.user !== undefined),
     isImpersonating: (state) => (state.admin_token !== null && state.admin_token !== undefined)
   },
   actions: {
     // Stores admin token temporarily for impersonation
-    startImpersonating () {
-      this.admin_token = this.token
-      Cookies.set('admin_token', this.token, { expires: 365 })
+    startImpersonating() {
+      this.setAdminToken(this.token)
     },
     // Stop admin impersonation
-    stopImpersonating () {
+    stopImpersonating() {
       this.token = this.admin_token
       this.admin_token = null
-      Cookies.set('token', this.token, { expires: 365 })
-      Cookies.remove('admin_token')
       this.fetchUser()
     },
 
-    saveToken (token, remember) {
+    setToken(token) {
+      useCookie('token', {maxAge: 60 * 60 * 24 * 30}).value = token
       this.token = token
-      Cookies.set('token', token, { expires: remember ? 365 : null })
     },
 
-    async fetchUser () {
+    setAdminToken(token) {
+      useCookie('admin_token', {maxAge: 60 * 60 * 24 * 30}).value = token
+      this.admin_token = token
+    },
+
+    loadTokenFromCookie() {
+      this.token = useCookie('token').value
+      this.admin_token = useCookie('admin_token').value
+    },
+
+    async fetchUser() {
       try {
-        const { data } = await axios.get('/api/user')
+        const {data} = await axios.get('/api/user')
         this.user = data
         this.initServiceClients()
 
         return data
       } catch (e) {
-        this.token = null
-        Cookies.remove('token')
+        this.setToken(null)
       }
     },
 
-    updateUser (payload) {
+    async fetchUserIfNotFetched() {
+      if (this.user === null && this.token) {
+        await this.fetchUser()
+      }
+    },
+
+    updateUser(payload) {
       this.user = payload
       this.initServiceClients()
     },
@@ -56,20 +67,29 @@ export const useAuthStore = defineStore('auth', {
       if (!this.user) return
       useAmplitude().setUser(this.user)
       useCrisp().setUser(this.user)
+
+      // Init sentry
+      Sentry.configureScope((scope) => {
+        scope.setUser({
+          id: this.user.id,
+          email: this.user.email,
+          subscription: this.user?.is_subscribed
+        })
+      })
     },
 
-    async logout () {
+    async logout() {
       try {
         await axios.post('/api/logout')
-      } catch (e) { }
+      } catch (e) {
+      }
 
       this.user = null
-      this.token = null
-      Cookies.remove('token')
+      this.setToken(null)
     },
 
-    async fetchOauthUrl (provider) {
-      const { data } = await axios.post(`/api/oauth/${provider}`)
+    async fetchOauthUrl(provider) {
+      const {data} = await axios.post(`/api/oauth/${provider}`)
       return data.url
     }
   }

client/stores/forms.js

@@ -1,7 +1,7 @@
-import { defineStore } from 'pinia'
-import axios from 'axios'
+import {defineStore} from 'pinia'
+import {useOpnFetch} from "~/composables/useOpnFetch.js";
 
-export const formsEndpoint = '/api/open/workspaces/{workspaceId}/forms'
+export const formsEndpoint = '/open/workspaces/{workspaceId}/forms'
 export let currentPage = 1
 
 export const useFormsStore = defineStore('forms', {
@@ -22,7 +22,7 @@ export const useFormsStore = defineStore('forms', {
       if (state.content.length === 0) return []
       let allTags = []
       state.content.forEach(form => {
-        if(form.tags && form.tags.length > 0){
+        if (form.tags && form.tags.length > 0) {
           allTags = allTags.concat(form.tags)
         }
       })
@@ -30,34 +30,34 @@ export const useFormsStore = defineStore('forms', {
     }
   },
   actions: {
-    set (items) {
+    set(items) {
       this.content = items
     },
-    append (items) {
+    append(items) {
       this.content = this.content.concat(items)
     },
-    addOrUpdate (item) {
+    addOrUpdate(item) {
       this.content = this.content.filter((val) => val.id !== item.id)
       this.content.push(item)
     },
-    remove (item) {
+    remove(item) {
       this.content = this.content.filter((val) => val.id !== item.id)
     },
-    startLoading () {
+    startLoading() {
       this.loading = true
     },
-    stopLoading () {
+    stopLoading() {
       this.loading = false
     },
-    resetState () {
+    resetState() {
       this.set([])
       this.stopLoading()
       currentPage = 1
     },
-    load (workspaceId) {
+    load(workspaceId) {
       this.startLoading()
-      return axios.get(formsEndpoint.replace('{workspaceId}', workspaceId)+'?page='+currentPage).then((response) => {
-        if (currentPage == 1) {
+      return useOpnFetch(formsEndpoint.replace('{workspaceId}', workspaceId) + '?page=' + currentPage).get().then((response) => {
+        if (currentPage === 1) {
           this.set(response.data.data)
         } else {
           this.append(response.data.data)
@@ -71,7 +71,7 @@ export const useFormsStore = defineStore('forms', {
         }
       })
     },
-    loadIfEmpty (workspaceId) {
+    loadIfEmpty(workspaceId) {
       if (this.content.length === 0) {
         return this.load(workspaceId)
       }

client/stores/workspaces.js

@@ -1,8 +1,10 @@
-import axios from 'axios'
-import { defineStore } from 'pinia'
-export const workspaceEndpoint = '/api/open/workspaces/'
+import {defineStore} from 'pinia'
+import {useOpnFetch} from "~/composables/useOpnFetch.js"
+import {useStorage} from "@vueuse/core"
 
-const localStorageCurrentWorkspaceKey = 'currentWorkspace'
+export const workspaceEndpoint = 'open/workspaces/'
+
+const storedWorkspaceId = useStorage('currentWorkspace', 0)
 
 export const useWorkspacesStore = defineStore('workspaces', {
   state: () => ({
@@ -21,72 +23,68 @@ export const useWorkspacesStore = defineStore('workspaces', {
     }
   },
   actions: {
-    set (items) {
+    set(items) {
       this.content = items
       if (this.currentId == null && this.content.length > 0) {
         // If one only, set it
         if (this.content.length === 1) {
-          this.currentId = items[0].id
-          localStorage.setItem(localStorageCurrentWorkspaceKey, this.currentId)
-        } else if (localStorage.getItem(localStorageCurrentWorkspaceKey) && this.content.find(item => item.id === parseInt(localStorage.getItem(localStorageCurrentWorkspaceKey)))) {
+          this.setCurrentId(items[0].id)
+        } else if (storedWorkspaceId && this.content.find(item => item.id === parseInt(storedWorkspaceId.value))) {
           // Check local storage for current workspace, or take first
-          this.currentId = parseInt(localStorage.getItem(localStorageCurrentWorkspaceKey))
-          localStorage.setItem(localStorageCurrentWorkspaceKey, this.currentId)
+          this.setCurrentId(parseInt(storedWorkspaceId.value))
         } else {
           // Else, take first
-          this.currentId = items[0].id
-          localStorage.setItem(localStorageCurrentWorkspaceKey, this.currentId)
+          this.setCurrentId(items[0].id)
         }
       } else {
-        localStorage.removeItem(localStorageCurrentWorkspaceKey)
+        this.setCurrentId(null)
       }
     },
-    setCurrentId (id) {
+    setCurrentId(id) {
       this.currentId = id
-      localStorage.setItem(localStorageCurrentWorkspaceKey, id)
+      storedWorkspaceId.value = id
     },
-    addOrUpdate (item) {
+    addOrUpdate(item) {
       this.content = this.content.filter((val) => val.id !== item.id)
       this.content.push(item)
       if (this.currentId == null) {
         this.currentId = item.id
-        localStorage.setItem(localStorageCurrentWorkspaceKey, this.currentId)
+        storedWorkspaceId.value = this.currentId
       }
     },
-    remove (itemId) {
+    remove(itemId) {
       this.content = this.content.filter((val) => val.id !== itemId)
       if (this.currentId === itemId) {
-        this.currentId = this.content.length > 0 ? this.content[0].id : null
-        localStorage.setItem(localStorageCurrentWorkspaceKey, this.currentId)
+        this.setCurrentId(this.content.length > 0 ? this.content[0].id : null)
       }
     },
-    startLoading () {
+    startLoading() {
       this.loading = true
     },
-    stopLoading () {
+    stopLoading() {
       this.loading = false
     },
-    resetState () {
+    resetState() {
       this.set([])
       this.stopLoading()
     },
-    load () {
+    load() {
       this.set([])
       this.startLoading()
-      return axios.get(workspaceEndpoint).then((response) => {
+      return useOpnFetch(workspaceEndpoint).then((response) => {
         this.set(response.data)
         this.stopLoading()
       })
     },
-    loadIfEmpty () {
+    loadIfEmpty() {
       if (this.content.length === 0) {
         return this.load()
       }
       return Promise.resolve()
     },
-    delete (id) {
+    delete(id) {
       this.startLoading()
-      return axios.delete(workspaceEndpoint + id).then((response) => {
+      return useOpnFetch(workspaceEndpoint + id, {method: 'DELETE'}).then((response) => {
         this.remove(response.data.workspace_id)
         this.stopLoading()
       })