fix ui

src/components/SortDropdown.vue

@@ -4,6 +4,7 @@ import { computed, onBeforeUnmount, ref } from "vue";
 type Option = {
   label: string;
   value: string;
+  iconSrc?: string | null;
 };
 
 const props = defineProps<{
@@ -63,7 +64,15 @@ onBeforeUnmount(() => {
       type="button"
       @click="toggle"
     >
-      <span>{{ selectedLabel }}</span>
+      <span class="sort-dropdown-trigger-label">
+        <img
+          v-if="options.find((option) => option.value === modelValue)?.iconSrc"
+          class="sort-dropdown-option-icon"
+          :src="options.find((option) => option.value === modelValue)?.iconSrc ?? undefined"
+          :alt="selectedLabel"
+        />
+        <span>{{ selectedLabel }}</span>
+      </span>
       <span class="sort-dropdown-caret" aria-hidden="true"></span>
     </button>
     <div v-if="open" class="sort-dropdown-menu">
@@ -75,7 +84,15 @@ onBeforeUnmount(() => {
         type="button"
         @click="select(option.value)"
       >
-        {{ option.label }}
+        <span class="sort-dropdown-option-content">
+          <img
+            v-if="option.iconSrc"
+            class="sort-dropdown-option-icon"
+            :src="option.iconSrc"
+            :alt="option.label"
+          />
+          <span>{{ option.label }}</span>
+        </span>
       </button>
     </div>
   </div>