## Problem statement There are a number of group and project lists throughout GitLab, but they don't all look and function the same way. Furthermore, some of them are built with HAML/Vanilla JavaScript, and some are built with Vue. We've developed a set of Vue components for group and project lists that are compliant with our design system and easily used in multiple places. Migrating the groups overview to these Vue components allows us to do the following: - Reduce technical debit by removing a mix of HAML/Vanilla JavaScript that is hard to maintain and add new dynamic features (bulk editing for example). - Improve the user experience by being able to filter, sort, paginate and use project actions (delete, restore, etc) without full page reloads. - Have a consistent groups and projects UX experience across the product. - Add features to one place and have them propagate to all group and project lists. For example if we want to add a new action such as leaving the Group or project we can add that in one place and it will show on all the lists. Same goes for filters, we can add them to one place and make them available on all lists. - Foundation to add more advanced sorting and filtering and other dynamic features such as bulk editing. ## Before/After video - Before video demonstrating the problems we will be fixing in this Epic - https://youtu.be/lEm2sGmCCtc - After video demonstrating what we fixed - https://www.youtube.com/watch?v=bTFMkm6sWEY ## DRI @peterhegman ## Exit criteria - Groups overview is rendered with shared Vue components ([nested_groups_projects_list.vue](https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/assets/javascripts/vue_shared/components/nested_groups_projects_list/nested_groups_projects_list.vue)) - Legacy code is removed ## Development Log See https://gitlab.com/groups/gitlab-org/-/epics/13790 ## Status Update See https://gitlab.com/groups/gitlab-org/-/epics/12282 ## Start and estimated end date - Start: July 12th, 2025 - Estimated end: October 10th, 2025