fernando
/
eeg_certs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[FE][Certs] Fixes #15: Handle error of loading courses list

master
Araozu 2023-12-15 15:26:50 -05:00
parent 16efa06639
commit fc411f4ec2
1 changed files with 25 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/certs/index.tsx
View File

@ -1,4 +1,4 @@
import { JSX, Resource, createContext, createMemo, createResource, createSignal, useContext } from "solid-js"; import { JSX, Resource, Show, createContext, createMemo, createResource, createSignal, useContext } from "solid-js";
import { NewRegister } from "./NewRegister"; import { NewRegister } from "./NewRegister";
import { Registers } from "./Registers"; import { Registers } from "./Registers";
import { Search } from "./Search"; import { Search } from "./Search";
@ -13,15 +13,17 @@ export function Certs() {
const [courses] = createResource(fetchAllCourses); const [courses] = createResource(fetchAllCourses);
const coursesReady = createMemo(() => courses.state === "ready"); const coursesReady = createMemo(() => courses.state === "ready");
const coursesLoading = createMemo(() => courses.state === "pending");
return ( return (
<> <>
<div class={`top-0 left-0 w-screen h-1 ${coursesReady() ? "hidden" : "fixed"}`}> <div class={`top-0 left-0 w-screen h-1 ${coursesLoading() ? "fixed" : "hidden"}`}>
<div class='h-1 w-full bg-c-on-primary overflow-hidden'> <div class='h-1 w-full bg-c-on-primary overflow-hidden'>
<div class='progress w-full h-full bg-c-primary left-right' /> <div class='progress w-full h-full bg-c-primary left-right' />
</div> </div>
</div> </div>
<CoursesProvider courses={courses}> <CoursesProvider courses={courses}>
<Show when={courses.state !== "errored"}>
<div class={`grid grid-cols-[16rem_25rem_1fr] ${coursesReady() ? "" : "opacity-25"}`}> <div class={`grid grid-cols-[16rem_25rem_1fr] ${coursesReady() ? "" : "opacity-25"}`}>
<Search setPerson={setPerson} /> <Search setPerson={setPerson} />
<NewRegister <NewRegister
@ -30,7 +32,20 @@ export function Certs() {
/> />
<Registers person={person()} count={count()} /> <Registers person={person()} count={count()} />
</div> </div>
</Show>
</CoursesProvider> </CoursesProvider>
<Show when={courses.state === "errored"}>
<div>
<div class="p-2 m-8 text-c-on-error bg-c-error rounded-md">
Error al cargar recursos vitales del sistema (lista de cursos)
<br />
Recargue la página para intentar de nuevo
<br />
<br />
{courses.error?.message}
</div>
</div>
</Show>
</> </>
); );
} }