-
Notifications
You must be signed in to change notification settings - Fork 6
eap(eap-registration-form): Add EAP Registration Form #2046
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: project/early-action-protocols
Are you sure you want to change the base?
eap(eap-registration-form): Add EAP Registration Form #2046
Conversation
|
| <InputSection | ||
| title="National Society (NS)" | ||
| description="Select National Society that is planning to apply for the EAP" | ||
| withAsteriskOnTitle | ||
| > | ||
| <NationalSocietySelectInput | ||
| error={undefined} | ||
| name="national_society" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is a good go ahead, but @barshathakuri , you need to create a typing, setup form and then create inputs. The form needs to be editable and working, only the send action is stopped. Only after we do this, we can change things easily later on.
d496188 to
4a259ca
Compare
4a259ca to
e91a814
Compare
e91a814 to
6bc8692
Compare
|
|
||
| type FormSchema = ObjectSchema<PartialFormFields>; | ||
| export const formSchema: FormSchema = { | ||
| fields: (value) => ({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we need to make every field required?
| } = props; | ||
|
|
||
| const strings = useTranslation(i18n); | ||
| const defaultFormValue = useMemo(() => ({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
After removing every field required we can have default value empty.
6bc8692 to
712bf90
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Make sure all input components have error handled. Add nonFieldErrors as well. Also, make sure select componets have their options fetched if they are there.
| const eapFormOptions = [ | ||
| { value: 'full', label: 'Full application' }, | ||
| { value: 'simplified', label: 'Simplified application' }, | ||
| { value: 'not_sure', label: 'Not Sure' }, | ||
| ]; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use translation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is dummy data. I'll be an Enum.
| interface Props { | ||
| disabled?: boolean; | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Always keep props next to the component
| keySelector={(option) => option.value} | ||
| labelSelector={(option) => option.label} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Define these outside plz
| value={value?.eap_start_date} | ||
| /> | ||
| <DateInput | ||
| name="eap_end_date" | ||
| onChange={setFieldValue} | ||
| value={value?.eap_end_date} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add errors here
| onChange={setFieldValue} | ||
| keySelector={partnerInvolvedKeySelector} | ||
| labelSelector={partnerInvolvedLabelSelector} | ||
| options={[]} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Where do we fetch this from? Either implement or add FIXME
| <Button | ||
| name={undefined} | ||
| onClick={handleFormSubmit} | ||
| type="submit" | ||
| variant="secondary" | ||
| disabled={disabled} | ||
| > | ||
| {strings.eapSubmitButton} | ||
| </Button> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We'll probably need a cancel button too right?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We have a submit button only in figma. Do we need to add the cancel button as well?
We also have a cancel button on the top of the form.
712bf90 to
20d7ef9
Compare
Summary
Add EAP Registration Form.
Addresses
Changes
This PR Ensures:
console.logstatements meant for debuggingAdditional Notes
Optional: Add any other relevant context, screenshots, or details here.