Approvals avatars and buttons
Continuation of https://gitlab.com/gitlab-org/gitlab-ee/issues/4134 and https://gitlab.com/gitlab-org/gitlab-ee/issues/2452
Description
To simplify design and implementation, each part of the approvals UI is independently displayed based on the following:
Check mark versus exclamation mark
- If the merge request has passed approvals (required number of approvals is reached), display a check mark.
- If the merge request has not passed approvals, display an exclamation mark.
Approve and approve additionally buttons
- If the user is not eligible to approve, to not show anything here.
- If the user has already approved the merge request, do not show anything here.
- If the user has not approved:
- If the number of approvals is less than the required number, display
Approve
. - If the number of approvals is equal or greater than the required number, display
Approve additionally
.
- If the number of approvals is less than the required number, display
Requires x more
and Enough approvals, additional from
text copy
- If the merge request requires more approvals to be passed, display
Requires x more approvals from
, wherex
is the number of approvals more to pass. - If the merge request has already the number of approvals met, display
Enough approvals, additional from
.
Eligible approvers avatars
- Display explicit eligible individual approvers who have currently not approved yet.
- Display explicit eligible group approvers. Always display the explicit group approver avatars, even if every member of the group has already approved. (This is to simplify the logic.)
- If in the
m > n
case of #4134 (closed), then display a special avatar that represents project members with developer role or higher. Maybe have a tooltip and/or link to docs. But use an avatar to streamline the design with individuals and groups.
Approved by avatars
- Display
Approved by
with the avatars, if at least one individual has approved. - Don't display anything if no one has approved.
- Only display the avatar of any individual who has approved.
- Don't display any group avatars.
- Don't display any empty dotted circles.
Remove approval button
- Display the
Remove approval
button if you have already approved.
Edited by Victor Wu