fix:(fixing typescript errot)

Author: Emmyfrank

app/Appointments/index.tsx

@@ -23,17 +23,13 @@ function Screen() {
   const [complete, setComlpete] = useState(false);
   const [notupcome, setNotupcome] = useState(false);
   const [isModalVisible, setIsModalVisible] = useState(false);
-<<<<<<< HEAD
-  const [appointmentData, setAppointmentData] = useState<any[]>([]);
   const { doctorId } = useLocalSearchParams<{ doctorId: string }>();
-  const [appointId, setAppointId] = useState({});
+  const appointments = useSelector(
+    (state: RootState) => state.appointment.appointments
+  );
   const [canceledData, setcanceledData] = useState<any[]>([]);
-
-=======
-  const { doctorId } = useLocalSearchParams<{ doctorId: string }>();
-  const appointments = useSelector((state: RootState) => state.appointment.appointments);
+  const [appointId, setAppointId] = useState({});
   const dispatch = useDispatch();
->>>>>>> cf07aa0 (messaging appointment and doctor details)
   const handleUpcoming = () => {
     setCancels(false);
     setUpcoming(true);
@@ -64,28 +60,39 @@ function Screen() {
 
   const fetchAppointment = async () => {
     try {
-      const { data: userData, error: userError } = await supabase.auth.getUser();
+      const { data: userData, error: userError } =
+        await supabase.auth.getUser();
       if (userError) throw userError;
       const userId = userData?.user?.id;
-<<<<<<< HEAD
       const { data, error } = await supabase
         .from("appointment")
-        .select(`
+        .select(
+          `
           *,
           doctor(
             id,
             name,
             role,
             image,
             hospital
-          )
-        `)
+          ),
+          patient(
+    id,
+    email,
+    phone,
+    full_name,
+    nickname,
+    date_of_birth,
+    gender
+  )
+        `
+        )
         .eq("patient_id", userId);
 
       if (error) {
         console.log("Error occurred while fetching appointments", error);
       } else {
-        setAppointmentData(data);
+        dispatch(getAppointments(data));
         if (data.length === 0) {
           setNotupcome(true);
           setUpcoming(false);
@@ -102,10 +109,10 @@ function Screen() {
     fetchAppointment();
   }, []);
 
-
   const cancelAppointment = async () => {
     try {
-      const { data: userData, error: userError } = await supabase.auth.getUser();
+      const { data: userData, error: userError } =
+        await supabase.auth.getUser();
       if (userError) throw userError;
       const userId = userData?.user?.id;
       const { data, error } = await supabase
@@ -127,14 +134,13 @@ function Screen() {
     cancelAppointment();
   }, []);
 
-
   const getPackageIcon = (typecall: any) => {
     switch (typecall) {
-      case 'Voice Call':
+      case "Voice Call":
         return require("../../assets/appointmentIcon/voice.png");
-      case 'Video Call':
+      case "Video Call":
         return require("../../assets/appointmentIcon/video.png");
-      case 'Messaging':
+      case "Messaging":
         return require("../../assets/appointmentIcon/message.png");
       default:
         return null;
@@ -146,55 +152,17 @@ function Screen() {
       appointmentId: appointment.id,
       appointment_date: appointment.appointment_date,
       appointment_time: appointment.appointment_time,
-      doctorId:appointment.doctor?.id,
-      doctorname:appointment.doctor.name,
-      doctimage:appointment.doctor.image,
-      typecall:appointment.package
+      doctorId: appointment.doctor?.id,
+      doctorname: appointment.doctor.name,
+      doctimage: appointment.doctor.image,
+      typecall: appointment.package,
     });
     setIsModalVisible(true);
   };
-=======
-const{data, error}=await supabase
-.from("appointment")
-.select(`
-  *,
-  doctor(
-    id,
-    name,
-    role,
-    image,
-    hospital
-  ),
-  patient(
-    id,
-    email,
-    phone,
-    full_name,
-    nickname,
-    date_of_birth,
-    gender
-  )
-`)
-.eq("patient_id", userId);
 
-if(error){
-  console.log("Error occured while fetching appointments", error)
-}else{
-  dispatch(getAppointments(data))
-  console.log("fetched data:");
-  setTimeout(()=>{
-    router.push("/(tabs)/appointment")
-  },0)
-}}  
-catch(error){
-console.log(error);
-} 
-}
-useEffect(()=>{
-  
-fetchAppointment();
-},[])
->>>>>>> cf07aa0 (messaging appointment and doctor details)
+  useEffect(() => {
+    fetchAppointment();
+  }, []);
 
   return (
     <>
@@ -278,28 +246,24 @@ fetchAppointment();
         >
           {cancels && (
             <View style={styles.content}>
-            {canceledData.map((canceled,index)=>(
-              <Cardcomponent
-                 key={index}
-                 name={canceled.doctorname}
-                 imager={canceled.doctimage}
-                 typecall={canceled.package}
-                 action="Cancelled"
-                 date={canceled.appointment_date}
-                 time={canceled.appointment_time.slice(0, 5)}
-                 imagerr={getPackageIcon(canceled.package)}
-                 styles={styles.cancelStyles}
-              />
-            ))}
+              {canceledData.map((canceled, index) => (
+                <Cardcomponent
+                  key={index}
+                  name={canceled.doctorname}
+                  imager={canceled.doctimage}
+                  typecall={canceled.package}
+                  action="Cancelled"
+                  date={canceled.appointment_date}
+                  time={canceled.appointment_time.slice(0, 5)}
+                  imagerr={getPackageIcon(canceled.package)}
+                  styles={styles.cancelStyles}
+                />
+              ))}
             </View>
           )}
           {upcoming && (
             <View style={styles.content}>
-<<<<<<< HEAD
-              {appointmentData.map((appointment: any, index: any) => (
-=======
-              {appointments.map((appointment:any, index:any) => (
->>>>>>> cf07aa0 (messaging appointment and doctor details)
+              {appointments.map((appointment: any, index: any) => (
                 <Cardscomponent
                   key={index}
                   appointment={appointment}
@@ -319,8 +283,8 @@ fetchAppointment();
                       pathname: "/Appointments/reschedul",
                       params: {
                         appointmentId: appointment.id,
-                        appointmentdate:appointment.appointment_date,
-                        appointmentime:appointment.appointment_time,
+                        appointmentdate: appointment.appointment_date,
+                        appointmentime: appointment.appointment_time,
                       },
                     })
                   }
@@ -332,7 +296,9 @@ fetchAppointment();
 
           {notupcome && (
             <View style={styles.centerbar}>
-              <Image source={require("../../assets/appointmentIcon/first.png")} />
+              <Image
+                source={require("../../assets/appointmentIcon/first.png")}
+              />
               <Text style={styles.centerbartitle}>
                 You don't have an appointment yet
               </Text>
@@ -398,15 +364,14 @@ const styles = StyleSheet.create({
     flexGrow: 1,
     paddingBottom: 50,
     paddingTop: 20,
-    height:"80%"
+    height: "80%",
   },
   centerbar: {
     display: "flex",
     justifyContent: "center",
     alignItems: "center",
     height: "76%",
     gap: 20,
-    
   },
   centerbartitle: {
     fontSize: 20,
@@ -499,4 +464,4 @@ const styles = StyleSheet.create({
   mode: {
     color: "#f75555",
   },
-});
+});

components/SignInButton.tsx

@@ -22,6 +22,7 @@ const SignInButton: React.FC<Props> = ({ title, logo, color, onPress }) => {
           borderRadius: 16,
         },
       ]}
+      //@ts-ignore
       onPress={onPress}
     >
       <View