brandon/uiowaATR
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

fix issue with edit page resource query

Browse Source
This commit is contained in:
Brandon Egger 2023-08-29 10:05:51 -05:00
parent b972b860ac
commit 6518dc5aec
2 changed files with 840 additions and 5086 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5862
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

64
src/pages/resources/[id]/edit.tsx
View File

@ -11,43 +11,43 @@ import { useForm, type SubmitHandler } from "react-hook-form";
import { api } from "~/utils/api"; import { api } from "~/utils/api";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { HeaderFooterLayout } from "~/layouts/HeaderFooterLayout"; import { HeaderFooterLayout } from "~/layouts/HeaderFooterLayout";
import { QueryWaitWrapper } from "~/components/LoadingWrapper";
const EditResourcePage = () => { const EditResourcePage = () => {
const router = useRouter(); const router = useRouter();
const id = router.query["id"]?.toString() ?? ""; const id = router.query["id"]?.toString() ?? "";
// TODO: Maybe useWait id before querying const resourceQuery = api.auditoryResource.byId.useQuery(
const { data: resource } = api.auditoryResource.byId.useQuery({ id }); { id },
{ enabled: router.isReady }
);
const [serverError, setServerError] = useState<string | undefined>(undefined); const ConditionalView = (data: ResourceUpdateInput) => {
const formMethods = useForm<ResourceUpdateInput>({ const [serverError, setServerError] = useState<string | undefined>(
defaultValues: resource as ResourceUpdateInput, undefined
}); );
const formMethods = useForm<ResourceUpdateInput>({
defaultValues: data,
});
const { mutate } = api.auditoryResource.update.useMutation({ const { mutate } = api.auditoryResource.update.useMutation({
onSuccess: async (_data) => { onSuccess: async (_resData) => {
if (!resource) { if (!data) {
setServerError("An unexpected error has occured"); setServerError("An unexpected error has occured");
return; return;
} }
setServerError(undefined); setServerError(undefined);
await router.push(`/resources/${resource.id}`); await router.push(`/resources/${data.id}`);
}, },
onError: (error) => setServerError(error.message), onError: (error) => setServerError(error.message),
}); });
const onSubmit: SubmitHandler<ResourceUpdateInput> = (data) => { const onSubmit: SubmitHandler<ResourceUpdateInput> = (data) => {
mutate(data); mutate(data);
}; };
if (!resource) { return (
// TODO: Error page if resource does not exist
return <></>;
}
return (
<HeaderFooterLayout>
<AdminBarLayout <AdminBarLayout
actions={[ actions={[
<AdminActionButton <AdminActionButton
@ -79,7 +79,7 @@ const EditResourcePage = () => {
key="cancel" key="cancel"
symbol={<XCircleIcon className="w-4" />} symbol={<XCircleIcon className="w-4" />}
label="Cancel" label="Cancel"
href={`/resources/${resource.id}`} href={`/resources/${data.id}`}
/>, />,
]} ]}
> >
@ -87,10 +87,16 @@ const EditResourcePage = () => {
<ResourceForm <ResourceForm
methods={formMethods} methods={formMethods}
error={serverError} error={serverError}
resource={resource as ResourceUpdateInput} resource={data}
/> />
</div> </div>
</AdminBarLayout> </AdminBarLayout>
);
};
return (
<HeaderFooterLayout>
<QueryWaitWrapper query={resourceQuery} Render={ConditionalView} />
</HeaderFooterLayout> </HeaderFooterLayout>
); );
}; };