Add latest changes from gitlab-org/gitlab@master

app/assets/javascripts/issues/list/components/issues_list_app.vue

@@ -294,6 +294,7 @@ export default {
         iid: isIidSearch ? this.searchQuery.slice(1) : undefined,
         isProject: this.isProject,
         isSignedIn: this.isSignedIn,
+        searchByEpic: Boolean(this.apiFilterParams.epicId),
         sort: this.sortKey,
         state: this.state,
         ...this.pageParams,

app/assets/javascripts/pages/groups/new/components/app.vue

 <script>
-import GROUP_IMPORT_SVG_URL from '@gitlab/svgs/dist/illustrations/group-import.svg?url';
-import GROUP_NEW_SVG_URL from '@gitlab/svgs/dist/illustrations/group-new.svg?url';
-
 import { s__ } from '~/locale';
 import NewNamespacePage from '~/vue_shared/new_namespace/new_namespace_page.vue';
 import createGroupDescriptionDetails from './create_group_description_details.vue';
@@ -74,7 +71,6 @@ export default {
             parentGroupName: this.parentGroupName,
             importExistingGroupPath: this.importExistingGroupPath,
           },
-          imageSrc: GROUP_NEW_SVG_URL,
         },
         {
           name: 'import-group-pane',
@@ -84,7 +80,6 @@ export default {
             'GroupsNew|Import a group and related data from another GitLab instance.',
           ),
           details: 'Migrate your existing groups from another instance of GitLab.',
-          imageSrc: GROUP_IMPORT_SVG_URL,
         },
       ];
     },

app/assets/javascripts/pages/projects/shared/permissions/components/settings_panel.vue

@@ -11,6 +11,7 @@ import {
 import SecretManagerSettings from 'ee_component/pages/projects/shared/permissions/components/secret_manager_settings.vue';
 import ConfirmDanger from '~/vue_shared/components/confirm_danger/confirm_danger.vue';
 import settingsMixin from 'ee_else_ce/pages/projects/shared/permissions/mixins/settings_pannel_mixin';
+import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { __, s__ } from '~/locale';
 import {
   VISIBILITY_LEVEL_PRIVATE_INTEGER,
@@ -30,6 +31,7 @@ import {
   duoHelpPath,
   amazonQHelpPath,
   pipelineExecutionPoliciesHelpPath,
+  extendedPratExpiryWebhooksExecuteHelpPath,
 } from '../constants';
 import { toggleHiddenClassBySelector } from '../external';
 import ProjectFeatureSetting from './project_feature_setting.vue';
@@ -95,6 +97,12 @@ export default {
     ),
     confirmButtonText: __('Save changes'),
     emailsLabel: s__('ProjectSettings|Email notifications'),
+    extendedPratExpiryWebhooksExecuteLabel: s__(
+      'ProjectSettings|Add additional webhook triggers for project access token expiry.',
+    ),
+    extendedPratExpiryWebhooksExecuteHelpText: s__(
+      'ProjectSettings|If enabled, project access tokens expiry webhooks execute 60, 30, and 7 days before the token expires. If disabled, these webhooks only execute 7 days before the token expires. %{linkStart}Learn more%{linkEnd}',
+    ),
     showDiffPreviewLabel: s__('ProjectSettings|Include diff previews'),
     showDiffPreviewHelpText: s__(
       'ProjectSettings|Emails are not encrypted. Concerned administrators may want to disable diff previews.',
@@ -113,6 +121,7 @@ export default {
   modelExperimentsHelpPath,
   modelRegistryHelpPath,
   pipelineExecutionPoliciesHelpPath,
+  extendedPratExpiryWebhooksExecuteHelpPath,
   components: {
     CiCatalogSettings,
     ProjectFeatureSetting,
@@ -132,7 +141,7 @@ export default {
         'jh_component/pages/projects/shared/permissions/components/other_project_settings.vue'
       ),
   },
-  mixins: [settingsMixin],
+  mixins: [settingsMixin, glFeatureFlagMixin()],
   inject: ['cascadingSettingsData'],
   props: {
     requestCveAvailable: {
@@ -346,6 +355,7 @@ export default {
       enforceAuthChecksOnUploads: true,
       emailsEnabled: true,
       showDiffPreviewInEmail: true,
+      extendedPratExpiryWebhooksExecute: false,
       cveIdRequestEnabled: true,
       duoFeaturesEnabled: false,
       sppRepositoryPipelineAccess: false,
@@ -1115,6 +1125,30 @@ export default {
           <template #help>{{ $options.i18n.pucWarningHelpText }}</template>
         </gl-form-checkbox>
       </project-setting-row>
+      <project-setting-row v-if="glFeatures.extendedExpiryWebhookExecutionSetting">
+        <input
+          :value="extendedPratExpiryWebhooksExecute"
+          type="hidden"
+          name="project[project_setting_attributes][extended_prat_expiry_webhooks_execute]"
+        />
+        <gl-form-checkbox
+          v-model="extendedPratExpiryWebhooksExecute"
+          name="project[project_setting_attributes][extended_prat_expiry_webhooks_execute]"
+        >
+          {{ $options.i18n.extendedPratExpiryWebhooksExecuteLabel }}
+          <template #help>
+            <gl-sprintf :message="$options.i18n.extendedPratExpiryWebhooksExecuteHelpText">
+              <template #link="{ content }">
+                <gl-link
+                  :href="$options.extendedPratExpiryWebhooksExecuteHelpPath"
+                  target="_blank"
+                  >{{ content }}</gl-link
+                >
+              </template>
+            </gl-sprintf>
+          </template>
+        </gl-form-checkbox>
+      </project-setting-row>
       <ci-catalog-settings v-if="canAddCatalogResource" :full-path="confirmationPhrase" />
       <secret-manager-settings v-if="canManageSecretManager" :full-path="confirmationPhrase" />
       <other-project-settings />

app/assets/javascripts/pages/projects/shared/permissions/constants.js

@@ -51,6 +51,11 @@ export const modelExperimentsHelpPath = helpPagePath(
 
 export const modelRegistryHelpPath = helpPagePath('user/project/ml/model_registry/_index.md');
 
+export const extendedPratExpiryWebhooksExecuteHelpPath = helpPagePath(
+  'user/project/settings/_index.md',
+  { anchor: 'add-additional-webhook-triggers-for-project-access-token-expiration' },
+);
+
 export const duoHelpPath = helpPagePath('user/ai_features');
 export const amazonQHelpPath = helpPagePath('user/duo_amazon_q/_index.md');
 

app/assets/javascripts/projects/new/components/app.vue

 <script>
-import PROJECT_CREATE_FROM_TEMPLATE_SVG_URL from '@gitlab/svgs/dist/illustrations/project-create-from-template-sm.svg?url';
-import PROJECT_CREATE_NEW_SVG_URL from '@gitlab/svgs/dist/illustrations/project-create-new-sm.svg?url';
-import PROJECT_IMPORT_SVG_URL from '@gitlab/svgs/dist/illustrations/project-import-sm.svg?url';
-import PROJECT_RUN_CICD_PIPELINES_SVG_URL from '@gitlab/svgs/dist/illustrations/empty-state/empty-devops-md.svg?url';
 import SafeHtml from '~/vue_shared/directives/safe_html';
 import { s__ } from '~/locale';
 import NewNamespacePage from '~/vue_shared/new_namespace/new_namespace_page.vue';
@@ -19,7 +15,6 @@ const PANELS = [
     description: s__(
       'ProjectsNew|Create a blank project to store your files, plan your work, and collaborate on code, among other things.',
     ),
-    imageSrc: PROJECT_CREATE_NEW_SVG_URL,
   },
   {
     key: 'template',
@@ -29,7 +24,6 @@ const PANELS = [
     description: s__(
       'ProjectsNew|Create a project pre-populated with the necessary files to get you started quickly.',
     ),
-    imageSrc: PROJECT_CREATE_FROM_TEMPLATE_SVG_URL,
   },
   {
     key: 'import',
@@ -39,7 +33,6 @@ const PANELS = [
     description: s__(
       'ProjectsNew|Migrate your data from an external source like GitHub, Bitbucket, or another instance of GitLab.',
     ),
-    imageSrc: PROJECT_IMPORT_SVG_URL,
   },
   {
     key: 'ci',
@@ -47,7 +40,6 @@ const PANELS = [
     selector: '#ci-cd-project-pane',
     title: s__('ProjectsNew|Run CI/CD for external repository'),
     description: s__('ProjectsNew|Connect your external repository to GitLab CI/CD.'),
-    imageSrc: PROJECT_RUN_CICD_PIPELINES_SVG_URL,
   },
 ];
 

app/assets/javascripts/vue_shared/new_namespace/new_namespace_page.vue

@@ -4,12 +4,14 @@ import NewTopLevelGroupAlert from '~/groups/components/new_top_level_group_alert
 import SuperSidebarToggle from '~/super_sidebar/components/super_sidebar_toggle.vue';
 import { sidebarState, JS_TOGGLE_EXPAND_CLASS } from '~/super_sidebar/constants';
 import { s__ } from '~/locale';
+import PageHeading from '~/vue_shared/components/page_heading.vue';
 import LegacyContainer from './components/legacy_container.vue';
 import WelcomePage from './components/welcome.vue';
 
 export default {
   JS_TOGGLE_EXPAND_CLASS,
   components: {
+    PageHeading,
     NewTopLevelGroupAlert,
     GlBreadcrumb,
     GlIcon,
@@ -150,19 +152,13 @@ export default {
     </div>
 
     <template v-if="activePanel">
-      <div data-testid="active-panel-template" class="gl-flex gl-items-center gl-py-5">
-        <div class="col-auto">
-          <img aria-hidden="true" :src="activePanel.imageSrc" :alt="activePanel.title" />
-        </div>
-        <div class="col">
-          <h1 class="gl-heading-2-fixed gl-my-3">{{ activePanel.title }}</h1>
-
-          <p v-if="hasTextDetails">{{ details }}</p>
+      <page-heading :heading="activePanel.title" data-testid="active-panel-template">
+        <template #description>
+          <template v-if="hasTextDetails">{{ details }}</template>
           <component :is="details" v-else v-bind="detailProps" />
-        </div>
-
-        <slot name="extra-description"></slot>
-      </div>
+          <slot name="extra-description"></slot>
+        </template>
+      </page-heading>
 
       <gl-alert
         v-if="identityVerificationRequired"

app/assets/stylesheets/framework/crud.scss

@@ -113,3 +113,7 @@ $crud-header-min-height: px-to-rem(49px);
     margin-bottom: 0;
   }
 }
+
+.crud-body .gl-alert {
+  @apply dark:gl-bg-strong;
+}

app/controllers/projects_controller.rb

@@ -54,6 +54,8 @@ class ProjectsController < Projects::ApplicationController
     push_force_frontend_feature_flag(:work_items, @project&.work_items_feature_flag_enabled?)
     push_force_frontend_feature_flag(:work_items_beta, @project&.work_items_beta_feature_flag_enabled?)
     push_force_frontend_feature_flag(:work_items_alpha, @project&.work_items_alpha_feature_flag_enabled?)
+    # FF to enable setting to allow webhook execution on 30D and 60D notification delivery too
+    push_frontend_feature_flag(:extended_expiry_webhook_execution_setting, @project&.namespace)
     push_frontend_feature_flag(:work_item_description_templates, @project&.group)
   end
 
@@ -460,7 +462,7 @@ def project_feature_attributes
   end
 
   def project_setting_attributes
-    %i[
+    attributes = %i[
       show_default_award_emojis
       show_diff_preview_in_email
       squash_option
@@ -469,6 +471,13 @@ def project_setting_attributes
       enforce_auth_checks_on_uploads
       emails_enabled
     ]
+
+    if ::Feature.enabled?(:extended_expiry_webhook_execution_setting, @project&.namespace) &&
+        can?(current_user, :admin_project, project)
+      attributes << :extended_prat_expiry_webhooks_execute
+    end
+
+    attributes
   end
 
   def project_params_attributes

app/finders/issuable_finder.rb

@@ -524,18 +524,16 @@ def by_subscribed(items)
   end
 
   def can_filter_by_crm_contact?
-    current_user&.can?(:read_crm_contact, root_group)
+    current_user&.can?(:read_crm_contact, crm_group)
   end
 
   def can_filter_by_crm_organization?
-    current_user&.can?(:read_crm_organization, root_group)
+    current_user&.can?(:read_crm_organization, crm_group)
   end
 
-  def root_group
-    strong_memoize(:root_group) do
-      base_group = params.group || params.project&.group
-
-      base_group&.root_ancestor
+  def crm_group
+    strong_memoize(:crm_group) do
+      params.group&.crm_group || params.project&.crm_group
     end
   end
 end

app/graphql/resolvers/wikis/wiki_page_resolver.rb

@@ -5,6 +5,8 @@ module Wikis
     class WikiPageResolver < BaseResolver
       description 'Retrieve a wiki page'
 
+      calls_gitaly!
+
       type Types::Wikis::WikiPageType, null: true
 
       argument :slug, GraphQL::Types::String, required: false, description: 'Wiki page slug.'
@@ -28,7 +30,10 @@ def resolve(slug: nil, namespace_id: nil, project_id: nil)
 
         return unless slug.present? && container.present?
 
-        ::WikiPage::Meta.find_by_canonical_slug(slug, container)
+        wiki = Wiki.for_container(container, current_user)
+        page = wiki.find_page(slug, load_content: false)
+
+        page&.find_or_create_meta
       end
 
       private

app/graphql/types/query_type.rb

@@ -196,7 +196,8 @@ class QueryType < ::Types::BaseObject
       null: true,
       resolver: Resolvers::Wikis::WikiPageResolver,
       experiment: { milestone: '17.6' },
-      description: 'Find a wiki page.'
+      description: 'Find a wiki page.',
+      calls_gitaly: true
     field :work_item, Types::WorkItemType,
       null: true,
       resolver: Resolvers::WorkItemResolver,

app/helpers/issues_helper.rb

@@ -165,8 +165,8 @@ def project_issues_list_data(project, current_user)
       can_create_issue: can?(current_user, :create_issue, project).to_s,
       can_edit: can?(current_user, :admin_project, project).to_s,
       can_import_issues: can?(current_user, :import_issues, @project).to_s,
-      can_read_crm_contact: can?(current_user, :read_crm_contact, project.group).to_s,
-      can_read_crm_organization: can?(current_user, :read_crm_organization, project.group).to_s,
+      can_read_crm_contact: can?(current_user, :read_crm_contact, project.crm_group).to_s,
+      can_read_crm_organization: can?(current_user, :read_crm_organization, project.crm_group).to_s,
       email: current_user&.notification_email_or_default,
       emails_help_page_path: help_page_path('development/emails.md', anchor: 'email-namespace'),
       export_csv_path: export_csv_project_issues_path(project),
@@ -188,8 +188,8 @@ def project_issues_list_data(project, current_user)
   def group_issues_list_data(group, current_user)
     common_issues_list_data(group, current_user).merge(
       can_create_projects: can?(current_user, :create_projects, group).to_s,
-      can_read_crm_contact: can?(current_user, :read_crm_contact, group).to_s,
-      can_read_crm_organization: can?(current_user, :read_crm_organization, group).to_s,
+      can_read_crm_contact: can?(current_user, :read_crm_contact, group.crm_group).to_s,
+      can_read_crm_organization: can?(current_user, :read_crm_organization, group.crm_group).to_s,
       group_id: group.id,
       has_any_issues: @has_issues.to_s,
       has_any_projects: @has_projects.to_s,

app/helpers/projects_helper.rb

@@ -949,6 +949,7 @@ def project_permissions_settings(project)
       containerRegistryEnabled: !!project.container_registry_enabled,
       lfsEnabled: !!project.lfs_enabled,
       emailsEnabled: project.emails_enabled?,
+      extendedPratExpiryWebhooksExecute: project.extended_prat_expiry_webhooks_execute?,
       showDiffPreviewInEmail: project.show_diff_preview_in_email?,
       monitorAccessLevel: feature.monitor_access_level,
       showDefaultAwardEmojis: project.show_default_award_emojis?,

app/models/project.rb

@@ -580,6 +580,7 @@ def self.integration_association_name(name)
     delegate :mr_default_target_self, :mr_default_target_self=
     delegate :previous_default_branch, :previous_default_branch=
     delegate :squash_option, :squash_option=
+    delegate :extended_prat_expiry_webhooks_execute, :extended_prat_expiry_webhooks_execute=
 
     with_options allow_nil: true do
       delegate :merge_commit_template, :merge_commit_template=
@@ -1235,6 +1236,10 @@ def warn_about_potentially_unwanted_characters?
     !!project_setting&.warn_about_potentially_unwanted_characters?
   end
 
+  def extended_prat_expiry_webhooks_execute?
+    !!project_setting&.extended_prat_expiry_webhooks_execute?
+  end
+
   def no_import?
     !!import_state&.no_import?
   end
@@ -1980,7 +1985,19 @@ def execute_hooks(data, hooks_scope = :push_hooks)
 
   def triggered_hooks(hooks_scope, data)
     triggered = ::Projects::TriggeredHooks.new(hooks_scope, data)
-    triggered.add_hooks(hooks)
+
+    # By default the webhook resource_access_token_hooks will execute for
+    # seven_days interval but we have a setting to allow webhook execution
+    # for thirty_days and sixty_days interval too.
+    if hooks_scope == :resource_access_token_hooks &&
+        ::Feature.enabled?(:extended_expiry_webhook_execution_setting, self.namespace) &&
+        data[:interval] != :seven_days &&
+        !self.extended_prat_expiry_webhooks_execute?
+
+      triggered
+    else
+      triggered.add_hooks(hooks)
+    end
   end
 
   def execute_integrations(data, hooks_scope = :push_hooks, skip_ci: false)

app/models/wiki_page.rb

@@ -71,8 +71,8 @@ def initialize(wiki, page = nil)
     set_attributes if persisted?
   end
 
-  def meta
-    WikiPage::Meta.find_by_canonical_slug(slug, container)
+  def find_or_create_meta
+    WikiPage::Meta.find_or_create(slug, self)
   end
 
   # The escaped URL path of this page.

app/services/concerns/integrations/project_test_data.rb

@@ -107,7 +107,7 @@ def access_tokens_events_data
         expires_at: 2.days.from_now
       )
 
-      Gitlab::DataBuilder::ResourceAccessToken.build(resource_access_token, :expiring, project)
+      Gitlab::DataBuilder::ResourceAccessTokenPayload.build(resource_access_token, :expiring, project)
     end
 
     def vulnerability_events_data

app/views/groups/_import_group_from_another_instance_panel.html.haml

 - bulk_imports_enabled = Gitlab::CurrentSettings.bulk_import_enabled?
 
-= gitlab_ui_form_with url: configure_import_bulk_imports_path(namespace_id: params[:parent_id]), class: 'gl-show-field-errors' do |f|
-  .gl-border-l-solid.gl-border-r-solid.gl-border-t-solid.gl-border-default.gl-border-1.gl-p-5.gl-mt-4
-    .gl-flex.gl-items-center.gl-justify-between
-      %h2.gl-flex.gl-heading-2-fixed.gl-my-3
-        = s_('GroupsNew|Import groups by direct transfer')
-      = render Pajamas::ButtonComponent.new(href: history_import_bulk_imports_path, category: :secondary, variant: :confirm, size: :small) do
-        = s_('BulkImport|View import history')
+.gl-flex.gl-flex-col.gl-gap-5
+  - if !bulk_imports_enabled
+    = render Pajamas::AlertComponent.new(dismissible: false, variant: :tip) do |c|
+      - c.with_body do
+        = s_('GroupsNew|Importing groups by direct transfer is currently disabled.')
 
-    - if !bulk_imports_enabled
-      = render Pajamas::AlertComponent.new(dismissible: false, variant: :tip) do |c|
-        - c.with_body do
-          = s_('GroupsNew|Importing groups by direct transfer is currently disabled.')
+        - if current_user.admin?
+          - admin_link = link_to('', general_admin_application_settings_path(anchor: 'js-import-export-settings'))
 
-          - if current_user.admin?
-            - admin_link = link_to('', general_admin_application_settings_path(anchor: 'js-import-export-settings'))
+          = safe_format(s_('GroupsNew|Please %{admin_link_start}enable it in the Admin settings%{admin_link_end}.'), tag_pair(admin_link, :admin_link_start, :admin_link_end))
+        - else
+          = s_('GroupsNew|Please ask your Administrator to enable it in the Admin settings.')
 
-            = safe_format(s_('GroupsNew|Please %{admin_link_start}enable it in the Admin settings%{admin_link_end}.'), tag_pair(admin_link, :admin_link_start, :admin_link_end))
-          - else
-            = s_('GroupsNew|Please ask your Administrator to enable it in the Admin settings.')
+        = s_('GroupsNew|Remember to enable it also on the instance you are migrating from.')
+  - else
+    = render ::Layouts::CrudComponent.new(s_('GroupsNew|Import groups by direct transfer')) do |c|
+      - c.with_actions do
+        = render Pajamas::ButtonComponent.new(href: history_import_bulk_imports_path, size: :small) do
+          = s_('BulkImport|View import history')
+      - c.with_body do
+        = render Pajamas::AlertComponent.new(dismissible: false,
+          variant: :warning) do |c|
+          - c.with_body do
+            - docs_link = link_to('', help_page_path('user/group/import/migrated_items.md', anchor: 'migrated-group-items'), target: '_blank', rel: 'noopener noreferrer')
+            = safe_format(s_('GroupsNew|Not all group items are migrated. %{docs_link_start}What items are migrated%{docs_link_end}?'), tag_pair(docs_link, :docs_link_start, :docs_link_end))
 
-          = s_('GroupsNew|Remember to enable it also on the instance you are migrating from.')
-    - else
-      = render Pajamas::AlertComponent.new(dismissible: false,
-        variant: :warning) do |c|
-        - c.with_body do
-          - docs_link = link_to('', help_page_path('user/group/import/migrated_items.md', anchor: 'migrated-group-items'), target: '_blank', rel: 'noopener noreferrer')
-          = safe_format(s_('GroupsNew|Not all group items are migrated. %{docs_link_start}What items are migrated%{docs_link_end}?'), tag_pair(docs_link, :docs_link_start, :docs_link_end))
+        = gitlab_ui_form_with url: configure_import_bulk_imports_path(namespace_id: params[:parent_id]), class: 'gl-show-field-errors' do |f|
+          %p.gl-mt-5.gl-mb-3
+            - url_link = link_to('', help_page_path('user/group/import/direct_transfer_migrations.md', anchor: 'connect-the-source-gitlab-instance'), target: '_blank', rel: 'noopener noreferrer')
+            = safe_format(s_('GroupsNew|Provide credentials for the %{url_link_start}source instance%{url_link_end} to import from. You can provide this instance as a source to move groups within this instance.'), tag_pair(url_link, :url_link_start, :url_link_end))
+          .form-group.gl-form-group.gl-flex.gl-flex-col
+            = f.label :bulk_import_gitlab_url, s_('GroupsNew|GitLab source instance base URL'), for: 'import_gitlab_url'
+            = f.text_field :bulk_import_gitlab_url, disabled: !bulk_imports_enabled, placeholder: 'https://gitlab.example.com', class: 'gl-form-input col-xs-12 col-sm-8',
+              required: true,
+              title: s_('GroupsNew|Enter the URL for the source instance.'),
+              id: 'import_gitlab_url',
+              data: { testid: 'import-gitlab-url' }
+            %small.form-text.gl-text-subtle
+              = s_('Import|Must only contain the base URL of the source GitLab instance.')
+          .form-group.gl-form-group.gl-flex.gl-flex-col
+            = f.label :bulk_import_gitlab_access_token, s_('GroupsNew|Personal access token'), for: 'import_gitlab_token', class: 'col-form-label'
+            .gl-text-subtle
+              - pat_link = link_to('', help_page_path('user/profile/personal_access_tokens.md'), target: '_blank')
+              - short_living_link = link_to('', help_page_path('security/tokens/_index.md', anchor: 'security-considerations'), target: '_blank')
+              = safe_format(s_('GroupsNew|Create a token in the %{pat_link_start}user settings%{pat_link_end} of the source GitLab instance with the %{code_start}api%{code_end} scope. For source instances on GitLab 15.0 or earlier, the token must additionally have the %{code_start}read_repository%{code_end} scope. For %{short_living_link_start}security reasons%{short_living_link_end}, set a short expiration date for the token. Keep in mind that large migrations take more time.'), tag_pair('<code></code>'.html_safe, :code_start , :code_end), tag_pair(pat_link, :pat_link_start, :pat_link_end), tag_pair(short_living_link, :short_living_link_start, :short_living_link_end))
+            = f.password_field :bulk_import_gitlab_access_token, placeholder: s_('GroupsNew|e.g. h8d3f016698e...'), class: 'gl-form-input gl-mt-3 col-xs-12 col-sm-8',
+              required: true,
+              disabled: !bulk_imports_enabled,
+              autocomplete: 'off',
+              title: s_('GroupsNew|Please fill in your personal access token.'),
+              id: 'import_gitlab_token',
+              data: { testid: 'import-gitlab-token' }
 
-    %p.gl-mt-5.gl-mb-3
-      - url_link = link_to('', help_page_path('user/group/import/direct_transfer_migrations.md', anchor: 'connect-the-source-gitlab-instance'), target: '_blank', rel: 'noopener noreferrer')
-      = safe_format(s_('GroupsNew|Provide credentials for the %{url_link_start}source instance%{url_link_end} to import from. You can provide this instance as a source to move groups within this instance.'), tag_pair(url_link, :url_link_start, :url_link_end))
-    .form-group.gl-form-group.gl-flex.gl-flex-col
-      = f.label :bulk_import_gitlab_url, s_('GroupsNew|GitLab source instance base URL'), for: 'import_gitlab_url'
-      = f.text_field :bulk_import_gitlab_url, disabled: !bulk_imports_enabled, placeholder: 'https://gitlab.example.com', class: 'gl-form-input col-xs-12 col-sm-8',
-        required: true,
-        title: s_('GroupsNew|Enter the URL for the source instance.'),
-        id: 'import_gitlab_url',
-        data: { testid: 'import-gitlab-url' }
-      %small.form-text.gl-text-subtle
-        = s_('Import|Must only contain the base URL of the source GitLab instance.')
-    .form-group.gl-form-group.gl-flex.gl-flex-col
-      = f.label :bulk_import_gitlab_access_token, s_('GroupsNew|Personal access token'), for: 'import_gitlab_token', class: 'col-form-label'
-      .gl-font-normal
-        - pat_link = link_to('', help_page_path('user/profile/personal_access_tokens.md'), target: '_blank')
-        - short_living_link = link_to('', help_page_path('security/tokens/_index.md', anchor: 'security-considerations'), target: '_blank')
-        = safe_format(s_('GroupsNew|Create a token in the %{pat_link_start}user settings%{pat_link_end} of the source GitLab instance with the %{code_start}api%{code_end} scope. For source instances on GitLab 15.0 or earlier, the token must additionally have the %{code_start}read_repository%{code_end} scope. For %{short_living_link_start}security reasons%{short_living_link_end}, set a short expiration date for the token. Keep in mind that large migrations take more time.'), tag_pair('<code></code>'.html_safe, :code_start , :code_end), tag_pair(pat_link, :pat_link_start, :pat_link_end), tag_pair(short_living_link, :short_living_link_start, :short_living_link_end))
-      = f.password_field :bulk_import_gitlab_access_token, placeholder: s_('GroupsNew|e.g. h8d3f016698e...'), class: 'gl-form-input gl-mt-3 col-xs-12 col-sm-8',
-        required: true,
-        disabled: !bulk_imports_enabled,
-        autocomplete: 'off',
-        title: s_('GroupsNew|Please fill in your personal access token.'),
-        id: 'import_gitlab_token',
-        data: { testid: 'import-gitlab-token' }
-  .gl-border-default.gl-border-solid.gl-border-1.gl-p-5
-    = f.submit s_('GroupsNew|Connect instance'), disabled: !bulk_imports_enabled, pajamas_button: true, data: { testid: 'connect-instance-button' }
+          = f.submit s_('GroupsNew|Connect instance'), disabled: !bulk_imports_enabled, pajamas_button: true, data: { testid: 'connect-instance-button' }

app/views/groups/_import_group_from_file_panel.html.haml

@@ -2,10 +2,8 @@
 - group_path = root_url
 - group_path << parent.full_path + '/' if parent
 
-= gitlab_ui_form_for '', url: import_gitlab_group_path, namespace: 'import_group', class: 'group-form gl-show-field-errors', multipart: true do |f|
-  .gl-border-l-solid.gl-border-r-solid.gl-border-default.gl-border-1.gl-p-5
-    %h2.gl-heading-2-fixed.gl-my-3
-      = _('Import group from file')
+= render ::Layouts::CrudComponent.new(_('Import group from file')) do |c|
+  - c.with_body do
     = render Pajamas::AlertComponent.new(variant: :warning,
       alert_options: { class: 'gl-mb-5' },
       dismissible: false) do |c|
@@ -13,13 +11,15 @@
         - docs_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/group/import/_index.md') }
         - link_end = '</a>'.html_safe
         = s_('GroupsNew|This feature is deprecated and replaced by group migration by direct transfer. %{docs_link_start}Learn more%{docs_link_end}.').html_safe % { docs_link_start: docs_link_start, docs_link_end: link_end }
-    = render 'shared/groups/group_name_and_path_fields', f: f
-    .form-group
-      = f.label :file, s_('GroupsNew|Upload file')
-      .gl-font-normal
-        - import_export_link_start = '<a href="%{url}" target="_blank">'.html_safe % { url: help_page_path('user/project/settings/import_export.md', anchor: 'migrate-groups-by-uploading-an-export-file-deprecated') }
-        = s_('GroupsNew|To import a group, navigate to the group settings for the GitLab source instance, %{link_start}generate an export file%{link_end}, and upload it here.').html_safe % { link_start: import_export_link_start, link_end: '</a>'.html_safe }
-      .gl-mt-3
-        = render 'shared/file_picker_button', f: f, field: :file, help_text: nil
-  .gl-border-default.gl-border-solid.gl-border-1.gl-p-5
-    = f.submit _('Import'), pajamas_button: true
+
+    = gitlab_ui_form_for '', url: import_gitlab_group_path, namespace: 'import_group', class: 'group-form gl-show-field-errors', multipart: true do |f|
+      = render 'shared/groups/group_name_and_path_fields', f: f
+      .form-group
+        = f.label :file, s_('GroupsNew|Upload file')
+        .gl-text-subtle
+          - import_export_link_start = '<a href="%{url}" target="_blank">'.html_safe % { url: help_page_path('user/project/settings/import_export.md', anchor: 'migrate-groups-by-uploading-an-export-file-deprecated') }
+          = s_('GroupsNew|To import a group, navigate to the group settings for the GitLab source instance, %{link_start}generate an export file%{link_end}, and upload it here.').html_safe % { link_start: import_export_link_start, link_end: '</a>'.html_safe }
+        .gl-mt-3
+          = render 'shared/file_picker_button', f: f, field: :file, help_text: nil
+
+      = f.submit _('Import'), pajamas_button: true

app/views/groups/_new_group_fields.html.haml

@@ -7,7 +7,7 @@
   .form-group.gl-form-group.col-sm-12
     %label.label-bold
       = _('Visibility level')
-    %p
+    %p.gl-text-subtle
       = _('Who will be able to see this group?')
       = link_to _('View the documentation'), help_page_path("user/public_access.md"), target: '_blank', rel: 'noopener noreferrer'
     = render 'shared/visibility_level', f: f, visibility_level: default_group_visibility, can_change_visibility_level: true, form_model: @group, with_label: false
@@ -29,7 +29,7 @@
       .col-sm-4
         = recaptcha_tags nonce: content_security_policy_nonce
 .row
-  .col-sm-12
+  .col-sm-12.gl-flex.gl-gap-3
     = f.submit submit_label, pajamas_button: true, data: { testid: 'create-group-button' }
     = render Pajamas::ButtonComponent.new(href: @parent_group || dashboard_groups_path) do
       = _('Cancel')

app/views/groups/_personalize.html.haml

@@ -2,7 +2,7 @@
   .form-group.col-sm-12.gl-mb-0
     %label.label-bold
       = _('Now, personalize your GitLab experience')
-    %p
+    %p.gl-text-subtle
       = _("We'll use this to help surface the right features and information to you.")
 
 .row