Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DataViews: rename onSelectionChange to onChangeSelection #63087

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion packages/dataviews/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,11 @@

## Unreleased

## 3.0.0 (2024-07-10)
### Breaking Changes

- `onSelectionChange` has been renamed to `onChangeSelection`.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be under a Breaking Changes section, right?


## 3.0.0 (2024-07-10)

### Breaking Changes

Expand Down
2 changes: 1 addition & 1 deletion packages/dataviews/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -278,7 +278,7 @@ Whether the data is loading. `false` by default.

Default layouts. By default, uses empty layouts: `table`, `grid`, `list`.

### `onSelectionChange`: `function`
### `onChangeSelection`: `function`

Callback that signals the user selected one of more items, and takes them as parameter. So far, only the `list` view implements it.

Expand Down
18 changes: 9 additions & 9 deletions packages/dataviews/src/bulk-actions-toolbar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,14 +33,14 @@ interface ToolbarContentProps< Item > {
selection: string[];
actionsToShow: Action< Item >[];
selectedItems: Item[];
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
}

interface BulkActionsToolbarProps< Item > {
data: Item[];
selection: string[];
actions: Action< Item >[];
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
getItemId: ( item: Item ) => string;
}

Expand Down Expand Up @@ -131,7 +131,7 @@ function renderToolbarContent< Item >(
selectedItems: Item[],
actionInProgress: string | null,
setActionInProgress: ( actionId: string | null ) => void,
onSelectionChange: SetSelection
onChangeSelection: SetSelection
) {
return (
<>
Expand Down Expand Up @@ -171,7 +171,7 @@ function renderToolbarContent< Item >(
label={ __( 'Cancel' ) }
disabled={ !! actionInProgress }
onClick={ () => {
onSelectionChange( EMPTY_ARRAY );
onChangeSelection( EMPTY_ARRAY );
} }
/>
</ToolbarGroup>
Expand All @@ -183,7 +183,7 @@ function ToolbarContent< Item >( {
selection,
actionsToShow,
selectedItems,
onSelectionChange,
onChangeSelection,
}: ToolbarContentProps< Item > ) {
const [ actionInProgress, setActionInProgress ] = useState< string | null >(
null
Expand All @@ -199,7 +199,7 @@ function ToolbarContent< Item >( {
selectedItems,
actionInProgress,
setActionInProgress,
onSelectionChange
onChangeSelection
);
} else if ( ! buttons.current ) {
buttons.current = renderToolbarContent(
Expand All @@ -208,7 +208,7 @@ function ToolbarContent< Item >( {
selectedItems,
actionInProgress,
setActionInProgress,
onSelectionChange
onChangeSelection
);
}
return buttons.current;
Expand All @@ -218,7 +218,7 @@ export default function BulkActionsToolbar< Item >( {
data,
selection,
actions = EMPTY_ARRAY,
onSelectionChange,
onChangeSelection,
getItemId,
}: BulkActionsToolbarProps< Item > ) {
const isReducedMotion = useReducedMotion();
Expand Down Expand Up @@ -266,7 +266,7 @@ export default function BulkActionsToolbar< Item >( {
selection={ selection }
actionsToShow={ actionsToShow }
selectedItems={ selectedItems }
onSelectionChange={ onSelectionChange }
onChangeSelection={ onChangeSelection }
/>
</div>
</Toolbar>
Expand Down
8 changes: 4 additions & 4 deletions packages/dataviews/src/bulk-actions.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ interface BulkActionsProps< Item > {
data: Item[];
actions: Action< Item >[];
selection: string[];
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
getItemId: ( item: Item ) => string;
}

Expand Down Expand Up @@ -184,7 +184,7 @@ export default function BulkActions< Item >( {
data,
actions,
selection,
onSelectionChange,
onChangeSelection,
getItemId,
}: BulkActionsProps< Item > ) {
const bulkActions = useMemo(
Expand Down Expand Up @@ -256,7 +256,7 @@ export default function BulkActions< Item >( {
disabled={ areAllSelected }
hideOnClick={ false }
onClick={ () => {
onSelectionChange(
onChangeSelection(
selectableItems.map( ( item ) =>
getItemId( item )
)
Expand All @@ -270,7 +270,7 @@ export default function BulkActions< Item >( {
disabled={ selection.length === 0 }
hideOnClick={ false }
onClick={ () => {
onSelectionChange( [] );
onChangeSelection( [] );
} }
>
{ __( 'Deselect' ) }
Expand Down
14 changes: 7 additions & 7 deletions packages/dataviews/src/dataviews.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,14 +51,14 @@ type DataViewsProps< Item > = {
defaultLayouts: SupportedLayouts;
selection?: string[];
setSelection?: SetSelection;
onSelectionChange?: ( items: Item[] ) => void;
onChangeSelection?: ( items: Item[] ) => void;
} & ( Item extends ItemWithId
? { getItemId?: ( item: Item ) => string }
: { getItemId: ( item: Item ) => string } );

const defaultGetItemId = ( item: ItemWithId ) => item.id;

const defaultOnSelectionChange = () => {};
const defaultOnChangeSelection = () => {};

export default function DataViews< Item >( {
view,
Expand All @@ -74,7 +74,7 @@ export default function DataViews< Item >( {
defaultLayouts,
selection: selectionProperty,
setSelection: setSelectionProperty,
onSelectionChange = defaultOnSelectionChange,
onChangeSelection = defaultOnChangeSelection,
}: DataViewsProps< Item > ) {
const [ selectionState, setSelectionState ] = useState< string[] >( [] );
const isUncontrolled =
Expand All @@ -88,7 +88,7 @@ export default function DataViews< Item >( {
function setSelectionWithChange( value: SelectionOrUpdater ) {
const newValue =
typeof value === 'function' ? value( selection ) : value;
onSelectionChange(
onChangeSelection(
data.filter( ( item ) => newValue.includes( getItemId( item ) ) )
);
return setSelection( value );
Expand Down Expand Up @@ -139,7 +139,7 @@ export default function DataViews< Item >( {
<BulkActions
actions={ actions }
data={ data }
onSelectionChange={ setSelectionWithChange }
onChangeSelection={ setSelectionWithChange }
selection={ _selection }
getItemId={ getItemId }
/>
Expand All @@ -158,7 +158,7 @@ export default function DataViews< Item >( {
getItemId={ getItemId }
isLoading={ isLoading }
onChangeView={ onChangeView }
onSelectionChange={ setSelectionWithChange }
onChangeSelection={ setSelectionWithChange }
selection={ _selection }
setOpenedFilter={ setOpenedFilter }
view={ view }
Expand All @@ -174,7 +174,7 @@ export default function DataViews< Item >( {
data={ data }
actions={ actions }
selection={ _selection }
onSelectionChange={ setSelectionWithChange }
onChangeSelection={ setSelectionWithChange }
getItemId={ getItemId }
/>
) }
Expand Down
12 changes: 6 additions & 6 deletions packages/dataviews/src/layouts/grid/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ import type { SetSelection } from '../../private-types';

interface GridItemProps< Item > {
selection: string[];
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
getItemId: ( item: Item ) => string;
item: Item;
actions: Action< Item >[];
Expand All @@ -40,7 +40,7 @@ interface GridItemProps< Item > {

function GridItem< Item >( {
selection,
onSelectionChange,
onChangeSelection,
getItemId,
item,
actions,
Expand Down Expand Up @@ -73,7 +73,7 @@ function GridItem< Item >( {
if ( ! hasBulkAction ) {
return;
}
onSelectionChange(
onChangeSelection(
selection.includes( id )
? selection.filter( ( itemId ) => id !== itemId )
: [ ...selection, id ]
Expand All @@ -91,7 +91,7 @@ function GridItem< Item >( {
<SingleSelectionCheckbox
item={ item }
selection={ selection }
onSelectionChange={ onSelectionChange }
onChangeSelection={ onChangeSelection }
getItemId={ getItemId }
primaryField={ primaryField }
disabled={ ! hasBulkAction }
Expand Down Expand Up @@ -169,7 +169,7 @@ export default function ViewGrid< Item >( {
fields,
getItemId,
isLoading,
onSelectionChange,
onChangeSelection,
selection,
view,
}: ViewGridProps< Item > ) {
Expand Down Expand Up @@ -217,7 +217,7 @@ export default function ViewGrid< Item >( {
<GridItem
key={ getItemId( item ) }
selection={ selection }
onSelectionChange={ onSelectionChange }
onChangeSelection={ onChangeSelection }
getItemId={ getItemId }
item={ item }
actions={ actions }
Expand Down
4 changes: 2 additions & 2 deletions packages/dataviews/src/layouts/list/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -320,7 +320,7 @@ export default function ViewList< Item >( props: ViewListProps< Item > ) {
fields,
getItemId,
isLoading,
onSelectionChange,
onChangeSelection,
selection,
view,
} = props;
Expand All @@ -345,7 +345,7 @@ export default function ViewList< Item >( props: ViewListProps< Item > ) {
);

const onSelect = ( item: Item ) =>
onSelectionChange( [ getItemId( item ) ] );
onChangeSelection( [ getItemId( item ) ] );

const getItemDomId = useCallback(
( item?: Item ) =>
Expand Down
22 changes: 11 additions & 11 deletions packages/dataviews/src/layouts/table/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ import ColumnHeaderMenu from './column-header-menu';

interface BulkSelectionCheckboxProps< Item > {
selection: string[];
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
data: Item[];
actions: Action< Item >[];
getItemId: ( item: Item ) => string;
Expand Down Expand Up @@ -81,12 +81,12 @@ interface TableRowProps< Item > {
primaryField?: NormalizedField< Item >;
selection: string[];
getItemId: ( item: Item ) => string;
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
}

function BulkSelectionCheckbox< Item >( {
selection,
onSelectionChange,
onChangeSelection,
data,
actions,
getItemId,
Expand Down Expand Up @@ -114,9 +114,9 @@ function BulkSelectionCheckbox< Item >( {
indeterminate={ ! areAllSelected && !! selectedItems.length }
onChange={ () => {
if ( areAllSelected ) {
onSelectionChange( [] );
onChangeSelection( [] );
} else {
onSelectionChange(
onChangeSelection(
selectableItems.map( ( item ) => getItemId( item ) )
);
}
Expand Down Expand Up @@ -196,7 +196,7 @@ function TableRow< Item >( {
primaryField,
selection,
getItemId,
onSelectionChange,
onChangeSelection,
}: TableRowProps< Item > ) {
const hasPossibleBulkAction = useHasAPossibleBulkAction( actions, item );
const isSelected = hasPossibleBulkAction && selection.includes( id );
Expand Down Expand Up @@ -235,7 +235,7 @@ function TableRow< Item >( {
! isTouchDevice.current &&
document.getSelection()?.type !== 'Range'
) {
onSelectionChange(
onChangeSelection(
selection.includes( id )
? selection.filter( ( itemId ) => id !== itemId )
: [ ...selection, id ]
Expand All @@ -254,7 +254,7 @@ function TableRow< Item >( {
<SingleSelectionCheckbox
item={ item }
selection={ selection }
onSelectionChange={ onSelectionChange }
onChangeSelection={ onChangeSelection }
getItemId={ getItemId }
primaryField={ primaryField }
disabled={ ! hasPossibleBulkAction }
Expand Down Expand Up @@ -306,7 +306,7 @@ function ViewTable< Item >( {
getItemId,
isLoading = false,
onChangeView,
onSelectionChange,
onChangeSelection,
selection,
setOpenedFilter,
view,
Expand Down Expand Up @@ -372,7 +372,7 @@ function ViewTable< Item >( {
>
<BulkSelectionCheckbox
selection={ selection }
onSelectionChange={ onSelectionChange }
onChangeSelection={ onChangeSelection }
data={ data }
actions={ actions }
getItemId={ getItemId }
Expand Down Expand Up @@ -448,7 +448,7 @@ function ViewTable< Item >( {
primaryField={ primaryField }
selection={ selection }
getItemId={ getItemId }
onSelectionChange={ onSelectionChange }
onChangeSelection={ onChangeSelection }
/>
) ) }
</tbody>
Expand Down
6 changes: 3 additions & 3 deletions packages/dataviews/src/single-selection-checkbox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import type { SetSelection } from './private-types';

interface SingleSelectionCheckboxProps< Item > {
selection: string[];
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
item: Item;
getItemId: ( item: Item ) => string;
primaryField?: Field< Item >;
Expand All @@ -21,7 +21,7 @@ interface SingleSelectionCheckboxProps< Item > {

export default function SingleSelectionCheckbox< Item >( {
selection,
onSelectionChange,
onChangeSelection,
item,
getItemId,
primaryField,
Expand Down Expand Up @@ -54,7 +54,7 @@ export default function SingleSelectionCheckbox< Item >( {
return;
}

onSelectionChange(
onChangeSelection(
selection.includes( id )
? selection.filter( ( itemId ) => id !== itemId )
: [ ...selection, id ]
Expand Down
2 changes: 1 addition & 1 deletion packages/dataviews/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -430,7 +430,7 @@ export interface ViewBaseProps< Item > {
getItemId: ( item: Item ) => string;
isLoading?: boolean;
onChangeView: ( view: View ) => void;
onSelectionChange: SetSelection;
onChangeSelection: SetSelection;
selection: string[];
setOpenedFilter: ( fieldId: string ) => void;
view: View;
Expand Down
Loading
Loading