doneeeee

Author: Sarthakbh321

src/pages/Dashboard/Dashboard.js

@@ -9,13 +9,20 @@ const Dashboard = () => {
 	const [courses, setCourses] = useState([]);
 	const [createCourseModal, setCreateCourseModal] = useState(false);
 
+	const userType = localStorage.getItem("userType");
+
 	const Logout = () => {
 		localStorage.removeItem("authToken");
 		history.push("/");
 	};
 
 	const history = useHistory();
 
+	const handleCardClick = (c) => {
+		console.log(c);
+		history.push(`/course/${c._id}`);
+	};
+
 	useEffect(async () => {
 		axios
 			.get("https://cod-ed.herokuapp.com/course/all", {
@@ -42,12 +49,14 @@ const Dashboard = () => {
 					<img src="/assets/logo.svg" alt="" />
 				</a>
 				<span>
-					<button
-						className="create"
-						onClick={() => setCreateCourseModal(true)}
-					>
-						Create Course
-					</button>
+					{userType !== "user" ? (
+						<button
+							className="create"
+							onClick={() => setCreateCourseModal(true)}
+						>
+							Create Course
+						</button>
+					) : null}
 					<TextField
 						variant="outlined"
 						className="text-field"
@@ -64,7 +73,11 @@ const Dashboard = () => {
 				<div className="cards">
 					{courses.map((c) => {
 						return (
-							<div className="card">
+							<div
+								className="card"
+								style={{ cursor: "pointer" }}
+								onClick={(e) => handleCardClick(c)}
+							>
 								<img
 									src={c.img ? c.img : "/assets/logo.svg"}
 									alt=""

src/pages/Lessons/Lessons.js

@@ -14,6 +14,8 @@ const Lessons = () => {
 	const [createLesson, setCreateLesson] = useState(false);
 	const { id } = useParams();
 
+	const userType = localStorage.getItem("userType");
+
 	const history = useHistory();
 
 	const getCourse = async () => {
@@ -39,6 +41,18 @@ const Lessons = () => {
 	};
 
 	const handleLessonClick = (id, lesson) => {
+		console.log(lesson);
+		if (userType === "user") {
+			history.push({
+				pathname: `/student/editor/`,
+				state: {
+					details: lesson,
+				},
+			});
+
+			return;
+		}
+
 		history.push({
 			pathname: `/editor/${id}`,
 			state: {
@@ -108,12 +122,14 @@ const Lessons = () => {
 				<Container>
 					<hr class="hr-text" data-content="LESSONS" />
 					<div className="lesson-action-bar">
-						<button
-							className="create-lesson"
-							onClick={() => setCreateLesson(true)}
-						>
-							Create Lesson
-						</button>
+						{userType !== "user" ? (
+							<button
+								className="create-lesson"
+								onClick={() => setCreateLesson(true)}
+							>
+								Create Lesson
+							</button>
+						) : null}
 					</div>
 					<List style={{ marginTop: "30px" }}>
 						{lessons.map((lesson) => (

src/pages/StudentEditor/StudentEditor.js

@@ -14,19 +14,23 @@ import { Link } from "react-router-dom";
 import CodeResult from "../../components/CodeResult/CodeResult";
 import { languageMap, monacoMap } from "../../utils/languages";
 import { getOutput, getToken } from "../../utils/codeRunning";
+import { motion } from "framer-motion";
 
-const StudentEditor = () => {
+const StudentEditor = (props) => {
+	const lesson = props.location.state.details;
 	const [srcDoc, setSrcDoc] = useState("");
 	const [code, setCode] = useState("");
-	const [stream, setStream] = useState([]);
+	const [stream, setStream] = useState(lesson.events);
 	const [isPlaying, setIsPlaying] = useState(false);
 	const [lastPaused, setLastPaused] = useState(0);
 	const [output, setOutput] = useState("");
 
-	const [languageId, setLanguageId] = useState(54);
-	const [language, setLanguage] = useState(languageMap[languageId]);
+	const [languageId, setLanguageId] = useState(lesson.language);
+	const [language, setLanguage] = useState(languageMap[lesson.language]);
 	const [codeLoading, setCodeLoading] = useState(false);
 
+	const videoRef = useRef();
+
 	// const {
 	// 	status,
 	// 	startRecording,
@@ -63,6 +67,8 @@ const StudentEditor = () => {
 			window.clearTimeout(id);
 		});
 
+		videoRef.current.pause();
+
 		// let index = stream.length - timeouts.length;
 		// console.log(index, stream.length, timeouts.length);
 		// setLastPaused(index);
@@ -89,6 +95,8 @@ const StudentEditor = () => {
 
 			setTimeoutIds((prevState) => [...prevState, id]);
 		}
+
+		videoRef.current.play();
 	};
 
 	const handleChange = (e) => {
@@ -147,6 +155,14 @@ const StudentEditor = () => {
 							onChange={handleChange}
 							ref={inputRef}
 						/>
+						<motion.div className="video-div" drag dragMomentum={0}>
+							<video
+								src={lesson.video}
+								width="200px"
+								height="150px"
+								ref={videoRef}
+							/>
+						</motion.div>
 					</Grid>
 
 					<Grid item md={1} className="middle-row">