Site editor: 🥝 Media library proof of concept 🥝

lib/experimental/media-library.php

@@ -0,0 +1,28 @@
+<?php
+
+function gutenberg_register_attachment_tag_taxonomy() {
+	register_taxonomy(
+		'attachment_tag',
+		'attachment',
+		array(
+			'hierarchical'          => false,
+			'query_var'             => 'tag',
+			'rewrite'               => false, // TODO: what is this?
+			'public'                => true,
+			'show_ui'               => true,
+			'show_admin_column'     => true,
+			'_builtin'              => true,
+			'capabilities'          => array( // TODO: is this right?
+				'manage_terms' => 'upload_files',
+				'edit_terms'   => 'upload_files',
+				'delete_terms' => 'upload_files',
+				'assign_terms' => 'upload_files',
+			),
+			'show_in_rest'          => true,
+			'rest_base'             => 'attachment_tags',
+			'rest_controller_class' => 'WP_REST_Terms_Controller',
+		)
+	);
+}
+
+add_action( 'init', 'gutenberg_register_attachment_tag_taxonomy' );

lib/load.php

@@ -149,6 +149,7 @@ function gutenberg_is_experiment_enabled( $name ) {
 require __DIR__ . '/experimental/interactivity-api/directives/wp-class.php';
 require __DIR__ . '/experimental/interactivity-api/directives/wp-style.php';
 require __DIR__ . '/experimental/interactivity-api/directives/wp-text.php';
+require __DIR__ . '/experimental/media-library.php';
 
 // Fonts API / Font Face.
 remove_action( 'plugins_loaded', '_wp_theme_json_webfonts_handler' ); // Turns off WordPress 6.0's stopgap handler.

package.json

@@ -91,6 +91,7 @@
 		"@wordpress/warning": "file:packages/warning",
 		"@wordpress/widgets": "file:packages/widgets",
 		"@wordpress/wordcount": "file:packages/wordcount",
+		"react-advanced-cropper": "0.19.3",
 		"wicg-inert": "3.1.2"
 	},
 	"devDependencies": {

packages/core-data/src/resolvers.js

@@ -410,7 +410,7 @@ export const canUserEditEntityRecord =
 			return;
 		}
 
-		const resource = entityConfig.__unstable_rest_base;
+		const resource = entityConfig.__unstable_rest_base ?? entityConfig.name;
 		await dispatch( canUser( 'update', resource, recordId ) );
 	};
 

packages/core-data/src/selectors.ts

@@ -1070,7 +1070,7 @@ export function canUserEditEntityRecord(
 	if ( ! entityConfig ) {
 		return false;
 	}
-	const resource = entityConfig.__unstable_rest_base;
+	const resource = entityConfig.__unstable_rest_base ?? entityConfig.name;
 
 	return canUser( state, 'update', resource, recordId );
 }

packages/edit-site/package.json

@@ -27,8 +27,10 @@
 	"react-native": "src/index",
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
+		"@tanstack/react-table": "^8.9.3",
 		"@wordpress/a11y": "file:../a11y",
 		"@wordpress/api-fetch": "file:../api-fetch",
+		"@wordpress/blob": "file:../blob",
 		"@wordpress/block-editor": "file:../block-editor",
 		"@wordpress/block-library": "file:../block-library",
 		"@wordpress/blocks": "file:../blocks",
@@ -73,6 +75,7 @@
 		"fast-deep-equal": "^3.1.3",
 		"is-plain-object": "^5.0.0",
 		"memize": "^2.1.0",
+		"react-advanced-cropper": "0.19.3",
 		"react-autosize-textarea": "^7.1.0",
 		"rememo": "^4.0.2",
 		"remove-accents": "^0.5.0"

packages/edit-site/src/components/page-main/index.js

@@ -7,6 +7,8 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
  * Internal dependencies
  */
 import PagePatterns from '../page-patterns';
+import PageMedia from '../page-media';
+import PageMediaItem from '../page-media/page-media-item';
 import PageTemplateParts from '../page-template-parts';
 import PageTemplates from '../page-templates';
 import { unlock } from '../../lock-unlock';
@@ -15,7 +17,7 @@ const { useLocation } = unlock( routerPrivateApis );
 
 export default function PageMain() {
 	const {
-		params: { path },
+		params: { path, postId, postType },
 	} = useLocation();
 
 	if ( path === '/wp_template/all' ) {
@@ -24,6 +26,10 @@ export default function PageMain() {
 		return <PageTemplateParts />;
 	} else if ( path === '/patterns' ) {
 		return <PagePatterns />;
+	} else if ( path && path.startsWith( '/media' ) && ! postId ) {
+		return <PageMedia />;
+	} else if ( postType === 'attachment' && !! postId ) {
+		return <PageMediaItem />;
 	}
 
 	return null;