diff --git a/frontend/src/certs/CertsImpl.tsx b/frontend/src/certs/CertsImpl.tsx index fb13ea5..068c7ca 100644 --- a/frontend/src/certs/CertsImpl.tsx +++ b/frontend/src/certs/CertsImpl.tsx @@ -4,15 +4,17 @@ import { Registers } from "./Registers"; import { Search } from "./Search"; import { Person } from "../types/Person"; import { useCourses } from "./CourseContext"; +import { useCustomLabel } from "./CustomLabelContext"; export function CertsImpl() { const [person, setPerson] = createSignal(null); const [count, setCount] = createSignal(0); const courses = useCourses()!; + const customLabels = useCustomLabel(); return ( <> -
+
diff --git a/frontend/src/certs/CustomLabelContext.tsx b/frontend/src/certs/CustomLabelContext.tsx index 306c9c4..aa84a13 100644 --- a/frontend/src/certs/CustomLabelContext.tsx +++ b/frontend/src/certs/CustomLabelContext.tsx @@ -5,14 +5,24 @@ import axios from "axios"; export type CustomLabelsMap = {[custom_label_id: number]: CustomLabel}; const CustomLabelContext = createContext<{ - labels: () => CustomLabelsMap + labels: () => CustomLabelsMap, + fetchLabels: () => void, + loading: () => boolean }>(); +let cachedLabels: CustomLabelsMap | null = null; + export function CustomLabelProvider(props: {children: JSX.Element}) { - const [labels] = createResource(fetchAllLabels); + const [labels, {refetch}] = createResource(fetchAllLabels); const customLabelData = { labels: createMemo(() => labels() ?? {}), + fetchLabels: () => { + // Remove cached values + cachedLabels = null; + refetch(); + }, + loading: createMemo(() => labels.state === "pending"), }; return ( @@ -22,8 +32,6 @@ export function CustomLabelProvider(props: {children: JSX.Element}) { ); } -let cachedLabels: CustomLabelsMap | null = null; - async function fetchAllLabels(useCache = true): Promise { if (useCache && cachedLabels !== null) { return cachedLabels; diff --git a/frontend/src/certs/NewRegister/RegisterPreview.tsx b/frontend/src/certs/NewRegister/RegisterPreview.tsx index b3edede..261c421 100644 --- a/frontend/src/certs/NewRegister/RegisterPreview.tsx +++ b/frontend/src/certs/NewRegister/RegisterPreview.tsx @@ -3,10 +3,10 @@ import { For, Show, createSignal } from "solid-js"; import { XIcon } from "../../icons/XIcon"; import { RegisterBatchCreate } from "../../types/Register"; import { RegistrationPreview } from "."; -import { loadCustomLabels } from "../../utils/allCustomLabels"; import { FileDashedIcon } from "../../icons/FileDashedIcon"; import { LoadingIcon } from "../../icons/LoadingIcon"; import { useCourses } from "../CourseContext"; +import { useCustomLabel } from "../CustomLabelContext"; function isoDateToLocalDate(date: string): string { @@ -18,8 +18,13 @@ function isoDateToLocalDate(date: string): string { export function RegisterPreview(props: {selections: Array, personId: number | null, onDelete: (v: number) => void, onRegister: () => void}) { const [error, setError] = createSignal(""); const [loading, setLoading] = createSignal(false); + const customLabels = useCustomLabel(); const submit = async() => { + if (customLabels === undefined || customLabels?.loading()) { + return; + } + setLoading(true); setError(""); @@ -35,9 +40,8 @@ export function RegisterPreview(props: {selections: Array, const result = await createRegisters(registers); if (result === null) { - console.log("Create register: success"); - // Custom labels may have changed, reload them - loadCustomLabels(); + // TODO: Determine if a reload is necessary by checking if a new custom label was created + customLabels.fetchLabels(); props.onRegister(); } else { console.log(`error. ${result}`); diff --git a/frontend/src/utils/allCustomLabels.ts b/frontend/src/utils/allCustomLabels.ts deleted file mode 100644 index 90fc198..0000000 --- a/frontend/src/utils/allCustomLabels.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { CustomLabel } from "../types/CustomLabel"; - -type CustomLabelsMap = {[k: number]: CustomLabel}; - - -export function loadCustomLabels() { - fetch(`${import.meta.env.VITE_BACKEND_URL}/api/label`) - .then((res) => res.json()) - .then((data: Array) => { - const map: CustomLabelsMap = {}; - for (const label of data) { - map[label.custom_label_id] = label; - } - }); -} - -loadCustomLabels(); -