\r\n {isPurchased && (\r\n
\r\n )\r\n )}\r\n {/* \r\n \r\n {truncateText(cat.categoryName, 12)}\r\n \r\n
\r\n ))}\r\n \r\n );\r\n};\r\n","import { Box, Flex, HStack, Stack } from \"@chakra-ui/layout\";\r\nimport PropTypes from \"prop-types\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport { FiMenu } from \"react-icons/fi\";\r\nimport { ForumMessageCardMoreIconButton, PlainButtonWithIcon, Text } from \"..\";\r\nimport { useLoggedInUserIsTheCreator } from \"../../hooks\";\r\nimport CommentForm from \"../../pages/user/Forum/Comments/CommentForm\";\r\nimport { formatToUsername, getFullName } from \"../../utils\";\r\n\r\nconst useReplyListCard = () => {\r\n const [displayEditForm, setDisplayEditForm] = useState(false);\r\n\r\n const handleDisplayEditForm = () => setDisplayEditForm(true);\r\n const handleHideEditForm = () => setDisplayEditForm(false);\r\n\r\n return {\r\n displayEditForm,\r\n handleHideEditForm,\r\n handleDisplayEditForm,\r\n };\r\n};\r\n\r\nexport const ReplyListCard = ({\r\n id,\r\n body,\r\n user,\r\n deleteStatusIsLoading,\r\n onReplyDeleteSuccess,\r\n onReplyEditSuccess,\r\n commentId,\r\n viewQuestion,\r\n questionId,\r\n mentionedUser,\r\n}) => {\r\n const { displayEditForm, handleHideEditForm, handleDisplayEditForm } =\r\n useReplyListCard();\r\n\r\n const wrapperRef = useRef();\r\n\r\n useEffect(() => {\r\n wrapperRef.current.focus();\r\n }, []);\r\n\r\n const showMoreIconButton = useLoggedInUserIsTheCreator(user);\r\n\r\n return (\r\n \r\n {isLoading ? (\r\n \r\n ) : (\r\n \r\n \r\n \r\n \r\n\r\n \r\n {layout2 ? (\r\n \r\n \r\n \r\n {course?.title}\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n \r\n {course?.title}\r\n \r\n \r\n \r\n )}\r\n \r\n {course?.reviews?.length === 0 ? (\r\n \r\n \r\n \r\n Rate this course\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n {course.ratingsTotal / course.ratingsCount}\r\n \r\n ({course.ratingsCount}) \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n \r\n By {course.instructor.name}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {!isNaN(course.progress) && (\r\n \r\n \r\n \r\n \r\n {course.progress}%\r\n \r\n )}\r\n \r\n <>\r\n \r\n {getDuration(course?.duration).combinedText}\r\n \r\n \r\n {getDuration(course?.duration).hours &&\r\n `${getDuration(course?.duration).hours} hrs`}{\" \"}\r\n {getDuration(course?.duration).minutes &&\r\n `${getDuration(course?.duration).minutes} mins`}\r\n \r\n \r\n\r\n \r\n {course.noofmodules} Modules\r\n \r\n \r\n \r\n )}\r\n
\r\n );\r\n};\r\n","import PropTypes from \"prop-types\";\r\nimport { Checkbox as CheckboxChakraui } from \"@chakra-ui/checkbox\";\r\nimport { forwardRef } from \"react\";\r\n\r\nexport const Checkbox = forwardRef(({ id, label, isChecked, ...rest }, ref) => {\r\n return (\r\n - \r\n
{link.text}
\r\n{query}\r\n
\r\n {data?.map((comment) => (\r\n
\r\n );\r\n};\r\n\r\nconst AnswerListItem = ({\r\n comment,\r\n commentCardHandlers,\r\n deleteStatusIsLoading,\r\n expStatusIsLoading,\r\n}) => {\r\n const [displayReplies, setDisplayReplies] = useState(false);\r\n console.log(comment);\r\n\r\n const handleDisplayRepliesToggle = () => setDisplayReplies((prev) => !prev);\r\n\r\n return (\r\n <>\r\n \r\n \r\n Purchased videos\r\n \r\n {videos.loading ? (\r\n \r\n {!main || main?.length === 0 ? (\r\n \r\n )}\r\n
\r\n );\r\n };\r\n const BookPage = () => {\r\n const { books } = useBooks();\r\n const main = books?.data?.filter((dat) => dat.isPurchased === true);\r\n console.log(main);\r\n\r\n return (\r\n \r\n \r\n Purchased Books\r\n \r\n {books.loading ? (\r\n \r\n {!main || main?.length === 0 ? (\r\n \r\n )}\r\n
\r\n \r\n \r\n Purchased Audios\r\n \r\n {audio.loading ? (\r\n \r\n {!main || main?.length === 0 ? (\r\n \r\n )}\r\n
\r\n );\r\n };\r\n return (\r\n \r\n \r\n \r\n \r\n {course.title}\r\n \r\n \r\n \r\n {course.instructor && (\r\n \r\n \r\n \r\n {/*\r\n By {course.instructor.name}\r\n \r\n \r\n \r\n \r\n )}\r\n\r\n \r\n \r\n {course.reviews.length === 0 ? (\r\n \r\n \r\n \r\n Rate this course\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n {course.ratingsTotal / course.ratingsCount}\r\n \r\n ({course.ratingsCount}) \r\n \r\n )}\r\n \r\n \r\n\r\n \r\n \r\n ₦{formatPriceToNaira(course?.discountedPrice)}\r\n \r\n\r\n {course.price && (\r\n \r\n ₦{formatPriceToNaira(course?.price)}\r\n \r\n )}\r\n \r\n
\r\n );\r\n\r\n return (\r\n \r\n \r\n {truncateText(cat.categoryName, 12)}\r\n \r\n
\r\n ))}\r\n \r\n );\r\n};\r\n","import { Box, Flex } from \"@chakra-ui/react\";\r\nimport { Skeleton } from \"@chakra-ui/skeleton\";\r\nimport { useCallback, useEffect } from \"react\";\r\nimport { Route } from \"react-router-dom\";\r\nimport {\r\n Button,\r\n CourseOverviewCard,\r\n Heading,\r\n ScrollCarousel,\r\n Text,\r\n} from \"../../components\";\r\nimport { GeneralCourseProductCard } from \"../../components/Cards/GeneralCourseCard\";\r\nimport { useApp } from \"../../contexts\";\r\nimport { useFetch } from \"../../hooks\";\r\nimport {\r\n userGetCompletedCourses,\r\n userGetCourseListing,\r\n userGetMyCourseListing,\r\n userGetOngoingCourses,\r\n userGetPurchasedCourses,\r\n} from \"../../services\";\r\nimport {\r\n pageWrapperSpacing_userPages,\r\n sectionMaxWidth_userPages,\r\n} from \"../../theme/breakpoints\";\r\nimport { createRange } from \"../../utils\";\r\n\r\n// export const useGetallCouses = (\r\n// params = {\r\n// ongoing: true,\r\n// limit: 100,\r\n// }\r\n// ) => {\r\n// const { resource: myCourses, handleFetchResource } = useFetch();\r\n\r\n// const handleFetch = useCallback(async () => {\r\n// handleFetchResource({\r\n// fetcher: async () => {\r\n// const { courses } = await userGetAllCourses(params);\r\n\r\n// return courses;\r\n// },\r\n// });\r\n\r\n// // eslint-disable-next-line react-hooks/exhaustive-deps\r\n// }, [handleFetchResource]);\r\n\r\n// useEffect(() => {\r\n// handleFetch();\r\n// }, [handleFetch]);\r\n\r\n// return {\r\n// myCourses,\r\n// handleFetchMyCourses: handleFetch,\r\n// };\r\n\r\n// };\r\n\r\nexport const useMyCourses = (\r\n params = {\r\n ongoing: true,\r\n limit: 100,\r\n }\r\n) => {\r\n const { resource: myCourses, handleFetchResource } = useFetch();\r\n\r\n const handleFetch = useCallback(async () => {\r\n handleFetchResource({\r\n fetcher: async () => {\r\n const { courses } = await userGetMyCourseListing(params);\r\n const publishedCourses = courses.filter(\r\n (course) => course.isPublished === true\r\n );\r\n\r\n return publishedCourses;\r\n },\r\n });\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [handleFetchResource]);\r\n\r\n useEffect(() => {\r\n handleFetch();\r\n }, [handleFetch]);\r\n\r\n return {\r\n myCourses,\r\n handleFetchMyCourses: handleFetch,\r\n };\r\n};\r\nexport const useOnGoingCourses = (\r\n params = {\r\n ongoing: true,\r\n limit: 100,\r\n }\r\n) => {\r\n const { resource: myCourses, handleFetchResource } = useFetch();\r\n\r\n const handleFetch = useCallback(async () => {\r\n handleFetchResource({\r\n fetcher: async () => {\r\n const { courses } = await userGetOngoingCourses(params);\r\n const publishedCourses = courses.filter(\r\n (course) => course.isPublished === true\r\n );\r\n\r\n return publishedCourses;\r\n },\r\n });\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [handleFetchResource]);\r\n\r\n useEffect(() => {\r\n handleFetch();\r\n }, [handleFetch]);\r\n\r\n return {\r\n myCourses,\r\n handleFetchMyCourses: handleFetch,\r\n };\r\n};\r\nexport const usePurchasedCourses = (\r\n params = {\r\n ongoing: true,\r\n limit: 100,\r\n }\r\n) => {\r\n const { resource: myCourses, handleFetchResource } = useFetch();\r\n\r\n const handleFetch = useCallback(async () => {\r\n handleFetchResource({\r\n fetcher: async () => {\r\n const { courses } = await userGetPurchasedCourses(params);\r\n const publishedCourses = courses.filter(\r\n (course) => course.isPublished === true\r\n );\r\n\r\n return publishedCourses;\r\n },\r\n });\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [handleFetchResource]);\r\n\r\n useEffect(() => {\r\n handleFetch();\r\n }, [handleFetch]);\r\n\r\n return {\r\n myCourses,\r\n handleFetchMyCourses: handleFetch,\r\n };\r\n};\r\nexport const useCompletedCourses = (\r\n params = {\r\n completed: true,\r\n limit: 100,\r\n }\r\n) => {\r\n const { resource: myCourses, handleFetchResource } = useFetch();\r\n\r\n const handleFetch = useCallback(async () => {\r\n handleFetchResource({\r\n fetcher: async () => {\r\n const { courses } = await userGetCompletedCourses(params);\r\n const publishedCourses = courses.filter(\r\n (course) => course.isPublished === true\r\n );\r\n\r\n return publishedCourses;\r\n },\r\n });\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [handleFetchResource]);\r\n\r\n useEffect(() => {\r\n handleFetch();\r\n }, [handleFetch]);\r\n\r\n return {\r\n myCourses,\r\n handleFetchMyCourses: handleFetch,\r\n };\r\n};\r\n\r\nexport const useCourseListing = (\r\n params\r\n // path // TODO: might add path to the same service, since the response signature is same\r\n) => {\r\n const { resource: courseListing, handleFetchResource } = useFetch();\r\n\r\n const handleFetch = useCallback(async () => {\r\n handleFetchResource({\r\n fetcher: async () => {\r\n const { courses } = await userGetCourseListing(params);\r\n\r\n return courses;\r\n },\r\n });\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [handleFetchResource]);\r\n\r\n useEffect(() => {\r\n handleFetch();\r\n }, [handleFetch]);\r\n\r\n return {\r\n courseListing,\r\n handleFetchCourseListing: handleFetch,\r\n };\r\n};\r\n\r\nconst HomePage = () => {\r\n const {\r\n state: { user },\r\n } = useApp();\r\n\r\n const { myCourses, handleFetchMyCourses } = usePurchasedCourses();\r\n return (\r\n \r\n {isLoading ? (\r\n \r\n ) : (\r\n \r\n \r\n \r\n {layout2 ? (\r\n \r\n \r\n \r\n {course.title}\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n \r\n {course.title}\r\n \r\n \r\n {course.title}\r\n \r\n \r\n \r\n )}\r\n\r\n \r\n \r\n \r\n \r\n By {course.instructor.name}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {!isNaN(course.progress) && (\r\n \r\n \r\n \r\n \r\n {course.progress}%\r\n \r\n )}\r\n\r\n \r\n {course?.reviews?.length === 0 ? (\r\n \r\n \r\n \r\n Rate this course\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n {course.ratingsTotal / course.ratingsCount}\r\n \r\n ({course.ratingsCount}) \r\n \r\n )}\r\n \r\n \r\n \r\n {course.noofmodules} Modules\r\n \r\n \r\n\r\n {catItems\r\n ?.filter((cat) => cat.id === course.categoryId)\r\n .map((cat) => (\r\n
\r\n );\r\n};\r\n","import { Box, Flex } from \"@chakra-ui/react\";\r\nimport { Fragment } from \"react\";\r\nimport { Route } from \"react-router-dom\";\r\nimport {\r\n useMyCourses,\r\n usePurchasedCourses,\r\n useCompletedCourses,\r\n useOnGoingCourses,\r\n} from \".\";\r\nimport { Button, CourseOverviewCard, Heading, Tabs } from \"../../components\";\r\nimport { CourseOverviewCard2 } from \"../../components/Cards/CourseOverviewCard2\";\r\nimport { EmptyState } from \"../../layouts\";\r\nimport { pageWrapperSpacing_userPages } from \"../../theme/breakpoints\";\r\nimport { createRange } from \"../../utils\";\r\n\r\nconst MyCoursesPage = () => {\r\n return (\r\n \r\n \r\n {truncateText(cat.categoryName, 12)}\r\n \r\n
\r\n ))}\r\n \r\n )}\r\n \r\n \r\n {courses &&\r\n courses.map((course, index) => (\r\n \r\n\r\n {err && (\r\n Try Again}\r\n heading=\"Oops An Error Occurred\"\r\n description=\"An unexpected error occurred, please try again later\"\r\n />\r\n )}\r\n
\r\n);\r\n\r\nexport const CourseListingGridLayout2 = ({\r\n courses,\r\n err,\r\n loading,\r\n onErrRetry,\r\n renderCard,\r\n}) => (\r\n \r\n {renderCard ? (\r\n {renderCard(course)} \r\n ) : (\r\n
\r\n ))}\r\n\r\n {loading &&\r\n createRange(8).map((i) => (\r\n \r\n \r\n {courses &&\r\n courses.map((course) => (\r\n Try Again}\r\n heading=\"Oops An Error Occurred\"\r\n description=\"An unexpected error occurred, please try again later\"\r\n />\r\n )}\r\n
\r\n);\r\n\r\nexport const MyCoursesPageRoute = ({ ...rest }) => {\r\n return \r\n {renderCard ? (\r\n {renderCard(course)} \r\n ) : (\r\n
\r\n ))}\r\n\r\n {loading &&\r\n createRange(8).map((i) => (\r\n All Categories
\r\n{item?.categoryName}
\r\n ))}\r\n \r\n\r\n {item.currentprice}\r\n
\r\n\r\n {item.prevprice}\r\n
\r\n \r\n \r\n \r\n ))}\r\n */}\r\n {categoryId ?\r\n NGN {item.price}\r\n
\r\n\r\n Please follow the instructions in the email.\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n 
\r\n
\r\n \r\n
\r\n \r\n 
\r\n
\r\n CREM E-LEARNING
\r\n\r\n
\r\n Certificate of Completion
\r\nThis is to proudly certify that
\r\n\r\n
\r\n {name}
\r\n \r\n\r\n has fullfilled all the neccessary requirements requested for\r\n
\r\n\r\n
\r\n {title}
\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default ProgressBar;\r\n","import { useState } from \"react\";\r\nimport Star from \"../Star\";\r\nimport { Flex } from \"@chakra-ui/react\";\r\nimport ProgressBar from \"../ProgressBar\";\r\nfunction StarRating({ onChange, rating, setRating }) {\r\n const changeRating = (newRating) => {\r\n setRating(newRating);\r\n onChange?.(newRating);\r\n };\r\n const testData = { bgcolor: \"red\", completed: rating * 20 };\r\n\r\n return (\r\n <>\r\n \r\n {`${completed}%`}\r\n
\r\n - \r\n
- \r\n
\r\n {myCourses?.data\r\n ?.filter((item) => {\r\n const searchTerm = value?.toLowerCase();\r\n const fullName = item?.title?.toLowerCase();\r\n\r\n return (\r\n searchTerm &&\r\n fullName.startsWith(searchTerm) &&\r\n fullName !== searchTerm\r\n );\r\n })\r\n .slice(0, 10)\r\n .map((item) => (\r\n onSearch(item.full_name)}\r\n className=\"dropdown-row\"\r\n key={item.fullName}\r\n >\r\n {item.fullName}\r\n
\r\n ))}\r\n \r\n\r\n \r\n );\r\n};\r\n\r\nSearchBar.propTypes = {\r\n adminLayoutHeaderStyle: PropTypes.bool,\r\n placeholder: PropTypes.string,\r\n sm: PropTypes.bool,\r\n fontSize: PropTypes.string,\r\n onSearch: PropTypes.func,\r\n onClear: PropTypes.func,\r\n onClick: PropTypes.func,\r\n};\r\n","import { Stack } from \"@chakra-ui/layout\";\r\nimport { Skeleton } from \"@chakra-ui/skeleton\";\r\nimport PropTypes from \"prop-types\";\r\n\r\nexport const SkeletonText = ({\r\n numberOfLines = 2,\r\n height = \"10px\",\r\n spacing = 2,\r\n ...rest\r\n}) => {\r\n const lines = Array(numberOfLines - 1).fill();\r\n\r\n return (\r\n history.goBack()}>\r\n }>\r\n {isExamination ? \"Examination\" : \"Quiz\"}\r\n \r\n
\r\n