From 2f354f350ffb2c9ec1bb364c0454369537f503ae Mon Sep 17 00:00:00 2001
From: ntsekouras <ntsekouras@outlook.com>
Date: Wed, 18 Oct 2023 16:48:33 +0300
Subject: [PATCH] remove dataConfig

---
 .../src/components/dataviews/dataviews.js     |   7 +-
 .../src/components/dataviews/field-types.js   |   8 +-
 .../src/components/page-pages/index.js        | 153 +++++++++---------
 3 files changed, 81 insertions(+), 87 deletions(-)

diff --git a/packages/edit-site/src/components/dataviews/dataviews.js b/packages/edit-site/src/components/dataviews/dataviews.js
index bd71f1e258feb..90240d2818e5b 100644
--- a/packages/edit-site/src/components/dataviews/dataviews.js
+++ b/packages/edit-site/src/components/dataviews/dataviews.js
@@ -22,7 +22,6 @@ export default function DataViews( {
 	fields,
 	actions,
 	data,
-	dataConfig,
 	isLoading = false,
 	paginationInfo,
 } ) {
@@ -30,11 +29,9 @@ export default function DataViews( {
 	const _fields = useMemo( () => {
 		return fields.map( ( field ) => ( {
 			...field,
-			render:
-				dataConfig[ field.id ]?.view?.( field.getValue ) ||
-				field.getValue,
+			render: field.render?.( field.getValue ) || field.getValue,
 		} ) );
-	}, [ fields, dataConfig ] );
+	}, [ fields ] );
 	return (
 		<div className="dataviews-wrapper">
 			<VStack spacing={ 4 }>
diff --git a/packages/edit-site/src/components/dataviews/field-types.js b/packages/edit-site/src/components/dataviews/field-types.js
index 0e44d3bd2f8e3..b941e00e2d7e6 100644
--- a/packages/edit-site/src/components/dataviews/field-types.js
+++ b/packages/edit-site/src/components/dataviews/field-types.js
@@ -5,16 +5,18 @@ import Media from '../../components/media';
 
 export const coreFieldTypes = {
 	string: {
-		view:
+		render:
 			( getValue ) =>
 			( { item } ) =>
 				getValue( { item } ),
 	},
 	date: {
-		view: ( { item, getValue } ) => <time>{ getValue( { item } ) }</time>,
+		render:
+			( getValue ) =>
+			( { item } ) => <time>{ getValue( { item } ) }</time>,
 	},
 	image: {
-		view:
+		render:
 			( getValue ) =>
 			( { item } ) => (
 				<Media id={ getValue( { item } ) } size={ [ 'thumbnail' ] } />
diff --git a/packages/edit-site/src/components/page-pages/index.js b/packages/edit-site/src/components/page-pages/index.js
index ce84b05a0e8f0..824d7e7176116 100644
--- a/packages/edit-site/src/components/page-pages/index.js
+++ b/packages/edit-site/src/components/page-pages/index.js
@@ -96,12 +96,64 @@ export default function PagePages() {
 				id: 'featured-image',
 				header: __( 'Featured Image' ),
 				getValue: ( { item } ) => item.featured_media,
+				...coreFieldTypes.image,
+				render:
+					( getValue ) =>
+					( { item, view: currentView } ) => {
+						const value = getValue( { item } );
+						if ( ! value ) {
+							return null;
+						}
+						return (
+							<Media
+								className="edit-site-page-pages__featured-image"
+								id={ value }
+								size={
+									currentView.type === 'list'
+										? [
+												'thumbnail',
+												'medium',
+												'large',
+												'full',
+										  ]
+										: [
+												'large',
+												'full',
+												'medium',
+												'thumbnail',
+										  ]
+								}
+							/>
+						);
+					},
 				enableSorting: false,
 			},
 			{
 				header: __( 'Title' ),
 				id: 'title',
 				getValue: ( { item } ) => item.title?.rendered || item.slug,
+				...coreFieldTypes.string,
+				render:
+					( getValue ) =>
+					( { item } ) => {
+						return (
+							<VStack spacing={ 1 }>
+								<Heading as="h3" level={ 5 }>
+									<Link
+										params={ {
+											postId: item.id,
+											postType: item.type,
+											canvas: 'edit',
+										} }
+									>
+										{ decodeEntities(
+											getValue( { item } )
+										) || __( '(no title)' ) }
+									</Link>
+								</Heading>
+							</VStack>
+						);
+					},
 				filters: [ { id: 'search', type: 'search' } ],
 				maxWidth: 400,
 				sortingFn: 'alphanumeric',
@@ -111,6 +163,17 @@ export default function PagePages() {
 				header: __( 'Author' ),
 				id: 'author',
 				getValue: ( { item } ) => item._embedded?.author[ 0 ]?.name,
+				...coreFieldTypes.string,
+				render:
+					( getValue ) =>
+					( { item } ) => {
+						const author = item._embedded?.author[ 0 ];
+						return (
+							<a href={ `user-edit.php?user_id=${ author.id }` }>
+								{ getValue( { item } ) }
+							</a>
+						);
+					},
 				filters: [ { id: 'author', type: 'enumeration' } ],
 				elements: [
 					{
@@ -128,6 +191,7 @@ export default function PagePages() {
 				id: 'status',
 				getValue: ( { item } ) =>
 					postStatuses[ item.status ] ?? item.status,
+				...coreFieldTypes.string,
 				filters: [ { type: 'enumeration', id: 'status' } ],
 				elements: [
 					{ label: __( 'All' ), value: 'publish,draft' },
@@ -148,90 +212,22 @@ export default function PagePages() {
 				header: __( 'Date' ),
 				id: 'date',
 				getValue: ( { item } ) => item.date,
+				...coreFieldTypes.date,
+				render:
+					( getValue ) =>
+					( { item } ) => {
+						const formattedDate = dateI18n(
+							getSettings().formats.datetimeAbbreviated,
+							getDate( getValue( { item } ) )
+						);
+						return <time>{ formattedDate }</time>;
+					},
 				enableSorting: false,
 			},
 		],
 		[ postStatuses, authors ]
 	);
 
-	const dataConfig = {
-		'featured-image': {
-			...coreFieldTypes.image,
-			view:
-				( getValue ) =>
-				( { item, view: currentView } ) => {
-					const value = getValue( { item } );
-					if ( ! value ) {
-						return null;
-					}
-					return (
-						<Media
-							className="edit-site-page-pages__featured-image"
-							id={ value }
-							size={
-								currentView.type === 'list'
-									? [ 'thumbnail', 'medium', 'large', 'full' ]
-									: [ 'large', 'full', 'medium', 'thumbnail' ]
-							}
-						/>
-					);
-				},
-		},
-		title: {
-			...coreFieldTypes.string,
-			view:
-				( getValue ) =>
-				( { item } ) => {
-					return (
-						<VStack spacing={ 1 }>
-							<Heading as="h3" level={ 5 }>
-								<Link
-									params={ {
-										postId: item.id,
-										postType: item.type,
-										canvas: 'edit',
-									} }
-								>
-									{ decodeEntities( getValue( { item } ) ) ||
-										__( '(no title)' ) }
-								</Link>
-							</Heading>
-						</VStack>
-					);
-				},
-		},
-		// For now we treat author as a string, but we should have a way
-		// to create a relation field type.
-		author: {
-			...coreFieldTypes.string,
-			view:
-				( getValue ) =>
-				( { item } ) => {
-					const author = item._embedded?.author[ 0 ];
-					return (
-						<a href={ `user-edit.php?user_id=${ author.id }` }>
-							{ getValue( { item } ) }
-						</a>
-					);
-				},
-		},
-		status: {
-			...coreFieldTypes.string,
-		},
-		date: {
-			...coreFieldTypes.date,
-			view:
-				( getValue ) =>
-				( { item } ) => {
-					const formattedDate = dateI18n(
-						getSettings().formats.datetimeAbbreviated,
-						getDate( getValue( { item } ) )
-					);
-					return <time>{ formattedDate }</time>;
-				},
-		},
-	};
-
 	const trashPostAction = useTrashPostAction();
 	const actions = useMemo( () => [ trashPostAction ], [ trashPostAction ] );
 	const onChangeView = useCallback(
@@ -262,7 +258,6 @@ export default function PagePages() {
 				fields={ fields }
 				actions={ actions }
 				data={ pages || EMPTY_ARRAY }
-				dataConfig={ dataConfig }
 				isLoading={ isLoadingPages }
 				view={ view }
 				onChangeView={ onChangeView }