diff --git a/packages/nc-gui/components/smartsheet/Kanban.vue b/packages/nc-gui/components/smartsheet/Kanban.vue index 4db9eb6661..ba345d861b 100644 --- a/packages/nc-gui/components/smartsheet/Kanban.vue +++ b/packages/nc-gui/components/smartsheet/Kanban.vue @@ -69,6 +69,7 @@ const { moveHistory, addNewStackId, removeRowFromUncategorizedStack, + uncategorizedStackId, } = useKanbanViewStoreOrThrow() const { isViewDataLoading } = storeToRefs(useViewsStore()) @@ -108,6 +109,10 @@ const coverImageObjectFitClass = computed(() => { if (fk_cover_image_object_fit === CoverImageObjectFit.COVER) return '!object-cover' }) +const isRequiredGroupingFieldColumn = computed(() => { + return !!groupingFieldColumn.value?.rqd +}) + const kanbanContainerRef = ref() const selectedStackTitle = ref('') @@ -496,7 +501,9 @@ const handleSubmitRenameOrNewStack = async (loadMeta: boolean, stack?: any, stac class="nc-kanban-stack" :class="{ 'w-[44px]': stack.collapsed, - 'hidden': hideEmptyStack && !formattedData.get(stack.title)?.length, + 'hidden': + (hideEmptyStack && !formattedData.get(stack.title)?.length) || + (isRequiredGroupingFieldColumn && stack.id === uncategorizedStackId), }" :data-testid="`nc-kanban-stack-${stack.title}`" > diff --git a/packages/nc-gui/composables/useKanbanViewStore.ts b/packages/nc-gui/composables/useKanbanViewStore.ts index 3195996dca..2d70feb3d5 100644 --- a/packages/nc-gui/composables/useKanbanViewStore.ts +++ b/packages/nc-gui/composables/useKanbanViewStore.ts @@ -15,6 +15,8 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState( const addNewStackId = 'addNewStack' + const uncategorizedStackId = 'uncategorized' + const { t } = useI18n() const { api } = useApi() @@ -255,7 +257,9 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState( // handle deleted options const columnOptionIds = (groupingFieldColumn.value?.colOptions as SelectOptionsType)?.options.map(({ id }) => id) - const cols = stackMetaObj.value[fk_grp_col_id].filter(({ id }) => id !== 'uncategorized' && !columnOptionIds.includes(id)) + const cols = stackMetaObj.value[fk_grp_col_id].filter( + ({ id }) => id !== uncategorizedStackId && !columnOptionIds.includes(id), + ) for (const col of cols) { const idx = stackMetaObj.value[fk_grp_col_id].map((ele: Record) => ele.id).indexOf(col.id) if (idx !== -1) { @@ -292,7 +296,7 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState( groupingFieldColOptions.value = [ ...((groupingFieldColumn.value?.colOptions as SelectOptionsType & { collapsed: boolean })?.options ?? []), // enrich uncategorized stack - { id: 'uncategorized', title: null, order: 0, color: themeV3Colors.gray[500] } as any, + { id: uncategorizedStackId, title: null, order: 0, color: themeV3Colors.gray[500] } as any, ] // sort by initial order .sort((a, b) => a.order! - b.order!) @@ -719,6 +723,7 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState( deleteRow, moveHistory, addNewStackId, + uncategorizedStackId, } }, 'kanban-view-store',