Skip to content

Commit a584ce9

Browse files
committed
test code for MediaEdit in site editor - quick edit
1 parent ceaafea commit a584ce9

8 files changed

Lines changed: 148 additions & 4 deletions

File tree

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<?php
2+
/**
3+
* Test fields for MediaEdit component development.
4+
*
5+
* @package gutenberg
6+
*/
7+
8+
/**
9+
* Register test media REST fields for MediaEdit component development.
10+
*
11+
* Creates 3 test fields:
12+
* - test_media_gallery: array type for multiple+expanded testing
13+
* - test_media_gallery_2: array type for multiple+compact testing
14+
* - test_media_single: integer type for single+expanded testing
15+
*/
16+
function gutenberg_register_media_edit_test_rest_fields() {
17+
$post_types = get_post_types( array( 'show_in_rest' => true ) );
18+
19+
// Define test fields: name => is_array.
20+
$fields = array(
21+
'test_media_gallery' => true, // array - multiple+expanded.
22+
'test_media_gallery_2' => true, // array - multiple+compact.
23+
'test_media_single' => false, // integer - single+expanded.
24+
);
25+
26+
foreach ( $post_types as $post_type ) {
27+
foreach ( $fields as $field_name => $is_array ) {
28+
register_rest_field(
29+
$post_type,
30+
$field_name,
31+
array(
32+
'schema' => $is_array
33+
? array(
34+
'type' => 'array',
35+
'items' => array( 'type' => 'integer' ),
36+
'context' => array( 'view', 'edit' ),
37+
'default' => array(),
38+
)
39+
: array(
40+
'type' => 'integer',
41+
'context' => array( 'view', 'edit' ),
42+
'default' => 0,
43+
),
44+
'get_callback' => function ( $object ) use ( $field_name, $is_array ) {
45+
if ( ! isset( $object['id'] ) ) {
46+
return $is_array ? array() : 0;
47+
}
48+
$meta = get_post_meta( $object['id'], $field_name, true );
49+
if ( $is_array ) {
50+
return ( empty( $meta ) || ! is_array( $meta ) ) ? array() : array_map( 'intval', $meta );
51+
}
52+
return $meta ? intval( $meta ) : 0;
53+
},
54+
'update_callback' => function ( $value, $object ) use ( $field_name, $is_array ) {
55+
if ( $is_array ) {
56+
$value = is_array( $value ) ? array_map( 'intval', $value ) : ( $value ? array( intval( $value ) ) : array() );
57+
} else {
58+
$value = intval( $value );
59+
}
60+
update_post_meta( $object->ID, $field_name, $value );
61+
return true;
62+
},
63+
)
64+
);
65+
}
66+
}
67+
}
68+
add_action( 'rest_api_init', 'gutenberg_register_media_edit_test_rest_fields' );

‎lib/load.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@ function gutenberg_is_experiment_enabled( $name ) {
7171
require __DIR__ . '/compat/wordpress-7.0/class-gutenberg-rest-static-templates-controller.php';
7272
require __DIR__ . '/compat/wordpress-7.0/template-activate.php';
7373
require __DIR__ . '/compat/wordpress-7.0/rest-api.php';
74+
require __DIR__ . '/compat/wordpress-7.0/media-edit-test.php';
7475
require __DIR__ . '/compat/wordpress-7.0/global-styles.php';
7576

7677
// Plugin specific code.

‎packages/edit-site/src/components/post-edit/index.js‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -79,12 +79,21 @@ function PostEditForm( { postType, postId } ) {
7979
type: 'panel',
8080
},
8181
fields: [
82+
{
83+
id: 'test_media_gallery_2',
84+
layout: { type: 'regular' },
85+
},
86+
{
87+
id: 'test_media_gallery',
88+
layout: { type: 'regular' },
89+
},
8290
{
8391
id: 'featured_media',
84-
layout: {
85-
type: 'regular',
86-
labelPosition: 'none',
87-
},
92+
layout: { type: 'regular' },
93+
},
94+
{
95+
id: 'test_media_single',
96+
layout: { type: 'regular' },
8897
},
8998
{
9099
id: 'status',

‎packages/edit-site/src/components/post-edit/style.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
.edit-site-post-edit {
55
padding: $grid-unit-30;
6+
overflow: auto;
67
}
78

89
.dataforms-layouts-panel__field-dropdown {

‎packages/editor/src/dataviews/store/private-actions.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ import {
3535
pageTitleField,
3636
patternTitleField,
3737
notesField,
38+
mediaEditTestFields,
3839
} from '@wordpress/fields';
3940
import {
4041
altTextField,
@@ -272,6 +273,7 @@ export const registerPostTypeSchema =
272273
postPreviewField,
273274
hasEditorNotesSupport( postTypeConfig.supports ) && notesField,
274275
].filter( Boolean );
276+
fields.push( ...mediaEditTestFields ); // Add the media test fields.
275277
if ( postTypeConfig.supports?.title ) {
276278
let _titleField;
277279
if ( postType === 'page' ) {

‎packages/fields/README.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -112,6 +112,10 @@ _Returns_
112112

113113
Undocumented declaration.
114114

115+
### mediaEditTestFields
116+
117+
Undocumented declaration.
118+
115119
### notesField
116120

117121
Notes count field for post types that support editor.notes.

‎packages/fields/src/fields/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,3 +15,4 @@ export { default as discussionField } from './discussion';
1515
export { default as dateField } from './date';
1616
export { default as authorField } from './author';
1717
export { default as notesField } from './notes';
18+
export { mediaEditTestFields } from './media-edit-test-fields';
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
/**
2+
* WordPress dependencies
3+
*/
4+
import type { Field } from '@wordpress/dataviews';
5+
import { __ } from '@wordpress/i18n';
6+
7+
/**
8+
* Internal dependencies
9+
*/
10+
import MediaEdit from '../../components/media-edit';
11+
import type { BasePost } from '../../types';
12+
13+
interface BasePostWithTestMeta extends BasePost {
14+
test_media_gallery?: number[];
15+
test_media_gallery_2?: number[];
16+
test_media_single?: number;
17+
}
18+
19+
const sharedConfig = {
20+
type: 'media',
21+
enableSorting: false,
22+
filterBy: false,
23+
} as const;
24+
25+
export const mediaEditTestFields: Field< BasePostWithTestMeta >[] = [
26+
{
27+
...sharedConfig,
28+
id: 'test_media_gallery',
29+
label: __( 'Test Gallery (Expanded)' ),
30+
Edit: ( props ) => <MediaEdit { ...props } multiple isExpanded />,
31+
getValue: ( { item } ) => item.test_media_gallery,
32+
setValue: ( { value } ) => ( {
33+
test_media_gallery: Array.isArray( value ) ? value : [],
34+
} ),
35+
},
36+
{
37+
...sharedConfig,
38+
id: 'test_media_gallery_2',
39+
label: __( 'Test Gallery (Compact)' ),
40+
Edit: ( props ) => (
41+
<MediaEdit { ...props } multiple isExpanded={ false } />
42+
),
43+
getValue: ( { item } ) => item.test_media_gallery_2,
44+
setValue: ( { value } ) => ( {
45+
test_media_gallery_2: Array.isArray( value ) ? value : [],
46+
} ),
47+
},
48+
{
49+
...sharedConfig,
50+
id: 'test_media_single',
51+
label: __( 'Test Single (Expanded)' ),
52+
Edit: ( props ) => <MediaEdit { ...props } isExpanded />,
53+
getValue: ( { item } ) => item.test_media_single,
54+
setValue: ( { value } ) => ( { test_media_single: value ?? 0 } ),
55+
},
56+
];
57+
58+
export default mediaEditTestFields;

0 commit comments

Comments
 (0)