Rich Text Editor - Identical emoji lists between text modes

Problem

GitLab has a plain text editor and a rich text editor. At this time the emoji lists between text modes is not identical. One Issue is related simply to positive intent, however, more broadly we want to ensure that all emojis currently available in the plain text editor (the original editor in GitLab) are available to use in GitLab.

Current differences:

Plain text	Rich text

Why

Users seeks parity and consistency in their user experience. All users should be able to complete the same functions and utilize the same emojis regardless of the editor they are using.

Implementation Guide

Enable the same functionality between the plain text editor with emojis and the rich text editor. Following patch should be a fix to make the rich text emoji dropdown look like the one in plain text:

diff --git a/app/assets/javascripts/content_editor/components/suggestions_dropdown.vue b/app/assets/javascripts/content_editor/components/suggestions_dropdown.vue
index 6535d9eaa5d8..cb4b01d5d7ee 100644
--- a/app/assets/javascripts/content_editor/components/suggestions_dropdown.vue
+++ b/app/assets/javascripts/content_editor/components/suggestions_dropdown.vue
@@ -276,10 +276,9 @@ export default {
                   <small class="gl-text-gray-500"> {{ item.description }} </small>
                 </div>
                 <div v-if="isEmoji" class="gl-display-flex gl-align-items-center">
-                  <div class="gl-pr-4 gl-font-lg">{{ item.e }}</div>
+                  <div class="gl-pr-3 gl-font-lg">{{ item.e }}</div>
                   <div class="gl-flex-grow-1">
-                    {{ item.name }}<br />
-                    <small>{{ item.d }}</small>
+                    {{ item.d }}
                   </div>
                 </div>
               </div>

Appearance after the patch: