GGLinnk/foris-js
1
0
Fork 0
mirror of https://gitlab.nic.cz/turris/reforis/foris-js.git synced 2025-09-19 02:02:13 +02:00
Code Issues Releases Activity

Format all files with Prettier

Browse Source
This commit is contained in:
Aleksandr Gumroian
2020-08-18 15:39:00 +02:00
parent e41da48b1a
commit f8726e6012
80 changed files with 933 additions and 804 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/form/components/ForisForm.md
View File

@@ -1,8 +1,11 @@
`<ForisForm/>` is Higher-Order Component which encapsulates entire form logic and provides with children required props.
This component structure provides comfort API and allows to create typical Foris module forms easily.
`<ForisForm/>` is Higher-Order Component which encapsulates entire form logic
and provides with children required props. This component structure provides
comfort API and allows to create typical Foris module forms easily.
## Example of usage of `<ForisForm/>`
You can pass more forms as children.
```js
<ForisForm
ws={ws}
@@ -24,7 +27,10 @@ You can pass more forms as children.
```js
export default function MACForm({
formData, formErrors, setFormValue, ...props
formData,
formErrors,
setFormValue,
...props
}) {
const macSettings = formData.mac_settings;
const errors = (formErrors || {}).mac_settings || {};
@@ -35,38 +41,33 @@ export default function MACForm({
label={_("Custom MAC address")}
checked={macSettings.custom_mac_enabled}
helpText={HELP_TEXTS.custom_mac_enabled}
onChange={setFormValue(
(value) => ({ mac_settings: { custom_mac_enabled: { $set: value } } }),
)}
onChange={setFormValue((value) => ({
mac_settings: { custom_mac_enabled: { $set: value } },
}))}
{...props}
/>
{macSettings.custom_mac_enabled
? (
<TextInput
label={_("MAC address")}
value={macSettings.custom_mac || ""}
helpText={HELP_TEXTS.custom_mac}
error={errors.custom_mac}
required
onChange={setFormValue(
(value) => ({ mac_settings: { custom_mac: { $set: value } } }),
)}
{...props}
/>
)
: null}
{macSettings.custom_mac_enabled ? (
<TextInput
label={_("MAC address")}
value={macSettings.custom_mac || ""}
helpText={HELP_TEXTS.custom_mac}
error={errors.custom_mac}
required
onChange={setFormValue((value) => ({
mac_settings: { custom_mac: { $set: value } },
}))}
{...props}
/>
) : null}
</>
);
}
```
The <ForisForm/> passes subsequent `props` to the child components.
| Prop | Type | Description |
|----------------|--------|----------------------------------------------------------------------------|
| -------------- | ------ | -------------------------------------------------------------------------- |
| `formData` | object | Data returned from API. |
| `formErrors` | object | Errors returned after validation via validator. |
| `setFormValue` | func | Function for data update. It takes update rule as arg (see example above). |