mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
feat: format with prettier
This commit is contained in:
swve
parent
03fb09c3d6
commit
a147ad6610
164 changed files with 11257 additions and 8154 deletions
|
|
@ -1,76 +1,95 @@
|
|||
'use client';
|
||||
import { useOrg } from '@components/Contexts/OrgContext';
|
||||
import { getAPIUrl, getUriWithOrg } from '@services/config/config';
|
||||
import { removeCourse } from '@services/courses/activity';
|
||||
import { getCourseThumbnailMediaDirectory } from '@services/media/media';
|
||||
import { revalidateTags } from '@services/utils/ts/requests';
|
||||
import Link from 'next/link';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useEffect } from 'react';
|
||||
import { mutate } from 'swr';
|
||||
'use client'
|
||||
import { useOrg } from '@components/Contexts/OrgContext'
|
||||
import { getAPIUrl, getUriWithOrg } from '@services/config/config'
|
||||
import { removeCourse } from '@services/courses/activity'
|
||||
import { getCourseThumbnailMediaDirectory } from '@services/media/media'
|
||||
import { revalidateTags } from '@services/utils/ts/requests'
|
||||
import Link from 'next/link'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import { useEffect } from 'react'
|
||||
import { mutate } from 'swr'
|
||||
|
||||
interface TrailCourseElementProps {
|
||||
course: any
|
||||
run: any
|
||||
orgslug: string
|
||||
course: any
|
||||
run: any
|
||||
orgslug: string
|
||||
}
|
||||
|
||||
function TrailCourseElement(props: TrailCourseElementProps) {
|
||||
const org = useOrg() as any;
|
||||
const courseid = props.course.course_uuid.replace("course_", "")
|
||||
const course = props.course
|
||||
const router = useRouter();
|
||||
const course_total_steps = props.run.course_total_steps
|
||||
const course_completed_steps = props.run.steps.length
|
||||
const orgID = org?.id;
|
||||
const course_progress = Math.round((course_completed_steps / course_total_steps) * 100)
|
||||
const org = useOrg() as any
|
||||
const courseid = props.course.course_uuid.replace('course_', '')
|
||||
const course = props.course
|
||||
const router = useRouter()
|
||||
const course_total_steps = props.run.course_total_steps
|
||||
const course_completed_steps = props.run.steps.length
|
||||
const orgID = org?.id
|
||||
const course_progress = Math.round(
|
||||
(course_completed_steps / course_total_steps) * 100
|
||||
)
|
||||
|
||||
async function quitCourse(course_uuid: string) {
|
||||
// Close activity
|
||||
let activity = await removeCourse(course_uuid, props.orgslug);
|
||||
// Mutate course
|
||||
await revalidateTags(['courses'], props.orgslug);
|
||||
router.refresh();
|
||||
async function quitCourse(course_uuid: string) {
|
||||
// Close activity
|
||||
let activity = await removeCourse(course_uuid, props.orgslug)
|
||||
// Mutate course
|
||||
await revalidateTags(['courses'], props.orgslug)
|
||||
router.refresh()
|
||||
|
||||
// Mutate
|
||||
mutate(`${getAPIUrl()}trail/org/${orgID}/trail`);
|
||||
}
|
||||
// Mutate
|
||||
mutate(`${getAPIUrl()}trail/org/${orgID}/trail`)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
}
|
||||
, [props.course, org]);
|
||||
useEffect(() => {}, [props.course, org])
|
||||
|
||||
return (
|
||||
<div className='trailcoursebox flex p-3 bg-white rounded-xl' style={{ boxShadow: '0px 4px 7px 0px rgba(0, 0, 0, 0.03)' }}>
|
||||
|
||||
<Link href={getUriWithOrg(props.orgslug, "/course/" + courseid)}>
|
||||
<div className="course_tumbnail inset-0 ring-1 ring-inset ring-black/10 rounded-lg relative h-[50px] w-[72px] bg-cover bg-center" style={{ backgroundImage: `url(${getCourseThumbnailMediaDirectory(org.org_uuid, props.course.course_uuid, props.course.thumbnail_image)})`, boxShadow: '0px 4px 7px 0px rgba(0, 0, 0, 0.03)' }}></div>
|
||||
</Link>
|
||||
<div className="course_meta pl-5 flex-grow space-y-1">
|
||||
<div className="course_top">
|
||||
<div className="course_info flex">
|
||||
<div className="course_basic flex flex-col flex-end -space-y-2">
|
||||
<p className='p-0 font-bold text-sm text-gray-700'>Course</p>
|
||||
<div className="course_progress flex items-center space-x-2">
|
||||
<h2 className='font-bold text-xl'>{course.name}</h2>
|
||||
<div className='bg-slate-300 rounded-full w-[10px] h-[5px]'></div>
|
||||
<h2>{course_progress}%</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div className="course_actions flex-grow flex flex-row-reverse">
|
||||
<button onClick={() => quitCourse(course.course_uuid)} className="bg-red-200 text-red-700 hover:bg-red-300 rounded-full text-xs h-5 px-2 font-bold">Quit Course</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="course_progress indicator w-full">
|
||||
<div className="w-full bg-gray-200 rounded-full h-1.5 ">
|
||||
<div className={`bg-teal-600 h-1.5 rounded-full`} style={{ width: `${course_progress}%` }} ></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
return (
|
||||
<div
|
||||
className="trailcoursebox flex p-3 bg-white rounded-xl"
|
||||
style={{ boxShadow: '0px 4px 7px 0px rgba(0, 0, 0, 0.03)' }}
|
||||
>
|
||||
<Link href={getUriWithOrg(props.orgslug, '/course/' + courseid)}>
|
||||
<div
|
||||
className="course_tumbnail inset-0 ring-1 ring-inset ring-black/10 rounded-lg relative h-[50px] w-[72px] bg-cover bg-center"
|
||||
style={{
|
||||
backgroundImage: `url(${getCourseThumbnailMediaDirectory(
|
||||
org.org_uuid,
|
||||
props.course.course_uuid,
|
||||
props.course.thumbnail_image
|
||||
)})`,
|
||||
boxShadow: '0px 4px 7px 0px rgba(0, 0, 0, 0.03)',
|
||||
}}
|
||||
></div>
|
||||
</Link>
|
||||
<div className="course_meta pl-5 flex-grow space-y-1">
|
||||
<div className="course_top">
|
||||
<div className="course_info flex">
|
||||
<div className="course_basic flex flex-col flex-end -space-y-2">
|
||||
<p className="p-0 font-bold text-sm text-gray-700">Course</p>
|
||||
<div className="course_progress flex items-center space-x-2">
|
||||
<h2 className="font-bold text-xl">{course.name}</h2>
|
||||
<div className="bg-slate-300 rounded-full w-[10px] h-[5px]"></div>
|
||||
<h2>{course_progress}%</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div className="course_actions flex-grow flex flex-row-reverse">
|
||||
<button
|
||||
onClick={() => quitCourse(course.course_uuid)}
|
||||
className="bg-red-200 text-red-700 hover:bg-red-300 rounded-full text-xs h-5 px-2 font-bold"
|
||||
>
|
||||
Quit Course
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
<div className="course_progress indicator w-full">
|
||||
<div className="w-full bg-gray-200 rounded-full h-1.5 ">
|
||||
<div
|
||||
className={`bg-teal-600 h-1.5 rounded-full`}
|
||||
style={{ width: `${course_progress}%` }}
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default TrailCourseElement
|
||||
export default TrailCourseElement
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue