@wordpress/block-editor 12.3.2 → 12.3.4

package/build-module/components/inserter/hooks/use-patterns-state.js

@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useCallback } from '@wordpress/element';
+import { useCallback, useMemo } from '@wordpress/element';
 import { cloneBlock } from '@wordpress/blocks';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { __, sprintf } from '@wordpress/i18n';
@@ -11,6 +11,11 @@ import { store as noticesStore } from '@wordpress/notices';
  */
 
 import { store as blockEditorStore } from '../../../store';
+const CUSTOM_CATEGORY = {
+  name: 'custom',
+  label: __('My patterns'),
+  description: __('Custom patterns add by site users')
+};
 /**
  * Retrieves the block patterns inserter state.
  *
@@ -34,6 +39,7 @@ const usePatternsState = (onInsert, rootClientId) => {
       patternCategories: getSettings().__experimentalBlockPatternCategories
     };
   }, [rootClientId]);
+  const allCategories = useMemo(() => [...patternCategories, CUSTOM_CATEGORY], [patternCategories]);
   const {
     createSuccessNotice
   } = useDispatch(noticesStore);
@@ -44,8 +50,8 @@ const usePatternsState = (onInsert, rootClientId) => {
     __('Block pattern "%s" inserted.'), pattern.title), {
       type: 'snackbar'
     });
-  }, []);
-  return [patterns, patternCategories, onClickPattern];
+  }, [createSuccessNotice, onInsert]);
+  return [patterns, allCategories, onClickPattern];
 };
 
 export default usePatternsState;

package/build-module/components/inserter/hooks/use-patterns-state.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/hooks/use-patterns-state.js"],"names":["useCallback","cloneBlock","useDispatch","useSelect","__","sprintf","store","noticesStore","blockEditorStore","usePatternsState","onInsert","rootClientId","patternCategories","patterns","select","__experimentalGetAllowedPatterns","getSettings","__experimentalBlockPatternCategories","createSuccessNotice","onClickPattern","pattern","blocks","map","block","name","title","type"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,WAAT,EAAsBC,SAAtB,QAAuC,iBAAvC;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,KAAK,IAAIC,YAAlB,QAAsC,oBAAtC;AAEA;AACA;AACA;;AACA,SAASD,KAAK,IAAIE,gBAAlB,QAA0C,gBAA1C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMC,gBAAgB,GAAG,CAAEC,QAAF,EAAYC,YAAZ,KAA8B;AACtD,QAAM;AAAEC,IAAAA,iBAAF;AAAqBC,IAAAA;AAArB,MAAkCV,SAAS,CAC9CW,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA,gCAAF;AAAoCC,MAAAA;AAApC,QACLF,MAAM,CAAEN,gBAAF,CADP;AAEA,WAAO;AACNK,MAAAA,QAAQ,EAAEE,gCAAgC,CAAEJ,YAAF,CADpC;AAENC,MAAAA,iBAAiB,EAChBI,WAAW,GAAGC;AAHT,KAAP;AAKA,GAT+C,EAUhD,CAAEN,YAAF,CAVgD,CAAjD;AAYA,QAAM;AAAEO,IAAAA;AAAF,MAA0BhB,WAAW,CAAEK,YAAF,CAA3C;AACA,QAAMY,cAAc,GAAGnB,WAAW,CAAE,CAAEoB,OAAF,EAAWC,MAAX,KAAuB;AAC1DX,IAAAA,QAAQ,CACP,CAAEW,MAAF,aAAEA,MAAF,cAAEA,MAAF,GAAY,EAAZ,EAAiBC,GAAjB,CAAwBC,KAAF,IAAatB,UAAU,CAAEsB,KAAF,CAA7C,CADO,EAEPH,OAAO,CAACI,IAFD,CAAR;AAIAN,IAAAA,mBAAmB,CAClBb,OAAO;AACN;AACAD,IAAAA,EAAE,CAAE,8BAAF,CAFI,EAGNgB,OAAO,CAACK,KAHF,CADW,EAMlB;AACCC,MAAAA,IAAI,EAAE;AADP,KANkB,CAAnB;AAUA,GAfiC,EAe/B,EAf+B,CAAlC;AAiBA,SAAO,CAAEb,QAAF,EAAYD,iBAAZ,EAA+BO,cAA/B,CAAP;AACA,CAhCD;;AAkCA,eAAeV,gBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../../store';\n\n/**\n * Retrieves the block patterns inserter state.\n *\n * @param {Function} onInsert     function called when inserter a list of blocks.\n * @param {string=}  rootClientId Insertion's root client ID.\n *\n * @return {Array} Returns the patterns state. (patterns, categories, onSelect handler)\n */\nconst usePatternsState = ( onInsert, rootClientId ) => {\n\tconst { patternCategories, patterns } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { __experimentalGetAllowedPatterns, getSettings } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tpatterns: __experimentalGetAllowedPatterns( rootClientId ),\n\t\t\t\tpatternCategories:\n\t\t\t\t\tgetSettings().__experimentalBlockPatternCategories,\n\t\t\t};\n\t\t},\n\t\t[ rootClientId ]\n\t);\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\tconst onClickPattern = useCallback( ( pattern, blocks ) => {\n\t\tonInsert(\n\t\t\t( blocks ?? [] ).map( ( block ) => cloneBlock( block ) ),\n\t\t\tpattern.name\n\t\t);\n\t\tcreateSuccessNotice(\n\t\t\tsprintf(\n\t\t\t\t/* translators: %s: block pattern title. */\n\t\t\t\t__( 'Block pattern \"%s\" inserted.' ),\n\t\t\t\tpattern.title\n\t\t\t),\n\t\t\t{\n\t\t\t\ttype: 'snackbar',\n\t\t\t}\n\t\t);\n\t}, [] );\n\n\treturn [ patterns, patternCategories, onClickPattern ];\n};\n\nexport default usePatternsState;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/hooks/use-patterns-state.js"],"names":["useCallback","useMemo","cloneBlock","useDispatch","useSelect","__","sprintf","store","noticesStore","blockEditorStore","CUSTOM_CATEGORY","name","label","description","usePatternsState","onInsert","rootClientId","patternCategories","patterns","select","__experimentalGetAllowedPatterns","getSettings","__experimentalBlockPatternCategories","allCategories","createSuccessNotice","onClickPattern","pattern","blocks","map","block","title","type"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAT,EAAsBC,OAAtB,QAAqC,oBAArC;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,WAAT,EAAsBC,SAAtB,QAAuC,iBAAvC;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,KAAK,IAAIC,YAAlB,QAAsC,oBAAtC;AAEA;AACA;AACA;;AACA,SAASD,KAAK,IAAIE,gBAAlB,QAA0C,gBAA1C;AAEA,MAAMC,eAAe,GAAG;AACvBC,EAAAA,IAAI,EAAE,QADiB;AAEvBC,EAAAA,KAAK,EAAEP,EAAE,CAAE,aAAF,CAFc;AAGvBQ,EAAAA,WAAW,EAAER,EAAE,CAAE,mCAAF;AAHQ,CAAxB;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMS,gBAAgB,GAAG,CAAEC,QAAF,EAAYC,YAAZ,KAA8B;AACtD,QAAM;AAAEC,IAAAA,iBAAF;AAAqBC,IAAAA;AAArB,MAAkCd,SAAS,CAC9Ce,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA,gCAAF;AAAoCC,MAAAA;AAApC,QACLF,MAAM,CAAEV,gBAAF,CADP;AAGA,WAAO;AACNS,MAAAA,QAAQ,EAAEE,gCAAgC,CAAEJ,YAAF,CADpC;AAENC,MAAAA,iBAAiB,EAChBI,WAAW,GAAGC;AAHT,KAAP;AAKA,GAV+C,EAWhD,CAAEN,YAAF,CAXgD,CAAjD;AAcA,QAAMO,aAAa,GAAGtB,OAAO,CAC5B,MAAM,CAAE,GAAGgB,iBAAL,EAAwBP,eAAxB,CADsB,EAE5B,CAAEO,iBAAF,CAF4B,CAA7B;AAKA,QAAM;AAAEO,IAAAA;AAAF,MAA0BrB,WAAW,CAAEK,YAAF,CAA3C;AACA,QAAMiB,cAAc,GAAGzB,WAAW,CACjC,CAAE0B,OAAF,EAAWC,MAAX,KAAuB;AACtBZ,IAAAA,QAAQ,CACP,CAAEY,MAAF,aAAEA,MAAF,cAAEA,MAAF,GAAY,EAAZ,EAAiBC,GAAjB,CAAwBC,KAAF,IAAa3B,UAAU,CAAE2B,KAAF,CAA7C,CADO,EAEPH,OAAO,CAACf,IAFD,CAAR;AAIAa,IAAAA,mBAAmB,CAClBlB,OAAO;AACN;AACAD,IAAAA,EAAE,CAAE,8BAAF,CAFI,EAGNqB,OAAO,CAACI,KAHF,CADW,EAMlB;AACCC,MAAAA,IAAI,EAAE;AADP,KANkB,CAAnB;AAUA,GAhBgC,EAiBjC,CAAEP,mBAAF,EAAuBT,QAAvB,CAjBiC,CAAlC;AAoBA,SAAO,CAAEG,QAAF,EAAYK,aAAZ,EAA2BE,cAA3B,CAAP;AACA,CA1CD;;AA4CA,eAAeX,gBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../../store';\n\nconst CUSTOM_CATEGORY = {\n\tname: 'custom',\n\tlabel: __( 'My patterns' ),\n\tdescription: __( 'Custom patterns add by site users' ),\n};\n\n/**\n * Retrieves the block patterns inserter state.\n *\n * @param {Function} onInsert     function called when inserter a list of blocks.\n * @param {string=}  rootClientId Insertion's root client ID.\n *\n * @return {Array} Returns the patterns state. (patterns, categories, onSelect handler)\n */\nconst usePatternsState = ( onInsert, rootClientId ) => {\n\tconst { patternCategories, patterns } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { __experimentalGetAllowedPatterns, getSettings } =\n\t\t\t\tselect( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\tpatterns: __experimentalGetAllowedPatterns( rootClientId ),\n\t\t\t\tpatternCategories:\n\t\t\t\t\tgetSettings().__experimentalBlockPatternCategories,\n\t\t\t};\n\t\t},\n\t\t[ rootClientId ]\n\t);\n\n\tconst allCategories = useMemo(\n\t\t() => [ ...patternCategories, CUSTOM_CATEGORY ],\n\t\t[ patternCategories ]\n\t);\n\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\tconst onClickPattern = useCallback(\n\t\t( pattern, blocks ) => {\n\t\t\tonInsert(\n\t\t\t\t( blocks ?? [] ).map( ( block ) => cloneBlock( block ) ),\n\t\t\t\tpattern.name\n\t\t\t);\n\t\t\tcreateSuccessNotice(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: %s: block pattern title. */\n\t\t\t\t\t__( 'Block pattern \"%s\" inserted.' ),\n\t\t\t\t\tpattern.title\n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t}\n\t\t\t);\n\t\t},\n\t\t[ createSuccessNotice, onInsert ]\n\t);\n\n\treturn [ patterns, allCategories, onClickPattern ];\n};\n\nexport default usePatternsState;\n"]}

package/build-module/components/inserter/reusable-blocks-tab.js

@@ -71,7 +71,7 @@ export function ReusableBlocksTab({
     href: addQueryArgs('edit.php', {
       post_type: 'wp_block'
     })
-  }, __('Manage custom patterns'))));
+  }, __('Manage my patterns'))));
 }
 export default ReusableBlocksTab;
 //# sourceMappingURL=reusable-blocks-tab.js.map

package/build-module/components/inserter/reusable-blocks-tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/reusable-blocks-tab.js"],"names":["useMemo","__","addQueryArgs","Button","BlockTypesList","InserterPanel","InserterNoResults","useBlockTypesState","ReusableBlocksList","onHover","onInsert","rootClientId","items","onSelectItem","filteredItems","filter","category","length","ReusableBlocksTab","post_type"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,YAAT,QAA6B,gBAA7B;AACA,SAASC,MAAT,QAAuB,uBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,cAAP,MAA2B,qBAA3B;AACA,OAAOC,aAAP,MAA0B,SAA1B;AACA,OAAOC,iBAAP,MAA8B,cAA9B;AACA,OAAOC,kBAAP,MAA+B,+BAA/B;;AAEA,SAASC,kBAAT,CAA6B;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,QAAX;AAAqBC,EAAAA;AAArB,CAA7B,EAAmE;AAClE,QAAM,CAAEC,KAAF,IAAaC,YAAb,IAA8BN,kBAAkB,CACrDI,YADqD,EAErDD,QAFqD,CAAtD;AAKA,QAAMI,aAAa,GAAGd,OAAO,CAAE,MAAM;AACpC,WAAOY,KAAK,CAACG,MAAN,CAAc,CAAE;AAAEC,MAAAA;AAAF,KAAF,KAAoBA,QAAQ,KAAK,UAA/C,CAAP;AACA,GAF4B,EAE1B,CAAEJ,KAAF,CAF0B,CAA7B;;AAIA,MAAKE,aAAa,CAACG,MAAd,KAAyB,CAA9B,EAAkC;AACjC,WAAO,cAAC,iBAAD,OAAP;AACA;;AAED,SACC,cAAC,aAAD;AAAe,IAAA,KAAK,EAAGhB,EAAE,CAAE,iBAAF;AAAzB,KACC,cAAC,cAAD;AACC,IAAA,KAAK,EAAGa,aADT;AAEC,IAAA,QAAQ,EAAGD,YAFZ;AAGC,IAAA,OAAO,EAAGJ,OAHX;AAIC,IAAA,KAAK,EAAGR,EAAE,CAAE,iBAAF;AAJX,IADD,CADD;AAUA,C,CAED;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASiB,iBAAT,CAA4B;AAAEP,EAAAA,YAAF;AAAgBD,EAAAA,QAAhB;AAA0BD,EAAAA;AAA1B,CAA5B,EAAkE;AACxE,SACC,8BACC,cAAC,kBAAD;AACC,IAAA,OAAO,EAAGA,OADX;AAEC,IAAA,QAAQ,EAAGC,QAFZ;AAGC,IAAA,YAAY,EAAGC;AAHhB,IADD,EAMC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,+CADX;AAEC,IAAA,OAAO,EAAC,WAFT;AAGC,IAAA,IAAI,EAAGT,YAAY,CAAE,UAAF,EAAc;AAChCiB,MAAAA,SAAS,EAAE;AADqB,KAAd;AAHpB,KAOGlB,EAAE,CAAE,wBAAF,CAPL,CADD,CAND,CADD;AAoBA;AAED,eAAeiB,iBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { addQueryArgs } from '@wordpress/url';\nimport { Button } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BlockTypesList from '../block-types-list';\nimport InserterPanel from './panel';\nimport InserterNoResults from './no-results';\nimport useBlockTypesState from './hooks/use-block-types-state';\n\nfunction ReusableBlocksList( { onHover, onInsert, rootClientId } ) {\n\tconst [ items, , , onSelectItem ] = useBlockTypesState(\n\t\trootClientId,\n\t\tonInsert\n\t);\n\n\tconst filteredItems = useMemo( () => {\n\t\treturn items.filter( ( { category } ) => category === 'reusable' );\n\t}, [ items ] );\n\n\tif ( filteredItems.length === 0 ) {\n\t\treturn <InserterNoResults />;\n\t}\n\n\treturn (\n\t\t<InserterPanel title={ __( 'Synced patterns' ) }>\n\t\t\t<BlockTypesList\n\t\t\t\titems={ filteredItems }\n\t\t\t\tonSelect={ onSelectItem }\n\t\t\t\tonHover={ onHover }\n\t\t\t\tlabel={ __( 'Synced patterns' ) }\n\t\t\t/>\n\t\t</InserterPanel>\n\t);\n}\n\n// The unwrapped component is only exported for use by unit tests.\n/**\n * List of reusable blocks shown in the \"Reusable\" tab of the inserter.\n *\n * @param {Object}   props              Component props.\n * @param {?string}  props.rootClientId Client id of block to insert into.\n * @param {Function} props.onInsert     Callback to run when item is inserted.\n * @param {Function} props.onHover      Callback to run when item is hovered.\n *\n * @return {WPComponent} The component.\n */\nexport function ReusableBlocksTab( { rootClientId, onInsert, onHover } ) {\n\treturn (\n\t\t<>\n\t\t\t<ReusableBlocksList\n\t\t\t\tonHover={ onHover }\n\t\t\t\tonInsert={ onInsert }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t/>\n\t\t\t<div className=\"block-editor-inserter__manage-reusable-blocks-container\">\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"block-editor-inserter__manage-reusable-blocks\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\thref={ addQueryArgs( 'edit.php', {\n\t\t\t\t\t\tpost_type: 'wp_block',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Manage custom patterns' ) }\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ReusableBlocksTab;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/inserter/reusable-blocks-tab.js"],"names":["useMemo","__","addQueryArgs","Button","BlockTypesList","InserterPanel","InserterNoResults","useBlockTypesState","ReusableBlocksList","onHover","onInsert","rootClientId","items","onSelectItem","filteredItems","filter","category","length","ReusableBlocksTab","post_type"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,YAAT,QAA6B,gBAA7B;AACA,SAASC,MAAT,QAAuB,uBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,cAAP,MAA2B,qBAA3B;AACA,OAAOC,aAAP,MAA0B,SAA1B;AACA,OAAOC,iBAAP,MAA8B,cAA9B;AACA,OAAOC,kBAAP,MAA+B,+BAA/B;;AAEA,SAASC,kBAAT,CAA6B;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,QAAX;AAAqBC,EAAAA;AAArB,CAA7B,EAAmE;AAClE,QAAM,CAAEC,KAAF,IAAaC,YAAb,IAA8BN,kBAAkB,CACrDI,YADqD,EAErDD,QAFqD,CAAtD;AAKA,QAAMI,aAAa,GAAGd,OAAO,CAAE,MAAM;AACpC,WAAOY,KAAK,CAACG,MAAN,CAAc,CAAE;AAAEC,MAAAA;AAAF,KAAF,KAAoBA,QAAQ,KAAK,UAA/C,CAAP;AACA,GAF4B,EAE1B,CAAEJ,KAAF,CAF0B,CAA7B;;AAIA,MAAKE,aAAa,CAACG,MAAd,KAAyB,CAA9B,EAAkC;AACjC,WAAO,cAAC,iBAAD,OAAP;AACA;;AAED,SACC,cAAC,aAAD;AAAe,IAAA,KAAK,EAAGhB,EAAE,CAAE,iBAAF;AAAzB,KACC,cAAC,cAAD;AACC,IAAA,KAAK,EAAGa,aADT;AAEC,IAAA,QAAQ,EAAGD,YAFZ;AAGC,IAAA,OAAO,EAAGJ,OAHX;AAIC,IAAA,KAAK,EAAGR,EAAE,CAAE,iBAAF;AAJX,IADD,CADD;AAUA,C,CAED;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASiB,iBAAT,CAA4B;AAAEP,EAAAA,YAAF;AAAgBD,EAAAA,QAAhB;AAA0BD,EAAAA;AAA1B,CAA5B,EAAkE;AACxE,SACC,8BACC,cAAC,kBAAD;AACC,IAAA,OAAO,EAAGA,OADX;AAEC,IAAA,QAAQ,EAAGC,QAFZ;AAGC,IAAA,YAAY,EAAGC;AAHhB,IADD,EAMC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,+CADX;AAEC,IAAA,OAAO,EAAC,WAFT;AAGC,IAAA,IAAI,EAAGT,YAAY,CAAE,UAAF,EAAc;AAChCiB,MAAAA,SAAS,EAAE;AADqB,KAAd;AAHpB,KAOGlB,EAAE,CAAE,oBAAF,CAPL,CADD,CAND,CADD;AAoBA;AAED,eAAeiB,iBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { addQueryArgs } from '@wordpress/url';\nimport { Button } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BlockTypesList from '../block-types-list';\nimport InserterPanel from './panel';\nimport InserterNoResults from './no-results';\nimport useBlockTypesState from './hooks/use-block-types-state';\n\nfunction ReusableBlocksList( { onHover, onInsert, rootClientId } ) {\n\tconst [ items, , , onSelectItem ] = useBlockTypesState(\n\t\trootClientId,\n\t\tonInsert\n\t);\n\n\tconst filteredItems = useMemo( () => {\n\t\treturn items.filter( ( { category } ) => category === 'reusable' );\n\t}, [ items ] );\n\n\tif ( filteredItems.length === 0 ) {\n\t\treturn <InserterNoResults />;\n\t}\n\n\treturn (\n\t\t<InserterPanel title={ __( 'Synced patterns' ) }>\n\t\t\t<BlockTypesList\n\t\t\t\titems={ filteredItems }\n\t\t\t\tonSelect={ onSelectItem }\n\t\t\t\tonHover={ onHover }\n\t\t\t\tlabel={ __( 'Synced patterns' ) }\n\t\t\t/>\n\t\t</InserterPanel>\n\t);\n}\n\n// The unwrapped component is only exported for use by unit tests.\n/**\n * List of reusable blocks shown in the \"Reusable\" tab of the inserter.\n *\n * @param {Object}   props              Component props.\n * @param {?string}  props.rootClientId Client id of block to insert into.\n * @param {Function} props.onInsert     Callback to run when item is inserted.\n * @param {Function} props.onHover      Callback to run when item is hovered.\n *\n * @return {WPComponent} The component.\n */\nexport function ReusableBlocksTab( { rootClientId, onInsert, onHover } ) {\n\treturn (\n\t\t<>\n\t\t\t<ReusableBlocksList\n\t\t\t\tonHover={ onHover }\n\t\t\t\tonInsert={ onInsert }\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t/>\n\t\t\t<div className=\"block-editor-inserter__manage-reusable-blocks-container\">\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"block-editor-inserter__manage-reusable-blocks\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\thref={ addQueryArgs( 'edit.php', {\n\t\t\t\t\t\tpost_type: 'wp_block',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Manage my patterns' ) }\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ReusableBlocksTab;\n"]}

package/build-module/store/selectors.js

@@ -1765,7 +1765,6 @@ const buildBlockTypeItem = (state, {
  *
  * @param    {Object}   state             Editor state.
  * @param    {?string}  rootClientId      Optional root client ID of block list.
- * @param    {?string}  syncStatus        Optional sync status to filter pattern blocks by.
  *
  * @return {WPEditorInserterItem[]} Items that appear in inserter.
  *
@@ -1783,10 +1782,7 @@ const buildBlockTypeItem = (state, {
  */
 
 
-export const getInserterItems = createSelector((state, rootClientId = null, syncStatus) => {
-  const buildBlockTypeInserterItem = buildBlockTypeItem(state, {
-    buildScope: 'inserter'
-  });
+export const getInserterItems = createSelector((state, rootClientId = null) => {
   /*
    * Matches block comment delimiters amid serialized content.
    *
@@ -1800,7 +1796,6 @@ export const getInserterItems = createSelector((state, rootClientId = null, sync
    * - prepended ^\s*
    *
    */
-
   const blockParserTokenizer = /^\s*<!--\s+(\/)?wp:([a-z][a-z0-9_-]*\/)?([a-z][a-z0-9_-]*)\s+({(?:(?=([^}]+|}+(?=})|(?!}\s+\/?-->)[^])*)\5|[^]*?)}\s+)?(\/)?-->/;
 
   const buildReusableBlockInserterItem = reusableBlock => {
@@ -1852,8 +1847,13 @@ export const getInserterItems = createSelector((state, rootClientId = null, sync
     };
   };
 
+  const syncedPatternInserterItems = canInsertBlockTypeUnmemoized(state, 'core/block', rootClientId) ? getReusableBlocks(state).filter(reusableBlock => // Filter to either fully synced patterns (sync_status === 'fully'),
+  // or old school reusable blocks (sync_status === '').
+  reusableBlock.meta?.sync_status === 'fully' || reusableBlock.meta?.sync_status === '' || !reusableBlock.meta?.sync_status).map(buildReusableBlockInserterItem) : [];
+  const buildBlockTypeInserterItem = buildBlockTypeItem(state, {
+    buildScope: 'inserter'
+  });
   const blockTypeInserterItems = getBlockTypes().filter(blockType => canIncludeBlockTypeInInserter(state, blockType, rootClientId)).map(buildBlockTypeInserterItem);
-  const reusableBlockInserterItems = canInsertBlockTypeUnmemoized(state, 'core/block', rootClientId) ? getReusableBlocks(state).filter(reusableBlock => syncStatus === reusableBlock.meta?.sync_status || !syncStatus && reusableBlock.meta?.sync_status === '').map(buildReusableBlockInserterItem) : [];
   const items = blockTypeInserterItems.reduce((accumulator, item) => {
     const {
       variations = []
@@ -1895,7 +1895,7 @@ export const getInserterItems = createSelector((state, rootClientId = null, sync
     noncore: []
   });
   const sortedBlockTypes = [...coreItems, ...nonCoreItems];
-  return [...sortedBlockTypes, ...reusableBlockInserterItems];
+  return [...sortedBlockTypes, ...syncedPatternInserterItems];
 }, (state, rootClientId) => [state.blockListSettings[rootClientId], state.blocks.byClientId, state.blocks.order, state.preferences.insertUsage, state.settings.allowedBlockTypes, state.settings.templateLock, getReusableBlocks(state), getBlockTypes()]);
 /**
  * Determines the items that appear in the available block transforms list.
@@ -2039,9 +2039,24 @@ const checkAllowListRecursive = (blocks, allowedBlockTypes) => {
   return true;
 };
 
+function getUnsyncedPatterns(state) {
+  var _state$settings$__exp;
+
+  const reusableBlocks = (_state$settings$__exp = state?.settings?.__experimentalReusableBlocks) !== null && _state$settings$__exp !== void 0 ? _state$settings$__exp : EMPTY_ARRAY;
+  return reusableBlocks.filter(reusableBlock => reusableBlock.meta?.sync_status === 'unsynced').map(reusableBlock => {
+    return {
+      name: `core/block/${reusableBlock.id}`,
+      title: reusableBlock.title.raw,
+      categories: ['custom'],
+      content: reusableBlock.content.raw
+    };
+  });
+}
+
 export const __experimentalGetParsedPattern = createSelector((state, patternName) => {
   const patterns = state.settings.__experimentalBlockPatterns;
-  const pattern = patterns.find(({
+  const unsyncedPatterns = getUnsyncedPatterns(state);
+  const pattern = [...patterns, ...unsyncedPatterns].find(({
     name
   }) => name === patternName);
 
@@ -2054,13 +2069,14 @@ export const __experimentalGetParsedPattern = createSelector((state, patternName
       __unstableSkipMigrationLogs: true
     })
   };
-}, state => [state.settings.__experimentalBlockPatterns]);
+}, state => [state.settings.__experimentalBlockPatterns, state.settings.__experimentalReusableBlocks]);
 const getAllAllowedPatterns = createSelector(state => {
   const patterns = state.settings.__experimentalBlockPatterns;
+  const unsyncedPatterns = getUnsyncedPatterns(state);
   const {
     allowedBlockTypes
   } = getSettings(state);
-  const parsedPatterns = patterns.filter(({
+  const parsedPatterns = [...patterns, ...unsyncedPatterns].filter(({
     inserter = true
   }) => !!inserter).map(({
     name
@@ -2069,7 +2085,7 @@ const getAllAllowedPatterns = createSelector(state => {
     blocks
   }) => checkAllowListRecursive(blocks, allowedBlockTypes));
   return allowedPatterns;
-}, state => [state.settings.__experimentalBlockPatterns, state.settings.allowedBlockTypes]);
+}, state => [state.settings.__experimentalBlockPatterns, state.settings.__experimentalReusableBlocks, state.settings.allowedBlockTypes]);
 /**
  * Returns the list of allowed patterns for inner blocks children.
  *
@@ -2087,7 +2103,7 @@ export const __experimentalGetAllowedPatterns = createSelector((state, rootClien
     name
   }) => canInsertBlockType(state, name, rootClientId)));
   return patternsAllowed;
-}, (state, rootClientId) => [state.settings.__experimentalBlockPatterns, state.settings.allowedBlockTypes, state.settings.templateLock, state.blockListSettings[rootClientId], state.blocks.byClientId.get(rootClientId)]);
+}, (state, rootClientId) => [state.settings.__experimentalBlockPatterns, state.settings.__experimentalReusableBlocks, state.settings.allowedBlockTypes, state.settings.templateLock, state.blockListSettings[rootClientId], state.blocks.byClientId.get(rootClientId)]);
 /**
  * Returns the list of patterns based on their declared `blockTypes`
  * and a block's name.
@@ -2311,9 +2327,9 @@ export function __experimentalGetLastBlockAttributeChanges(state) {
  */
 
 function getReusableBlocks(state) {
-  var _state$settings$__exp;
+  var _state$settings$__exp2;
 
-  return (_state$settings$__exp = state?.settings?.__experimentalReusableBlocks) !== null && _state$settings$__exp !== void 0 ? _state$settings$__exp : EMPTY_ARRAY;
+  return (_state$settings$__exp2 = state?.settings?.__experimentalReusableBlocks) !== null && _state$settings$__exp2 !== void 0 ? _state$settings$__exp2 : EMPTY_ARRAY;
 }
 /**
  * Returns whether the navigation mode is enabled.