diff --git a/app/chat-history/VideoCall.tsx b/app/chat-history/VideoCall.tsx index bca03a5b..a978c42a 100644 --- a/app/chat-history/VideoCall.tsx +++ b/app/chat-history/VideoCall.tsx @@ -1,64 +1,46 @@ -import React from "react"; +import React, {useState, useEffect} from "react"; import { View, ScrollView } from "react-native"; import DoctorVideo from "@/components/cards/DoctorVideo"; import { useRouter } from "expo-router"; -import { DoctorCard } from "./types"; // Import the types - +import { DoctorCard } from "./types"; +import { supabase } from "../supabase"; const VideoCall = () => { const router = useRouter(); + const [appointment, setAppointment]=useState([]); - const docCards: DoctorCard[] = [ - { - name: "Dr. Randy Wigham", - callDay: "Wednesday", - callTime: "1:00 PM", - images: require("../../assets/doctors/doc2.png"), - }, - { - name: "Dr. Jenny Watson", - callDay: "Wednesday", - callTime: "1:00 PM", - images: require("../../assets/doctors/doc3.png"), - }, - { - name: "Dr. Raul Zirkind", - callDay: "Wednesday", - callTime: "1:00 PM", - images: require("../../assets/doctors/doc1.png"), - }, - { - name: "Dr. Elijah Baranick", - callDay: "Wednesday", - callTime: "1:00 PM", - images: require("../../assets/doctors/doc2.png"), - }, - { - name: "Dr. Stephen Shute", - callDay: "Wednesday", - callTime: "1:00 PM", - images: require("../../assets/doctors/doc5.png"), - }, - ]; - - const handlePress = (doctor: DoctorCard) => { + useEffect(()=>{ + const fetchAppointments=async()=>{ + const {data, error}=await supabase.auth.getUser(); + if(error) throw error; + const userId=data?.user?.id; + const {data:AppointmentData, error:Error}=await supabase.from("appointment").select("*, doctor(name,image)").eq("patient_id", userId).eq("package","Video Call") + if(Error) throw Error + if(AppointmentData){ + setAppointment(AppointmentData); + } + } + fetchAppointments(); + },[]) + + const handlePress = (appointmentId:any) => { router.push({ pathname: "/chat-history/VideoRecord", - params: { doctor: JSON.stringify(doctor) }, + params: {appointmentId}, }); }; return ( - {docCards.map((doctor, index) => ( + {appointment.map((appointments, index) => ( handlePress(doctor)} - doctorName={doctor.name} - doctorImage={doctor.images} - callType="Video Call" - callDay={doctor.callDay} - callTime={doctor.callTime} + onPress={() => handlePress(appointments.id)} + doctorName={appointments.doctor.name} + doctorImage={appointments.doctor.image} + callType={appointments.package} + callDay={appointments.appointment_date} + callTime={appointments.appointment_time.slice(0,5)} isVideoCallScreen={false} /> ))} diff --git a/app/chat-history/VideoRecord.tsx b/app/chat-history/VideoRecord.tsx index a11bc7ce..f6317a02 100644 --- a/app/chat-history/VideoRecord.tsx +++ b/app/chat-history/VideoRecord.tsx @@ -14,20 +14,22 @@ import PlayButton from "@/components/cards/PlayButton"; import { useRouter, useLocalSearchParams } from "expo-router"; import { SvgXml } from "react-native-svg"; import AsyncStorage from "@react-native-async-storage/async-storage"; - -import { DoctorCard } from "./types"; import { moreTransparent } from "@/assets/icons/more"; import { back } from "@/assets/icons/userprofile/icons"; +import { supabase } from "../supabase"; const VideoRecord: React.FC = () => { const router = useRouter(); - const { doctor: doctorString } = useLocalSearchParams(); - const doctor: DoctorCard = doctorString - ? JSON.parse(doctorString as string) - : null; - + + +const {appointmentId}=useLocalSearchParams(); const [modalVisible, setModalVisible] = useState(false); const [videoDuration, setVideoDuration] = useState(0); + const[ name, setName]=useState(""); + const[date, setDate]=useState(""); + const[time, setTime]=useState(""); + const[packageType, setPackage]=useState(""); + const[image, setImage]=useState(""); useEffect(() => { const fetchDuration = async () => { @@ -40,9 +42,7 @@ const VideoRecord: React.FC = () => { fetchDuration(); }, []); - if (!doctor) { - return null; - } + const handlePress = () => { router.push("/chat-history/PlayRecord"); @@ -64,7 +64,7 @@ const VideoRecord: React.FC = () => { setModalVisible(false); }; - const { name, images, callDay, callTime } = doctor; + const formatTime = (timeInSeconds: number) => { const hours = Math.floor(timeInSeconds / 3600); @@ -79,6 +79,21 @@ const VideoRecord: React.FC = () => { return `${minutes}:${String(seconds).padStart(2, "0")} minutes`; } }; + useEffect(()=>{ + const fetchAppointments=async()=>{ + const {data:AppointmentData, error:Error}=await supabase.from("appointment").select("*, doctor(name,image)").eq("id",appointmentId).single(); + if(Error) throw Error + if(AppointmentData){ + setName(AppointmentData.doctor.name); + setPackage(AppointmentData.package); + setImage(AppointmentData.doctor.image); + setTime(AppointmentData.appointment_time); + setDate(AppointmentData.appointment_date); + + } + } + fetchAppointments(); + },[appointmentId]) return ( @@ -89,12 +104,12 @@ const VideoRecord: React.FC = () => { - ([]); const handleDocName = (doc: string) => { setDocname(doc); setIsModalVisible(true); }; - const renderItems = ({ item }: { item: MessagesType }) => { + + useEffect(()=>{ +const fetchAppointments=async()=>{ +const {data, error}=await supabase.auth.getUser(); +if(error) throw error; +const userId=data?.user?.id; +const {data:AppointmentData, error:Error}=await supabase.from("appointment").select("*, doctor(name,image)").eq("patient_id", userId).eq("package","Messaging") +if(Error) throw Error +if(AppointmentData){ +setAppointment(AppointmentData); +} +} +fetchAppointments(); + },[]) + const renderHistory = (appointment: any, index:number) => { return ( - + - + handleDocName(item.name)} + onPress={() => handleDocName(appointment.doctor.name)} > - {item.name} + {appointment.doctor.name} - {item.message} + ..... - {item.date} + {appointment.appointment_date} - {item.time} + {appointment.appointment_time.slice(0,5)} @@ -125,7 +140,7 @@ export default function Chathistory() { - + /> */} - + /> */} {/* 16:03 PM @@ -249,16 +264,12 @@ export default function Chathistory() { - {selected === "Messages" && ( - + + {appointment.map((appointmentItem,index) => renderHistory(appointmentItem,index))} + )} - +{selected==="Calls"&&} {selected === "Videos" && } diff --git a/app/chat-history/singleCall.tsx b/app/chat-history/singleCall.tsx index 10cf37da..e9e68204 100644 --- a/app/chat-history/singleCall.tsx +++ b/app/chat-history/singleCall.tsx @@ -9,9 +9,10 @@ import { useCallback, useEffect, useRef, useState } from 'react'; import { play } from "@/assets/icons/playBtn"; import { download } from '@/assets/icons/download'; import { deleteRed } from '@/assets/icons/delete'; -import { router } from 'expo-router'; +import { router, useLocalSearchParams } from 'expo-router'; import { AVPlaybackSource, AVPlaybackStatus, AVPlaybackStatusSuccess, Audio } from "expo-av"; import { Sound } from 'expo-av/build/Audio'; +import { supabase } from '../supabase'; const { width } = Dimensions.get('window'); const WAVEFORM_ELEMENTS_COUNT = 50; @@ -23,18 +24,26 @@ export default function SingleCall() { const [duration, setDuration] = useState(1); const [sound, setSound] = useState(null); const progressAnim = useRef(new Animated.Value(0)).current; + const { appointmentId } = useLocalSearchParams(); const intervalRef = useRef(null); const [waveformHeights, setWaveformHeights] = useState([]); - + const [appointment, setAppointment] = useState([]); + const [name, setName] = useState(""); + const [date, setDate] = useState(""); + const [time, setTime] = useState(""); + const [packageType, setPackage] = useState(""); + const [image, setImage] = useState(""); const generateWaveformHeights = () => { + return Array.from({ length: WAVEFORM_ELEMENTS_COUNT }, () => Math.random() * 50 + 10); }; - const handleLoad= async()=>{ + const handleLoad = async () => { const { sound } = await Audio.Sound.createAsync(require('@/assets/Travis-Mafia.mp3')); + setSound(sound); await sound.loadAsync(require('@/assets/Travis-Mafia.mp3')); const status = await sound.getStatusAsync(); - if (status.isLoaded){ + if (status.isLoaded) { setDuration(status.durationMillis); } } @@ -80,12 +89,12 @@ export default function SingleCall() { const formatTime = (millis: number) => { const minutes = Math.floor(millis / 60 / 1000); - const seconds= Math.round(((millis/60/1000)-minutes)*60); - return seconds<10? `${minutes} minutes and 0${seconds} seconds`:`${minutes} minutes and ${seconds} seconds`;; + const seconds = Math.round(((millis / 60 / 1000) - minutes) * 60); + return seconds < 10 ? `${minutes} minutes and 0${seconds} seconds` : `${minutes} minutes and ${seconds} seconds`;; } - useEffect(()=>{ + useEffect(() => { handleLoad(); - },[]) + }, []) useEffect(() => { intervalRef.current = setInterval(() => { handleProgress(); @@ -111,6 +120,20 @@ export default function SingleCall() { setWaveformHeights(generateWaveformHeights()); }, [sound]); + useEffect(() => { + const fetchAppointments = async () => { + const { data: AppointmentData, error: Error } = await supabase.from("appointment").select("*, doctor(name,image)").eq("id", appointmentId).single() + if (AppointmentData) { + setName(AppointmentData.doctor.name); + setPackage(AppointmentData.package); + setImage(AppointmentData.doctor.image); + setTime(AppointmentData.appointment_time); + setDate(AppointmentData.appointment_date); + } + } + fetchAppointments(); + }, [appointmentId]) + return ( <> @@ -138,13 +161,12 @@ export default function SingleCall() { setVisible(!visible)} /> - @@ -160,13 +182,13 @@ export default function SingleCall() { {waveformHeights.map((height, index) => { const barWidth = width * 0.75 / WAVEFORM_ELEMENTS_COUNT; const barProgress = progressAnim.interpolate({ - inputRange: [0, (index ) / WAVEFORM_ELEMENTS_COUNT * width], + inputRange: [0, (index) / WAVEFORM_ELEMENTS_COUNT * width], outputRange: [0, 1], extrapolate: 'clamp', }); const backgroundColor = barProgress.interpolate({ inputRange: [0, 1], - outputRange: ['#E9F0FF','#246BFD'] + outputRange: ['#E9F0FF', '#246BFD'] }); return ( { +export default function VoiceCalls() { + const[appointment, setAppointment]=useState([]); + + useEffect(()=>{ + const fetchAppointments=async()=>{ + const {data, error}=await supabase.auth.getUser(); + if(error) throw error; + const userId=data?.user?.id; + const {data:AppointmentData, error:Error}=await supabase.from("appointment").select("*, doctor(name,image)").eq("patient_id", userId).eq("package","Voice Call") + if(Error) throw Error + if(AppointmentData){ + setAppointment(AppointmentData); + } + } + fetchAppointments(); + },[]) + const renderItems = (appointment: any, index:number) => { return ( <> router.push('chat-history/singleCall')} + key={index} + name={appointment.doctor.name} + type={appointment.package} + date={appointment.appointment_date} + time={appointment.appointment_time.slice(0,5)} + image={appointment.doctor.image} + onPress={()=>router.push({pathname:'chat-history/singleCall', params:{appointmentId:appointment.id}})} /> ) } - const image = require('@/assets/doctors/doc1.png'); return ( <> - + {appointment.map((appointmentItem,index) => renderItems(appointmentItem,index))} ) } \ No newline at end of file diff --git a/app/doctor-appointments/patient-details.tsx b/app/doctor-appointments/patient-details.tsx index 715d9934..cf5c6ff3 100644 --- a/app/doctor-appointments/patient-details.tsx +++ b/app/doctor-appointments/patient-details.tsx @@ -7,6 +7,11 @@ import { useState, useEffect } from "react"; import { calendar } from "@/assets/icons/userprofile/icons"; import { SvgXml } from "react-native-svg"; import Touchable from "@/components/common/touchable"; +import { router, useLocalSearchParams } from "expo-router"; +import { useState, useEffect } from "react"; +import { calendar } from "@/assets/icons/userprofile/icons"; +import { SvgXml } from "react-native-svg"; +import Touchable from "@/components/common/touchable"; import { KeyboardAvoidingView, ScrollView, @@ -23,6 +28,15 @@ import { import { SelectList } from "react-native-dropdown-select-list"; import { supabase } from "../supabase"; import DateTimePickerModal from "react-native-modal-datetime-picker"; +import { + back, + edit, + emailIcon, + selector, +} from "../../assets/icons/userprofile/icons"; +import { SelectList } from "react-native-dropdown-select-list"; +import { supabase } from "../supabase"; +import DateTimePickerModal from "react-native-modal-datetime-picker"; export default function PatientDetailsScreen() { const dimensions = useWindowDimensions(); diff --git a/components/cards/DoctorVideo.tsx b/components/cards/DoctorVideo.tsx index 086bd55e..409257ef 100644 --- a/components/cards/DoctorVideo.tsx +++ b/components/cards/DoctorVideo.tsx @@ -23,7 +23,7 @@ export default function DoctorCard(props: DocCardProps) { - + {props.doctorName} diff --git a/components/chats/voiceCard.tsx b/components/chats/voiceCard.tsx index ad2fc2af..90708a6f 100644 --- a/components/chats/voiceCard.tsx +++ b/components/chats/voiceCard.tsx @@ -16,7 +16,7 @@ export type CallsType = { time: string; date: string; icon?: any; - image: ImageSourcePropType; + image: any; onPress?: () => void; }; @@ -25,7 +25,7 @@ export default function CallsCard(props: CallsType) { - +