From 57b2bf83eaebdfb79a1cd708c744fdceba248d50 Mon Sep 17 00:00:00 2001 From: Rushikesh-Sonawane99 Date: Fri, 29 Nov 2024 12:28:58 +0530 Subject: [PATCH] Issue #PS-000 chore: Added TOC for course planner in admin app --- src/components/ResourceCard.tsx | 10 +- src/components/RouteGuard.tsx | 3 +- src/pages/course-hierarchy/[identifier].tsx | 121 ++++++++++++++++++++ src/pages/resourceList.tsx | 6 +- src/services/coursePlanner.ts | 23 +++- src/utils/url.config.ts | 1 + 6 files changed, 153 insertions(+), 11 deletions(-) create mode 100644 src/pages/course-hierarchy/[identifier].tsx diff --git a/src/components/ResourceCard.tsx b/src/components/ResourceCard.tsx index 58056f9d..1fd4c954 100644 --- a/src/components/ResourceCard.tsx +++ b/src/components/ResourceCard.tsx @@ -8,7 +8,7 @@ import { fetchContent } from "@/services/PlayerService"; interface ResourceCardProps { title: string; // type: string; - // resource: string; + resource: string; identifier: string; appIcon?: string; } @@ -16,7 +16,7 @@ interface ResourceCardProps { const ResourceCard: React.FC = ({ title, // type, - // resource, + resource, identifier, appIcon, }) => { @@ -42,7 +42,11 @@ const ResourceCard: React.FC = ({ const openPlayers = () => { sessionStorage.setItem("previousPage", window.location.href); - router.push(`/play/content/${identifier}`); + if (resource === "Course") { + router.push(`/course-hierarchy/${identifier}`); + } else { + router.push(`/play/content/${identifier}`); + } }; return ( diff --git a/src/components/RouteGuard.tsx b/src/components/RouteGuard.tsx index f7f5e025..0b6c68fa 100644 --- a/src/components/RouteGuard.tsx +++ b/src/components/RouteGuard.tsx @@ -59,7 +59,8 @@ const RouteGuard: React.FC<{ children: React.ReactNode }> = ({ children }) => { "/csvDetails", "/csvList", "/play", - "/edit-password" + "/edit-password", + "/course-hierarchy" ]; const isCoursePlannerContent = coursePlannerPaths.some((path) => diff --git a/src/pages/course-hierarchy/[identifier].tsx b/src/pages/course-hierarchy/[identifier].tsx new file mode 100644 index 00000000..c6396718 --- /dev/null +++ b/src/pages/course-hierarchy/[identifier].tsx @@ -0,0 +1,121 @@ +import React, { useEffect, useState } from 'react'; +import { + Accordion, + AccordionSummary, + AccordionDetails, + Typography, + Link, + Box, +} from '@mui/material'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; +import { getContentHierarchy } from '@/services/coursePlanner'; +import { useRouter } from 'next/router'; +import Loader from '@/components/Loader'; + +const RecursiveAccordion = ({ data }: { data: any[] }) => { + let router = useRouter(); + + const renderAccordion = (nodes: any[], level = 0) => { + return nodes.map((node, index) => ( + + {level === 0 ? ( + <> + {/* Render level 0 name as heading */} + + {node.name} + + {/* Render children as accordions */} + {node.children && renderAccordion(node.children, level + 1)} + + ) : node.contentType === 'Resource' ? ( + + router.push(`/play/content/${node?.identifier || node?.id}`) + } + > + ) : ( + + }> + + {node?.name} + + + + {/* Recursively render children */} + {node?.children && renderAccordion(node?.children, level + 1)} + + + )} + + )); + }; + + return {renderAccordion(data)}; +}; + +export default function CourseHierarchy() { + const router = useRouter(); + const [doId, setDoId] = useState(null); + const [courseHierarchyData, setCourseHierarchyData] = useState([]); + const [loading, setLoading] = useState(true); + + useEffect(() => { + if (router.query.identifier) { + setDoId(router.query.identifier as string); + } + }, [router.query.identifier]); + + useEffect(() => { + const fetchCohortHierarchy = async (doId: string): Promise => { + try { + const hierarchyResponse = await getContentHierarchy({ + doId, + }); + setLoading(true); + const hierarchyData = hierarchyResponse?.data?.result?.content; + setCourseHierarchyData([hierarchyData]); + + console.log('hierarchyData:', hierarchyData); + + return hierarchyResponse; + } catch (error) { + console.error('Error fetching solution details:', error); + throw error; + } finally { + setLoading(false); + } + }; + + if (typeof doId === 'string') { + fetchCohortHierarchy(doId); + } + }, [doId]); + + if (loading) { + return ( + + ); + } + + return ; +} \ No newline at end of file diff --git a/src/pages/resourceList.tsx b/src/pages/resourceList.tsx index 349927c0..5c736aab 100644 --- a/src/pages/resourceList.tsx +++ b/src/pages/resourceList.tsx @@ -95,7 +95,7 @@ const ResourceList = () => { @@ -118,7 +118,7 @@ const ResourceList = () => { @@ -141,7 +141,7 @@ const ResourceList = () => { diff --git a/src/services/coursePlanner.ts b/src/services/coursePlanner.ts index 4bf0e9df..8087a453 100644 --- a/src/services/coursePlanner.ts +++ b/src/services/coursePlanner.ts @@ -1,7 +1,8 @@ import { CoursePlannerMetaData, GetSolutionDetailsParams, GetTargetedSolutionsParams, GetUserProjectTemplateParams } from "@/utils/Interfaces"; -import { post } from "./RestClient"; +import { get, post } from "./RestClient"; import axios from 'axios'; import { FRAMEWORK_ID } from "../../app.config"; +import { URL_CONFIG } from "@/utils/url.config"; @@ -150,7 +151,21 @@ export const uploadCoursePlanner = async (file: File, metaData: CoursePlannerMet } }; - - - + export const getContentHierarchy = async ({ + doId, + }: { + doId: string; + }): Promise => { + const apiUrl: string = `${URL_CONFIG.API.CONTENT_HIERARCHY}/${doId}`; + + try { + console.log('Request data', apiUrl); + const response = await get(apiUrl); + // console.log('response', response); + return response; + } catch (error) { + console.error('Error in getContentHierarchy Service', error); + throw error; + } + }; \ No newline at end of file diff --git a/src/utils/url.config.ts b/src/utils/url.config.ts index 61a34ae1..a2dc7780 100644 --- a/src/utils/url.config.ts +++ b/src/utils/url.config.ts @@ -10,5 +10,6 @@ export const URL_CONFIG = { HIERARCHY_API: "/action/questionset/v2/hierarchy/", QUESTIONSET_READ: "/action/questionset/v2/read/", COMPOSITE_SEARCH: '/action/composite/v3/search', + CONTENT_HIERARCHY: '/action/content/v3/hierarchy', }, };