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: refactor + home improvements

Browse source
This commit is contained in:
swve 2023-09-21 17:55:28 +02:00
parent 832394777e
commit ebb8c64fd7
8 changed files with 187 additions and 115 deletions
Download patch file Download diff file Expand all files Collapse all files

87
front/app/orgs/[orgslug]/(withmenu)/page.tsx
View file

@ -1,20 +1,20 @@
export const dynamic = 'force-dynamic';
import { Metadata, ResolvingMetadata } from 'next';
import { getBackendUrl, getUriWithOrg } from "@services/config/config";
import { getCourse, getOrgCourses, getOrgCoursesWithAuthHeader } from "@services/courses/courses";
import { Metadata } from 'next';
import { getUriWithOrg } from "@services/config/config";
import { getOrgCoursesWithAuthHeader } from "@services/courses/courses";
import Link from "next/link";
import Image from "next/image";
import { getOrgCollections, getOrgCollectionsWithAuthHeader } from "@services/courses/collections";
import { getOrgCollectionsWithAuthHeader } from "@services/courses/collections";
import { getOrganizationContextInfo } from '@services/organizations/orgs';
import { cookies } from 'next/headers';
import GeneralWrapperStyled from '@components/StyledElements/Wrappers/GeneralWrapper';
import TypeOfContentTitle from '@components/StyledElements/Titles/TypeOfContentTitle';
import { getCourseThumbnailMediaDirectory } from '@services/media/media';
import { getAccessTokenFromRefreshTokenCookie, getNewAccessTokenUsingRefreshTokenServer } from '@services/auth/auth';
import { getAccessTokenFromRefreshTokenCookie } from '@services/auth/auth';
import CourseThumbnail from '@components/Objects/Other/CourseThumbnail';
import CollectionThumbnail from '@components/Objects/Other/CollectionThumbnail';
import AuthenticatedClientElement from '@components/Security/AuthenticatedClientElement';
import { Plus, PlusCircle } from 'lucide-react';
import NewCourseButton from '@components/StyledElements/Buttons/NewCourseButton';
import NewCollectionButton from '@components/StyledElements/Buttons/NewCollectionButton';
type MetadataProps = {
params: { orgslug: string };
@ -56,40 +56,85 @@ const OrgHomePage = async (params: any) => {
const access_token = await getAccessTokenFromRefreshTokenCookie(cookieStore)
const courses = await getOrgCoursesWithAuthHeader(orgslug, { revalidate: 0, tags: ['courses'] }, access_token ? access_token : null);
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] });
const org_id = org.org_id;
const collections = await getOrgCollectionsWithAuthHeader(org.org_id, access_token ? access_token : null, { revalidate: 0, tags: ['courses'] });
// function to remove "course_" from the course_id
function removeCoursePrefix(course_id: string) {
return course_id.replace("course_", "");
}
function removeCollectionPrefix(collection_id: string) {
return collection_id.replace("collection_", "");
}
return (
<div>
<GeneralWrapperStyled>
{/* Collections */}
<TypeOfContentTitle title="Collections" type="col" />
<div className='flex items-center '>
<div className='flex grow'>
<TypeOfContentTitle title="Collections" type="col" />
</div>
<AuthenticatedClientElement checkMethod='roles' orgId={org_id}>
<Link href={getUriWithOrg(orgslug, "/collections/new")}>
<NewCollectionButton />
</Link>
</AuthenticatedClientElement>
</div>
<div className="home_collections flex flex-wrap">
{collections.map((collection: any) => (
<div className="flex flex-col py-3 px-3" key={collection.collection_id}>
<CollectionThumbnail collection={collection} orgslug={orgslug} org_id={org.org_id} />
</div>
))}
{collections.length == 0 &&
<div className="flex mx-auto h-[100px]">
<div className="flex flex-col justify-center text-center items-center space-y-3">
<div className="flex flex-col space-y-3">
<div className='mx-auto'>
<svg width="50" height="50" viewBox="0 0 295 295" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="0.51" x="10" y="10" width="275" height="275" rx="75" stroke="#4B5564" stroke-opacity="0.15" stroke-width="20" />
<path d="M135.8 200.8V130L122.2 114.6L135.8 110.4V102.8L122.2 87.4L159.8 76V200.8L174.6 218H121L135.8 200.8Z" fill="#4B5564" fill-opacity="0.08" />
</svg>
</div>
<div className="space-y-0">
<h1 className="text-xl font-bold text-gray-600">No collections yet</h1>
<p className="text-md text-gray-400">Create a collection to group courses together</p>
</div>
</div>
</div>
</div>
}
</div>
{/* Courses */}
<div className='h-5'></div>
<TypeOfContentTitle title="Courses" type="cou" />
<div className='flex items-center '>
<div className='flex grow'>
<TypeOfContentTitle title="Courses" type="cou" />
</div>
<AuthenticatedClientElement checkMethod='roles' orgId={org_id}>
<Link href={getUriWithOrg(orgslug, "/courses?new=true")}>
<NewCourseButton />
</Link>
</AuthenticatedClientElement>
</div>
<div className="home_courses flex flex-wrap">
{courses.map((course: any) => (
<div className="py-3 px-3" key={course.course_id}>
<CourseThumbnail course={course} orgslug={orgslug} />
</div>
))}
{courses.length == 0 &&
<div className="flex mx-auto h-[300px]">
<div className="flex flex-col justify-center text-center items-center space-y-3">
<div className="flex flex-col space-y-3">
<div className='mx-auto'>
<svg width="50" height="50" viewBox="0 0 295 295" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="0.51" x="10" y="10" width="275" height="275" rx="75" stroke="#4B5564" stroke-opacity="0.15" stroke-width="20" />
<path d="M135.8 200.8V130L122.2 114.6L135.8 110.4V102.8L122.2 87.4L159.8 76V200.8L174.6 218H121L135.8 200.8Z" fill="#4B5564" fill-opacity="0.08" />
</svg>
</div>
<div className="space-y-0">
<h1 className="text-xl font-bold text-gray-600">No courses yet</h1>
<p className="text-md text-gray-400">Create a course to add content</p>
</div>
</div>
</div>
</div>
}
</div>
</GeneralWrapperStyled>
</div>