Skip to content

Commit

Permalink
Merge pull request #232 from atlp-rwanda/ft-video-call
Browse files Browse the repository at this point in the history 
Feature: Implement Video Call functionalities
  • Loading branch information
@Nkbtemmy
Nkbtemmy authored Jul 23, 2024
2 parents bf0c16e + 792bbe9 commit ca4e979
Show file tree
Hide file tree
Showing 21 changed files with 1,158 additions and 1,422 deletions.
6 changes: 4 additions & 2 deletions app/(app)/ActionMenu/Booking/Doctor_details.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -548,8 +548,10 @@ const visibleReviews = reviews.slice(0, 1);
)

) : (
<Text style={[Typography.semiBold.large] }> No available reviews</Text>
)}
<Text style={[Typography.semiBold.large,
{color: theme === "dark" ? Colors.others.white : "#212121",}
] }> No available reviews</Text>
)}
</View>
</View>
</View>
Expand Down
1 change: 0 additions & 1 deletion app/(app)/ActionMenu/Booking/Select-package.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@ const SelectPackage = () => {
const { Doctor_id, hour, date,patient_id } = useLocalSearchParams()
const [selectedPackageTitle, setSelectedPackageTitle] = useState<{ title: string, price: string }>({ title: "Messaging", price: "Rwf20" })
const [selectedDuration, setSelectedDuration] = useState<string>("1 hour")
console.log("this is new:", Doctor_id, hour, date)
const handleNextPress = () => {
if (!selectedPackageTitle||!selectedDuration) {
Alert.alert("Please select both Duration and package")
Expand Down
6 changes: 4 additions & 2 deletions app/(app)/ActionMenu/Booking/SelectPayment.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ export default function SelectPayment() {

const modal = useModal()
const flutterKey = process.env.EXPO_PUBLIC_FLUTTERWAVE_KEY ?? ""
console.log("this is packageprice from slect Payment:",packagePrice)

interface RedirectParams {
status: "successful" | "cancelled";
Expand Down Expand Up @@ -138,7 +137,10 @@ const total:number=price*num
></View>
<Button
title="View Appointment"
onPress={successBooking}
onPress={()=> {
successBooking()
router.push("(app)/Appointments")
}}
/>
<TouchableOpacity
onPress={() => {
Expand Down
3 changes: 1 addition & 2 deletions app/(app)/ActionMenu/Booking/reviewSummary.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,6 @@ export default function Reviewsummary() {
}
fetchDoctordata()
}, [doctor_id])
console.log("this is packagePrice:",packagePrice)
let num:number=1;
if (duration === "30 minutes") {
num=1
Expand Down Expand Up @@ -423,4 +422,4 @@ const total:number=price*num
</ScrollView>
</>
);
}
}
19 changes: 9 additions & 10 deletions app/(app)/Appointments/MessagingAppointment/ChannelList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,14 @@ import React, { useContext, useEffect, useState } from 'react'
import { fetchPatientData } from '@/utils/LoggedInUser';
import { AuthContext } from '@/ctx/AuthContext';
import {
ChannelList
} from 'stream-chat-expo'
ChannelList,
DefaultStreamChatGenerics
} from 'stream-chat-expo'
import { useAppContext } from '@/ctx/ChatContext';
import { PatientTypes } from '@/constants/Types';
import {useRouter } from 'expo-router';

const ChannelLists = ({appointmentId}:{appointmentId:any}) => {
import { ChannelSort } from 'stream-chat';
const ChannelLists = ({appointmentId, loggedInUserId, doctorId}:{appointmentId:any, loggedInUserId:string, doctorId:any}) => {
const { channel, setChannel } = useAppContext();
const [patientData, setPatientData] = useState<PatientTypes[] | null>(null);
const { userId, } = useContext(AuthContext);
Expand All @@ -28,14 +29,13 @@ const ChannelLists = ({appointmentId}:{appointmentId:any}) => {
};
}

const sort = {last_message_at: -1,};

const sort : ChannelSort<DefaultStreamChatGenerics> = { last_message_at: -1 }
const handleNavigateToChannel = (channel: any) => {
setChannel(channel);
router.push({
pathname: "(app)/Appointments/MessagingAppointment/ChannelScreen",
params: { id: channel?.id, appointmentId },
});
params: { chanelId: channel?.id, appointmentId, loggedInUserId, doctorId},
});
};

return (
Expand All @@ -50,5 +50,4 @@ const ChannelLists = ({appointmentId}:{appointmentId:any}) => {
}


export default ChannelLists

export default ChannelLists
80 changes: 19 additions & 61 deletions app/(app)/Appointments/MessagingAppointment/ChannelScreen.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,17 +25,31 @@ import { supabase } from "@/lib/supabase";
import { useGlobalSearchParams } from "expo-router";
import Typography from "@/constants/Typography";
import { useModal } from "@/ctx/ModalContext";
import { StreamChat } from "stream-chat";

const ChannelScreen = () => {
const { theme, changeTheme } = useContext(ThemeContext);
const [isloading, setIsLoading] = useState(false);
const ios = Platform.OS === "ios";
const modal = useModal();
const {appointmentId} = useGlobalSearchParams();
const {chanelId,appointmentId, loggedInUserId, doctorId} = useGlobalSearchParams();
const { channel } = useAppContext();

const API_KEY = process.env.EXPO_PUBLIC_STREAM_API_KEY;

const chatClient = StreamChat.getInstance(`${API_KEY}`);

const disableUser = async () => {
try{
await chatClient.channel('messaging', `${chanelId}`).removeMembers([`${loggedInUserId}`])
}catch(error){
console.log("user not deleted",error);
}
}

const endAppointment = async() => {
try {
disableUser();
setIsLoading(true);
const { error } = await supabase
.from("appointment")
Expand All @@ -46,7 +60,10 @@ const ChannelScreen = () => {
console.log(error);
} else {
setIsLoading(false);
handlemodal()
router.push({
pathname: "Appointments/MessagingAppointment/SessionEnded",
params: {id: doctorId}
})
}
} catch (error) {
console.log(error);
Expand All @@ -58,65 +75,6 @@ const ChannelScreen = () => {
router.push("/(app)/Appointments");
}

async function handlemodal() {
modal.show({
children: (
<View
style={{
padding: 40,
alignItems: "center",
gap: 20,
borderRadius: 48,
backgroundColor:
theme === "light" ? Colors.others.white : Colors.dark._2,
}}
>
<Image source={require("@/assets/images/cancelimg.png")} />
<View
style={{
gap: 20,
backgroundColor:
theme === "light" ? Colors.others.white : Colors.dark._2,
}}
>
<Text
style={[
Typography.heading._4,
{
color: Colors.main.primary._500,
textAlign: "center",
},
]}
>
Chat ended Successfully!
</Text>
<Text
style={[
Typography.regular.large,
{
textAlign: "center",
color:
theme === "light"
? Colors.grayScale._900
: Colors.others.white,
},
]}
>
Thank you for using our service. Your chat has been ended
please go on and provide a review to the doctor.
</Text>
<TouchableOpacity style={styles.btn} onPress={handlebackhome}>
<Text
style={[Typography.bold.large, { color: Colors.others.white }]}
>
Ok
</Text>
</TouchableOpacity>
</View>
</View>
),
});
}
return (
<View
style={{
Expand Down
63 changes: 31 additions & 32 deletions app/(app)/Appointments/MessagingAppointment/Home.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,13 @@ export function Home() {

const { userId } = useContext(AuthContext);

const {id, appointmentId} = useGlobalSearchParams()
const doctorId = id;
const chatRoomId = "matadores-medica"+uuid.v4();

const [loggedInUserId , setLoggedInUserId] = useState<string>("");
const CDNURL =
"https://vbwbfflzxuhktdvpbspd.supabase.co/storage/v1/object/public/patients/";
const { doctorId, appointmentId } = useGlobalSearchParams();

useEffect(() => {
if (userId) {
fetchPatientData(userId, setPatientData);
Expand All @@ -35,44 +38,40 @@ export function Home() {

useEffect(() => {
const setupClient = async () => {
try {
if (patientData && patientData[0]) {
const user = {
id: patientData[0].id,
name: `${patientData[0].first_name} ${patientData[0].last_name}`,
image: "https://i.imgur.com/fR9Jz14.png",
};

await chatClient.connectUser(
user,
chatClient.devToken(user.id));
setClientIsReady(true);
setClient(chatClient);
try {
if (patientData && patientData[0]) {
setLoggedInUserId(patientData[0].id);
const user = {
id: patientData[0].id,
name: `${patientData[0].first_name} ${patientData[0].last_name}`,
image: `${CDNURL + patientData[0]?.image}`,
};
await chatClient.connectUser(user, chatClient.devToken(user.id));

const channel = chatClient.channel("messaging", `${chatRoomId}`, {
image: "https://vbwbfflzxuhktdvpbspd.supabase.co/storage/v1/object/public/doctors/adaptive_icon.png",
name: "Medica Chat Room",
members: [user?.id , `${doctorId}`],
});
await channel.watch();
setChannel(channel);
} else {
console.log("No patient data found");
}
} catch (error) {
console.error("An error occurred while connecting the user:", error);
setClientIsReady(true);
setClient(chatClient);
const channel = chatClient.channel("messaging", `${chatRoomId}`, {
image:
"https://vbwbfflzxuhktdvpbspd.supabase.co/storage/v1/object/public/doctors/adaptive_icon.png",
name: `${user?.name} in the chat`,
members: [user?.id, `${doctorId}`],
});
await channel.watch();
setChannel(channel);
} else {
console.log("No patient data found");
}
} catch (error) {
console.error("An error occurred while connecting the user:", error);
}
};
if (!chatClient.userID) {
setupClient();
}
// if(client){return async()=> await client.disconnectUser()}
}, [patientData]);

return (
<ChannelLists appointmentId={appointmentId}/>
)
return <ChannelLists appointmentId={appointmentId} loggedInUserId={loggedInUserId} doctorId={doctorId}/>
}

export default Home;

export default Home;
Loading

0 comments on commit ca4e979

Please sign in to comment.