-
Notifications
You must be signed in to change notification settings - Fork 3
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
Add option to disable delete button if model has protected object #573
Conversation
Pull Request Test Coverage Report for Build 5932108690
💛 - Coveralls |
Delete | ||
</GuardedButton> | ||
<Tooltip title={hasProtectedObject ? deleteDisabledTooltip : ''}> | ||
<span> |
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.
Wrapping it in a <span>
is necessary because tooltips don't show on disabled buttons
src/components/EditableCard.tsx
Outdated
onDelete?: (model: unknown) => Promise<any>; | ||
protectedField?: string | null; |
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.
Can this be a boolean field? disableDelete
or something and on the frontend you can just pass {!!payments}
. I think that makes the prop a little more straight forward but also we would be able to use that prop for when we just want to disable the delete button for other reasons (i.e. disable if the user doesn't have the permission to delete.
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.
Each investment could have or not have payments
, so we have to pass the field along with the model
to EditableArrayCard
so when it renders each EditableCard
it can check whether that instance has payments or not. From inside coop-client
we can't pass a boolean for each investment since the frontend only passes the model. Let me know if I'm understanding you correctly.
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.
In the future we could do a disableDelete
for permissions since we could just disable the delete button for the entire EditableArrayCard
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 prop feels way too specific for the component i think. Do you think this is possible?
<EditableArrayCard
...
renderDelete={(investment) => investment.payments && investment.payments.length > 0}
...
/>
const enableDelete = renderDelete ? renderDelete(model) : true;
something like that... then we can just pass (investment) => false
to the prop if we want to disable it for other reasons?
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.
also didnt realize that this was a array card! but i think that might work?!
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.
yeah agreed! I think passing the function is much better. updated!
> | ||
Delete | ||
</GuardedButton> | ||
<Tooltip title={isDeleteDisabled ? disabledDeleteTooltip : ''}> |
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.
if the button is disabled but the prop passed an empty string for disabledDeleteTooltip
, does the tool tip render with an empty string or does not render at all?
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.
No tooltip is rendered when the string is empty!
JIRA: https://thatsmighty.atlassian.net/browse/PROD-506
CoOp pull request: https://github.com/mighty-justice/coop-client/pull/1198
Tested in Storybook (ended up removing the Storybook code, thought it might be overkill):
Also tested in CoOp: