@secretstache/wordpress-gutenberg 0.6.9 → 0.6.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@secretstache/wordpress-gutenberg",
-  "version": "0.6.9",
+  "version": "0.6.11",
   "description": "",
   "author": "Secret Stache",
   "license": "GPL-2.0-or-later",

package/src/components/DataQueryControls.jsx

@@ -10,7 +10,7 @@ import { arrayMove } from 'react-sortable-hoc';
 import Select from 'react-select';
 
 import { SortableSelectAsync } from './SortableSelect.jsx';
-import { decodeHtmlEntities, loadSelectOptions } from '../utils/index.js';
+import { decodeHtmlEntities, loadSelectOptions, useDefaultSelectOptions } from '../utils/index.js';
 
 const DataQueryContext = createContext({});
 
@@ -192,11 +192,7 @@ const CuratedPosts = memo(({
         return await loadSelectOptions(inputValue, postType);
     }, []);
 
-    const [ defaultPostsOptions, setDefaultPostsOptions ] = useState([]);
-
-    useEffect(() => {
-        loadSelectOptions('', postType).then(setDefaultPostsOptions);
-    }, []);
+    const { options: defaultPostsOptions } = useDefaultSelectOptions(postType);
 
     const onSortEnd = useCallback(({ oldIndex, newIndex }) => {
         const newCuratedPosts = arrayMove(curatedPosts, oldIndex, newIndex);

package/src/hooks/useTabs.jsx

@@ -12,6 +12,7 @@ export const useTabs = (tabsClientId, tabItemName) => {
 
     const {
         tabs,
+        tabsAttributes,
         tabsCount,
         tabsOrder,
 
@@ -30,6 +31,7 @@ export const useTabs = (tabsClientId, tabItemName) => {
 
             return {
                 tabs: getBlock(tabsClientId)?.innerBlocks || [],
+                tabsAttributes: getBlock(tabsClientId)?.innerBlocks?.map((block) => block?.attributes) || [],
                 tabsCount: getBlockCount(tabsClientId),
                 tabsOrder: getBlockOrder(tabsClientId),
 
@@ -108,6 +110,7 @@ export const useTabs = (tabsClientId, tabItemName) => {
 
     return {
         tabs,
+        tabsAttributes,
         tabsCount,
         tabsOrder,
 

package/src/utils/helpers.js

@@ -1,10 +1,11 @@
 import { filters } from '@wordpress/hooks';
 import apiFetch from '@wordpress/api-fetch';
-import { select, subscribe } from '@wordpress/data';
+import { select, subscribe, useSelect } from '@wordpress/data';
 import { getBlockType, registerBlockType, unregisterBlockType } from '@wordpress/blocks';
 import slugify from 'slugify';
 import classNames from 'classnames';
 import debounce from 'debounce-promise';
+import { useMemo } from '@wordpress/element';
 
 let controller;
 
@@ -341,3 +342,40 @@ export const getFocalPointStyle = (focalPoint) => {
     return { objectPosition: `${x}% ${y}%` };
 };
 
+/**
+ * Default options for Select via core-data cache
+ *
+ * @param {string} postType
+ * @param {(post:any)=>{value:number,label:string}} [mapper]
+ * @param {Object} [extraParams={}]
+ *
+ * @returns {{ options: Array<{value:number,label:string}>, isResolving: boolean }}
+ */
+export const useDefaultSelectOptions = (postType, mapper = null, extraParams = {}) => {
+    const query = useMemo(() => ({
+        per_page: 100,
+        status: 'publish',
+        order: 'asc',
+        orderby: 'title',
+        _fields: 'id,title,acf',
+        ...extraParams,
+    }), [ postType, JSON.stringify(extraParams) ]);
+
+    return useSelect((select) => {
+        const core = select('core');
+        const posts = core.getEntityRecords('postType', postType, query) || [];
+        const isResolving = core.isResolving('getEntityRecords', [ 'postType', postType, query ]);
+
+        const options = mapper
+            ? posts.map(mapper)
+            : posts.map((post) => ({
+                value: post.id,
+                label: decodeHtmlEntities(post?.title?.rendered || ''),
+            }));
+
+        return {
+            options,
+            isResolving,
+        };
+    }, [ postType, JSON.stringify(query) ]);
+};