api call optimized

apps/mobile/src/app/(tabs)/recommendations.tsx

@@ -14,46 +14,35 @@ import { Ionicons } from "@expo/vector-icons";
 import { useUser } from "@clerk/clerk-expo";
 import { useFocusEffect } from "expo-router";
 import { theme } from "../../styles/theme";
-import {
-  getRecommendations,
-  generateRecommendation,
-  type Recommendation,
-} from "../../api/recommendations";
+import { useRecommendations } from "../../contexts/RecommendationsContext";
+import type { Recommendation } from "../../api/recommendations";
 import log from "../../utils/logger";
 
 export default function RecommendationsScreen() {
   const { user } = useUser();
-  const [recommendations, setRecommendations] = useState<Recommendation[]>([]);
-  const [loading, setLoading] = useState(true);
+  const {
+    recommendations: allRecommendations,
+    loading,
+    refetchRecommendations,
+    generateNewRecommendation,
+  } = useRecommendations();
   const [generating, setGenerating] = useState(false);
   const [refreshing, setRefreshing] = useState(false);
 
-  const loadRecommendations = useCallback(async () => {
-    if (!user?.id) return;
-
-    try {
-      setLoading(true);
-      const data = await getRecommendations(user.id);
-      // Filter to show only approved recommendations for regular users
-      const approved = data.filter((rec) => rec.status === "approved");
-      setRecommendations(approved);
-    } catch (error) {
-      log.error("Failed to load recommendations", error);
-      Alert.alert("Error", "Failed to load recommendations");
-    } finally {
-      setLoading(false);
-    }
-  }, [user?.id]);
+  // Filter to show only approved recommendations for regular users
+  const recommendations = allRecommendations.filter(
+    (rec) => rec.status === "approved",
+  );
 
   useFocusEffect(
     useCallback(() => {
-      loadRecommendations();
-    }, [loadRecommendations]),
+      refetchRecommendations();
+    }, [refetchRecommendations]),
   );
 
   const onRefresh = async () => {
     setRefreshing(true);
-    await loadRecommendations();
+    await refetchRecommendations();
     setRefreshing(false);
   };
 
@@ -70,7 +59,7 @@ export default function RecommendationsScreen() {
           onPress: async () => {
             try {
               setGenerating(true);
-              await generateRecommendation({
+              await generateNewRecommendation({
                 userId: user.id,
                 modelProvider: "openai",
                 useExternalModel: true,
@@ -79,7 +68,7 @@ export default function RecommendationsScreen() {
                 "Success",
                 "AI recommendation generated! It will appear here once approved by your trainer.",
               );
-              await loadRecommendations();
+              await refetchRecommendations();
             } catch (error) {
               log.error("Failed to generate recommendation", error);
               Alert.alert(