Browse Source

feat/gui-v2-user-management-invite-moved-useglobal-to-folder-added-init-plugin-which-handles-feedback-form-logic

pull/2854/head
Muhammed Mustafa 2 years ago
parent
commit
72ba657213
  1. 9
      packages/nc-gui-v2/composables/useGlobalState/index.ts
  2. 5
      packages/nc-gui-v2/composables/useGlobalState/initialFeedBackForm.ts
  3. 8
      packages/nc-gui-v2/lib/types.ts
  4. 2
      packages/nc-gui-v2/plugins/api.ts
  5. 46
      packages/nc-gui-v2/plugins/init.ts

9
packages/nc-gui-v2/composables/useGlobalState.ts → packages/nc-gui-v2/composables/useGlobalState/index.ts

@ -1,6 +1,7 @@
import { breakpointsTailwind, usePreferredLanguages, useStorage } from '@vueuse/core' import { breakpointsTailwind, usePreferredLanguages, useStorage } from '@vueuse/core'
import { useJwt } from '@vueuse/integrations/useJwt' import { useJwt } from '@vueuse/integrations/useJwt'
import type { JwtPayload } from 'jwt-decode' import type { JwtPayload } from 'jwt-decode'
import initialFeedBackForm from './initialFeedBackForm'
import { computed, ref, toRefs, useBreakpoints, useNuxtApp, useTimestamp, watch } from '#imports' import { computed, ref, toRefs, useBreakpoints, useNuxtApp, useTimestamp, watch } from '#imports'
import type { Actions, Getters, GlobalState, StoredState, User } from '~/lib/types' import type { Actions, Getters, GlobalState, StoredState, User } from '~/lib/types'
@ -67,7 +68,13 @@ export const useGlobalState = (): GlobalState => {
}, 'en' /** fallback locale */) }, 'en' /** fallback locale */)
/** State */ /** State */
const initialState: StoredState = { token: null, user: null, lang: preferredLanguage, darkMode: prefersDarkMode } const initialState: StoredState = {
token: null,
user: null,
lang: preferredLanguage,
darkMode: prefersDarkMode,
feedbackForm: initialFeedBackForm,
}
/** saves a reactive state, any change to these values will write/delete to localStorage */ /** saves a reactive state, any change to these values will write/delete to localStorage */
const storage = $(useStorage<StoredState>(storageKey, initialState)) const storage = $(useStorage<StoredState>(storageKey, initialState))

5
packages/nc-gui-v2/composables/useGlobalState/initialFeedBackForm.ts

@ -0,0 +1,5 @@
export default {
url: 'https://docs.google.com/forms/d/e/1FAIpQLSeTlAfZjszgr53lArz3NvUEnJGOT9JtG9NAU5d0oQwunDS2Pw/viewform?embedded=true',
createdAt: new Date('2020-01-01T00:00:00.000Z').toISOString(),
isHidden: false,
}

8
packages/nc-gui-v2/lib/types.ts

@ -9,11 +9,19 @@ export interface User {
roles: Roles roles: Roles
} }
export interface FeedbackForm {
url: string
createdAt: string
isHidden: boolean
lastFormPollDate?: string
}
export interface StoredState { export interface StoredState {
token: string | null token: string | null
user: User | null user: User | null
lang: string lang: string
darkMode: boolean darkMode: boolean
feedbackForm: FeedbackForm
} }
export interface State extends StoredState { export interface State extends StoredState {

2
packages/nc-gui-v2/plugins/api.ts

@ -21,7 +21,7 @@ function addAxiosInterceptors(api: Api<any>, app: { $state: GlobalState }) {
api.instance.interceptors.request.use((config) => { api.instance.interceptors.request.use((config) => {
config.headers['xc-gui'] = 'true' config.headers['xc-gui'] = 'true'
if (app.$state.token.value) config.headers['xc-auth'] = app.$state.token.value if (app.$state?.token.value) config.headers['xc-auth'] = app.$state.token.value
if (!config.url?.endsWith('/user/me') && !config.url?.endsWith('/admin/roles')) { if (!config.url?.endsWith('/user/me') && !config.url?.endsWith('/admin/roles')) {
// config.headers['xc-preview'] = store.state.users.previewAs // config.headers['xc-preview'] = store.state.users.previewAs

46
packages/nc-gui-v2/plugins/init.ts

@ -0,0 +1,46 @@
import type { Dayjs } from 'dayjs'
import dayjs from 'dayjs'
import duration from 'dayjs/plugin/duration'
import { defineNuxtPlugin } from '#app'
dayjs.extend(duration)
const handleFeedbackForm = async () => {
let { feedbackForm: currentFeedbackForm } = $(useGlobalState())
if (!currentFeedbackForm) return
const { $api } = useNuxtApp()
const fetchFeedbackForm = async (now: Dayjs) => {
try {
const { data: feedbackForm } = await $api.instance.get('/api/v1/feedback_form')
const isFetchedFormDuplicate = currentFeedbackForm.url === feedbackForm.url
currentFeedbackForm = {
url: feedbackForm.url,
lastFormPollDate: now.toISOString(),
createdAt: feedbackForm.created_at,
isHidden: isFetchedFormDuplicate ? currentFeedbackForm.isHidden : false,
}
} catch (e) {
console.error(e)
}
}
const isFirstTimePolling = !currentFeedbackForm.lastFormPollDate
const now = dayjs()
const lastFormPolledDate = dayjs(currentFeedbackForm.lastFormPollDate)
if (isFirstTimePolling || dayjs.duration(now.diff(lastFormPolledDate)).days() > 0) {
await fetchFeedbackForm(now)
}
}
const handleInitFunctions = async () => {
await handleFeedbackForm()
}
export default defineNuxtPlugin((nuxtApp) => {
nuxtApp.vueApp.use(handleInitFunctions)
})
Loading…
Cancel
Save