Put extra meta data in form context
I have a form where every field has to know if
isDisabled is true or false. I'm currently passing the value in as a prop to each component but that doesn't scale super well. Is there a way that I can save this and other form wide information so that I can have the field access the value directly from form context or the store?5 Replies
dependent-tanOP•3mo ago
<AppForm>
<form
onSubmit={(e) => {
e.preventDefault();
e.stopPropagation();
handleSubmit();
}}
>
<FormRow>
<AppField
name="foregroundColor"
children={({ Text }) => (
<Text
i18nKey="base.labels.foregroundColor"
isDisabled={isBank}
outstandingPermissions={outstandingPermissions}
/>
)}
/>
</FormRow>
<FormRow>
<AppField
name="backgroundColor"
children={({ Text }) => (
<Text
i18nKey="base.labels.backgroundColor"
isDisabled={isBank}
outstandingPermissions={outstandingPermissions}
/>
)}
/>
</FormRow>
<FormRow>
<AppField
name="logoColor"
children={({ Text }) => (
<Text
i18nKey="base.labels.logoColor"
isDisabled={isBank}
outstandingPermissions={outstandingPermissions}
/>
)}
/>
</FormRow>
<ButtonForCompanyProfile
isLoading={isLoading}
isDisabled={isBank}
outstandingPermissions={outstandingPermissions}
/>
<Subscribe
selector={(state) => state.isDirty}
children={(isDirty) => <UnsavedChangesModal isDirty={isIdle && isDirty} />}
/>
</form>
</AppForm>
see how isDisabled and outstandingPermissions is currently being passed everywhere, I would much rather have to pass that in once somewhere so the team can have a form wide way to disable or lock the form based on permissions missing
environmental-rose•3mo ago
field meta is currently a draft PR, once that‘s finished it would be a great use case for this
as for now, you have a few options. The HTML way would be to wrap your fields in a
fieldset and disable that.
If you need to always pass it due to UI library restrictions, you could put them in an object and spread it for the elementsdependent-tanOP•3mo ago
that looks like a nice addition. so the
values available in meta would be passed in as args to useAppFormenvironmental-rose•3mo ago
I‘m not sure … it‘s still highly likely to change since there‘s some issues to iron out, so I haven‘t had a thorough look at it yet.
However, you could mention your use case in the PR as example for meta, to ensure it‘s considered for the feature addition!
dependent-tanOP•3mo ago
thanks for the suggestion. I've been a lurker for long enough that I should probably start getting more involved in open source projects. threw a comment it. good to know that there's no built in way to do at least so I feel better about working around it.