diff --git a/packages/edit-site/src/components/dataviews/list-view.js b/packages/edit-site/src/components/dataviews/list-view.js index 55a871d3df8c9..df417d75f3291 100644 --- a/packages/edit-site/src/components/dataviews/list-view.js +++ b/packages/edit-site/src/components/dataviews/list-view.js @@ -8,12 +8,29 @@ import { flexRender } from '@tanstack/react-table'; * WordPress dependencies */ import { __ } from '@wordpress/i18n'; -import { chevronDown, chevronUp } from '@wordpress/icons'; -import { Button } from '@wordpress/components'; +import { chevronDown, chevronUp, unseen } from '@wordpress/icons'; +import { + Button, + Icon, + privateApis as componentsPrivateApis, +} from '@wordpress/components'; import { forwardRef } from '@wordpress/element'; +/** + * Internal dependencies + */ +import { unlock } from '../../lock-unlock'; +import { FieldSortingItems } from './view-actions'; + +const { + DropdownMenuV2, + DropdownMenuGroupV2, + DropdownMenuItemV2, + DropdownMenuSeparatorV2, +} = unlock( componentsPrivateApis ); + const sortIcons = { asc: chevronUp, desc: chevronDown }; -function Header( { header } ) { +function HeaderMenu( { dataView, header } ) { if ( header.isPlaceholder ) { return null; } @@ -21,21 +38,46 @@ function Header( { header } ) { header.column.columnDef.header, header.getContext() ); - if ( ! header.column.getCanSort() ) { + const isSortable = !! header.column.getCanSort(); + const isHidable = !! header.column.getCanHide(); + if ( ! isSortable && ! isHidable ) { return text; } - const sortDirection = header.column.getIsSorted(); return ( -