diff --git a/packages/manager/.changeset/pr-10225-fixed-1708720961774.md b/packages/manager/.changeset/pr-10225-fixed-1708720961774.md new file mode 100644 index 00000000000..302898fac72 --- /dev/null +++ b/packages/manager/.changeset/pr-10225-fixed-1708720961774.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Fixed +--- + +Linode storage Volume Create Drawer crash ([#10225](https://github.com/linode/manager/pull/10225)) diff --git a/packages/manager/src/features/Volumes/VolumeDrawer/LinodeVolumeCreateForm.tsx b/packages/manager/src/features/Volumes/VolumeDrawer/LinodeVolumeCreateForm.tsx index 30debabe284..37aeb219216 100644 --- a/packages/manager/src/features/Volumes/VolumeDrawer/LinodeVolumeCreateForm.tsx +++ b/packages/manager/src/features/Volumes/VolumeDrawer/LinodeVolumeCreateForm.tsx @@ -10,6 +10,7 @@ import { TagsInput } from 'src/components/TagsInput/TagsInput'; import { TextField } from 'src/components/TextField'; import { Typography } from 'src/components/Typography'; import { MAX_VOLUME_SIZE } from 'src/constants'; +import { useFormValidateOnChange } from 'src/hooks/useFormValidateOnChange'; import { useEventsPollingActions } from 'src/queries/events/events'; import { useGrants, useProfile } from 'src/queries/profile'; import { useCreateVolumeMutation } from 'src/queries/volumes'; @@ -56,6 +57,10 @@ export const LinodeVolumeCreateForm = (props: Props) => { const { data: profile } = useProfile(); const { data: grants } = useGrants(); const { mutateAsync: createVolume } = useCreateVolumeMutation(); + const { + hasFormBeenSubmitted, + setHasFormBeenSubmitted, + } = useFormValidateOnChange(); const { checkForNewEvents } = useEventsPollingActions(); @@ -90,6 +95,7 @@ export const LinodeVolumeCreateForm = (props: Props) => { size: maybeCastToNumber(size), tags, }); + setHasFormBeenSubmitted(false); checkForNewEvents(); enqueueSnackbar(`Volume scheduled for creation.`, { variant: 'success', @@ -99,6 +105,7 @@ export const LinodeVolumeCreateForm = (props: Props) => { // Analytics Event sendCreateVolumeEvent(`Size: ${size}GB`, origin); } catch (error) { + setHasFormBeenSubmitted(true); handleFieldErrors(setErrors, error); handleGeneralErrors( setStatus, @@ -107,6 +114,8 @@ export const LinodeVolumeCreateForm = (props: Props) => { ); } }, + validateOnBlur: false, + validateOnChange: hasFormBeenSubmitted, validationSchema: CreateVolumeSchema, }); @@ -205,6 +214,7 @@ export const LinodeVolumeCreateForm = (props: Props) => { disabled, label: 'Create Volume', loading: isSubmitting, + onClick: () => setHasFormBeenSubmitted(true), type: 'submit', }} secondaryButtonProps={{