fix: test code & addressed nit code reviews

Author: viva-jinyi

src/components/topbar/TopbarBadge.test.ts

@@ -185,7 +185,9 @@ describe('TopbarBadge', () => {
         'full'
       )
 
-      expect(wrapper.find('.pi-exclamation-triangle').exists()).toBe(true)
+      expect(wrapper.find('.icon-\\[lucide--triangle-alert\\]').exists()).toBe(
+        true
+      )
     })
   })
 

src/workbench/extensions/manager/components/manager/ImportFailedNodeHeader.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex w-full items-center justify-between p-4">
     <div class="flex items-center gap-2">
-      <i class="icon-[lucide--triangle-alert] text-warning-background"></i>
+      <i class="icon-[lucide--triangle-alert] text-warning-background" />
       <p class="m-0 text-sm">
         {{ $t('importFailed.title') }}
       </p>

src/workbench/extensions/manager/components/manager/ManagerDialogContent.vue

@@ -39,8 +39,8 @@
             class="relative mt-3 mb-4 flex items-center gap-6 rounded-lg bg-yellow-500/20 p-4"
           >
             <i
-              class="icon-[lucide--triangle-alert] text-lg text-yellow-600"
-            ></i>
+              class="icon-[lucide--triangle-alert] text-lg text-warning-background"
+            />
             <div class="flex flex-1 flex-col gap-2">
               <p class="m-0 text-sm font-bold">
                 {{ $t('manager.conflicts.warningBanner.title') }}

src/workbench/extensions/manager/components/manager/NodeConflictHeader.vue

@@ -2,7 +2,7 @@
   <div class="flex h-12 w-full items-center justify-between pl-6">
     <div class="flex items-center gap-2">
       <!-- Warning Icon -->
-      <i class="icon-[lucide--triangle-alert] text-warning-background"></i>
+      <i class="icon-[lucide--triangle-alert] text-warning-background" />
       <!-- Title -->
       <p class="text-base font-bold">
         {{ $t('manager.conflicts.title') }}

src/workbench/extensions/manager/components/manager/PackVersionSelectorPopover.test.ts

@@ -411,7 +411,7 @@ describe('PackVersionSelectorPopover', () => {
       expect(mockCheckNodeCompatibility).toHaveBeenCalled()
 
       // The warning icon should be shown for incompatible versions
-      const warningIcons = wrapper.findAll('.pi-exclamation-triangle')
+      const warningIcons = wrapper.findAll('.icon-\\[lucide--triangle-alert\\]')
       expect(warningIcons.length).toBeGreaterThan(0)
     })
 
@@ -536,7 +536,7 @@ describe('PackVersionSelectorPopover', () => {
       expect(mockCheckNodeCompatibility).toHaveBeenCalled()
 
       // The warning icon should be shown for version incompatible packages
-      const warningIcons = wrapper.findAll('.pi-exclamation-triangle')
+      const warningIcons = wrapper.findAll('.icon-\\[lucide--triangle-alert\\]')
       expect(warningIcons.length).toBeGreaterThan(0)
     })
 
@@ -662,7 +662,7 @@ describe('PackVersionSelectorPopover', () => {
       await wrapper.vm.$nextTick()
 
       // The warning icon should be shown for banned packages in the dropdown options
-      const warningIcons = wrapper.findAll('.pi-exclamation-triangle')
+      const warningIcons = wrapper.findAll('.icon-\\[lucide--triangle-alert\\]')
       expect(warningIcons.length).toBeGreaterThan(0)
     })
 
@@ -705,7 +705,7 @@ describe('PackVersionSelectorPopover', () => {
       expect(mockCheckNodeCompatibility).toHaveBeenCalled()
 
       // The warning icon should be shown for security pending packages
-      const warningIcons = wrapper.findAll('.pi-exclamation-triangle')
+      const warningIcons = wrapper.findAll('.icon-\\[lucide--triangle-alert\\]')
       expect(warningIcons.length).toBeGreaterThan(0)
     })
   })

src/workbench/extensions/manager/components/manager/button/PackEnableToggle.test.ts

@@ -192,7 +192,7 @@ describe('PackEnableToggle', () => {
       const wrapper = mountComponent()
 
       // Check if warning icon exists
-      const warningIcon = wrapper.find('.pi-exclamation-triangle')
+      const warningIcon = wrapper.find('.icon-\\[lucide--triangle-alert\\]')
       expect(warningIcon.exists()).toBe(true)
       expect(warningIcon.classes()).toContain('text-warning-background')
     })
@@ -204,7 +204,7 @@ describe('PackEnableToggle', () => {
       const wrapper = mountComponent()
 
       // Check if warning icon does not exist
-      const warningIcon = wrapper.find('.pi-exclamation-triangle')
+      const warningIcon = wrapper.find('.icon-\\[lucide--triangle-alert\\]')
       expect(warningIcon.exists()).toBe(false)
     })
   })

src/workbench/extensions/manager/components/manager/button/PackEnableToggle.vue

@@ -11,7 +11,7 @@
     >
       <i
         class="icon-[lucide--triangle-alert] text-xl text-warning-background"
-      ></i>
+      />
     </div>
     <ToggleSwitch
       v-if="!canToggleDirectly"