Template for form inputs (prepare for graphql mutation) #132
Open
Description
Goal:
- refactoring of existing code: instead of typescript factory that create AST use templates + refactoring rules
- read template into AST and apply refactoring rules (using a script)
Templates
Read info/background from #138.
Let's have multiple templates and preserve existing logic using them:
- Template for input string
- Template for integer
- Template for decimal
- Template for date
- Template for time
- Template for date time
function StringInputTemplate({value, handleChange, error})
<TextField
label={T('label')}
placeholder={T('placeholder')}
value={value}
onChange={handleChange}
error={error}
helperText={error}
/>
Refactoring rules:
- try to replace translation
T('label')
if not missing with real messageID andT('messageID')
with a particular translation framework (react-intl and potentially react-i18n) - try to replace translation
T('placeholder')
if not missing with real messageID andT('messageID')
with a particular translation framework (react-intl and potentially react-i18n) - inline all prop
value
occurences with for examplevalue={formik.values.email}
(in case of using formik) - inline all prop
handleChange
with for exampleonChange={formik.handleChange}
(in case of using formik) - inline all prop
error
with for exampleerror={formik.touched.email && Boolean(formik.errors.email)}
and in this case alsohelperText={formik.touched.email && formik.errors.email}
https://codesandbox.io/s/github/formik/formik/tree/master/examples/with-material-ui?from-embed
Next steps will be:
- template detail page that queries graphql by PK
- introduce graphql mutation in the template
Metadata
Assignees
Labels
No labels