⚡ Optimize CrazyRecipes render loop performance

src/pages/CrazyRecipeDetail.tsx

@@ -8,7 +8,6 @@ import { Label } from '@/components/ui/label';
 import Navbar from '@/components/Navbar';
 import Footer from '@/components/Footer';
 import { useAuth } from '@/hooks/useAuth';
-import { useAdmin } from '@/hooks/useAdmin';
 import { useToast } from '@/hooks/use-toast';
 import { useRecipeService } from '@/hooks/useRecipeService';
 import type { CrazyRecipe, RecipeReview } from '@/services/recipeService';
@@ -24,7 +23,6 @@ import {
 const CrazyRecipeDetail = () => {
   const { id } = useParams<{ id: string }>();
   const { user } = useAuth();
-  const { isAdmin } = useAdmin();
   const { toast } = useToast();
   const navigate = useNavigate();
   const { getRecipeById, deleteRecipe, incrementViews: serviceIncrementViews, getRecipeReviews, submitReview } = useRecipeService();

src/pages/CrazyRecipes.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useMemo } from 'react';
 import { Link, useNavigate } from 'react-router-dom';
 import { Plus, Search, Filter, Clock, Eye, Heart, ChefHat, Leaf, Flame, Star, User, Edit, Trash2, LogIn } from 'lucide-react';
 import { Button } from '@/components/ui/button';
@@ -14,8 +14,8 @@
 import { 
   weirdFoodRecipes, 
   weirdFoodReviews, 
   getReviewsForWeirdFood, 
   getAverageRatingForWeirdFood,
   type WeirdFoodRecipe 
 } from '@/data/weirdFoods';
 
@@ -151,17 +151,37 @@
     setShowUploadForm(true);
   };
 
-  const getReviewsAndRating = (recipeId: string) => {
-    // Check if it's a frontend recipe
-    const isFrontendRecipe = weirdFoodRecipes.some(recipe => recipe.id === recipeId);
+  const frontendRecipeData = useMemo(() => {
+    const data = new Map<string, { reviews: typeof weirdFoodReviews, averageRating: number, isFrontendRecipe: boolean }>();
+    const frontendIds = new Set(weirdFoodRecipes.map(r => r.id));
 
-    if (isFrontendRecipe) {
-      const reviews = getReviewsForWeirdFood(recipeId);
-      const averageRating = getAverageRatingForWeirdFood(recipeId);
-      return { reviews, averageRating, isFrontendRecipe: true };
-    }
+    // Group reviews by recipe ID first
+    const reviewsMap = new Map<string, typeof weirdFoodReviews>();
+    weirdFoodReviews.forEach(review => {
+      if (!reviewsMap.has(review.recipe_id)) {
+        reviewsMap.set(review.recipe_id, []);
+      }
+      reviewsMap.get(review.recipe_id)!.push(review);
+    });
+
+    frontendIds.forEach(id => {
+      const reviews = reviewsMap.get(id) || [];
+      const averageRating = reviews.length > 0
+        ? reviews.reduce((sum, r) => sum + r.rating, 0) / reviews.length
+        : 0;
+
+      data.set(id, {
+        reviews,
+        averageRating,
+        isFrontendRecipe: true
+      });
+    });
 
-    return { reviews: [], averageRating: 0, isFrontendRecipe: false };
+    return data;
+  }, []);
+
+  const getReviewsAndRating = (recipeId: string) => {
+    return frontendRecipeData.get(recipeId) || { reviews: [], averageRating: 0, isFrontendRecipe: false };
   };
 
   const handleDeleteRecipe = async (recipeId: string, recipeTitle: string) => {