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: add loader to pages

Browse source
This commit is contained in:
swve 2023-05-16 23:07:08 +00:00
parent d9a9b445dd
commit e52ff60d18
7 changed files with 54 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

9
front/app/_orgs/[orgslug]/(withmenu)/collections/loading.tsx Normal file
View file

@ -0,0 +1,9 @@
import PageLoading from "@components/Pages/PageLoading";
export default function Loading() {
// Or a custom loading skeleton component
return (
<PageLoading></PageLoading>
)
}

3
front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/page.tsx
View file

@ -9,6 +9,7 @@ import useSWR, { mutate } from "swr";
import { swrFetcher } from "@services/utils/ts/requests";
import { useRouter } from "next/navigation";
import ToolTip from "@components/UI/Tooltip/Tooltip";
import PageLoading from "@components/Pages/PageLoading";
const CourseIdPage = (params: any) => {
const courseid = params.params.courseid;
@ -41,7 +42,7 @@ const CourseIdPage = (params: any) => {
<>
{error && <p>Failed to load</p>}
{!course ? (
<div>Loading...</div>
<PageLoading></PageLoading>
) : (
<CoursePageLayout>
<br></br>

9
front/app/_orgs/[orgslug]/(withmenu)/courses/loading.tsx Normal file
View file

@ -0,0 +1,9 @@
import PageLoading from "@components/Pages/PageLoading";
export default function Loading() {
// Or a custom loading skeleton component
return (
<PageLoading></PageLoading>
)
}

8
front/app/_orgs/[orgslug]/(withmenu)/loading.tsx Normal file
View file

@ -0,0 +1,8 @@
import PageLoading from "@components/Pages/PageLoading";
export default function Loading() {
return (
<PageLoading></PageLoading>
)
}

7
front/app/_orgs/[orgslug]/(withmenu)/page.tsx
View file

@ -1,4 +1,5 @@
// export const runtime = 'edge';
export const dynamic = 'force-dynamic';
import { Menu } from "@components/UI/Elements/Menu";
import { getBackendUrl, getUriWithOrg } from "@services/config/config";
import { getOrgCourses } from "@services/courses/courses";
@ -12,6 +13,9 @@ import { getOrgCollections } from "@services/courses/collections";
const OrgHomePage = async (params: any) => {
const orgslug = params.params.orgslug;
// timeout to simulate a slow connection
// await new Promise((resolve) => setTimeout(resolve, 12000));
const courses = await getOrgCourses(orgslug);
const collections = await getOrgCollections();
@ -24,6 +28,7 @@ const OrgHomePage = async (params: any) => {
<div>
<div className="max-w-7xl mx-auto px-4 py-10">
{/* Collections */}
<Title title="Collections" type="col" />

3
front/app/_orgs/[orgslug]/(withmenu)/trail/page.tsx
View file

@ -1,4 +1,5 @@
"use client";
import PageLoading from "@components/Pages/PageLoading";
import { getAPIUrl, getBackendUrl } from "@services/config/config";
import { swrFetcher } from "@services/utils/ts/requests";
import React from "react";
@ -16,7 +17,7 @@ function Trail(params: any) {
<br />
{error && <p>Failed to load</p>}
{!trail ? (
<div>Loading...</div>
<PageLoading></PageLoading>
) : (
<div>
{trail.courses.map((course: any) => (

16
front/components/Pages/PageLoading.tsx Normal file
View file

@ -0,0 +1,16 @@
import React from 'react'
function PageLoading() {
return (
<div className="max-w-7xl mx-auto px-4 py-20">
<div className="animate-pulse mx-auto flex space-x-4">
<svg className="mx-auto" width="295" height="295" viewBox="0 0 295 295" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect opacity="0.51" x="6.5" y="6.5" width="282" height="282" rx="78.5" stroke="#454545" stroke-opacity="0.46" stroke-width="13" stroke-dasharray="11 11" />
<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="#454545" fill-opacity="0.13" />
</svg>
</div>
</div>
)
}
export default PageLoading