fix(web): correct tag rounding in search options (#26814)

web/src/lib/modals/AssetTagModal.svelte

@@ -2,12 +2,13 @@
   import { eventManager } from '$lib/managers/event-manager.svelte';
   import { tagAssets } from '$lib/utils/asset-utils';
   import { getAllTags, upsertTags, type TagResponseDto } from '@immich/sdk';
-  import { FormModal, Icon } from '@immich/ui';
-  import { mdiClose, mdiTag } from '@mdi/js';
+  import { FormModal } from '@immich/ui';
+  import { mdiTag } from '@mdi/js';
   import { onMount } from 'svelte';
   import { t } from 'svelte-i18n';
   import { SvelteSet } from 'svelte/reactivity';
   import Combobox, { type ComboBoxOption } from '../components/shared-components/combobox.svelte';
+  import TagPill from '../components/shared-components/tag-pill.svelte';
 
   interface Props {
     onClose: (updated?: boolean) => void;
@@ -81,24 +82,7 @@
     {#each selectedIds as tagId (tagId)}
       {@const tag = tagMap[tagId]}
       {#if tag}
-        <div class="flex group transition-all">
-          <span
-            class="inline-block h-min whitespace-nowrap ps-3 pe-1 group-hover:ps-3 py-1 text-center align-baseline leading-none text-gray-100 dark:text-immich-dark-gray bg-primary rounded-s-full hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
-          >
-            <p class="text-sm">
-              {tag.value}
-            </p>
-          </span>
-
-          <button
-            type="button"
-            class="text-gray-100 dark:text-immich-dark-gray bg-immich-primary/95 dark:bg-immich-dark-primary/95 rounded-e-full place-items-center place-content-center pe-2 ps-1 py-1 hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
-            title={$t('remove_tag')}
-            onclick={() => handleRemove(tagId)}
-          >
-            <Icon icon={mdiClose} />
-          </button>
-        </div>
+        <TagPill label={tag.value} onRemove={() => handleRemove(tagId)} />
       {/if}
     {/each}
   </section>