Revert "DataForm - Add combined fields support (WordPress#65399)"

This reverts commit 766fda4.

packages/dataviews/src/components/dataform/stories/index.story.tsx

@@ -7,7 +7,6 @@ import { useState } from '@wordpress/element';
  * Internal dependencies
  */
 import DataForm from '../index';
-import type { CombinedFormField } from '../../../types';
 
 const meta = {
 	title: 'DataViews/DataForm',
@@ -77,11 +76,6 @@ const fields = [
 			{ value: 'published', label: 'Published' },
 		],
 	},
-	{
-		id: 'password',
-		label: 'Password',
-		type: 'text' as const,
-	},
 ];
 
 export const Default = ( { type }: { type: 'panel' | 'regular' } ) => {
@@ -124,62 +118,3 @@ export const Default = ( { type }: { type: 'panel' | 'regular' } ) => {
 		/>
 	);
 };
-
-const CombinedFieldsComponent = ( {
-	type = 'regular',
-	combinedFieldDirection = 'vertical',
-}: {
-	type: 'panel' | 'regular';
-	combinedFieldDirection: 'vertical' | 'horizontal';
-} ) => {
-	const [ post, setPost ] = useState( {
-		title: 'Hello, World!',
-		order: 2,
-		author: 1,
-		status: 'draft',
-	} );
-
-	const form = {
-		fields: [ 'title', 'status_and_visibility', 'order', 'author' ],
-		combinedFields: [
-			{
-				id: 'status_and_visibility',
-				label: 'Status & Visibility',
-				children: [ 'status', 'password' ],
-				direction: combinedFieldDirection,
-				render: ( { item } ) => item.status,
-			},
-		] as CombinedFormField< any >[],
-	};
-
-	return (
-		<DataForm
-			data={ post }
-			fields={ fields }
-			form={ {
-				...form,
-				type,
-			} }
-			onChange={ ( edits ) =>
-				setPost( ( prev ) => ( {
-					...prev,
-					...edits,
-				} ) )
-			}
-		/>
-	);
-};
-
-export const CombinedFields = {
-	title: 'DataViews/CombinedFields',
-	render: CombinedFieldsComponent,
-	argTypes: {
-		...meta.argTypes,
-		combinedFieldDirection: {
-			control: { type: 'select' },
-			description:
-				'Chooses the direction of the combined field. "vertical" is the default layout.',
-			options: [ 'vertical', 'horizontal' ],
-		},
-	},
-};

packages/dataviews/src/dataforms-layouts/panel/index.tsx

@@ -17,8 +17,7 @@ import { closeSmall } from '@wordpress/icons';
  * Internal dependencies
  */
 import { normalizeFields } from '../../normalize-fields';
-import { getVisibleFields } from '../get-visible-fields';
-import type { DataFormProps, NormalizedField } from '../../types';
+import type { DataFormProps, NormalizedField, Field } from '../../types';
 
 interface FormFieldProps< Item > {
 	data: Item;
@@ -143,13 +142,13 @@ export default function FormPanel< Item >( {
 	const visibleFields = useMemo(
 		() =>
 			normalizeFields(
-				getVisibleFields< Item >(
-					fields,
-					form.fields,
-					form.combinedFields
-				)
+				( form.fields ?? [] )
+					.map( ( fieldId ) =>
+						fields.find( ( { id } ) => id === fieldId )
+					)
+					.filter( ( field ): field is Field< Item > => !! field )
 			),
-		[ fields, form.fields, form.combinedFields ]
+		[ fields, form.fields ]
 	);
 
 	return (

packages/dataviews/src/dataforms-layouts/regular/index.tsx

@@ -8,8 +8,7 @@ import { useMemo } from '@wordpress/element';
  * Internal dependencies
  */
 import { normalizeFields } from '../../normalize-fields';
-import { getVisibleFields } from '../get-visible-fields';
-import type { DataFormProps } from '../../types';
+import type { DataFormProps, Field } from '../../types';
 
 export default function FormRegular< Item >( {
 	data,
@@ -20,13 +19,13 @@ export default function FormRegular< Item >( {
 	const visibleFields = useMemo(
 		() =>
 			normalizeFields(
-				getVisibleFields< Item >(
-					fields,
-					form.fields,
-					form.combinedFields
-				)
+				( form.fields ?? [] )
+					.map( ( fieldId ) =>
+						fields.find( ( { id } ) => id === fieldId )
+					)
+					.filter( ( field ): field is Field< Item > => !! field )
 			),
-		[ fields, form.fields, form.combinedFields ]
+		[ fields, form.fields ]
 	);
 
 	return (

packages/dataviews/src/normalize-fields.ts

@@ -2,14 +2,8 @@
  * Internal dependencies
  */
 import getFieldTypeDefinition from './field-types';
-import type {
-	CombinedFormField,
-	Field,
-	NormalizedField,
-	NormalizedCombinedFormField,
-} from './types';
+import type { Field, NormalizedField } from './types';
 import { getControl } from './dataform-controls';
-import DataFormCombinedEdit from './components/dataform-combined-edit';
 
 /**
  * Apply default values and normalize the fields config.
@@ -72,29 +66,3 @@ export function normalizeFields< Item >(
 		};
 	} );
 }
-
-/**
- * Apply default values and normalize the fields config.
- *
- * @param combinedFields combined field list.
- * @param fields         Fields config.
- * @return Normalized fields config.
- */
-export function normalizeCombinedFields< Item >(
-	combinedFields: CombinedFormField< Item >[],
-	fields: Field< Item >[]
-): NormalizedCombinedFormField< Item >[] {
-	return combinedFields.map( ( combinedField ) => {
-		return {
-			...combinedField,
-			Edit: DataFormCombinedEdit,
-			fields: normalizeFields(
-				combinedField.children
-					.map( ( fieldId ) =>
-						fields.find( ( { id } ) => id === fieldId )
-					)
-					.filter( ( field ): field is Field< Item > => !! field )
-			),
-		};
-	} );
-}

packages/dataviews/src/style.scss

@@ -6,7 +6,6 @@
 @import "./components/dataviews-item-actions/style.scss";
 @import "./components/dataviews-selection-checkbox/style.scss";
 @import "./components/dataviews-view-config/style.scss";
-@import "./components/dataform-combined-edit/style.scss";
 
 @import "./dataviews-layouts/grid/style.scss";
 @import "./dataviews-layouts/list/style.scss";

packages/dataviews/src/types.ts

@@ -174,6 +174,14 @@ export type Fields< Item > = Field< Item >[];
 
 export type Data< Item > = Item[];
 
+/**
+ * The form configuration.
+ */
+export type Form = {
+	type?: 'regular' | 'panel';
+	fields?: string[];
+};
+
 export type DataFormControlProps< Item > = {
 	data: Item;
 	field: NormalizedField< Item >;
@@ -516,37 +524,9 @@ export interface SupportedLayouts {
 	table?: Omit< ViewTable, 'type' >;
 }
 
-export interface CombinedFormField< Item > extends CombinedField {
-	render?: ComponentType< { item: Item } >;
-}
-
-export interface DataFormCombinedEditProps< Item > {
-	field: NormalizedCombinedFormField< Item >;
-	data: Item;
-	onChange: ( value: Record< string, any > ) => void;
-	hideLabelFromVision?: boolean;
-}
-
-export type NormalizedCombinedFormField< Item > = CombinedFormField< Item > & {
-	fields: NormalizedField< Item >[];
-	Edit?: ComponentType< DataFormCombinedEditProps< Item > >;
-};
-
-/**
- * The form configuration.
- */
-export type Form< Item > = {
-	type?: 'regular' | 'panel';
-	fields?: string[];
-	/**
-	 * The fields to combine.
-	 */
-	combinedFields?: CombinedFormField< Item >[];
-};
-
 export interface DataFormProps< Item > {
 	data: Item;
 	fields: Field< Item >[];
-	form: Form< Item >;
+	form: Form;
 	onChange: ( value: Record< string, any > ) => void;
 }

packages/dataviews/src/validation.ts

@@ -7,7 +7,7 @@ import type { Field, Form } from './types';
 export function isItemValid< Item >(
 	item: Item,
 	fields: Field< Item >[],
-	form: Form< Item >
+	form: Form
 ): boolean {
 	const _fields = normalizeFields(
 		fields.filter( ( { id } ) => !! form.fields?.includes( id ) )