github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

Merge pull request #6607 from nocodb/nc-fix/misc-issues 

Misc issues
pull/6610/head
Muhammed Mustafa 11 months ago committed by GitHub
parent
21908758be f235e818b6
commit
05a2e797a2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 170 additions and 103 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
  2. 236
      packages/nc-gui/components/dashboard/settings/DataSources.vue
  3. 4
      packages/nc-gui/components/general/BaseLogo.vue
  4. 5
      packages/nc-gui/components/nc/Tooltip.vue
  5. 4
      packages/nc-gui/components/project/AllTables.vue
  6. 14
      packages/nc-gui/components/project/View.vue
  7. 6
      tests/playwright/pages/Dashboard/ProjectView/DataSourcePage.ts

4
packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
Unescape View File

@ -657,7 +657,7 @@ const projectDelete = () => {
class="source-context flex items-center gap-2 text-gray-800 nc-sidebar-node-title" class="source-context flex items-center gap-2 text-gray-800 nc-sidebar-node-title"
@contextmenu="setMenuContext('source', source)" @contextmenu="setMenuContext('source', source)"
> >
<GeneralBaseLogo :source-type="source.type" class="min-w-4 !xs:(min-w-4.25 w-4.25 text-sm)" /> <GeneralBaseLogo class="min-w-4 !xs:(min-w-4.25 w-4.25 text-sm)" />
{{ $t('general.default') }} {{ $t('general.default') }}
</div> </div>
<div <div
@ -665,7 +665,7 @@ const projectDelete = () => {
class="source-context flex flex-grow items-center gap-1.75 text-gray-800 min-w-1/20 max-w-full" class="source-context flex flex-grow items-center gap-1.75 text-gray-800 min-w-1/20 max-w-full"
@contextmenu="setMenuContext('source', source)" @contextmenu="setMenuContext('source', source)"
> >
<GeneralBaseLogo :source-type="source.type" class="min-w-4 !xs:(min-w-4.25 w-4.25 text-sm)" /> <GeneralBaseLogo class="min-w-4 !xs:(min-w-4.25 w-4.25 text-sm)" />
<div <div
:data-testid="`nc-sidebar-base-${source.alias}`" :data-testid="`nc-sidebar-base-${source.alias}`"
class="nc-sidebar-node-title flex capitalize text-ellipsis overflow-hidden select-none" class="nc-sidebar-node-title flex capitalize text-ellipsis overflow-hidden select-none"

236
packages/nc-gui/components/dashboard/settings/DataSources.vue
Unescape View File

@ -315,7 +315,7 @@ const isEditBaseModalOpen = computed({
<div class="ds-table-col ds-table-enabled cursor-pointer" @dblclick="forceAwaken">{{ $t('general.visibility') }}</div> <div class="ds-table-col ds-table-enabled cursor-pointer" @dblclick="forceAwaken">{{ $t('general.visibility') }}</div>
<div class="ds-table-col ds-table-name">{{ $t('general.name') }}</div> <div class="ds-table-col ds-table-name">{{ $t('general.name') }}</div>
<div class="ds-table-col ds-table-type">{{ $t('general.type') }}</div> <div class="ds-table-col ds-table-type">{{ $t('general.type') }}</div>
<div class="ds-table-col ds-table-actions pl-2">{{ $t('labels.actions') }}</div> <div class="ds-table-col ds-table-actions -ml-13">{{ $t('labels.actions') }}</div>
<div class="ds-table-col ds-table-crud"></div> <div class="ds-table-col ds-table-crud"></div>
</div> </div>
</div> </div>
@ -351,58 +351,82 @@ const isEditBaseModalOpen = computed({
<div class="ds-table-col ds-table-actions"> <div class="ds-table-col ds-table-actions">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<a-button <NcTooltip v-if="!sources[0].is_meta && !sources[0].is_local">
v-if="!sources[0].is_meta && !sources[0].is_local" <template #title>
class="nc-action-btn cursor-pointer outline-0"
type="text"
@click="baseAction(sources[0].id, DataSourcesSubTab.Metadata)"
>
<div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="sync" class="group-hover:text-accent" />
{{ $t('tooltip.metaSync') }} {{ $t('tooltip.metaSync') }}
</div> </template>
</a-button> <NcButton
<a-button class="nc-action-btn cursor-pointer outline-0"
class="nc-action-btn cursor-pointer outline-0" type="text"
type="text" data-testid="nc-data-sources-view-meta-sync"
@click="baseAction(sources[0].id, DataSourcesSubTab.ERD)" size="small"
> @click="baseAction(sources[0].id, DataSourcesSubTab.Metadata)"
<div class="flex items-center gap-2 text-gray-600"> >
<GeneralIcon icon="erd" class="group-hover:text-accent" /> <div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="sync" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
<NcTooltip>
<template #title>
{{ $t('title.relations') }} {{ $t('title.relations') }}
</div> </template>
</a-button> <NcButton
<a-button size="small"
class="nc-action-btn cursor-pointer outline-0" class="nc-action-btn cursor-pointer outline-0"
type="text" type="text"
@click="baseAction(sources[0].id, DataSourcesSubTab.UIAcl)" data-testid="nc-data-sources-view-erd"
> @click="baseAction(sources[0].id, DataSourcesSubTab.ERD)"
<div class="flex items-center gap-2 text-gray-600"> >
<GeneralIcon icon="acl" class="group-hover:text-accent" /> <div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="erd" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
<NcTooltip>
<template #title>
{{ $t('labels.uiAcl') }} {{ $t('labels.uiAcl') }}
</div> </template>
</a-button> <NcButton
<a-button size="small"
class="nc-action-btn cursor-pointer outline-0" class="nc-action-btn cursor-pointer outline-0"
type="text" type="text"
@click="baseAction(sources[0].id, DataSourcesSubTab.Audit)" data-testid="nc-data-sources-view-ui-acl"
> @click="baseAction(sources[0].id, DataSourcesSubTab.UIAcl)"
<div class="flex items-center gap-2 text-gray-600"> >
<GeneralIcon icon="book" class="group-hover:text-accent" /> <div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="acl" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
<NcTooltip>
<template #title>
{{ $t('title.audit') }} {{ $t('title.audit') }}
</div> </template>
</a-button> <NcButton
size="small"
class="nc-action-btn cursor-pointer outline-0"
type="text"
data-testid="nc-data-sources-view-audit"
@click="baseAction(sources[0].id, DataSourcesSubTab.Audit)"
>
<div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="book" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
</div> </div>
</div> </div>
<div class="ds-table-col ds-table-crud"> <div class="ds-table-col ds-table-crud">
<a-button <NcButton
v-if="!sources[0].is_meta && !sources[0].is_local" v-if="!sources[0].is_meta && !sources[0].is_local"
size="small"
class="nc-action-btn cursor-pointer outline-0 !w-8 !px-1 !rounded-lg" class="nc-action-btn cursor-pointer outline-0 !w-8 !px-1 !rounded-lg"
type="text" type="text"
@click="baseAction(sources[0].id, DataSourcesSubTab.Edit)" @click="baseAction(sources[0].id, DataSourcesSubTab.Edit)"
> >
<GeneralIcon icon="edit" class="text-gray-600" /> <GeneralIcon icon="edit" class="text-gray-600" />
</a-button> </NcButton>
</div> </div>
</div> </div>
</template> </template>
@ -419,12 +443,12 @@ const isEditBaseModalOpen = computed({
</a-tooltip> </a-tooltip>
</div> </div>
</div> </div>
<div class="ds-table-col ds-table-name font-medium"> <div class="ds-table-col ds-table-name font-medium w-full">
<GeneralIcon v-if="sources.length > 2" icon="dragVertical" small class="ds-table-handle" /> <GeneralIcon v-if="sources.length > 2" icon="dragVertical" small class="ds-table-handle" />
<div v-if="source.is_meta || source.is_local">-</div> <div v-if="source.is_meta || source.is_local">-</div>
<div v-else class="flex items-center gap-1"> <span v-else class="truncate">
{{ source.is_meta || source.is_local ? $t('general.base') : source.alias }} {{ source.is_meta || source.is_local ? $t('general.base') : source.alias }}
</div> </span>
</div> </div>
<div class="ds-table-col ds-table-type"> <div class="ds-table-col ds-table-type">
@ -437,56 +461,86 @@ const isEditBaseModalOpen = computed({
<div class="ds-table-col ds-table-actions"> <div class="ds-table-col ds-table-actions">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<a-button <NcTooltip>
class="nc-action-btn cursor-pointer outline-0" <template #title>
type="text"
@click="baseAction(source.id, DataSourcesSubTab.ERD)"
>
<div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="erd" class="group-hover:text-accent" />
{{ $t('title.relations') }} {{ $t('title.relations') }}
</div> </template>
</a-button> <NcButton
<a-button size="small"
type="text" class="nc-action-btn cursor-pointer outline-0"
class="nc-action-btn cursor-pointer outline-0" type="text"
@click="baseAction(source.id, DataSourcesSubTab.UIAcl)" data-testid="nc-data-sources-view-erd"
> @click="baseAction(source.id, DataSourcesSubTab.ERD)"
<div class="flex items-center gap-2 text-gray-600"> >
<GeneralIcon icon="acl" class="group-hover:text-accent" /> <div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="erd" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
<NcTooltip>
<template #title>
{{ $t('labels.uiAcl') }} {{ $t('labels.uiAcl') }}
</div> </template>
</a-button> <NcButton
<a-button size="small"
v-if="!source.is_meta && !source.is_local" type="text"
type="text" class="nc-action-btn cursor-pointer outline-0"
class="nc-action-btn cursor-pointer outline-0" data-testid="nc-data-sources-view-ui-acl"
@click="baseAction(source.id, DataSourcesSubTab.Metadata)" @click="baseAction(source.id, DataSourcesSubTab.UIAcl)"
> >
<div class="flex items-center gap-2 text-gray-600"> <div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="sync" class="group-hover:text-accent" /> <GeneralIcon icon="acl" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
<NcTooltip>
<template #title>
{{ $t('tooltip.metaSync') }} {{ $t('tooltip.metaSync') }}
</div> </template>
</a-button> <NcButton
v-if="!source.is_meta && !source.is_local"
size="small"
type="text"
data-testid="nc-data-sources-view-meta-sync"
class="nc-action-btn cursor-pointer outline-0"
@click="baseAction(source.id, DataSourcesSubTab.Metadata)"
>
<div class="flex items-center gap-2 text-gray-600">
<GeneralIcon icon="sync" class="group-hover:text-accent" />
</div>
</NcButton>
</NcTooltip>
</div> </div>
</div> </div>
<div class="ds-table-col ds-table-crud justify-end gap-x-1"> <div class="ds-table-col ds-table-crud justify-end gap-x-1">
<a-button <NcTooltip>
v-if="!source.is_meta && !source.is_local" <template #title>
class="nc-action-btn cursor-pointer outline-0 !w-8 !px-1 !rounded-lg mt-0.5" {{ $t('general.edit') }}
type="text" </template>
@click="baseAction(source.id, DataSourcesSubTab.Edit)" <NcButton
> v-if="!source.is_meta && !source.is_local"
<GeneralIcon icon="edit" class="text-gray-600 -mt-0.5" /> size="small"
</a-button> class="nc-action-btn cursor-pointer outline-0 !w-8 !px-1 !rounded-lg"
<a-button type="text"
v-if="!source.is_meta && !source.is_local" @click="baseAction(source.id, DataSourcesSubTab.Edit)"
class="nc-action-btn cursor-pointer outline-0 !w-8 !px-1 !rounded-lg mt-0.5" >
type="text" <GeneralIcon icon="edit" class="text-gray-600" />
@click="openDeleteBase(source)" </NcButton>
> </NcTooltip>
<GeneralIcon icon="delete" class="text-red-500 -mt-0.5" /> <NcTooltip>
</a-button> <template #title>
{{ $t('general.delete') }}
</template>
<NcButton
v-if="!source.is_meta && !source.is_local"
size="small"
class="nc-action-btn cursor-pointer outline-0 !w-8 !px-1 !rounded-lg"
type="text"
@click="openDeleteBase(source)"
>
<GeneralIcon icon="delete" class="text-red-500" />
</NcButton>
</NcTooltip>
</div> </div>
</div> </div>
</template> </template>
@ -550,7 +604,7 @@ const isEditBaseModalOpen = computed({
<style> <style>
.ds-table-head { .ds-table-head {
@apply flex items-center border-0 text-gray-400; @apply flex items-center border-0 text-gray-500;
} }
.ds-table-body { .ds-table-body {
@ -570,15 +624,15 @@ const isEditBaseModalOpen = computed({
} }
.ds-table-name { .ds-table-name {
@apply col-span-6 items-center capitalize; @apply col-span-9 items-center capitalize;
} }
.ds-table-type { .ds-table-type {
@apply col-span-3 items-center; @apply col-span-2 items-center;
} }
.ds-table-actions { .ds-table-actions {
@apply col-span-7; @apply col-span-5 flex w-full justify-end;
} }
.ds-table-crud { .ds-table-crud {

4
packages/nc-gui/components/general/BaseLogo.vue
Unescape View File

@ -6,10 +6,10 @@ import SimpleIconsMicrosoftsqlserver from '~icons/simple-icons/microsoftsqlserve
import LogosSnowflakeIcon from '~icons/logos/snowflake-icon' import LogosSnowflakeIcon from '~icons/logos/snowflake-icon'
import MdiDatabaseOutline from '~icons/mdi/database-outline' import MdiDatabaseOutline from '~icons/mdi/database-outline'
const { baseType } = defineProps<{ baseType?: string }>() const { sourceType } = defineProps<{ sourceType?: string }>()
const baseIcon = computed(() => { const baseIcon = computed(() => {
switch (baseType) { switch (sourceType) {
case ClientType.MYSQL: case ClientType.MYSQL:
return LogosMysqlIcon return LogosMysqlIcon
case ClientType.PG: case ClientType.PG:

5
packages/nc-gui/components/nc/Tooltip.vue
Unescape View File

@ -12,6 +12,7 @@ interface Props {
disabled?: boolean disabled?: boolean
placement?: TooltipPlacement | undefined placement?: TooltipPlacement | undefined
hideOnClick?: boolean hideOnClick?: boolean
overlayClassName?: string
} }
const props = defineProps<Props>() const props = defineProps<Props>()
@ -36,6 +37,8 @@ const attrs = useAttrs()
const isKeyPressed = ref(false) const isKeyPressed = ref(false)
const overlayClassName = computed(() => props.overlayClassName)
onKeyStroke( onKeyStroke(
(e) => e.key === modifierKey.value, (e) => e.key === modifierKey.value,
(e) => { (e) => {
@ -100,7 +103,7 @@ const onClick = () => {
<template> <template>
<a-tooltip <a-tooltip
v-model:visible="showTooltip" v-model:visible="showTooltip"
:overlay-class-name="`nc-tooltip ${showTooltip ? 'visible' : 'hidden'}`" :overlay-class-name="`nc-tooltip ${showTooltip ? 'visible' : 'hidden'} ${overlayClassName}`"
:overlay-style="tooltipStyle" :overlay-style="tooltipStyle"
arrow-point-at-center arrow-point-at-center
:trigger="[]" :trigger="[]"

4
packages/nc-gui/components/project/AllTables.vue
Unescape View File

@ -147,8 +147,8 @@ const onCreateBaseClick = () => {
</div> </div>
<div class="w-1/5 text-gray-600" data-testid="proj-view-list__item-type"> <div class="w-1/5 text-gray-600" data-testid="proj-view-list__item-type">
<div v-if="table.source_id === defaultBase?.id" class="ml-0.75">-</div> <div v-if="table.source_id === defaultBase?.id" class="ml-0.75">-</div>
<div v-else> <div v-else class="capitalize flex flex-row items-center gap-x-0.5">
<GeneralBaseLogo :source-type="sources.get(table.source_id!)?.type" class="w-4 mr-1" /> <GeneralBaseLogo class="w-4 mr-1" />
{{ sources.get(table.source_id!)?.alias }} {{ sources.get(table.source_id!)?.alias }}
</div> </div>
</div> </div>

14
packages/nc-gui/components/project/View.vue
Unescape View File

@ -3,7 +3,7 @@ import { useTitle } from '@vueuse/core'
import NcLayout from '~icons/nc-icons/layout' import NcLayout from '~icons/nc-icons/layout'
const { openedProject } = storeToRefs(useBases()) const { openedProject } = storeToRefs(useBases())
const { activeTables } = storeToRefs(useTablesStore()) const { activeTables } = storeToRefs(useTablesStore())
const { activeWorkspace } = storeToRefs(useWorkspace()) const { activeWorkspace, workspaceUserCount } = storeToRefs(useWorkspace())
const { navigateToProjectPage } = useBase() const { navigateToProjectPage } = useBase()
@ -113,6 +113,16 @@ watch(
<div class="tab-title" data-testid="proj-view-tab__access-settings"> <div class="tab-title" data-testid="proj-view-tab__access-settings">
<GeneralIcon icon="users" class="!h-3.5 !w-3.5" /> <GeneralIcon icon="users" class="!h-3.5 !w-3.5" />
<div>{{ $t('labels.members') }}</div> <div>{{ $t('labels.members') }}</div>
<div
v-if="workspaceUserCount"
class="tab-info"
:class="{
'bg-primary-selected': projectPageTab === 'data-source',
'bg-gray-50': projectPageTab !== 'data-source',
}"
>
{{ workspaceUserCount }}
</div>
</div> </div>
</template> </template>
<ProjectAccessSettings /> <ProjectAccessSettings />
@ -130,7 +140,7 @@ watch(
'bg-gray-50': projectPageTab !== 'data-source', 'bg-gray-50': projectPageTab !== 'data-source',
}" }"
> >
{{ base.sources.length - 1 }} {{ base.sources.length }}
</div> </div>
</div> </div>
</template> </template>

6
tests/playwright/pages/Dashboard/ProjectView/DataSourcePage.ts
Unescape View File

@ -39,7 +39,7 @@ export class DataSourcePage extends BasePage {
const row = this.get() const row = this.get()
.locator('.ds-table-row') .locator('.ds-table-row')
.nth(rowIndex + 1); .nth(rowIndex + 1);
await row.locator('button.nc-action-btn:has-text("Sync Metadata")').click(); await row.getByTestId('nc-data-sources-view-meta-sync').click();
} }
async openERD({ rowIndex }: { rowIndex: number }) { async openERD({ rowIndex }: { rowIndex: number }) {
@ -47,7 +47,7 @@ export class DataSourcePage extends BasePage {
const row = this.get() const row = this.get()
.locator('.ds-table-row') .locator('.ds-table-row')
.nth(rowIndex + 1); .nth(rowIndex + 1);
await row.locator('button.nc-action-btn:has-text("Relations")').click(); await row.getByTestId('nc-data-sources-view-erd').click();
} }
async openAudit({ rowIndex }: { rowIndex: number }) { async openAudit({ rowIndex }: { rowIndex: number }) {
@ -55,6 +55,6 @@ export class DataSourcePage extends BasePage {
const row = this.get() const row = this.get()
.locator('.ds-table-row') .locator('.ds-table-row')
.nth(rowIndex + 1); .nth(rowIndex + 1);
await row.locator('button.nc-action-btn:has-text("Audit")').click(); await row.getByTestId('nc-data-sources-view-audit').click();
} }
} }

Write Preview
Loading…
Cancel
Save