Close add person dialog on submit
Signed-off-by: Émile Ré <emile@getprobo.com>
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import { useTranslate } from "@probo/i18n";
|
import { useTranslate } from "@probo/i18n";
|
||||||
import { Dialog } from "@probo/ui";
|
import { Dialog, useDialogRef } from "@probo/ui";
|
||||||
import { type PropsWithChildren } from "react";
|
import { type PropsWithChildren } from "react";
|
||||||
import type { DataID } from "relay-runtime";
|
import type { DataID } from "relay-runtime";
|
||||||
|
|
||||||
@@ -9,7 +9,7 @@ export function AddPersonDialog(props: PropsWithChildren<{
|
|||||||
connectionId: DataID;
|
connectionId: DataID;
|
||||||
}>) {
|
}>) {
|
||||||
const { children, connectionId } = props;
|
const { children, connectionId } = props;
|
||||||
|
const dialogRef = useDialogRef();
|
||||||
const { __ } = useTranslate();
|
const { __ } = useTranslate();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -17,9 +17,10 @@ export function AddPersonDialog(props: PropsWithChildren<{
|
|||||||
title={__("Add Person")}
|
title={__("Add Person")}
|
||||||
trigger={children}
|
trigger={children}
|
||||||
className="max-w-xl"
|
className="max-w-xl"
|
||||||
|
ref={dialogRef}
|
||||||
>
|
>
|
||||||
<div className="p-4">
|
<div className="p-4">
|
||||||
<PersonForm connectionId={connectionId} />
|
<PersonForm connectionId={connectionId} onSubmit={() => dialogRef.current?.close()} />
|
||||||
</div>
|
</div>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -77,6 +77,7 @@ export function PersonForm(props: {
|
|||||||
connectionId?: DataID;
|
connectionId?: DataID;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
defaultValues?: z.infer<typeof schema>;
|
defaultValues?: z.infer<typeof schema>;
|
||||||
|
onSubmit?: () => void;
|
||||||
}) {
|
}) {
|
||||||
const {
|
const {
|
||||||
id,
|
id,
|
||||||
@@ -92,6 +93,7 @@ export function PersonForm(props: {
|
|||||||
contractStartDate: null,
|
contractStartDate: null,
|
||||||
contractEndDate: null,
|
contractEndDate: null,
|
||||||
},
|
},
|
||||||
|
onSubmit,
|
||||||
} = props;
|
} = props;
|
||||||
|
|
||||||
const organizationId = useOrganizationId();
|
const organizationId = useOrganizationId();
|
||||||
@@ -99,7 +101,7 @@ export function PersonForm(props: {
|
|||||||
const { role } = use(CurrentUser);
|
const { role } = use(CurrentUser);
|
||||||
const availableRoles = getAssignableRoles(role);
|
const availableRoles = getAssignableRoles(role);
|
||||||
|
|
||||||
const { control, formState, handleSubmit, register, reset }
|
const { control, formState, handleSubmit: handleSubmitWrapper, register, reset }
|
||||||
= useFormWithSchema(schema, { defaultValues });
|
= useFormWithSchema(schema, { defaultValues });
|
||||||
const watchedRole = useWatch({
|
const watchedRole = useWatch({
|
||||||
control,
|
control,
|
||||||
@@ -120,7 +122,7 @@ export function PersonForm(props: {
|
|||||||
errorMessage: __("Failed to update person"),
|
errorMessage: __("Failed to update person"),
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
const onSubmit = handleSubmit(async (data: z.infer<typeof schema>) => {
|
const handleSubmit = handleSubmitWrapper(async (data: z.infer<typeof schema>) => {
|
||||||
const input = {
|
const input = {
|
||||||
fullName: data.fullName,
|
fullName: data.fullName,
|
||||||
emailAddress: data.emailAddress,
|
emailAddress: data.emailAddress,
|
||||||
@@ -137,6 +139,7 @@ export function PersonForm(props: {
|
|||||||
variables: { input: { ...input, id } },
|
variables: { input: { ...input, id } },
|
||||||
onCompleted: () => {
|
onCompleted: () => {
|
||||||
reset(data);
|
reset(data);
|
||||||
|
onSubmit?.();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
@@ -147,13 +150,14 @@ export function PersonForm(props: {
|
|||||||
},
|
},
|
||||||
onCompleted: () => {
|
onCompleted: () => {
|
||||||
reset(data);
|
reset(data);
|
||||||
|
onSubmit?.();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form onSubmit={e => void onSubmit(e)} className="space-y-4">
|
<form onSubmit={e => void handleSubmit(e)} className="space-y-4">
|
||||||
<Field label={__("Full name *")} {...register("fullName")} type="text" />
|
<Field label={__("Full name *")} {...register("fullName")} type="text" />
|
||||||
{id
|
{id
|
||||||
? (
|
? (
|
||||||
|
|||||||
Reference in New Issue
Block a user