From 58f47b7a67dec82f34e943f8fcbac168940e3b83 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Karlo=20Miku=C5=A1?= <karlo.mikus1@gmail.com>
Date: Sun, 15 Dec 2024 14:20:34 +0100
Subject: [PATCH] Fetch host from local storage

---
 src/components/Cocktail/CocktailForm.vue         | 4 ++--
 src/components/Cocktail/CocktailImport.vue       | 2 +-
 src/components/Cocktail/CocktailIndex.vue        | 4 ++--
 src/components/Cocktail/IngredientModal.vue      | 3 +--
 src/components/Cocktail/SubstituteModal.vue      | 6 +-----
 src/components/Ingredient/IngredientForm.vue     | 4 ++--
 src/components/IngredientFinder.vue              | 9 ++++-----
 src/components/Search/FilterIngredientsModal.vue | 6 +-----
 8 files changed, 14 insertions(+), 24 deletions(-)

diff --git a/src/components/Cocktail/CocktailForm.vue b/src/components/Cocktail/CocktailForm.vue
index 3222bd67..f21076ee 100644
--- a/src/components/Cocktail/CocktailForm.vue
+++ b/src/components/Cocktail/CocktailForm.vue
@@ -72,7 +72,7 @@
                         <button class="button button--dark" type="button" @click="addIngredient">{{ $t('ingredient.add') }}</button>
                     </template>
                     <template #dialog>
-                        <IngredientModal :search-host="bar.search_host" :search-token="bar.search_token" :cocktail-ingredient="cocktailIngredientForEdit" @close="showDialog = false" />
+                        <IngredientModal :search-token="bar.search_token" :cocktail-ingredient="cocktailIngredientForEdit" @close="showDialog = false" />
                     </template>
                 </SaltRimDialog>
             </div>
@@ -82,7 +82,7 @@
                 <span></span>
             </template>
             <template #dialog>
-                <SubstituteModal :search-host="bar.search_host" :search-token="bar.search_token" :value="cocktailIngredientForSubstitutes" @close="showSubstituteDialog = false" />
+                <SubstituteModal :search-token="bar.search_token" :value="cocktailIngredientForSubstitutes" @close="showSubstituteDialog = false" />
             </template>
         </SaltRimDialog>
         <h3 class="form-section-title">{{ $t('media') }}</h3>
diff --git a/src/components/Cocktail/CocktailImport.vue b/src/components/Cocktail/CocktailImport.vue
index 9ead677c..2b4bee10 100644
--- a/src/components/Cocktail/CocktailImport.vue
+++ b/src/components/Cocktail/CocktailImport.vue
@@ -630,7 +630,7 @@ async function getBar(barId: number): Promise<void> {
                 <template #dialog>
                     <div class="dialog-title">{{ t('import.manually-match') }}</div>
                     <p style="margin-bottom: 1rem;">{{ t('import.manual-match-notice', {name: ingredientEdit.refIngredient.name}) }}</p>
-                    <IngredientFinder v-if="bar.search_host && bar.search_token" :search-host="bar.search_host" :search-token="bar.search_token" :initial-query="ingredientEdit.refIngredient.name" @ingredient-selected="handleIngredientEdit"></IngredientFinder>
+                    <IngredientFinder v-if="bar.search_token" :search-token="bar.search_token" :initial-query="ingredientEdit.refIngredient.name" @ingredient-selected="handleIngredientEdit"></IngredientFinder>
                     <div class="dialog-actions">
                         <button type="button" class="button button--outline" @click="showIngredientDialog = false">{{ t('close') }}</button>
                     </div>
diff --git a/src/components/Cocktail/CocktailIndex.vue b/src/components/Cocktail/CocktailIndex.vue
index 5c0f08ec..dd50aaac 100644
--- a/src/components/Cocktail/CocktailIndex.vue
+++ b/src/components/Cocktail/CocktailIndex.vue
@@ -22,7 +22,7 @@
                                 <a href="#" @click.prevent="showSpecificIngredientsModal = true">{{ $t('search.ingredients') }} ({{ activeFilters.specific_ingredients.length }})</a>
                             </template>
                             <template #dialog>
-                                <FilterIngredientsModal :search-host="appState.bar.search_host" :search-token="appState.bar.search_token" :title="$t('search.select-specific-ingredients')" :value="activeFilters.specific_ingredients" @close="updateSpecificIngredients"></FilterIngredientsModal>
+                                <FilterIngredientsModal :search-token="appState.bar.search_token" :title="$t('search.select-specific-ingredients')" :value="activeFilters.specific_ingredients" @close="updateSpecificIngredients"></FilterIngredientsModal>
                             </template>
                         </SaltRimDialog>
                         <br>
@@ -31,7 +31,7 @@
                                 <a href="#" @click.prevent="showIgnoreIngredientsModal = true">{{ $t('search.ignore-ingredients') }} ({{ activeFilters.ignore_ingredients.length }})</a>
                             </template>
                             <template #dialog>
-                                <FilterIngredientsModal :search-host="appState.bar.search_host" :search-token="appState.bar.search_token" :title="$t('search.select-ingredients-to-ignore')" :value="activeFilters.ignore_ingredients" @close="updateIgnoredIngredients"></FilterIngredientsModal>
+                                <FilterIngredientsModal :search-token="appState.bar.search_token" :title="$t('search.select-ingredients-to-ignore')" :value="activeFilters.ignore_ingredients" @close="updateIgnoredIngredients"></FilterIngredientsModal>
                             </template>
                         </SaltRimDialog>
                     </Refinement>
diff --git a/src/components/Cocktail/IngredientModal.vue b/src/components/Cocktail/IngredientModal.vue
index cfca14e6..7ca55483 100644
--- a/src/components/Cocktail/IngredientModal.vue
+++ b/src/components/Cocktail/IngredientModal.vue
@@ -20,7 +20,6 @@ interface FinderIngredient {
 const emit = defineEmits(['close', 'ingredient-changed'])
 const props = defineProps<{
     cocktailIngredient: CocktailIngredient,
-    searchHost: string,
     searchToken: string,
 }>()
 
@@ -61,7 +60,7 @@ function selectIngredient(item: FinderIngredient): void {
         <p style="margin: 0 0 1rem 0;">
             {{ t('ingredient.units-help') }}
         </p>
-        <IngredientFinder :search-host="searchHost" :search-token="searchToken" :selected-ingredients="[localCocktailingredient.ingredient.id]" @ingredient-selected="selectIngredient"></IngredientFinder>
+        <IngredientFinder :search-token="searchToken" :selected-ingredients="[localCocktailingredient.ingredient.id]" @ingredient-selected="selectIngredient"></IngredientFinder>
         <div class="selected-ingredient">
             <small>{{ t('ingredient.dialog.current') }}:</small>
             <p>{{ localCocktailingredient.ingredient.name }}</p>
diff --git a/src/components/Cocktail/SubstituteModal.vue b/src/components/Cocktail/SubstituteModal.vue
index 24f4be7d..01438d3b 100644
--- a/src/components/Cocktail/SubstituteModal.vue
+++ b/src/components/Cocktail/SubstituteModal.vue
@@ -3,7 +3,7 @@
         <OverlayLoader v-if="isLoading" />
         <div class="dialog-title">{{ $t('ingredient.dialog.select-substitutes') }}</div>
         <p style="margin-bottom: 1rem;">{{ $t('ingredient.dialog.select-substitutes-for', {name: cocktailIngredient.ingredient.name}) }}</p>
-        <IngredientFinder :search-host="searchHost" :search-token="searchToken" :selected-ingredients="selectedSubstitutes.map(s => s.ingredient.id)" @ingredient-selected="selectIngredient"></IngredientFinder>
+        <IngredientFinder :search-token="searchToken" :selected-ingredients="selectedSubstitutes.map(s => s.ingredient.id)" @ingredient-selected="selectIngredient"></IngredientFinder>
         <div class="substitutes">
             <h4>{{ $t('substitutes') }}:</h4>
             <div v-for="(substitute, index) in selectedSubstitutes" :key="substitute.ingredient.id" class="substitutes__substitute">
@@ -61,10 +61,6 @@ export default {
         AmountInput,
     },
     props: {
-        searchHost: {
-            type: String,
-            required: true,
-        },
         searchToken: {
             type: String,
             required: true,
diff --git a/src/components/Ingredient/IngredientForm.vue b/src/components/Ingredient/IngredientForm.vue
index 213e2699..9681c568 100644
--- a/src/components/Ingredient/IngredientForm.vue
+++ b/src/components/Ingredient/IngredientForm.vue
@@ -53,7 +53,7 @@
                 <SaltRimCheckbox id="parent-ingredient-checkbox" v-model="isParent" :label="$t('ingredient.is-variety')" :description="'[EXPERIMENTAL] ' + $t('ingredient.variety-note')"></SaltRimCheckbox>
             </div>
             <div v-show="isParent" class="form-group" v-if="bar.search_host">
-                <IngredientFinder v-show="ingredient.parent_ingredient == null" :search-host="bar.search_host" :search-token="bar.search_token" v-model="ingredient.parent_ingredient" :disabled-ingredients="disabledFinderIngredients"></IngredientFinder>
+                <IngredientFinder v-show="ingredient.parent_ingredient == null" :search-token="bar.search_token" v-model="ingredient.parent_ingredient" :disabled-ingredients="disabledFinderIngredients"></IngredientFinder>
                 <div v-if="ingredient.parent_ingredient" style="display: flex; gap: 0.5rem; flex-wrap: wrap;">
                     {{ ingredient.parent_ingredient.name }} &middot; <a href="#" @click.prevent="ingredient.parent_ingredient = null">{{ $t('remove') }}</a>
                 </div>
@@ -63,7 +63,7 @@
             </div>
             <div v-show="isComplex" class="ingredient-form__complex-ingredients" v-if="bar.search_host">
                 <div>
-                    <IngredientFinder :selected-ingredients="ingredient.ingredient_parts.map(i => i.id)" :search-host="bar.search_host" :search-token="bar.search_token" @ingredient-selected="selectIngredientPart" :disabled-ingredients="disabledFinderIngredients"></IngredientFinder>
+                    <IngredientFinder :selected-ingredients="ingredient.ingredient_parts.map(i => i.id)" :search-token="bar.search_token" @ingredient-selected="selectIngredientPart" :disabled-ingredients="disabledFinderIngredients"></IngredientFinder>
                 </div>
                 <div>
                     <ul v-if="ingredient.ingredient_parts.length > 0" class="block-container block-container--inset ingredient-form__complex-ingredients__list">
diff --git a/src/components/IngredientFinder.vue b/src/components/IngredientFinder.vue
index 4ec5a320..8671c871 100644
--- a/src/components/IngredientFinder.vue
+++ b/src/components/IngredientFinder.vue
@@ -34,6 +34,7 @@ import { instantMeiliSearch } from '@meilisearch/instant-meilisearch'
 import OverlayLoader from './OverlayLoader.vue'
 import IngredientImage from './Ingredient/IngredientImage.vue'
 import BarAssistantClient from '@/api/BarAssistantClient'
+import AppState from '@/AppState';
 
 export default {
     components: {
@@ -41,10 +42,6 @@ export default {
         IngredientImage
     },
     props: {
-        searchHost: {
-            type: String,
-            required: true,
-        },
         searchToken: {
             type: String,
             required: true,
@@ -78,6 +75,8 @@ export default {
     },
     emits: ['update:modelValue', 'ingredientSelected'],
     data() {
+        const appState = new AppState();
+
         return {
             isLoading: false,
             currentQuery: this.initialQuery,
@@ -88,7 +87,7 @@ export default {
                 },
             },
             searchClient: instantMeiliSearch(
-                this.searchHost,
+                appState.bar.search_host,
                 this.searchToken,
             ).searchClient,
         }
diff --git a/src/components/Search/FilterIngredientsModal.vue b/src/components/Search/FilterIngredientsModal.vue
index 500dc2fe..5e936851 100644
--- a/src/components/Search/FilterIngredientsModal.vue
+++ b/src/components/Search/FilterIngredientsModal.vue
@@ -2,7 +2,7 @@
     <form @submit.prevent="filter">
         <OverlayLoader v-if="isLoading" />
         <div class="dialog-title">{{ title }}</div>
-        <IngredientFinder :search-host="searchHost" :search-token="searchToken" :selected-ingredients="selectedIngredients.map(s => s.id)" @ingredient-selected="selectIngredient"></IngredientFinder>
+        <IngredientFinder :search-token="searchToken" :selected-ingredients="selectedIngredients.map(s => s.id)" @ingredient-selected="selectIngredient"></IngredientFinder>
         <div class="search-ingredients-modal-ingredients">
             <div v-for="ing in selectedIngredients" :key="ing.id" class="search-ingredients-modal-ingredients__ingredient">
                 {{ ing.name }} <button type="button" @click.prevent="removeIngredient(ing)"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12" height="12" fill="currentcolor"><path fill="none" d="M0 0h24v24H0z" /><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z" /></svg></button>
@@ -26,10 +26,6 @@ export default {
         IngredientFinder,
     },
     props: {
-        searchHost: {
-            type: String,
-            required: true,
-        },
         searchToken: {
             type: String,
             required: true,