[Classroom][FE] Fixes #5 Don't show duplicate entries

This commit is contained in:
Araozu 2023-10-06 10:53:54 -05:00
parent b72026a93f
commit d30a75697b
2 changed files with 19 additions and 12 deletions

View File

@ -8,7 +8,7 @@ export function ClassroomRegistration(props: {
surname_first_letter: string, userId: number | null,
onSuccess: () => void,
}) {
const [selections, setSelections] = createSignal<Array<ClassroomCourseValue>>([]);
const [selections, setSelections] = createSignal<Set<ClassroomCourseValue>>(new Set());
return (
<div class="h-screen overflow-y-scroll">
@ -17,7 +17,7 @@ export function ClassroomRegistration(props: {
<div class="bg-c-surface p-4 h-[23rem]">
<ManualClassroomRegistration
onAdd={(x) => setSelections((s) => ([...s, x]))}
onAdd={(x) => setSelections((s) => new Set([...s, x]))}
/>
</div>
</FilledCard>
@ -26,9 +26,14 @@ export function ClassroomRegistration(props: {
surname_first_letter={props.surname_first_letter}
userId={props.userId}
selections={selections()}
deleteRegister={(course_key) => setSelections((course) => course.filter((v) => v !== course_key))}
deleteRegister={(course_key) => {
setSelections((prevSet) => {
prevSet.delete(course_key as ClassroomCourseValue);
return new Set(prevSet);
});
}}
onSuccess={() => {
setSelections([]);
setSelections(new Set<ClassroomCourseValue>());
props.onSuccess();
}}
/>

View File

@ -10,7 +10,7 @@ import { AxiosError } from "axios";
export function ClassroomRegistrationPreview(props: {
surname_first_letter: string,
userId: number | null,
selections: Array<ClassroomCourseValue>,
selections: Set<ClassroomCourseValue>,
deleteRegister: (k: string) => void,
onSuccess: () => void,
}) {
@ -27,7 +27,7 @@ export function ClassroomRegistrationPreview(props: {
backend.post<JsonResult<null>>(`/api/classroom/course/${props.userId}`, {
surname_first_letter: "A",
courses: props.selections,
courses: [...props.selections.values()],
})
.then((response) => {
if (response.status === 200) {
@ -35,25 +35,27 @@ export function ClassroomRegistrationPreview(props: {
props.onSuccess();
} else {
console.error(response.data);
setError(response.data.Err.reason);
setError(response.data.Error.reason);
setStatus(LoadingStatus.Error);
}
})
.catch((err: AxiosError<JsonResult<null>>) => {
console.error(err);
if (err.response?.data?.Err?.reason) {
setError(err.response.data.Err.reason);
if (err.response?.data?.Error?.reason) {
setError(err.response.data.Error.reason);
}
setStatus(LoadingStatus.Error);
});
};
const selections = createMemo(() => [...props.selections]);
return (
<FilledCard class="border border-c-outline overflow-hidden">
<h2 class="p-4 font-bold text-xl">Confirmar registro</h2>
<div class="bg-c-surface p-4">
<For each={props.selections}>
<For each={selections()}>
{(course_key) => (
<div class="grid grid-cols-[auto_1.5rem] py-1 px-2 rounded-md border border-c-outline my-1">
<span class="font-mono">
@ -73,7 +75,7 @@ export function ClassroomRegistrationPreview(props: {
class="bg-c-primary text-c-on-primary px-4 py-2 rounded-full cursor-pointer mt-4
disabled:opacity-50 disabled:cursor-not-allowed relative"
type="button"
disabled={props.userId === null || props.selections.length === 0 || loading()}
disabled={props.userId === null || selections().length === 0 || loading()}
onclick={submit}
>
<span
@ -86,7 +88,7 @@ export function ClassroomRegistrationPreview(props: {
/>
</span>
<span class="ml-6">
Matricular en {props.selections.length} cursos
Matricular en {selections().length} cursos
</span>
</button>
</div>