Commit 0b2af0c8 authored by Nicolò Maria Mezzopera's avatar Nicolò Maria Mezzopera Committed by Martin Wortschack

Add feature flag to load new markup

- move old code to legacy
- fix feature tests
parent 5d56db52
......@@ -11,7 +11,13 @@ export default {
props: {
projectId: {
type: String,
required: true,
required: false,
default: '',
},
groupId: {
type: String,
required: false,
default: '',
},
canDestroyPackage: {
type: Boolean,
......
......@@ -11,14 +11,17 @@ export default () =>
PackagesListApp,
},
data() {
const { dataset } = document.querySelector(this.$options.el);
const {
dataset: { projectId, groupId, emptyListIllustration, emptyListHelpUrl, canDestroyPackage },
} = document.querySelector(this.$options.el);
return {
packageListAttrs: {
projectId: dataset.projectId,
emptyListIllustration: dataset.emptyListIllustration,
emptyListHelpUrl: dataset.emptyListHelpUrl,
canDestroyPackage: dataset.canDestroyPackage,
projectId,
groupId,
emptyListIllustration,
emptyListHelpUrl,
canDestroyPackage,
},
};
},
......
import initPackageList from 'ee/packages/list/packages_list_app_bundle';
document.addEventListener('DOMContentLoaded', initPackageList);
- sort_value = @sort
- sort_title = packages_sort_option_title(sort_value)
- if @packages.any?
.d-flex.justify-content-end
.dropdown.inline.prepend-top-default.append-bottom-default.package-sort-dropdown
.btn-group{ role: 'group' }
.btn-group{ role: 'group' }
%button.dropdown-menu-toggle{ type: 'button', data: { toggle: 'dropdown', display: 'static', 'qa-selector': 'sort-dropdown-button' }, class: 'btn btn-default' }
= sort_title
= icon('chevron-down')
%ul.dropdown-menu.dropdown-menu-right.dropdown-menu-selectable.dropdown-menu-sort
%li
= sortable_item(sort_title_created_date, package_sort_path(sort: sort_value_recently_created), sort_title)
= sortable_item(sort_title_name, package_sort_path(sort: sort_value_name_desc), sort_title)
= sortable_item(sort_title_project_name, package_sort_path(sort: sort_value_project_name_desc), sort_title)
= sortable_item(sort_title_version, package_sort_path(sort: sort_value_version_desc), sort_title)
= sortable_item(sort_title_type, package_sort_path(sort: sort_value_type_desc), sort_title)
= packages_sort_direction_button(sort_value)
.table-holder
.gl-responsive-table-row.table-row-header.bg-secondary-50.px-2.border-top{ role: 'row' }
.table-section.section-30{ role: 'rowheader' }
= _('Name')
.table-section.section-20{ role: 'rowheader' }
= _('Project')
.table-section.section-20{ role: 'rowheader' }
= _('Version')
.table-section.section-10{ role: 'rowheader' }
= _('Type')
.table-section.section-20{ role: 'rowheader' }
= _('Created')
- @packages.each do |package|
.gl-responsive-table-row{ data: { 'qa-selector': 'package-row' } }
.table-section.section-30
.table-mobile-header{ role: "rowheader" }= _("Name")
.table-mobile-content.flex-truncate-parent
= link_to package.name, project_package_path(package.project, package), class: 'flex-truncate-child'
.table-section.section-20
.table-mobile-header{ role: "rowheader" }= _("Project")
.table-mobile-content
= link_to_project(package.project)
.table-section.section-20
.table-mobile-header{ role: "rowheader" }= _("Version")
.table-mobile-content
= package.version
.table-section.section-10
.table-mobile-header{ role: "rowheader" }= _("Type")
.table-mobile-content
= package.package_type
.table-section.section-20
.table-mobile-header{ role: "rowheader" }= _("Created")
.table-mobile-content
= time_ago_with_tooltip(package.created_at)
= paginate @packages, theme: "gitlab"
- else
.row.empty-state
.col-12
= render 'shared/packages/no_packages'
- page_title _("Packages")
- sort_value = @sort
- sort_title = packages_sort_option_title(sort_value)
- if @packages.any?
.d-flex.justify-content-end
.dropdown.inline.prepend-top-default.append-bottom-default.package-sort-dropdown
.btn-group{ role: 'group' }
.btn-group{ role: 'group' }
%button.dropdown-menu-toggle{ type: 'button', data: { toggle: 'dropdown', display: 'static', 'qa-selector': 'sort-dropdown-button' }, class: 'btn btn-default' }
= sort_title
= icon('chevron-down')
%ul.dropdown-menu.dropdown-menu-right.dropdown-menu-selectable.dropdown-menu-sort
%li
= sortable_item(sort_title_created_date, package_sort_path(sort: sort_value_recently_created), sort_title)
= sortable_item(sort_title_name, package_sort_path(sort: sort_value_name_desc), sort_title)
= sortable_item(sort_title_project_name, package_sort_path(sort: sort_value_project_name_desc), sort_title)
= sortable_item(sort_title_version, package_sort_path(sort: sort_value_version_desc), sort_title)
= sortable_item(sort_title_type, package_sort_path(sort: sort_value_type_desc), sort_title)
= packages_sort_direction_button(sort_value)
- if vue_package_list_enabled_for?(@group)
.row
.col-12
#js-vue-packages-list{ data: { group_id: @group.id,
empty_list_help_url: help_page_path('administration/packages/index'),
empty_list_illustration: image_path('illustrations/no-packages.svg') } }
.table-holder
.gl-responsive-table-row.table-row-header.bg-secondary-50.px-2.border-top{ role: 'row' }
.table-section.section-30{ role: 'rowheader' }
= _('Name')
.table-section.section-20{ role: 'rowheader' }
= _('Project')
.table-section.section-20{ role: 'rowheader' }
= _('Version')
.table-section.section-10{ role: 'rowheader' }
= _('Type')
.table-section.section-20{ role: 'rowheader' }
= _('Created')
- @packages.each do |package|
.gl-responsive-table-row{ data: { 'qa-selector': 'package-row' } }
.table-section.section-30
.table-mobile-header{ role: "rowheader" }= _("Name")
.table-mobile-content.flex-truncate-parent
= link_to package.name, project_package_path(package.project, package), class: 'flex-truncate-child'
.table-section.section-20
.table-mobile-header{ role: "rowheader" }= _("Project")
.table-mobile-content
= link_to_project(package.project)
.table-section.section-20
.table-mobile-header{ role: "rowheader" }= _("Version")
.table-mobile-content
= package.version
.table-section.section-10
.table-mobile-header{ role: "rowheader" }= _("Type")
.table-mobile-content
= package.package_type
.table-section.section-20
.table-mobile-header{ role: "rowheader" }= _("Created")
.table-mobile-content
= time_ago_with_tooltip(package.created_at)
= paginate @packages, theme: "gitlab"
- else
.row.empty-state
.col-12
= render 'shared/packages/no_packages'
= render "legacy_package_list"
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment