Skip to content
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

(feat) Migrating conditions form to use RHF and Zod #1248

Merged
merged 9 commits into from Jul 4, 2023

Conversation

lumuchris256
Copy link
Contributor

@lumuchris256 lumuchris256 commented Jun 29, 2023

Requirements

  • This PR has a title that briefly describes the work done including the ticket number. If there is a ticket, make sure your PR title includes a conventional commit label. See existing PR titles for inspiration.
  • My work conforms to the OpenMRS 3.0 Styleguide and design documentation.
  • My work includes tests or is validated by existing tests.

Summary

-migrated the conditions form to use RHF and Zod

Screenshots

www_screencapture_com_2023-6-29_09_10.mp4

current update

focus

Related Issue

https://issues.openmrs.org/browse/O3-2139 current
needs merging first #1232

Other

cc @hadijahkyampeire @denniskigen

@lumuchris256 lumuchris256 changed the title conditions form refactor (feat) Migrating conditions form to use RHF and Zod Jun 29, 2023
: null
: null,
clinicalStatus: condition?.cells?.find((cell) => cell?.info?.header === 'clinicalStatus')?.value ?? 'Active',
search: condition?.cells?.find((cell) => cell?.info?.header === 'display')?.value,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

initilizing RHF with default values

search: z.string({ required_error: "A condition is required"}),
});

export type ConditionFormData = z.infer<typeof conditionSchema>;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

infering form data type from the zod schema

if (isSubmitting) {
editing ? handleUpdate() : handleCreate();
if (formState?.errors?.search) {
searchInputFocus();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

focuses on the conditon's search input if an invalid condition is entered

if (isSubmitting) {
editing ? handleUpdate() : handleCreate();
if (formState?.errors?.search) {
searchInputFocus();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

focuses on the conditon's search input if an invalid condition is entered

</ButtonSet>
</div>
</Form>
<FormProvider {...methods}>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Passing down form contexts and methods
api

}) => {
const { t } = useTranslation();
const { conditions, mutate } = useConditions(patientUuid);
const editing = formContext === 'editing';
const { control, watch, getValues, formState } = useFormContext<ConditionFormData>();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

using the formcontext and methods api

@lumuchris256 lumuchris256 marked this pull request as ready for review July 2, 2023 07:10
Copy link
Contributor

@hadijahkyampeire hadijahkyampeire left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good, let's merge it and test it more on dev3

@hadijahkyampeire hadijahkyampeire merged commit 695a067 into openmrs:main Jul 4, 2023
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants