Browse Source

fix/minor cleanup

pull/3035/head
Muhammed Mustafa 2 years ago
parent
commit
a1f6a38a2a
  1. 2
      packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue
  2. 13
      packages/nc-gui-v2/components/smartsheet/sidebar/menu/ApiSnippet.vue
  3. 5
      packages/nc-gui-v2/composables/useGlobal/state.ts
  4. 3
      packages/nc-gui-v2/composables/useProject.ts
  5. 2
      packages/nc-gui-v2/plugins/state.ts

2
packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue

@ -91,7 +91,7 @@ function onOpenModal(type: ViewTypes, title = '') {
</a-tooltip> </a-tooltip>
</a-menu-item> </a-menu-item>
<SmartsheetSidebarMenuApiSnippet :model-value="showApiSnippet" @update:model-value="(val) => (showApiSnippet = val)" /> <SmartsheetSidebarMenuApiSnippet v-model="showApiSnippet" />
<div class="flex-auto justify-end flex flex-col gap-4 mt-4"> <div class="flex-auto justify-end flex flex-col gap-4 mt-4">
<button <button
class="flex items-center gap-2 w-full mx-3 px-4 py-3 rounded !bg-primary text-white transform translate-x-4 hover:(translate-x-0 shadow-lg) transition duration-150 ease" class="flex items-center gap-2 w-full mx-3 px-4 py-3 rounded !bg-primary text-white transform translate-x-4 hover:(translate-x-0 shadow-lg) transition duration-150 ease"

13
packages/nc-gui-v2/components/smartsheet/sidebar/menu/ApiSnippet.vue

@ -1,27 +1,24 @@
<script setup lang="ts"> <script setup lang="ts">
import HTTPSnippet from 'httpsnippet' import HTTPSnippet from 'httpsnippet'
import { useClipboard } from '@vueuse/core' import { useClipboard } from '@vueuse/core'
import { useToast } from 'vue-toastification' import { notification } from 'ant-design-vue'
import { ActiveViewInj, MetaInj } from '~/context' import { ActiveViewInj, MetaInj } from '~/context'
const props = defineProps<Props>() const props = defineProps<Props>()
const emits = defineEmits(['update:modelValue']) const emits = defineEmits(['update:modelValue'])
const toast = useToast()
interface Props { interface Props {
modelValue: boolean modelValue: boolean
} }
const { project } = $(useProject()) const { project } = $(useProject())
const { appInfo } = $(useGlobal()) const { appInfo, token } = $(useGlobal())
const meta = $(inject(MetaInj)) const meta = $(inject(MetaInj))
const view = $(inject(ActiveViewInj)) const view = $(inject(ActiveViewInj))
const { xWhere } = useSmartsheetStoreOrThrow() const { xWhere } = useSmartsheetStoreOrThrow()
const { queryParams } = $(useViewData(meta, view as any, xWhere)) const { queryParams } = $(useViewData(meta, view as any, xWhere))
const { copy } = useClipboard() const { copy } = useClipboard()
const { $state } = useNuxtApp()
let vModel = $(useVModel(props, 'modelValue', emits)) let vModel = $(useVModel(props, 'modelValue', emits))
@ -73,7 +70,7 @@ const snippet = $computed(
() => () =>
new HTTPSnippet({ new HTTPSnippet({
method: 'GET', method: 'GET',
headers: [{ name: 'xc-auth', value: $state.token.value as string, comment: 'JWT Auth token' }], headers: [{ name: 'xc-auth', value: token as string, comment: 'JWT Auth token' }],
url: apiUrl, url: apiUrl,
queryString: Object.entries(queryParams || {}).map(([name, value]) => { queryString: Object.entries(queryParams || {}).map(([name, value]) => {
return { return {
@ -92,7 +89,7 @@ const code = $computed(() => {
const api = new Api({ const api = new Api({
baseURL: ${JSON.stringify(apiUrl)}, baseURL: ${JSON.stringify(apiUrl)},
headers: { headers: {
"xc-auth": ${JSON.stringify($state.token.value as string)} "xc-auth": ${JSON.stringify(token as string)}
} }
}) })
@ -113,7 +110,7 @@ api.dbViewRow.list(
const onCopyToClipboard = () => { const onCopyToClipboard = () => {
copy(code) copy(code)
toast.info('Copied to clipboard') notification.info({ message: 'Copied to clipboard' })
} }
const afterVisibleChange = (visible: boolean) => { const afterVisibleChange = (visible: boolean) => {

5
packages/nc-gui-v2/composables/useGlobal/state.ts

@ -1,7 +1,7 @@
import { usePreferredLanguages, useStorage } from '@vueuse/core' import { 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 type { State, StoredState } from './types' import type { AppInfo, State, StoredState } from './types'
import { computed, ref, toRefs, useCounter, useNuxtApp, useTimestamp } from '#imports' import { computed, ref, toRefs, useCounter, useNuxtApp, useTimestamp } from '#imports'
import type { User } from '~/lib' import type { User } from '~/lib'
@ -71,6 +71,8 @@ export function useGlobalState(storageKey = 'nocodb-gui-v2'): State {
set: (val) => (storage.value.token = val), set: (val) => (storage.value.token = val),
}) })
const appInfo = ref<AppInfo>({ ncSiteUrl: 'localhost:8080' })
/** reactive token payload */ /** reactive token payload */
const { payload } = useJwt<JwtPayload & User>(token) const { payload } = useJwt<JwtPayload & User>(token)
@ -88,5 +90,6 @@ export function useGlobalState(storageKey = 'nocodb-gui-v2'): State {
timestamp, timestamp,
runningRequests, runningRequests,
error, error,
appInfo,
} }
} }

3
packages/nc-gui-v2/composables/useProject.ts

@ -11,7 +11,6 @@ export function useProject(projectId?: MaybeRef<string>) {
const _projectId = $computed(() => unref(projectId)) const _projectId = $computed(() => unref(projectId))
const project = useState<ProjectType>('project') const project = useState<ProjectType>('project')
const appInfo = useState<any>('appInfo')
const tables = useState<TableType[]>('tables', () => [] as TableType[]) const tables = useState<TableType[]>('tables', () => [] as TableType[])
async function loadProjectRoles() { async function loadProjectRoles() {
@ -50,5 +49,5 @@ export function useProject(projectId?: MaybeRef<string>) {
() => SqlUiFactory.create({ client: projectBaseType }) as Exclude<ReturnType<typeof SqlUiFactory['create']>, typeof OracleUi>, () => SqlUiFactory.create({ client: projectBaseType }) as Exclude<ReturnType<typeof SqlUiFactory['create']>, typeof OracleUi>,
) )
return { project, tables, loadProjectRoles, loadProject, appInfo, loadTables, isMysql, isPg, sqlUi } return { project, tables, loadProjectRoles, loadProject, loadTables, isMysql, isPg, sqlUi }
} }

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

@ -23,7 +23,7 @@ export default defineNuxtPlugin(async (nuxtApp) => {
nuxtApp.vueApp.i18n.locale.value = state.lang.value nuxtApp.vueApp.i18n.locale.value = state.lang.value
try { try {
state.appInfo = await $api.utils.appInfo() state.appInfo.value = await $api.utils.appInfo()
} catch (e) { } catch (e) {
console.error(e) console.error(e)
} }

Loading…
Cancel
Save