refactor to UI components

src/components/Search/SearchBar.vue

@@ -66,7 +66,7 @@ const resultsRefs = ref<InstanceType<typeof SearchResult>[]>([])
       @keydown="handleKeydown"
     />
     <div class="z-1000 absolute left-0 right-0 top-[100%]" v-if="active">
-      <ul tabindex="0" class="menu mt-1 w-full rounded-md bg-base-100 p-2 text-black shadow">
+      <UIMenu :compact="true" class="mt-1 w-full rounded-md bg-base-100 p-2 text-black shadow">
         <div class="max-h-[320px] w-full overflow-y-auto">
           <template v-if="results.length > 0">
             <SearchResult
@@ -78,9 +78,9 @@ const resultsRefs = ref<InstanceType<typeof SearchResult>[]>([])
               ref="resultsRefs"
             />
           </template>
-          <li v-else><a>No notes found</a></li>
+          <UIMenuItem :compact="true" v-else>No notes found</UIMenuItem>
         </div>
-      </ul>
+      </UIMenu>
     </div>
   </div>
 </template>