Merge pull request #401 from alleyinteractive/feature/TECH-127/add-po…

…stpicker

Feature/tech 127/add postpicker

client/src/components/byline-postpicker/index.jsx

@@ -0,0 +1,48 @@
+// External dependencies.
+import apiFetch from '@wordpress/api-fetch';
+import { addQueryArgs } from '@wordpress/url';
+import { useCallback } from 'react';
+import { PostPicker } from '@alleyinteractive/block-editor-tools';
+import PropTypes from 'prop-types';
+
+function BylinePostpicker({
+  addAuthorLabel,
+  id,
+  onUpdate,
+  profilesApiUrl,
+}) {
+  const doProfileSearch = useCallback((profileId) => {
+    apiFetch({ url: addQueryArgs(profilesApiUrl, { id: profileId }) })
+      .then((rawResults) => {
+        onUpdate(rawResults[0]);
+      });
+  }, [profilesApiUrl, onUpdate]);
+
+  return (
+    <>
+      <label
+        className="components-base-control__label"
+        htmlFor={id}
+      >
+        {addAuthorLabel}
+      </label>
+      <PostPicker
+        allowedTypes={['profile']}
+        onUpdate={(profile) => doProfileSearch(profile)}
+      />
+    </>
+  );
+}
+
+BylinePostpicker.defaultProps = {
+  id: 'profiles_postpicker',
+};
+
+BylinePostpicker.propTypes = {
+  addAuthorLabel: PropTypes.string.isRequired,
+  id: PropTypes.string,
+  onUpdate: PropTypes.func.isRequired,
+  profilesApiUrl: PropTypes.string.isRequired,
+};
+
+export default BylinePostpicker;

client/src/components/byline-slot-wrapper/index.jsx

@@ -6,18 +6,16 @@ import { Spinner } from '@wordpress/components';
 import { Fragment } from '@wordpress/element';
 
 // Internal dependencies.
-import BylineAutocomplete from '../byline-autocomplete';
 import BylineFreeform from '../byline-freeform';
 import BylineList from '../byline-list';
+import BylinePostpicker from '../byline-postpicker';
 
 function BylineSlotWrapper({
   addAuthorLabel,
-  addAuthorPlaceholder,
   addFreeformButtonLabel,
   addFreeformLabel,
   addFreeformPlaceholder,
   addProfile,
-  autocompleteInputId,
   freeformInputId,
   profiles,
   profilesApiUrl,
@@ -33,13 +31,10 @@ function BylineSlotWrapper({
         </div>
       ) : (
         <Fragment>
-          <BylineAutocomplete
-            id={autocompleteInputId}
-            profiles={profiles}
+          <BylinePostpicker
+            addAuthorLabel={addAuthorLabel || bylineData.addAuthorLabel}
             onUpdate={addProfile}
             profilesApiUrl={profilesApiUrl || bylineData.profilesApiUrl}
-            addAuthorPlaceholder={addAuthorPlaceholder || bylineData.addAuthorPlaceholder}
-            addAuthorLabel={addAuthorLabel || bylineData.addAuthorLabel}
           />
           <BylineFreeform
             id={freeformInputId}
@@ -66,11 +61,9 @@ function BylineSlotWrapper({
 
 BylineSlotWrapper.defaultProps = {
   addAuthorLabel: null,
-  addAuthorPlaceholder: null,
   addFreeformButtonLabel: null,
   addFreeformLabel: null,
   addFreeformPlaceholder: null,
-  autocompleteInputId: 'profiles_autocomplete',
   freeformInputId: 'byline_freeform',
   profiles: [],
   profilesApiUrl: null,
@@ -79,12 +72,10 @@ BylineSlotWrapper.defaultProps = {
 
 BylineSlotWrapper.propTypes = {
   addAuthorLabel: PropTypes.string,
-  addAuthorPlaceholder: PropTypes.string,
   addFreeformButtonLabel: PropTypes.string,
   addFreeformLabel: PropTypes.string,
   addFreeformPlaceholder: PropTypes.string,
   addProfile: PropTypes.func.isRequired,
-  autocompleteInputId: PropTypes.string,
   freeformInputId: PropTypes.string,
   profiles: PropTypes.arrayOf(PropTypes.shape({
     id: PropTypes.oneOfType([

inc/rest-api.php

@@ -67,9 +67,9 @@ function rest_profile_search( WP_REST_Request $request ): WP_REST_Response {
 		[
 			'post_type'        => PROFILE_POST_TYPE,
 			'numberposts'      => 10,
-			's'                => $request->get_param( 's' ),
 			'suppress_filters' => false,
 			'orderby'          => 'relevance',
+			'include'          => [ $request->get_param( 'id' ) ],
 		]
 	);
 

package.json

@@ -68,6 +68,7 @@
     "webpack-dev-server": "^5.0.4"
   },
   "dependencies": {
+    "@alleyinteractive/block-editor-tools": "^0.10.2",
     "@uidotdev/usehooks": "^2.4.1",
     "@wordpress/api-fetch": "^6.47.0",
     "@wordpress/components": "^25.8.14",