diff --git a/LeftOvers/Services/Recipes/RecipesServices.tsx b/LeftOvers/Services/Recipes/RecipesServices.tsx
index 731ddcc..c6aec4a 100644
--- a/LeftOvers/Services/Recipes/RecipesServices.tsx
+++ b/LeftOvers/Services/Recipes/RecipesServices.tsx
@@ -34,7 +34,7 @@ export default class RecipesService implements IRecipesService {
         }
     }
 
-    async getRecipeWithIngredientsAndFilters(ids: string[], filters: string[]): Promise<Recipes[]> {
+    async getRecipeWithIngredientsAndFilters(ids: string[], filters: string): Promise<Recipes[]> {
         try {
             const response = await axios.get(`${this.IA_URL}/getrecipeswithfilters/${ids}/${filters}`);
             return response.data as Recipes[];
diff --git a/LeftOvers/screens/RecipeSuggestion.tsx b/LeftOvers/screens/RecipeSuggestion.tsx
index 3a24def..6468d9a 100644
--- a/LeftOvers/screens/RecipeSuggestion.tsx
+++ b/LeftOvers/screens/RecipeSuggestion.tsx
@@ -37,7 +37,6 @@ export default function RecipeSuggestion({ route, navigation })  {
 
   let selectedIngredients: string[]; 
 
-  const die = [{value: "Gluten free"}, {value: "Porkless"}, {value: "Gluten free"}, {value: "Porkless"}]
   const all = []
 
   
@@ -94,22 +93,34 @@ export default function RecipeSuggestion({ route, navigation })  {
 
   const loadRecipes = async () => {
     const ids: string[] = getIngredientsIds(ingredients);
+    console.log('load recipes - active diets tab :', activeDiets)
+    const filters: string = activeDiets.map(diet => diet).join(':')
     try {
-      const recipes: Recipes[] = await recipeService.getRecipeWithIngredients(ids);
-      if(recipes[0].id != -1 ){
-        setSelectedRecipes(recipes);
+      if (filters) {
+        const recipes: Recipes[] = await recipeService.getRecipeWithIngredientsAndFilters(ids, filters)
+        if(recipes[0].id != -1 ){
+          setSelectedRecipes(recipes);
+        } 
+      }
+      else {
+        const recipes: Recipes[] = await recipeService.getRecipeWithIngredients(ids);
+        if(recipes[0].id != -1 ){
+          setSelectedRecipes(recipes);
+        } 
       }
-    
     } catch (error) {
       console.error(error)
     }
   };
 
   useEffect(() => {
-    loadRecipes()
     fetchActiveDiets()
   }, []);
 
+  useEffect(() => {
+    loadRecipes();
+  }, [activeDiets]);
+
   const styles = StyleSheet.create({
     linearGradient: {
         width: "100%",
@@ -205,12 +216,16 @@ export default function RecipeSuggestion({ route, navigation })  {
   });
 
   const fetchActiveDiets = async () => {
-      const results = await AsyncStorage.getItem('activeDiets')
-      let existingActiveDiets = JSON.parse(results)
-      if(existingActiveDiets.length == 0){
-        existingActiveDiets = []
+    try {
+      const results = await AsyncStorage.getItem('activeDiets');
+      let existingActiveDiets = JSON.parse(results);
+      if (existingActiveDiets.length === 0) {
+        existingActiveDiets = [];
       }
       setActiveDiets(existingActiveDiets)
+    } catch (error) {
+      console.error('Error fetching active diets:', error);
+    }
   }
 
   const ingredientElements = limitedList.map((source, index) => (
@@ -286,9 +301,9 @@ export default function RecipeSuggestion({ route, navigation })  {
                         <View style={styles.background}>
                             <View style={styles.filterBar}>
                                 <Text style={styles.filters}>Additional Filters</Text>
-                                <Text style={styles.nbSelected}>{die.length} selected</Text>
+                                <Text style={styles.nbSelected}>{activeDiets.length} selected</Text>
                             </View>
-                            <ListWithoutSelect title="Diets" content={die}></ListWithoutSelect>
+                            <ListWithoutSelect title="Diets" content={activeDiets}></ListWithoutSelect>
                             <View style={{marginTop: "3%"}}/>
                             <ListWithoutSelect title="Allergies" content={all}></ListWithoutSelect>
                             <View style={{marginTop: "3%"}}/>