From 6e894624db2289a172d4584577bbd5a17ed5ce20 Mon Sep 17 00:00:00 2001 From: Pranav C Date: Fri, 12 Aug 2022 23:46:34 +0530 Subject: [PATCH] wip(gui-v2): change useProject composable to work using shared base id Signed-off-by: Pranav C --- .../components/dashboard/TreeView.vue | 2 +- .../components/general/MiniSidebar.vue | 2 +- .../composables/useApi/interceptors.ts | 2 +- packages/nc-gui-v2/composables/useProject.ts | 25 +++++++++++++------ packages/nc-gui-v2/composables/useTabs.ts | 21 +++++++++++----- .../[projectId]/index.vue | 4 +-- .../[projectId]/index/index.vue | 0 .../index/[type]/[title]/[[viewTitle]].vue | 0 .../[projectId]/index/index/auth.vue | 0 .../[projectId]/index/index/index.vue | 0 10 files changed, 37 insertions(+), 19 deletions(-) rename packages/nc-gui-v2/pages/{nc => [projectType]}/[projectId]/index.vue (98%) rename packages/nc-gui-v2/pages/{nc => [projectType]}/[projectId]/index/index.vue (100%) rename packages/nc-gui-v2/pages/{nc => [projectType]}/[projectId]/index/index/[type]/[title]/[[viewTitle]].vue (100%) rename packages/nc-gui-v2/pages/{nc => [projectType]}/[projectId]/index/index/auth.vue (100%) rename packages/nc-gui-v2/pages/{nc => [projectType]}/[projectId]/index/index/index.vue (100%) diff --git a/packages/nc-gui-v2/components/dashboard/TreeView.vue b/packages/nc-gui-v2/components/dashboard/TreeView.vue index 1056663fb7..ab9f5eb0a2 100644 --- a/packages/nc-gui-v2/components/dashboard/TreeView.vue +++ b/packages/nc-gui-v2/components/dashboard/TreeView.vue @@ -16,7 +16,7 @@ const { $api, $e } = useNuxtApp() const route = useRoute() -const { tables, loadTables } = useProject(route.params.projectId as string) +const { tables, loadTables } = useProject() const { activeTab } = useTabs() const { deleteTable } = useTable() diff --git a/packages/nc-gui-v2/components/general/MiniSidebar.vue b/packages/nc-gui-v2/components/general/MiniSidebar.vue index 9034f44756..81fb2589f6 100644 --- a/packages/nc-gui-v2/components/general/MiniSidebar.vue +++ b/packages/nc-gui-v2/components/general/MiniSidebar.vue @@ -106,7 +106,7 @@ const logout = () => {
diff --git a/packages/nc-gui-v2/composables/useApi/interceptors.ts b/packages/nc-gui-v2/composables/useApi/interceptors.ts index c8c6fd1fa6..6924779344 100644 --- a/packages/nc-gui-v2/composables/useApi/interceptors.ts +++ b/packages/nc-gui-v2/composables/useApi/interceptors.ts @@ -18,7 +18,7 @@ export function addAxiosInterceptors(api: Api) { } if (!config.url?.endsWith('/user/me') && !config.url?.endsWith('/admin/roles')) { - if (route && route.params && route.params.shared_base_id) config.headers['xc-shared-base-id'] = route.params.shared_base_id + if (route && route.params && route.params.projectType === 'base') config.headers['xc-shared-base-id'] = route.params.projectId } return config diff --git a/packages/nc-gui-v2/composables/useProject.ts b/packages/nc-gui-v2/composables/useProject.ts index 7d4fc760db..6ac63b701c 100644 --- a/packages/nc-gui-v2/composables/useProject.ts +++ b/packages/nc-gui-v2/composables/useProject.ts @@ -1,17 +1,19 @@ import { SqlUiFactory } from 'nocodb-sdk' import type { OracleUi, ProjectType, TableType } from 'nocodb-sdk' import type { MaybeRef } from '@vueuse/core' -import { useNuxtApp, useState } from '#app' +import { useNuxtApp, useRoute, useState } from '#app' import { USER_PROJECT_ROLES } from '~/lib' export function useProject(projectId?: MaybeRef) { const projectRoles = useState>(USER_PROJECT_ROLES, () => ({})) const { $api } = useNuxtApp() - - const _projectId = $computed(() => unref(projectId)) + let _projectId = $ref('') const project = useState('project') const tables = useState('tables', () => [] as TableType[]) + const route = useRoute() + + const projectType = $computed(() => route.params.projectType as string) async function loadProjectRoles() { projectRoles.value = {} @@ -29,14 +31,21 @@ export function useProject(projectId?: MaybeRef) { } } - async function loadProject(id: string) { - project.value = await $api.project.read(id) - await loadProjectRoles() + async function loadProject() { + if(unref(projectId)){ + _projectId = unref(projectId)! + } else if (projectType === 'base') { + const baseData = await $api.public.sharedBaseGet(route.params.projectId as string) + _projectId = baseData.project_id! + } else { + _projectId = route.params.projectId as string + } + project.value = await $api.project.read(_projectId!) } watchEffect(async () => { - if (_projectId) { - await loadProject(_projectId) + if (project?.value ) { + await loadProjectRoles() await loadTables() } }) diff --git a/packages/nc-gui-v2/composables/useTabs.ts b/packages/nc-gui-v2/composables/useTabs.ts index 99817e6b5a..01072f1765 100644 --- a/packages/nc-gui-v2/composables/useTabs.ts +++ b/packages/nc-gui-v2/composables/useTabs.ts @@ -1,6 +1,9 @@ import type { WritableComputedRef } from '@vue/reactivity' import { navigateTo, useProject, useRoute, useState } from '#imports' +import type { RouterConfig } from '@nuxt/schema' + + export enum TabType { TABLE = 'table', VIEW = 'view', @@ -29,9 +32,11 @@ export function useTabs() { const router = useRouter() const { tables } = useProject() + const projectType = $computed(() => route.params.projectType as string) + const activeTabIndex: WritableComputedRef = computed({ get() { - if ((route.name as string)?.startsWith('nc-projectId-index-index-type-title-viewTitle') && tables.value?.length) { + if ((route.name as string)?.startsWith('projectType-projectId-index-index-type-title-viewTitle') && tables.value?.length) { const tab: Partial = { type: route.params.type as TabType, title: route.params.title as string } const id = tables.value?.find((t) => t.title === tab.title)?.id @@ -56,7 +61,7 @@ export function useTabs() { }, set(index: number) { if (index === -1) { - navigateTo(`/nc/${route.params.projectId}`) + navigateTo(`/${projectType}/${route.params.projectId}`) } else { const tab = tabs.value[index] @@ -91,7 +96,7 @@ export function useTabs() { let newTabIndex = index - 1 if (newTabIndex < 0 && tabs.value?.length > 1) newTabIndex = index + 1 if (newTabIndex === -1) { - await navigateTo(`/nc/${route.params.projectId}`) + await navigateTo(`/${projectType}/${route.params.projectId}`) } else { await navigateToTab(tabs.value?.[newTabIndex]) } @@ -102,11 +107,15 @@ export function useTabs() { function navigateToTab(tab: TabItem) { switch (tab.type) { case TabType.TABLE: - return navigateTo(`/nc/${route.params.projectId}/table/${tab?.title}${tab.viewTitle ? `/${tab.viewTitle}` : ''}`) + return navigateTo( + `/${projectType}/${route.params.projectId}/table/${tab?.title}${tab.viewTitle ? `/${tab.viewTitle}` : ''}`, + ) case TabType.VIEW: - return navigateTo(`/nc/${route.params.projectId}/view/${tab?.title}${tab.viewTitle ? `/${tab.viewTitle}` : ''}`) + return navigateTo( + `/${projectType}/${route.params.projectId}/view/${tab?.title}${tab.viewTitle ? `/${tab.viewTitle}` : ''}`, + ) case TabType.AUTH: - return navigateTo(`/nc/${route.params.projectId}/auth`) + return navigateTo(`/${projectType}/${route.params.projectId}/auth`) } } diff --git a/packages/nc-gui-v2/pages/nc/[projectId]/index.vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index.vue similarity index 98% rename from packages/nc-gui-v2/pages/nc/[projectId]/index.vue rename to packages/nc-gui-v2/pages/[projectType]/[projectId]/index.vue index d90987b1d3..613c503d33 100644 --- a/packages/nc-gui-v2/pages/nc/[projectId]/index.vue +++ b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index.vue @@ -5,7 +5,7 @@ import { openLink } from '~/utils' const route = useRoute() -const { project, loadProject, loadTables } = useProject(route.params.projectId as string) +const { project, loadProject, loadTables } = useProject() const { addTab, clearTabs } = useTabs() @@ -39,7 +39,7 @@ function toggleDialog(value?: boolean, key?: string) { openDialogKey.value = key } -await loadProject(route.params.projectId as string) +await loadProject() await loadTables() diff --git a/packages/nc-gui-v2/pages/nc/[projectId]/index/index.vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index.vue similarity index 100% rename from packages/nc-gui-v2/pages/nc/[projectId]/index/index.vue rename to packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index.vue diff --git a/packages/nc-gui-v2/pages/nc/[projectId]/index/index/[type]/[title]/[[viewTitle]].vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/[type]/[title]/[[viewTitle]].vue similarity index 100% rename from packages/nc-gui-v2/pages/nc/[projectId]/index/index/[type]/[title]/[[viewTitle]].vue rename to packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/[type]/[title]/[[viewTitle]].vue diff --git a/packages/nc-gui-v2/pages/nc/[projectId]/index/index/auth.vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/auth.vue similarity index 100% rename from packages/nc-gui-v2/pages/nc/[projectId]/index/index/auth.vue rename to packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/auth.vue diff --git a/packages/nc-gui-v2/pages/nc/[projectId]/index/index/index.vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue similarity index 100% rename from packages/nc-gui-v2/pages/nc/[projectId]/index/index/index.vue rename to packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue