From 54dd709b6cb4a2f5801d597ce9b01654649ffd8c Mon Sep 17 00:00:00 2001 From: Murenzi Paterne Date: Wed, 22 May 2024 11:55:24 +0200 Subject: [PATCH] ch(ch-updated-readme) configured release-it and its packages * ft(release): update readme and trigger release * fix(setup-fingerprint): gap between the buttons * fix (bad-theme-context): fix bad state error * fix: Fixed bad theme context and implemented dark mode for the settings surrounding screens --- app/(app)/ActionMenu/Booking/AddNewCard.tsx | 1 - .../ActionMenu/Booking/BookingAppointment.tsx | 1 - .../ActionMenu/Booking/reviewSummary.tsx | 1 - .../MessagingAppointment/ChatMessaging.tsx | 1 - .../ReschedualAppointment/Selectreason.tsx | 1 - .../ReschedualAppointment/rescheduleDate.tsx | 1 - .../Appointments/Review/ReviewScreen.tsx | 1 - .../MyAppointmentVoiceCall.tsx | 279 + .../VoiceCallAppointment/SessionEnded.tsx | 1 - app/(app)/Profile/EditProfile.tsx | 67 +- app/(app)/Profile/HelpCenter/ContactUs.tsx | 8 +- app/(app)/Profile/HelpCenter/FAQ.tsx | 15 +- app/(app)/Profile/HelpCenter/_layout.tsx | 6 + app/(app)/Profile/InviteFriends.tsx | 8 +- app/(app)/Profile/Languages.tsx | 17 +- app/(app)/Profile/Notification.tsx | 11 +- app/(app)/Profile/Payment.tsx | 34 +- app/(app)/Profile/Security.tsx | 13 +- app/(app)/Profile/_layout.tsx | 49 +- app/(app)/Profile/index.tsx | 210 +- app/(app)/_layout.tsx | 8 +- .../SignIn&SignOut/SetYourFingerPrint.tsx | 18 +- app/index.tsx | 4 +- app/onBoarding/FirstScreen.tsx | 19 +- assets/icons/EmptyImageContainer.ts | 12 + assets/icons/Profile/Icons.ts | 93 + assets/icons/ThreeDotCircle.ts | 9 +- components/OnBoarding/OnboardingComponent.tsx | 1 - components/Profile/ContactsListing.tsx | 19 +- components/Profile/FriendsListing.tsx | 32 +- components/Profile/LanguageListing.tsx | 18 +- components/Profile/OptionListing.tsx | 15 +- .../Profile/SelectedPaymentCardListing.tsx | 24 +- .../Profile/SwitchNotificationListing.tsx | 25 +- components/UI/Accordion.tsx | 22 +- components/UI/Header.tsx | 2 - components/UI/Icons.tsx | 18 + components/UI/Input.tsx | 10 +- components/UI/Search.tsx | 55 +- components/UI/Switch.tsx | 42 + components/UI/Tags/Tag.tsx | 8 +- .../UI/icons/MyAppointmentVoiceCall.tsx | 1 - constants/icon.ts | 9 + package-lock.json | 34566 +++++++++------- package.json | 43 +- 45 files changed, 20355 insertions(+), 15443 deletions(-) create mode 100644 app/(app)/Appointments/VoiceCallAppointment/MyAppointmentVoiceCall.tsx create mode 100644 components/UI/Switch.tsx create mode 100644 constants/icon.ts diff --git a/app/(app)/ActionMenu/Booking/AddNewCard.tsx b/app/(app)/ActionMenu/Booking/AddNewCard.tsx index cc657421..1a2cc0e8 100644 --- a/app/(app)/ActionMenu/Booking/AddNewCard.tsx +++ b/app/(app)/ActionMenu/Booking/AddNewCard.tsx @@ -21,7 +21,6 @@ import { ThemeContext } from "@/ctx/ThemeContext"; export default function AddNewCard() { const { theme, changeTheme } = useContext(ThemeContext); - changeTheme("light"); const [date, setDate] = useState(new Date()); const [showDatePicker, setShowDatePicker] = useState(false); const [textColor, setTextColor] = useState("black"); diff --git a/app/(app)/ActionMenu/Booking/BookingAppointment.tsx b/app/(app)/ActionMenu/Booking/BookingAppointment.tsx index 36be1788..00123c29 100644 --- a/app/(app)/ActionMenu/Booking/BookingAppointment.tsx +++ b/app/(app)/ActionMenu/Booking/BookingAppointment.tsx @@ -27,7 +27,6 @@ function BookingAppointment() { console.log(time); }; console.log(selectedTime); - changeTheme("light"); // documentation : https://hosseinshabani.github.io/react-native-modern-datepicker/?ref=retool-blog // Function to generate time slots from 9:00 AM to 15:00 PM const generateTimeSlots = () => { diff --git a/app/(app)/ActionMenu/Booking/reviewSummary.tsx b/app/(app)/ActionMenu/Booking/reviewSummary.tsx index 066e09f7..1cbf099f 100644 --- a/app/(app)/ActionMenu/Booking/reviewSummary.tsx +++ b/app/(app)/ActionMenu/Booking/reviewSummary.tsx @@ -11,7 +11,6 @@ import { router } from "expo-router"; export default function Reviewsummary() { const { theme, changeTheme } = useContext(ThemeContext); - changeTheme("light"); return ( <> diff --git a/app/(app)/Appointments/MessagingAppointment/ChatMessaging.tsx b/app/(app)/Appointments/MessagingAppointment/ChatMessaging.tsx index 7c03f5dc..cdd6e002 100644 --- a/app/(app)/Appointments/MessagingAppointment/ChatMessaging.tsx +++ b/app/(app)/Appointments/MessagingAppointment/ChatMessaging.tsx @@ -77,7 +77,6 @@ function ChatMessaging() { }; const ios = Platform.OS === "ios"; - changeTheme("light"); return ( diff --git a/app/(app)/Appointments/ReschedualAppointment/rescheduleDate.tsx b/app/(app)/Appointments/ReschedualAppointment/rescheduleDate.tsx index 49fea6b5..1ff680b6 100644 --- a/app/(app)/Appointments/ReschedualAppointment/rescheduleDate.tsx +++ b/app/(app)/Appointments/ReschedualAppointment/rescheduleDate.tsx @@ -36,7 +36,6 @@ export default function RescheduleAppointment() { console.log(time); }; console.log(selectedTime); - changeTheme("light"); // documentation : https://hosseinshabani.github.io/react-native-modern-datepicker/?ref=retool-blog // Function to generate time slots from 9:00 AM to 15:00 PM const generateTimeSlots = () => { diff --git a/app/(app)/Appointments/Review/ReviewScreen.tsx b/app/(app)/Appointments/Review/ReviewScreen.tsx index 6d8df57f..7f010807 100644 --- a/app/(app)/Appointments/Review/ReviewScreen.tsx +++ b/app/(app)/Appointments/Review/ReviewScreen.tsx @@ -27,7 +27,6 @@ const RadioText: RadioButtonProps[] = [ const ReviewBlankform: React.FC = (props) => { const{ theme, changeTheme } = useContext(ThemeContext); const [rating, setRating ] = useState(0); - changeTheme('light'); return ( diff --git a/app/(app)/Appointments/VoiceCallAppointment/MyAppointmentVoiceCall.tsx b/app/(app)/Appointments/VoiceCallAppointment/MyAppointmentVoiceCall.tsx new file mode 100644 index 00000000..13ed2f2a --- /dev/null +++ b/app/(app)/Appointments/VoiceCallAppointment/MyAppointmentVoiceCall.tsx @@ -0,0 +1,279 @@ +import React, { useContext, useState } from "react"; +import { + SafeAreaView, + Text, + View, + StyleSheet, + Pressable, + Platform, + TouchableWithoutFeedback, + Image, +} from "react-native"; +import { Colors } from "@/constants/Colors"; +import { router } from "expo-router"; +import { MaterialIcons } from "@expo/vector-icons"; +import { ThemeContext } from "@/ctx/ThemeContext"; +import { StatusBar } from "expo-status-bar"; +import Typography from "@/constants/Typography"; +import { SvgXml } from "react-native-svg"; +import { circleWithDots } from "@/components/UI/icons/circleWithDots"; +import { WhiteMenuCircle } from "@/components/UI/icons/WhiteMenuCircle"; +import DoctorCard from "@/components/DoctorCard"; +import { Call, CallWhiteIcon } from "@/components/Icons/Icons" +import { BackArrow, blackArrow } from "@/components/Icons/Icons"; + +interface PatientType{ + id: string + name: string + gender: "male" | "female" + age: string + problem: string, + appointmentMethod: "Messaging" | "Voice Call" | "video call" + appointmentDate:string + time: string + price: string + paid: boolean, +} + +function AppointmentMessaging() { + const { theme, changeTheme } = useContext(ThemeContext); + const ios = Platform.OS === "ios"; + + + const PatientDetails: PatientType[] = [ + { + id: "23", + name: "Rhys manners", + gender: "male", + age: "23", + problem: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor", + appointmentMethod: "Voice Call", + appointmentDate: "Today December 22,, 2022", + time: "14:00 PM", + price: "20", + paid: true, + }, + ]; + + return ( + + + + + + + + + router.back()} + style={{ + flexDirection: "row", + alignItems: "center", + justifyContent: "space-between", + gap: 30, + + }} + > + + + + + My Appointment + + + + + + + + {PatientDetails && + PatientDetails.map((data: PatientType) => ( + + + + + + + + Scheduled appointment + + + + {data.appointmentDate} + {data.time} + + + + + Patient Information + + + + Full Name: {data?.name} + + + Gender: {data?.gender} + + + Age: {data?.age} + + + Problem: {data?.problem} + + + + + + Your Package + + + + + + + + + {data.appointmentMethod} + + Voice call with doctor + + + + + ${data.price} + + {data.paid ? "(paid)" : "not paid"} + + + + + router.push("(app)/Appointments/VoiceCallAppointment/VoiceCallRinging")} + style={{ + backgroundColor: Colors.main.primary._500, + borderRadius: 100, + }} + > + + + + {data?.appointmentMethod}( + Start at {data?.time}) + + + + + ))} + + + + ); +} + +export default AppointmentMessaging; + diff --git a/app/(app)/Appointments/VoiceCallAppointment/SessionEnded.tsx b/app/(app)/Appointments/VoiceCallAppointment/SessionEnded.tsx index 1ff1a340..47c87d54 100644 --- a/app/(app)/Appointments/VoiceCallAppointment/SessionEnded.tsx +++ b/app/(app)/Appointments/VoiceCallAppointment/SessionEnded.tsx @@ -16,7 +16,6 @@ interface doctor { const SessionEnded = () => { const { theme, changeTheme } = useContext(ThemeContext); - changeTheme("light"); const doctorDetails: doctor[] = [ { id: "22", diff --git a/app/(app)/Profile/EditProfile.tsx b/app/(app)/Profile/EditProfile.tsx index 0e7182df..b64ef3e0 100644 --- a/app/(app)/Profile/EditProfile.tsx +++ b/app/(app)/Profile/EditProfile.tsx @@ -6,19 +6,24 @@ import { Colors } from "@/constants/Colors"; import { SvgXml } from "react-native-svg"; import { CalenderIcon, + CalenderIconDark, DropDownIcon, + DropDownIconDark, MessageIcon, + MessageIconDark, } from "@/assets/icons/Profile/Icons"; import { Dropdown } from "react-native-element-dropdown"; -import { useState } from "react"; +import { useContext, useState } from "react"; import Typography from "@/constants/Typography"; import { typedCountries } from "@/constants/Languages"; +import { ThemeContext } from "@/ctx/ThemeContext"; interface Props {} export default function EditProfile() { const [value, setValue] = useState("United States"); const [isFocus, setIsFocus] = useState(false); + const { theme } = useContext(ThemeContext); const countryNames: { label: string; value: string }[] = Object.keys( typedCountries @@ -26,13 +31,12 @@ export default function EditProfile() { return { label: typedCountries[key].name, value: typedCountries[key].name }; }); - console.log(countryNames.length); - return ( <> { return ( - + ); }} @@ -66,7 +72,9 @@ export default function EditProfile() { rightElement={() => { return ( - + ); }} @@ -74,14 +82,34 @@ export default function EditProfile() { {/* */} } + renderRightIcon={() => ( + + )} + itemTextStyle={{ + color: + theme === "light" ? Colors.grayScale._900 : Colors.others.white, + }} /> @@ -119,13 +155,6 @@ const styles = StyleSheet.create({ backgroundColor: "white", padding: 16, }, - dropdown: { - height: 50, - borderColor: "gray", - borderWidth: 0.5, - borderRadius: 8, - paddingHorizontal: 8, - }, icon: { marginRight: 5, }, @@ -148,8 +177,4 @@ const styles = StyleSheet.create({ width: 20, height: 20, }, - inputSearchStyle: { - height: 40, - fontSize: 16, - }, }); diff --git a/app/(app)/Profile/HelpCenter/ContactUs.tsx b/app/(app)/Profile/HelpCenter/ContactUs.tsx index 40e4618a..036d45b7 100644 --- a/app/(app)/Profile/HelpCenter/ContactUs.tsx +++ b/app/(app)/Profile/HelpCenter/ContactUs.tsx @@ -7,15 +7,21 @@ import { WhatsappBlueIcon, } from "@/assets/icons/Profile/Icons"; import ContactsListing from "@/components/Profile/ContactsListing"; +import { Colors } from "@/constants/Colors"; +import { ThemeContext } from "@/ctx/ThemeContext"; +import { useContext } from "react"; import { ScrollView } from "react-native"; import { View } from "react-native"; import { SvgXml } from "react-native-svg"; export default function ContactUs() { + const { theme } = useContext(ThemeContext); + return ( {}} /> - + {faqs.map((faq) => { return ( diff --git a/app/(app)/Profile/HelpCenter/_layout.tsx b/app/(app)/Profile/HelpCenter/_layout.tsx index 634f3298..a2666c28 100644 --- a/app/(app)/Profile/HelpCenter/_layout.tsx +++ b/app/(app)/Profile/HelpCenter/_layout.tsx @@ -8,6 +8,8 @@ import { ParamListBase, TabNavigationState } from "@react-navigation/native"; import Typography from "@/constants/Typography"; import { Colors } from "@/constants/Colors"; import { color } from "react-native-elements/dist/helpers"; +import { useContext } from "react"; +import { ThemeContext } from "@/ctx/ThemeContext"; const { Navigator } = createMaterialTopTabNavigator(); @@ -19,6 +21,8 @@ export const MaterialTopTabs = withLayoutContext< >(Navigator); export default function Layout() { + const { theme } = useContext(ThemeContext); + return ( - - + ); } diff --git a/app/(app)/Profile/Notification.tsx b/app/(app)/Profile/Notification.tsx index 96f920fd..36d1e1bf 100644 --- a/app/(app)/Profile/Notification.tsx +++ b/app/(app)/Profile/Notification.tsx @@ -1,18 +1,25 @@ import SwitchNotificationListing from "@/components/Profile/SwitchNotificationListing"; +import { Colors } from "@/constants/Colors"; +import { ThemeContext } from "@/ctx/ThemeContext"; +import { useContext } from "react"; import { ScrollView, View } from "react-native"; export default function Notification() { + const { theme } = useContext(ThemeContext); return ( <> @@ -39,25 +47,39 @@ export default function Payment() { /> { - return ; + return ( + + ); }} title="Apple Pay" /> { - return ; + return ( + + ); }} title="•••• •••• •••• •••• 4679" /> { - return ; + return ( + + ); }} title="•••• •••• •••• •••• 2766" /> { - return ; + return ( + + ); }} title="•••• •••• •••• •••• 3892" /> diff --git a/app/(app)/Profile/Security.tsx b/app/(app)/Profile/Security.tsx index 018170ea..b92597ea 100644 --- a/app/(app)/Profile/Security.tsx +++ b/app/(app)/Profile/Security.tsx @@ -1,21 +1,28 @@ import SwitchNotificationListing from "@/components/Profile/SwitchNotificationListing"; import Button from "@/components/UI/Button"; import { Colors } from "@/constants/Colors"; +import { ThemeContext } from "@/ctx/ThemeContext"; +import { useContext } from "react"; import { View } from "react-native"; import { ScrollView } from "react-native"; export default function Security() { + const { theme } = useContext(ThemeContext); + return ( <> - +