Ensure archived groups cannot be transferred

Problem

Archived groups should not be transferable, as it can cause issues with keeping the archived state. We also don't expect this to be a common use case. As a workaround, to transfer an archived group, users should unarchive the group, transfer it, and archive it again.

Proposal

  • Indicate in the transfer UI that transfer is not possible when a group is archived.
  • Ensure that all subgroups and projects of the archived cannot be transferred either. The transfer option should behave in the same way as above.

Design Audit Finding

Screenshot_2025-04-22_at_12.07.01

  • Inconsistent content levels across advanced function cards (transfer, archive, export)
  • Export and transfer cards contain excessive content, increasing cognitive load
  • Using disabled submit buttons to indicate form validation status doesn't align with Pajamas design system

Design Solutions

  1. Define a consistent pattern for setting page cards to improve consistency and reduce cognitive load. Implement this pattern on the transfer card first as a proof of concept
New card pattern
Screenshot_2025-04-22_at_12.07.18
Before After
Screenshot_2025-04-22_at_12.12.18 Transfer_project_-_default
  1. Make the "Transfer" button active by default and only show inline validation for missing fields when users click the button, reducing clutter when multiple cards appear on the same page. Change the button style from "primary confirm" to "default primary" to reduce the number of primary actions on the settings page.
Before After
Group_48 Group_87
  1. Visual treatments to indicate disabled cards in the archive state
Archived state
Group_89
Pros: minimal distraction, works well when multiple features are disabled

Other considered options can be found under the Design file.

Design Artefacts (Awaiting for UXW approval)

  • Group level

    • New design for "Transfer group"
    • New design for "Archive group"
    • New design for "Unarchive group"

  • Project level

    • New design for "Transfer project"
    • New design for "Archive project"
    • New design for "Unarchive project"

Design file.

Next step

  • Create a new design issue to explore how the updated card pattern can enhance settings functionality

Implementation guide

  1. Create a new transfer_card.vue component in app/assets/javascripts/groups_projects/components
  2. Use GlFormFields to render app/assets/javascripts/groups_projects/components/transfer_locations.vue and show an error message if submitted without selecting a value.
  3. Render transfer_card.vue in app/views/groups/settings/_transfer.html.haml and app/views/projects/_transfer.html.haml
  4. Pass is_archived prop to transfer_card.vue via data attributes. Check group.self_or_ancestor_archived? or project.archived?
  5. Adjust copy based on isArchived prop
  6. Hide submit button based on isArchived prop
  7. Show icon with tooltip in card header based on isArchived prop
Edited by Jason Hung