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

Refactor modals component #159

Open
thai-truong opened this issue Sep 9, 2020 · 0 comments
Open

Refactor modals component #159

thai-truong opened this issue Sep 9, 2020 · 0 comments
Assignees
Labels
enhancement New feature or request

Comments

@thai-truong
Copy link
Collaborator

I currently use the render function pattern in order to allow for custom action buttons on modals to close the modal (refer to the source code for more details). However, I realize that this way of doing things is way too confusing and messy, so I'm coming up with another solution to make the code for modals easier to understand.

Solution: For components like ButtonWithConfirmationModal that uses ButtonWithModal (which uses BaseModal), instead of passing the modal action buttons via ButtonWithConfirmationModal.children, then ButtonWithModal passes that same children, unaltered, to BaseModal for the render function pattern, I pass down to ButtonWithModal a prop called buttonList, which is a list of objects that contain props for a Button component (objects are of type ActionButton), in order to render the buttons in ButtonWithModal instead. This works well because ButtonWithModal contains the handleClose function that BaseModal needs (handleClose = () => setOpen(false)) already so I can just use it with the onClickFunc prop of ActionButton to do what I mentioned in the previous paragraph. I realize that this might sound a bit confusing but it will definitely be a lot easier to understand than what I have currently.

@thai-truong thai-truong added the enhancement New feature or request label Sep 9, 2020
@thai-truong thai-truong self-assigned this Sep 9, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant