Migrate button to Pajamas in email participants warning
What does this MR do and why?
Refactoring a <button>
to use <gl-button>
as part of gitlab-org/gitlab-services/design.gitlab.com#1722 (closed)
Screenshots or screen recordings
Screenshots are required for UI changes, and strongly recommended for all other merge requests.
Note that the screenshots below are provided to show that no visual change has been made. This is just a refactor.
Before | After | Change |
---|---|---|
No visual change in browser. CSS classes differ slightly in dev tools. | ||
No visual/behavior change on hover | ||
no visual/behavioral change on focus |
How to set up and validate locally
- check out this branch on your local GDK
git fetch origin
git checkout -b '20231013-clavimoniere-pajamas-email-participants-warning' 'origin/20231013-clavimoniere-pajamas-email-participants-warning'
- In the terminal, navigate to the
gitlab
directory and run the following. This applies changes toapp/assets/javascripts/notes/components/comment_field_layout.vue
so that email participants will show when composing a comment
cat << 'EOF' | git apply
diff --git a/app/assets/javascripts/notes/components/comment_field_layout.vue b/app/assets/javascripts/notes/components/comment_field_layout.vue
index cefcc1b0c98..8325985eff8 100644
--- a/app/assets/javascripts/notes/components/comment_field_layout.vue
+++ b/app/assets/javascripts/notes/components/comment_field_layout.vue
@@ -53,6 +53,7 @@ export default {
return this.noteableData.issue_email_participants?.map(({ email }) => email) || [];
},
showEmailParticipantsWarning() {
+ return true
return this.emailParticipants.length && !this.isInternalNote;
},
showAttachmentWarning() {
@@ -96,7 +97,7 @@ export default {
'gl-pt-4 gl-pb-3 gl-mt-n3': !showAttachmentWarning,
'gl-py-3 gl-mt-1': showAttachmentWarning,
}"
- :emails="emailParticipants"
+ :emails="['a@exaple.com', 'b@exaple.com', 'c@exaple.com', 'd@exaple.com', 'e@exaple.com', 'f@exaple.com', 'g@exaple.com']"
/>
</div>
</template>
EOF
- navigate to an issue and look at the open compose comment field. You will see that it lists the emails in the above diff as email participants in the email participant warning, and the "and 4 more" button that has been refactored in this MR is visible.
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Edited by Chad Lavimoniere