[Data views]: Rename accessorFn to getValue (#55434)

WordPress · Oct 18, 2023 · 418a3fc · 418a3fc
1 parent 2525a64
commit 418a3fc
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 17 deletions.
diff --git a/packages/edit-site/src/components/dataviews/dataviews.js b/packages/edit-site/src/components/dataviews/dataviews.js
@@ -29,7 +29,7 @@ export default function DataViews( {
 	const _fields = useMemo( () => {
 		return fields.map( ( field ) => ( {
 			...field,
-			render: field.render || field.accessorFn,
+			render: field.render || field.getValue,
 		} ) );
 	}, [ fields ] );
 	return (

diff --git a/packages/edit-site/src/components/dataviews/view-grid.js b/packages/edit-site/src/components/dataviews/view-grid.js
@@ -29,7 +29,7 @@ export function ViewGrid( { data, fields, view, actions } ) {
 				return (
 					<VStack key={ index }>
 						<div className="dataviews-view-grid__media">
-							{ mediaField?.render( item, view ) || (
+							{ mediaField?.render( { item, view } ) || (
 								<Placeholder
 									withIllustration
 									style={ {
@@ -45,7 +45,7 @@ export function ViewGrid( { data, fields, view, actions } ) {
 								<VStack>
 									{ visibleFields.map( ( field ) => (
 										<div key={ field.id }>
-											{ field.render( item, view ) }
+											{ field.render( { item, view } ) }
 										</div>
 									) ) }
 								</VStack>

diff --git a/packages/edit-site/src/components/dataviews/view-list.js b/packages/edit-site/src/components/dataviews/view-list.js
@@ -146,8 +146,12 @@ function ViewList( {
 } ) {
 	const columns = useMemo( () => {
 		const _columns = fields.map( ( field ) => {
-			const { render, ...column } = field;
-			column.cell = ( props ) => render( props.row.original, view );
+			const { render, getValue, ...column } = field;
+			column.cell = ( props ) =>
+				render( { item: props.row.original, view } );
+			if ( getValue ) {
+				column.accessorFn = ( item ) => getValue( { item } );
+			}
 			return column;
 		} );
 		if ( actions?.length ) {

diff --git a/packages/edit-site/src/components/page-pages/index.js b/packages/edit-site/src/components/page-pages/index.js
@@ -95,8 +95,8 @@ export default function PagePages() {
 			{
 				id: 'featured-image',
 				header: __( 'Featured Image' ),
-				accessorFn: ( page ) => page.featured_media,
-				render: ( item, currentView ) =>
+				getValue: ( { item } ) => item.featured_media,
+				render: ( { item, view: currentView } ) =>
 					!! item.featured_media ? (
 						<Media
 							className="edit-site-page-pages__featured-image"
@@ -113,20 +113,20 @@ export default function PagePages() {
 			{
 				header: __( 'Title' ),
 				id: 'title',
-				accessorFn: ( page ) => page.title?.rendered || page.slug,
-				render: ( page ) => {
+				getValue: ( { item } ) => item.title?.rendered || item.slug,
+				render: ( { item } ) => {
 					return (
 						<VStack spacing={ 1 }>
 							<Heading as="h3" level={ 5 }>
 								<Link
 									params={ {
-										postId: page.id,
-										postType: page.type,
+										postId: item.id,
+										postType: item.type,
 										canvas: 'edit',
 									} }
 								>
 									{ decodeEntities(
-										page.title?.rendered || page.slug
+										item.title?.rendered || item.slug
 									) || __( '(no title)' ) }
 								</Link>
 							</Heading>
@@ -141,8 +141,8 @@ export default function PagePages() {
 			{
 				header: __( 'Author' ),
 				id: 'author',
-				accessorFn: ( page ) => page._embedded?.author[ 0 ]?.name,
-				render: ( item ) => {
+				getValue: ( { item } ) => item._embedded?.author[ 0 ]?.name,
+				render: ( { item } ) => {
 					const author = item._embedded?.author[ 0 ];
 					return (
 						<a href={ `user-edit.php?user_id=${ author.id }` }>
@@ -165,8 +165,8 @@ export default function PagePages() {
 			{
 				header: __( 'Status' ),
 				id: 'status',
-				accessorFn: ( page ) =>
-					postStatuses[ page.status ] ?? page.status,
+				getValue: ( { item } ) =>
+					postStatuses[ item.status ] ?? item.status,
 				filters: [ { type: 'enumeration', id: 'status' } ],
 				elements: [
 					{ label: __( 'All' ), value: 'publish,draft' },
@@ -186,7 +186,7 @@ export default function PagePages() {
 			{
 				header: 'Date',
 				id: 'date',
-				render: ( item ) => {
+				render: ( { item } ) => {
 					const formattedDate = dateI18n(
 						getSettings().formats.datetimeAbbreviated,
 						getDate( item.date )