fix: add missing search bar to Recipe Data management page (#7504)

Co-authored-by: Zdenek <tvuj-email@example.com>
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-authored-by: Michael Genson <71845777+michael-genson@users.noreply.github.com>

frontend/app/components/Domain/Recipe/RecipeDataTable.vue

@@ -9,6 +9,7 @@
     :items-per-page="15"
     class="elevation-0"
     :loading="loading"
+    :search="search"
     return-object
   >
     <template #[`item.name`]="{ item }">
@@ -86,6 +87,7 @@ interface Props {
   loading?: boolean;
   recipes?: Recipe[];
   showHeaders?: ShowHeaders;
+  search?: string;
 }
 const props = withDefaults(defineProps<Props>(), {
   loading: false,

frontend/app/pages/group/data/recipes.vue

@@ -180,12 +180,20 @@
           }}
         </p>
       </v-card-actions>
+      <div class="mx-2 clip-width">
+        <v-text-field
+          v-model="search"
+          variant="underlined"
+          :label="$t('search.search')"
+        />
+      </div>
       <v-card>
         <RecipeDataTable
           v-model="selected"
           :loading="loading"
           :recipes="allRecipes"
           :show-headers="headers"
+          :search="search"
         />
         <v-card-actions class="justify-end">
           <BaseButton
@@ -263,6 +271,7 @@ useSeoMeta({
 
 const { refreshRecipes } = useRecipes(true, true, false, `householdId=${auth.user.value?.householdId || ""}`);
 const selected = ref<Recipe[]>([]);
+const search = ref("");
 
 function resetAll() {
   selected.value = [];
@@ -513,6 +522,9 @@ const selectedOwnerHousehold = computed(() => {
 </script>
 
 <style>
+.clip-width {
+  max-width: 400px;
+}
 .v-btn--disabled {
   opacity: 0.5 !important;
 }