clone/nocodb
1
0
Fork 0
mirror of https://github.com/nocodb/nocodb.git synced 2026-05-02 00:36:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(nc-gui): show empty state if integration search list is empty (#9178)

Browse Source
This commit is contained in:
Ramesh Mane
2024-08-08 14:28:34 +05:30
committed by GitHub
parent 5fe1be1d8a
commit 353241123b
1 changed files with 20 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
packages/nc-gui/components/workspace/integrations/IntegrationsTab.vue
View File

@@ -90,6 +90,18 @@ const integrationsMapByCategory = computed(() => {
)
})
const isEmptyList = computed(() => {
const categories = Object.keys(integrationsMapByCategory.value);
if (!categories.length) {
return true;
}
console.log('cate', categories, integrationsMapByCategory.value)
return !categories.some(category => integrationsMapByCategory.value[category].list.length > 0);
});
const isAddNewIntegrationModalOpen = computed({
get: () => {
return pageMode.value === IntegrationsPageMode.LIST
@@ -197,7 +209,9 @@ const handleAddIntegration = (category: IntegrationCategoryType, integration: In
ref="integrationListRef"
class="flex-1 px-6 pb-6 flex flex-col nc-workspace-settings-integrations-list overflow-y-auto nc-scrollbar-thin"
>
<div class="w-full flex justify-center">
<div class="w-full flex justify-center" :class="{
'flex-1': isEmptyList
}">
<div
class="flex flex-col space-y-6 w-full"
:style="{
@@ -205,11 +219,7 @@ const handleAddIntegration = (category: IntegrationCategoryType, integration: In
}"
>
<template v-for="(category, key) in integrationsMapByCategory">
<div
v-if="category.list.length || key === IntegrationCategoryType.OTHERS"
:key="key"
class="integration-type-wrapper"
>
<div v-if="category.list.length" :key="key" class="integration-type-wrapper">
<div class="category-type-title flex gap-2">
{{ $t(category.title) }}
<NcBadge
@@ -259,6 +269,10 @@ const handleAddIntegration = (category: IntegrationCategoryType, integration: In
</div>
</div>
</template>
<div v-if="isEmptyList" class="h-full text-center flex items-center justify-center gap-3">
<a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" class="!my-0" />
</div>
</div>
</div>
</div>