rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: mark lectures as done

Browse source
This commit is contained in:
swve 2023-01-22 17:24:11 +01:00
parent cf7285b6f9
commit a9c3d24c62
3 changed files with 47 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

34
front/app/_orgs/[orgslug]/course/[courseid]/lecture/[lectureid]/page.tsx
View file

@ -10,6 +10,7 @@ import styled from "styled-components";
import { getCourse, getCourseMetadata } from "../../../../../../../services/courses/courses";
import VideoLecture from "@components/LectureViews/Video/Video";
import { Check } from "lucide-react";
import { maskLectureAsComplete } from "@services/courses/activity";
function LecturePage(params: any) {
const router = useRouter();
@ -32,6 +33,11 @@ function LecturePage(params: any) {
setIsLoading(false);
}
async function markLectureAsCompleteFront() {
const activity = await maskLectureAsComplete("" + lectureid, courseid, lecture.lecture_id.replace("lecture_", ""));
fetchCourseData();
}
React.useEffect(() => {
if (lectureid) {
fetchLectureData();
@ -85,10 +91,24 @@ function LecturePage(params: any) {
{lecture.type == "video" && <VideoLecture course={course} lecture={lecture} />}
<ActivityMarkerWrapper>
<button> <i><Check size={20}></Check></i> Mark as complete</button>
{course.activity.lectures_marked_complete.includes("lecture_"+lectureid) ? (
<button style={{ backgroundColor: "green" }}>
<i>
<Check size={20}></Check>
</i>{" "}
Already completed
</button>
) : (
<button onClick={markLectureAsCompleteFront}>
{" "}
<i>
<Check size={20}></Check>
</i>{" "}
Mark as complete
</button>
)}
</ActivityMarkerWrapper>
</CourseContent>
</LectureLayout>
)}
</>
@ -169,8 +189,7 @@ const ActivityMarkerWrapper = styled.div`
margin: 0 auto;
align-items: center;
button{
button {
background-color: #151515;
border: none;
padding: 18px;
@ -190,20 +209,17 @@ const ActivityMarkerWrapper = styled.div`
font-size: 16px;
letter-spacing: -0.05em;
box-shadow: 0px 13px 33px -13px rgba(0, 0, 0, 0.42);
i{
i {
margin-right: 5px;
// center the icon
display: flex;
align-items: center;
justify-content: center;
}
&:hover{
&:hover {
background-color: #000000;
}
}

7
front/services/courses/activity.ts
View file

@ -22,3 +22,10 @@ export async function closeActivity(org_id: string, activity_id: string) {
.catch((error) => console.log("error", error));
return result;
}
export async function maskLectureAsComplete(org_id: string, course_id: string, lecture_id: string) {
const result: any = await fetch(`${getAPIUrl()}activity/${org_id}/add_lecture/${course_id}/${lecture_id}`, RequestBody("POST", null))
.then((result) => result.json())
.catch((error) => console.log("error", error));
return result;
}