50 lines
1.3 KiB
TypeScript
50 lines
1.3 KiB
TypeScript
import {Box, TextField} from '@mui/material'
|
|
import {Create} from '@refinedev/mui'
|
|
import {useForm} from '@refinedev/react-hook-form'
|
|
|
|
export const ArticleCreate = () => {
|
|
const {
|
|
saveButtonProps,
|
|
refineCore: {formLoading},
|
|
register,
|
|
formState: {errors},
|
|
} = useForm({
|
|
refineCoreProps: {
|
|
resource: 'article/',
|
|
},
|
|
})
|
|
|
|
return (
|
|
<Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
|
|
<Box component="form" sx={{display: 'flex', flexDirection: 'column'}} autoComplete="off">
|
|
<TextField
|
|
{...register('heading', {
|
|
required: 'This field is required',
|
|
})}
|
|
error={!!(errors as any)?.heading}
|
|
helperText={(errors as any)?.heading?.message}
|
|
margin="normal"
|
|
fullWidth
|
|
InputLabelProps={{shrink: true}}
|
|
type="text"
|
|
label={'Heading'}
|
|
name="heading"
|
|
/>
|
|
<TextField
|
|
{...register('body', {
|
|
required: 'This field is required',
|
|
})}
|
|
error={!!(errors as any)?.body}
|
|
helperText={(errors as any)?.body?.message}
|
|
margin="normal"
|
|
fullWidth
|
|
InputLabelProps={{shrink: true}}
|
|
type="text"
|
|
label={'Body'}
|
|
name="body"
|
|
/>
|
|
</Box>
|
|
</Create>
|
|
)
|
|
}
|