feat(front): artist page search bar

front/src/components/library/Artists.vue

@@ -134,30 +134,15 @@ const paginateOptions = computed(() => sortedUniq([12, 30, 50, paginateBy.value]
       >
         <div class="fields">
           <div class="field">
-            <label for="artist-search">
-              {{ t('components.library.Artists.label.search') }}
-            </label>
-            <div class="ui action input">
-              <Input
-                id="artist-search"
-                v-model="query"
-                type="text"
-                name="search"
-                autofocus
-                :placeholder="labels.searchPlaceholder"
-              >
-                <template #input-right>
-                  <Button
-                    type="submit"
-                    auto
-                    primary
-                    icon="bi-search"
-                    :aria-label="t('components.library.Artists.button.search')"
-                  >
-                  </Button>
-                </template>
-              </Input>
-            </div>
+            <Input search
+              id="artist-search"
+              v-model="query"
+              name="search"
+              :label="t('components.library.Artists.label.search')"
+              autofocus
+              :placeholder="labels.searchPlaceholder"
+            >
+            </Input>
           </div>
           <div class="field">
             <label for="tags-search">{{ t('components.library.Artists.label.tags') }}</label>

front/src/components/ui/Input.vue

@@ -94,6 +94,7 @@ const model = defineModel<string|number>()
     <!-- Search -->
     <Button
       solid primary
+      type="submit"
       v-if="restProps.search"
       class="input-right search"
     >