Make Group ID copy-on-click

app/views/groups/_home_panel.html.haml

@@ -5,17 +5,19 @@
 .group-home-panel
   .row.mb-3
     .home-panel-title-row.col-md-12.col-lg-6.d-flex
-      .avatar-container.rect-avatar.s64.home-panel-avatar.gl-mr-3.float-none
+      .avatar-container.rect-avatar.s64.home-panel-avatar.gl-flex-shrink-0.float-none{ class: 'gl-mr-3!' }
         = group_icon(@group, class: 'avatar avatar-tile s64', width: 64, height: 64, itemprop: 'logo')
       .d-flex.flex-column.flex-wrap.align-items-baseline
         .d-inline-flex.align-items-baseline
-          %h1.home-panel-title.gl-mt-3.gl-mb-2{ itemprop: 'name' }
+          %h1.home-panel-title.gl-mt-3.gl-mb-2.gl-ml-3{ itemprop: 'name' }
             = @group.name
             %span.visibility-icon.text-secondary.gl-ml-2.has-tooltip{ data: { container: 'body' }, title: visibility_icon_description(@group) }
               = visibility_level_icon(@group.visibility_level, options: {class: 'icon'})
-        .home-panel-metadata.text-secondary
-          %span
-            = _("Group ID: %{group_id}") % { group_id: @group.id }
+        .home-panel-metadata.text-secondary.gl-font-base.gl-font-weight-normal.gl-line-height-normal
+          - if can?(current_user, :read_group, @group)
+            - button_class = "btn gl-button btn-sm btn-tertiary btn-default-tertiary home-panel-metadata"
+            - button_text = s_('GroupPage|Group ID: %{group_id}') % { group_id: @group.id }
+            = clipboard_button(title: s_('GroupPage|Copy group ID'), text: @group.id, hide_button_icon: true, button_text: button_text, class: button_class, qa_selector: 'group_id_content', itemprop: 'identifier')
           - if current_user
             %span.gl-ml-3
               = render 'shared/members/access_request_links', source: @group

locale/gitlab.pot

@@ -15922,9 +15922,6 @@ msgstr ""
 msgid "Group ID"
 msgstr ""
 
-msgid "Group ID: %{group_id}"
-msgstr ""
-
 msgid "Group Owner must have signed in with SAML before enabling Group Managed Accounts"
 msgstr ""
 
@@ -16099,6 +16096,12 @@ msgstr ""
 msgid "GroupImport|Unable to process group import file"
 msgstr ""
 
+msgid "GroupPage|Copy group ID"
+msgstr ""
+
+msgid "GroupPage|Group ID: %{group_id}"
+msgstr ""
+
 msgid "GroupRoadmap|%{dateWord} – No end date"
 msgstr ""