fix: some navigation issue adn oss missing changes

2026-05-02 01:36:51 +00:00 · 2026-03-04 14:42:39 +00:00
parent 290741f230
commit 06b453baa8
11 changed files with 243 additions and 128 deletions
--- a/packages/nc-gui/components/dashboard/TreeView/Project/BaseSettingsMenu.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/Project/BaseSettingsMenu.vue
@@ -12,8 +12,12 @@ const base = inject(ProjectInj)!

 const baseRole = inject(ProjectRoleInj)!

+const { isMobileMode } = useGlobal()
+
 const { isUIAllowed, baseRoles, loadRoles } = useRoles()

+const { showUpgradeToUseTableAndFieldPermissions, showUpgradeToUseSync } = useEeConfig()
+
 const resolveBaseId = () => {
  if (route.value.params.baseId) return route.value.params.baseId as string
  if (base.value?.id) return base.value.id
@@ -24,6 +28,9 @@ const resolveBaseId = () => {
 }

 const navigateToBaseSettings = (page: string) => {
+  if (page === 'permissions' && showUpgradeToUseTableAndFieldPermissions()) return
+  if (page === 'syncs' && showUpgradeToUseSync()) return
+
  const baseId = resolveBaseId()
  if (!baseId) return

@@ -61,7 +68,7 @@ onMounted(() => {
    </div>
    <NcSidebarMenuItem
      v-if="isUIAllowed('newUser', { roles: effectiveRoles })"
-      v-e="['c:admin:base:add-user']"
+      v-e="['c:settings:base:add-user']"
      icon="users"
      :active="isSettingsItemActive('collaborator')"
      @click="navigateToBaseSettings('collaborator')"
@@ -69,8 +76,17 @@ onMounted(() => {
      {{ $t('labels.addUserToBase') }}
    </NcSidebarMenuItem>
    <NcSidebarMenuItem
-      v-if="isUIAllowed('manageMCP', { roles: effectiveRoles })"
-      v-e="['c:admin:base:mcp']"
+      v-if="isEeUI && isUIAllowed('sourceCreate', { roles: effectiveRoles }) && !isMobileMode"
+      v-e="['c:settings:base:permissions']"
+      icon="ncLock"
+      :active="isSettingsItemActive('permissions')"
+      @click="navigateToBaseSettings('permissions')"
+    >
+      {{ $t('labels.dataPermissions') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="isUIAllowed('manageMCP', { roles: effectiveRoles }) && !isMobileMode"
+      v-e="['c:settings:base:mcp']"
      icon="mcp"
      :active="isSettingsItemActive('mcp')"
      @click="navigateToBaseSettings('mcp')"
@@ -78,8 +94,26 @@ onMounted(() => {
      {{ $t('title.mcpServer') }}
    </NcSidebarMenuItem>
    <NcSidebarMenuItem
-      v-if="isUIAllowed('sourceCreate', { roles: effectiveRoles })"
-      v-e="['c:admin:base:add-data-source']"
+      v-if="isEeUI && isUIAllowed('sourceCreate', { roles: effectiveRoles }) && !isMobileMode"
+      v-e="['c:settings:base:syncs']"
+      icon="ncZap"
+      :active="isSettingsItemActive('syncs')"
+      @click="navigateToBaseSettings('syncs')"
+    >
+      {{ $t('labels.manageSyncs') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="isEeUI && isUIAllowed('baseMiscSettings', { roles: effectiveRoles }) && isUIAllowed('manageSnapshot', { roles: effectiveRoles }) && !isMobileMode"
+      v-e="['c:settings:base:snapshots']"
+      icon="camera"
+      :active="isSettingsItemActive('snapshots')"
+      @click="navigateToBaseSettings('snapshots')"
+    >
+      {{ $t('labels.manageSnapshots') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="isUIAllowed('sourceCreate', { roles: effectiveRoles }) && !isMobileMode"
+      v-e="['c:settings:base:add-data-source']"
      icon="ncDatabase"
      :active="isSettingsItemActive('data-source')"
      @click="navigateToBaseSettings('data-source')"
@@ -87,7 +121,8 @@ onMounted(() => {
      {{ $t('labels.addDataSource') }}
    </NcSidebarMenuItem>
    <NcSidebarMenuItem
-      v-e="['c:admin:base:more']"
+      v-if="!isMobileMode"
+      v-e="['c:settings:base:more']"
      icon="ncMoreHorizontal"
      :active="isSettingsItemActive('base-settings')"
      @click="navigateToBaseSettings('base-settings')"
--- a/packages/nc-gui/components/dashboard/TreeView/Project/Home.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/Project/Home.vue
@@ -1,72 +1,34 @@
 <script lang="ts" setup>
 import Table from '~/components/dashboard/TreeView/Table/index.vue'

-const router = useRouter()
-const route = router.currentRoute
+const sidebarStore = useSidebarStore()

-const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
+const { activeSidebarTab } = storeToRefs(sidebarStore)

 const { isSharedBase } = storeToRefs(useBase())
-const { baseUrl } = useBase()
-
-const base = inject(ProjectInj)!
-
-const basesStore = useBases()
-
-const { activeProjectId } = storeToRefs(basesStore)
-
-const { isUIAllowed } = useRoles()

 const { isMobileMode } = useGlobal()

+const base = inject(ProjectInj)!
+
+const baseRole = inject(ProjectRoleInj)!
+
+const { isUIAllowed } = useRoles()
+
 const { isDark } = useTheme()

-const { meta: metaKey, control } = useMagicKeys()
-
 const projectNodeRef = ref()

-// If only base is open, i.e in case of docs, base view is open and not the page view
-const baseViewOpen = computed(() => {
-  const routeNameSplit = String(route.value?.name).split('baseId-index-index')
-  if (routeNameSplit.length <= 1) return false
-
-  const routeNameAfterProjectView = routeNameSplit[routeNameSplit.length - 1]
-  return routeNameAfterProjectView.split('-').length === 2 || routeNameAfterProjectView.split('-').length === 1
-})
-
 async function addNewProjectChildEntity(showSourceSelector = true) {
  if (!projectNodeRef.value) return

  projectNodeRef.value?.addNewProjectChildEntity?.(showSourceSelector)
 }

-const openBaseHomePage = async () => {
-  if (isMobileMode.value && isLeftSidebarOpen.value && route.value.name === 'index-typeOrId-baseId-index-index') {
-    isLeftSidebarOpen.value = false
-
-    return
-  }
-  const cmdOrCtrl = isMac() ? metaKey.value : control.value
-
-  await navigateTo(
-    `${cmdOrCtrl ? '#' : ''}${baseUrl({
-      id: base.value.id!,
-      type: 'database',
-      isSharedBase: isSharedBase.value,
-      projectPage: !isUIAllowed('projectOverviewTab') || isMobileMode.value ? 'collaborator' : undefined,
-    })}`,
-    cmdOrCtrl
-      ? {
-          open: navigateToBlankTargetOpenOption,
-        }
-      : undefined,
-  )
-}
-
 const isVisibleCreateNew = ref(false)

 const hasTableCreatePermission = computed(() => {
-  return isUIAllowed('tableCreate', { roles: base.value.project_role, source: base.value?.sources?.[0] })
+  return isUIAllowed('tableCreate', { roles: baseRole.value, source: base.value?.sources?.[0] })
 })
 </script>

@@ -95,32 +57,7 @@ const hasTableCreatePermission = computed(() => {
        <DashboardTreeViewProjectNode v-else ref="projectNodeRef" is-project-header />
      </DashboardSidebarHeaderWrapper>

-      <DashboardTreeViewProjectHomeSearchInput placeholder="Search table, view" />
-
-      <div v-if="!isSharedBase" class="nc-project-home-section pt-1 !pb-2 flex flex-col gap-2">
-        <NcButton
-          v-e="['c:base:home']"
-          type="text"
-          size="xsmall"
-          class="nc-sidebar-top-button !h-8 w-full !pl-0"
-          :centered="false"
-          :class="{
-            '!text-nc-content-brand-disabled !bg-nc-bg-brand !hover:bg-nc-bg-brand': activeProjectId === base.id && baseViewOpen,
-            '!hover:(bg-nc-bg-gray-medium text-nc-content-gray-subtle)': !(activeProjectId === base.id && baseViewOpen),
-          }"
-          data-testid="nc-sidebar-base-overview-btn"
-          @click="openBaseHomePage"
-        >
-          <div
-            class="flex items-center gap-2 pl-3 pr-1"
-            :class="{
-              'font-semibold': activeProjectId === base.id && baseViewOpen,
-            }"
-          >
-            <GeneralIcon icon="home1" class="!h-4 w-4" />
-            <div>{{ $t('general.home') }}</div>
-          </div>
-        </NcButton>
+      <div v-if="!isSharedBase && activeSidebarTab !== 'settings'" class="nc-project-home-section pt-1 !pb-2 flex flex-col gap-2">
        <div v-if="hasTableCreatePermission" class="flex items-center w-full xs:hidden">
          <NcDropdown v-model:visible="isVisibleCreateNew">
            <NcButton
@@ -129,12 +66,8 @@ const hasTableCreatePermission = computed(() => {
              full-width
              class="nc-home-create-new-btn nc-home-create-new-dropdown-btn !text-nc-content-brand !hover:(text-nc-content-brand-disabled) !xs:hidden !w-full !px-3"
              :class="isVisibleCreateNew ? 'active' : ''"
-              icon-position="right"
              data-testid="nc-home-create-new-btn"
            >
-              <template #icon>
-                <GeneralIcon icon="chevronDown" class="flex-none" />
-              </template>
              <div class="flex items-center gap-2">
                <GeneralIcon icon="ncPlusCircleSolid" />

@@ -154,7 +87,22 @@ const hasTableCreatePermission = computed(() => {
    </div>

    <div class="flex-1 relative overflow-y-auto nc-scrollbar-thin">
-      <Table :base-id="base.id" @create-table="addNewProjectChildEntity()" />
+      <!-- Data tab -->
+      <template v-if="activeSidebarTab === 'data'">
+        <Table :base-id="base.id" @create-table="addNewProjectChildEntity()" />
+      </template>
+
+      <!-- Settings panel -->
+      <template v-else-if="activeSidebarTab === 'settings'">
+        <DashboardTreeViewProjectBaseSettingsMenu v-if="!isSharedBase" />
+        <div v-if="!isSharedBase && !isMobileMode" class="mx-3 border-t border-nc-border-gray-medium"></div>
+        <DashboardTreeViewProjectWsSettingsMenu />
+      </template>
+
+      <!-- Fallback to data -->
+      <template v-else>
+        <Table :base-id="base.id" @create-table="addNewProjectChildEntity()" />
+      </template>
    </div>

    <slot name="footer"> </slot>
--- a/packages/nc-gui/components/dashboard/TreeView/Project/List.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/Project/List.vue
@@ -16,7 +16,9 @@ const { createProject: _createProject } = basesStore

 const { bases, basesList, activeProjectId, isProjectsLoaded, isProjectsLoading } = storeToRefs(basesStore)

-const { activeWorkspaceId } = storeToRefs(useWorkspace())
+const { activeWorkspaceId, activeWorkspace } = storeToRefs(useWorkspace())
+
+const { activeSidebarTab } = storeToRefs(useSidebarStore())

 const baseCreateDlg = ref(false)

@@ -332,6 +334,25 @@ watch(
      </ProjectWrapper>
    </div>

+    <div
+      v-else-if="isProjectsLoaded && !isProjectsLoading && !basesList.length && activeSidebarTab === 'settings'"
+      class="nc-treeview-active-base flex flex-col h-full"
+    >
+      <div>
+        <DashboardSidebarHeaderWrapper>
+          <NcTooltip class="truncate font-semibold text-sm text-nc-content-gray" show-on-truncate-only>
+            <template #title>{{ activeWorkspace?.title }}</template>
+            {{ activeWorkspace?.title }}
+          </NcTooltip>
+        </DashboardSidebarHeaderWrapper>
+      </div>
+
+      <div class="flex-1 relative overflow-y-auto nc-scrollbar-thin">
+        <DashboardTreeViewProjectWsSettingsMenu />
+      </div>
+
+      <slot name="footer" />
+    </div>
    <div v-else-if="isProjectsLoaded && !isProjectsLoading && !basesList.length" class="nc-treeview-empty-state">
      <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('activity.noBasesFound')" class="!mb-1" />

--- a/packages/nc-gui/components/dashboard/TreeView/Project/WsSettingsMenu.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/Project/WsSettingsMenu.vue
@@ -1,13 +1,42 @@
 <script lang="ts" setup>
+import { PlanFeatureTypes, PlanTitles } from 'nocodb-sdk'
+
 const router = useRouter()
 const route = router.currentRoute

+const workspaceStore = useWorkspace()
+const { activeWorkspace, isTeamsEnabled } = storeToRefs(workspaceStore)
+
 const sidebarStore = useSidebarStore()
 const { activeSidebarTab } = storeToRefs(sidebarStore)

+const { appInfo, isMobileMode } = useGlobal()
+
 const { isUIAllowed } = useRoles()

+const { t } = useI18n()
+
+const { isWsAuditEnabled, isPaymentEnabled, getFeature, showUpgradeToUseTeams, handleUpgradePlan } = useEeConfig()
+
+const isWorkspaceSsoAvail = computed(() => {
+  if (isEeUI && appInfo.value?.isCloud && getFeature(PlanFeatureTypes.FEATURE_SSO)) {
+    return true
+  }
+  return false
+})
+
 const navigateToWsSettings = (page: string) => {
+  if (page === 'ws-teams' && showUpgradeToUseTeams()) return
+
+  if (page === 'ws-audits' && !isWsAuditEnabled.value) {
+    handleUpgradePlan({
+      title: t('upgrade.upgradeToAccessWsAudit'),
+      content: t('upgrade.upgradeToAccessWsAuditSubtitle', { plan: PlanTitles.ENTERPRISE }),
+      limitOrFeature: PlanFeatureTypes.FEATURE_AUDIT_WORKSPACE,
+    })
+    return
+  }
+
  const wsId = route.value.params.typeOrId
  const slug = wsSettingsTabToSlug[page] || page
  navigateTo(`/${wsId}/settings/${slug}`)
@@ -26,12 +55,10 @@ const isWsSettingsItemActive = (tab: string) => {

 <template>
  <div class="nc-project-home-section">
-    <div class="nc-settings-section-header">
-      {{ $t('objects.workspace') }} {{ $t('labels.settings') }}
-    </div>
+    <div class="nc-settings-section-header">{{ $t('objects.workspace') }} {{ $t('labels.settings') }}</div>
    <NcSidebarMenuItem
      v-if="isUIAllowed('workspaceCollaborators')"
-      v-e="['c:admin:ws:invite-user']"
+      v-e="['c:settings:ws:invite-user']"
      icon="users"
      :active="isWsSettingsItemActive('ws-collaborators')"
      @click="navigateToWsSettings('ws-collaborators')"
@@ -39,7 +66,16 @@ const isWsSettingsItemActive = (tab: string) => {
      {{ $t('labels.inviteUsersToWorkspace') }}
    </NcSidebarMenuItem>
    <NcSidebarMenuItem
-      v-if="isUIAllowed('workspaceIntegrations')"
+      v-if="isEeUI && isTeamsEnabled"
+      v-e="['c:settings:ws:add-team']"
+      icon="ncBuilding"
+      :active="isWsSettingsItemActive('ws-teams')"
+      @click="navigateToWsSettings('ws-teams')"
+    >
+      {{ $t('labels.manageTeams') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="isUIAllowed('workspaceIntegrations') && !isMobileMode"
      v-e="['c:integrations']"
      icon="integration"
      :active="isWsSettingsItemActive('ws-integrations')"
@@ -48,8 +84,35 @@ const isWsSettingsItemActive = (tab: string) => {
      {{ $t('general.integrations') }}
    </NcSidebarMenuItem>
    <NcSidebarMenuItem
-      v-if="isUIAllowed('workspaceSettings') || isUIAllowed('workspaceCollaborators')"
-      v-e="['c:admin:ws:general']"
+      v-if="isEeUI && !activeWorkspace?.fk_org_id && isPaymentEnabled && isUIAllowed('workspaceBilling') && !isMobileMode"
+      v-e="['c:settings:ws:billing']"
+      icon="ncDollarSign"
+      :active="isWsSettingsItemActive('ws-billing')"
+      @click="navigateToWsSettings('ws-billing')"
+    >
+      {{ $t('general.billing') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="isEeUI && isUIAllowed('workspaceAuditList') && !isMobileMode"
+      v-e="['c:settings:ws:audits']"
+      icon="audit"
+      :active="isWsSettingsItemActive('ws-audits')"
+      @click="navigateToWsSettings('ws-audits')"
+    >
+      {{ $t('title.audits') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="isWorkspaceSsoAvail && !activeWorkspace?.fk_org_id && isUIAllowed('workspaceSSO') && !isMobileMode"
+      v-e="['c:settings:ws:sso']"
+      icon="sso"
+      :active="isWsSettingsItemActive('ws-sso')"
+      @click="navigateToWsSettings('ws-sso')"
+    >
+      {{ $t('title.sso') }}
+    </NcSidebarMenuItem>
+    <NcSidebarMenuItem
+      v-if="!isMobileMode && (isUIAllowed('workspaceSettings') || isUIAllowed('workspaceCollaborators'))"
+      v-e="['c:settings:ws:general']"
      icon="ncMoreHorizontal"
      :active="isWsSettingsItemActive('ws-settings')"
      @click="navigateToWsSettings('ws-settings')"