chore: Search improvements (#10801)

- Adds pagination support for search.
- Use composition API on all search related component.
- Minor UI improvements.
- Adds missing specs

Loom video
https://www.loom.com/share/5b01afa5c9204e7d97ff81b215621dde?sid=82ca6d22-ca8c-4d5e-8740-ba06ca4051ba

app/javascript/dashboard/modules/search/components/SearchResultSection.vue

@@ -32,14 +32,14 @@ const titleCase = computed(() => props.title.toLowerCase());
     <div v-if="showTitle" class="sticky top-0 p-2 z-50 mb-0.5 bg-n-background">
       <h3 class="text-sm text-n-slate-12">{{ title }}</h3>
     </div>
+    <slot />
     <woot-loading-state
       v-if="isFetching"
-      :message="$t('SEARCH.SEARCHING_DATA')"
+      :message="empty ? $t('SEARCH.SEARCHING_DATA') : $t('SEARCH.LOADING_DATA')"
     />
-    <slot v-else />
     <div
       v-if="empty && !isFetching"
-      class="flex items-center justify-center px-4 py-6 m-2 rounded-md bg-n-slate-2 dark:bg-n-solid-3"
+      class="flex items-center justify-center px-4 py-6 m-2 rounded-xl bg-n-slate-2 dark:bg-n-solid-1"
     >
       <fluent-icon icon="info" size="16px" class="text-n-slate-11" />
       <p class="mx-2 my-0 text-center text-n-slate-11">