From 8d7c8cb3ed8220ecb26df0492fa2a80e48d3aeeb Mon Sep 17 00:00:00 2001
From: Lykin <137850705+tiny-craft@users.noreply.github.com>
Date: Fri, 5 Jan 2024 22:02:23 +0800
Subject: [PATCH] perf: support display layer with blank label

---
 frontend/src/components/sidebar/BrowserTree.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/sidebar/BrowserTree.vue b/frontend/src/components/sidebar/BrowserTree.vue
index d07e383..016d751 100644
--- a/frontend/src/components/sidebar/BrowserTree.vue
+++ b/frontend/src/components/sidebar/BrowserTree.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { computed, h, nextTick, reactive, ref, watchEffect } from 'vue'
 import { ConnectionType } from '@/consts/connection_type.js'
-import { NIcon, NSpace, useThemeVars } from 'naive-ui'
+import { NIcon, NSpace, NText, useThemeVars } from 'naive-ui'
 import Key from '@/components/icons/Key.vue'
 import Binary from '@/components/icons/Binary.vue'
 import Database from '@/components/icons/Database.vue'
@@ -397,6 +397,13 @@ const renderPrefix = ({ option }) => {
 const renderLabel = ({ option }) => {
     switch (option.type) {
         case ConnectionType.RedisKey:
+            if (option.label === '') {
+                // blank label name
+                return h('div', [
+                    h(NText, { italic: true, depth: 3 }, () => '[Empty]'),
+                    h('span', () => ` (${option.keyCount || 0})`),
+                ])
+            }
             return `${option.label} (${option.keyCount || 0})`
         // case ConnectionType.RedisValue:
         //   return `[${option.keyType}]${option.label}`