Skip to content

Commit

Permalink
fix(form-plugin): reset form on changed document
Browse files Browse the repository at this point in the history
  • Loading branch information
soofstad committed May 30, 2024
1 parent 9151109 commit 3c27175
Show file tree
Hide file tree
Showing 7 changed files with 21 additions and 13 deletions.
8 changes: 5 additions & 3 deletions packages/dm-core-plugins/src/form/FormPlugin.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,14 @@ import {
import { Form } from './components/Form'

export const FormPlugin = (props: IUIPlugin) => {
const { document, isLoading, updateDocument, error, isFetching } =
useDocument<any>(props.idReference, 0)
const { document, isLoading, updateDocument, error } = useDocument<any>(
props.idReference,
0
)

// react-hook-form is unable to rerender when the document is updated.
// This means that the form will not benefit from react-query caching.
if (isLoading || isFetching) return <Loading />
if (isLoading) return <Loading />

if (error) throw new Error(JSON.stringify(error, null, 2))

Expand Down
8 changes: 7 additions & 1 deletion packages/dm-core-plugins/src/form/components/Form.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useState } from 'react'
import { useEffect, useState } from 'react'

import {
EBlueprint,
Expand Down Expand Up @@ -49,6 +49,12 @@ export const Form = (props: TFormProps) => {
defaultValues: formData || {},
})

useEffect(() => {
if (formData) {
rootMethods.reset(formData, { keepDefaultValues: false })
}
}, [formData])

const childMethods = useFormContext()

const methods = showSubmitButton ? rootMethods : childMethods
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ const DimensionalScalarWidget = (props: TWidget) => {
helperText={error}
variant={error ? 'error' : undefined}
onChange={onChangeHandler}
defaultValue={isPrimitive ? entity : entity?.value ?? ''}
value={isPrimitive ? entity : entity?.value ?? ''}
/>
</EdsProvider>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const EntityPickerWidget = (props: TWidget) => {
<TextField
id={props.id}
readOnly={props.readOnly}
defaultValue={props.value}
value={props.value}
inputRef={props.inputRef}
variant={props.variant}
helperText={props.helperText}
Expand Down
2 changes: 1 addition & 1 deletion packages/dm-core-plugins/src/form/widgets/SwitchWidget.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ const SwitchWidget = (props: TWidget) => {
<Switch
{...props}
disabled={readOnly}
defaultChecked={typeof value === 'undefined' ? false : value}
checked={typeof value === 'undefined' ? false : value}
data-testid='form-switch'
/>
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ export const StyledTextField = (
return (
<StyledEDSField
{...restProps}
defaultValue={
value={
props.readOnly && props.value === ''
? '-'
: props.defaultValue ?? props.value
Expand Down Expand Up @@ -99,7 +99,7 @@ export const StyledNumberField = (
onWheel={(event: React.UIEvent<HTMLInputElement>) =>
(event.target as HTMLInputElement).blur()
}
defaultValue={value ?? props.defaultValue}
value={value ?? props.defaultValue}
type={'number'}
/>
)
Expand Down
8 changes: 4 additions & 4 deletions packages/dm-core/src/hooks/useDocument.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export function useDocument<T>(

const { isPending, data } = useQuery({
staleTime: 5 * 1000,
refetchOnMount: false,
refetchOnMount: true,
queryKey: queryKeys,
queryFn: () =>
dmssAPI
Expand Down Expand Up @@ -118,8 +118,8 @@ export function useDocument<T>(
error.response?.data || { message: error.name, data: error }
)
if (throwError) {
throw new Error(JSON.stringify(error, null, 2))
}
throw new Error(JSON.stringify(error, null, 2))
}
}),
})

Expand All @@ -129,6 +129,6 @@ export function useDocument<T>(
updateDocument: (newDocument: T, notify, partialUpdate, throwError) =>
mutation.mutateAsync({ newDocument, notify, partialUpdate, throwError }),
error: errorResponse,
setError: setErrorResponse
setError: setErrorResponse,
}
}

0 comments on commit 3c27175

Please sign in to comment.