basic structure for ‘view tips’

App.js

@@ -11,6 +11,7 @@ import {
   ShareTipScreen,
   EditVetProfileScreen,
   TipsScreen,
+  TipsScreenPet,
 } from "./src/screens";
 
 const Stack = createStackNavigator();
@@ -28,6 +29,8 @@ export default function App() {
         <Stack.Screen name="Share Tip Screen" component={ShareTipScreen} />
         <Stack.Screen name="Edit Vet Profile Screen" component={EditVetProfileScreen} />
         <Stack.Screen name="Tips Screen" component={TipsScreen} />
+        <Stack.Screen name="Tips Screen Pet" component={TipsScreenPet} />
+
       </Stack.Navigator>
     </NavigationContainer>
   );

api/index.js

@@ -275,6 +275,24 @@ app.get("/veterinarianId/checkId/:vetId", async (req, res) => {
 
 // ------------ Tip------------
 
+app.get("/tips/all", async (req, res) => {
+  try {
+    // Populate the 'vetId' field in each tip with the 'name' field from the referenced veterinarian document
+    const tips = await Tip.find().populate('vetId', 'name');
+    const tipsWithVetNames = tips.map(tip => ({
+      _id: tip._id,
+      content: tip.content,
+      vetName: tip.vetId ? tip.vetId.name : 'Unknown'
+    }));
+    res.status(200).json(tipsWithVetNames);
+  } catch (error) {
+    console.error("Error fetching all tips", error);
+    res.status(500).json({ message: "Internal server error" });
+  }
+});
+
+
+
 // Add tip
 app.post("/tip/addTip/:vetId", async (req, res) => {
   try {

api/models/tip.js

@@ -8,6 +8,7 @@ const tipSchema = new mongoose.Schema({
   },
   vetId: {
     type: mongoose.Types.ObjectId,
+    ref: 'Veterinarian',
     required: true,
   },
 });

src/screens/PetOwnerHomeScreen/PetOwnerHomeScreen.js

@@ -48,7 +48,7 @@ export default function PetOwnerHomeScreen({ route, navigation }) {
     if (searchQuery) queryParams.append('location', searchQuery);
     queryParams.append('isAvailable', true);
 
-    axios.get(`http://10.0.2.2:3000/veterinarians?${queryParams.toString()}`)
+    axios.get(`http://localhost:3000/veterinarians?${queryParams.toString()}`)
       .then((response) => {
         setVeterinarians(response.data);
       })
@@ -61,9 +61,11 @@ export default function PetOwnerHomeScreen({ route, navigation }) {
     navigation.navigate("Pet Profile Screen Edit", { petOwnerId: petOwnerId });
   };
 
-  const handleVetPress = (vet) => {
-    console.log("vetId: check", vet._id);
+  const handleNavigateToTipsScreen = () => {
+    navigation.navigate("Tips Screen Pet");
+  };
 
+  const handleVetPress = (vet) => {
     // Navigate to VetHomeScreen with the selected vet's ID and pet owner's ID
     navigation.navigate("Vet Home Screen", {userId: vet._id, userType: "petOwner" // ID of the pet owner
     });
@@ -100,6 +102,9 @@ export default function PetOwnerHomeScreen({ route, navigation }) {
           <Text>{vet.name} - {vet.location}</Text>
         </TouchableOpacity>
       ))}
+      <TouchableOpacity style={styles.viewTipsButton} onPress={handleNavigateToTipsScreen}>
+        <Text style={styles.buttonText}>View Tips</Text>
+      </TouchableOpacity>
     </ScrollView>
   );
 }
@@ -141,4 +146,17 @@ const styles = StyleSheet.create({
     borderRadius: 5,
     marginTop: 20,
   },
+  viewTipsButton: {
+    backgroundColor: "#FFA500",
+    padding: 10,
+    borderRadius: 5,
+    marginTop: 20,
+    marginBottom: 20,
+  },
+  buttonText: {
+    color: "white",
+    fontSize: 16,
+    fontWeight: "bold",
+    textAlign: "center", // Center the text inside the button
+  },
 });

src/screens/TipsScreenPet/TipsScreenPet.js

@@ -0,0 +1,83 @@
+import React, { useState, useEffect } from "react";
+import { View, TouchableOpacity, Text, FlatList, StyleSheet } from "react-native";
+import { AntDesign } from "@expo/vector-icons";
+import axios from "axios";
+import { COLORS } from "../../constants";
+
+export default function TipsScreenPet({ route, navigation }) {
+  const [vetTips, setVetTips] = useState([]);
+
+  useEffect(() => {
+    const fetchAllTips = async () => {
+      try {
+        const response = await axios.get('http://localhost:3000/tips/all');
+        if (response.data) {
+          setVetTips(response.data);
+        }
+      } catch (error) {
+        console.error("Error fetching tips:", error);
+      }
+    };
+
+    fetchAllTips();
+
+    const subscription = navigation.addListener("focus", fetchAllTips);
+
+    return () => {
+      if (subscription) {
+        subscription.remove();
+      }
+    };
+  }, [navigation]);
+
+
+  const renderItem = ({ item }) => {
+    return (
+        <View style={styles.tipContainer}>
+        <Text style={styles.tipContent}>{item.content}</Text>
+        <Text style={styles.vetName}>By: {item.vetName}</Text>
+      </View>
+    );
+  };
+
+  return (
+    <View style={styles.container}>
+
+      <Text style={styles.title}>Vet Tips</Text>
+      <FlatList
+        data={vetTips}
+        renderItem={renderItem}
+        keyExtractor={(item) => item._id}
+      />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    padding: 20,
+  },
+  title: {
+    fontSize: 20,
+    fontWeight: "bold",
+    marginBottom: 10,
+  },
+  tipContainer: {
+    backgroundColor: "#f0f0f0",
+    borderRadius: 10,
+    padding: 15,
+    marginBottom: 10,
+  },
+  tipContent: {
+    fontSize: 16,
+  },
+  vetName: {
+    fontStyle: 'italic',
+    marginTop: 5,
+  },
+  addButton: {
+    alignSelf: 'flex-end',
+    marginBottom: 10,
+  }
+});

src/screens/index.js

@@ -7,6 +7,8 @@ import VetHomeScreen from "./VetHomeScreen/VetHomeScreen";
 import ShareTipScreen from "./ShareTipScreen/ShareTipScreen";
 import EditVetProfileScreen from "./EditVetProfileScreen/EditVetProfileScreen";
 import TipsScreen from "./TipsScreen/TipsScreen";
+import TipsScreenPet from "./TipsScreenPet/TipsScreenPet";
+
 
 export {
   HomeScreen,
@@ -18,4 +20,5 @@ export {
   ShareTipScreen,
   EditVetProfileScreen,
   TipsScreen,
+  TipsScreenPet,
 };