optimize(components): use disabled property for none tippy button

src/components/custom/button-icon.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { createReusableTemplate } from '@vueuse/core';
 import type { PopoverPlacement } from 'naive-ui';
 import { twMerge } from 'tailwind-merge';
 
@@ -28,37 +27,22 @@ const props = withDefaults(defineProps<Props>(), {
   zIndex: 98
 });
 
-const [DefineButton, Button] = createReusableTemplate();
-
 const DEFAULT_CLASS = 'h-[36px] text-icon';
 </script>
 
 <template>
-  <!-- define component start: Button -->
-  <DefineButton v-slot="{ $slots }">
+  <NTooltip :placement="tooltipPlacement" :z-index="zIndex" :disabled="!tooltipContent">
+    <template #trigger>
       <NButton quaternary :class="twMerge(DEFAULT_CLASS, props.class)" v-bind="$attrs">
         <div class="flex-center gap-8px">
-        <component :is="$slots.default" />
-      </div>
-    </NButton>
-  </DefineButton>
-  <!-- define component end: Button -->
-
-  <NTooltip v-if="tooltipContent" :placement="tooltipPlacement" :z-index="zIndex">
-    <template #trigger>
-      <Button>
           <slot>
             <SvgIcon :icon="icon" />
           </slot>
-      </Button>
+        </div>
+      </NButton>
     </template>
     {{ tooltipContent }}
   </NTooltip>
-  <Button v-else>
-    <slot>
-      <SvgIcon :icon="icon" />
-    </slot>
-  </Button>
 </template>
 
 <style scoped></style>