chore(web): migrate CircleIconButton to @immich/ui IconButton (#18486)

* remove import and referenced file

* first pass at replacing all CircleIconButtons

* fix linting issues

* fix combobox formatting issues

* fix button context menu coloring

* remove circle icon button from search history box

* use theme switcher from UI lib

* dark mode force the asset viewer icons

* fix forced dark mode icons

* dark mode memory viewer icons

* fix: back button in memory viewer

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>

web/src/lib/components/elements/search-bar.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
-  import { mdiClose, mdiMagnify } from '@mdi/js';
   import type { SearchOptions } from '$lib/utils/dipatch';
+  import { mdiClose, mdiMagnify } from '@mdi/js';
   import LoadingSpinner from '../shared-components/loading-spinner.svelte';
-  import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
   import { t } from 'svelte-i18n';
+  import { IconButton } from '@immich/ui';
 
   interface Props {
     name: string;
@@ -43,11 +43,13 @@
     ? 'rounded-2xl'
     : 'rounded-t-lg'} bg-gray-200 p-2 dark:bg-immich-dark-gray gap-2 place-items-center h-full"
 >
-  <CircleIconButton
+  <IconButton
+    shape="round"
+    color="secondary"
+    variant="ghost"
     icon={mdiMagnify}
-    title={$t('search')}
-    size="16"
-    padding="2"
+    aria-label={$t('search')}
+    size="small"
     onclick={() => onSearch({ force: true })}
   />
   <input
@@ -65,6 +67,14 @@
     </div>
   {/if}
   {#if name}
-    <CircleIconButton icon={mdiClose} title={$t('clear_value')} size="16" padding="2" onclick={resetSearch} />
+    <IconButton
+      shape="round"
+      color="secondary"
+      variant="ghost"
+      icon={mdiClose}
+      aria-label={$t('clear_value')}
+      size="small"
+      onclick={resetSearch}
+    />
   {/if}
 </div>