@wordpress/edit-site 5.22.0 → 5.24.0

package/build/components/global-styles/header.js

@@ -14,7 +14,8 @@ var _icons = require("@wordpress/icons");
 
 function ScreenHeader({
   title,
-  description
+  description,
+  onBack
 }) {
   return (0, _react.createElement)(_components.__experimentalVStack, {
     spacing: 0
@@ -34,7 +35,8 @@ function ScreenHeader({
     },
     icon: (0, _i18n.isRTL)() ? _icons.chevronRight : _icons.chevronLeft,
     isSmall: true,
-    "aria-label": (0, _i18n.__)('Navigate to the previous view')
+    "aria-label": (0, _i18n.__)('Navigate to the previous view'),
+    onClick: onBack
   }), (0, _react.createElement)(_components.__experimentalSpacer, null, (0, _react.createElement)(_components.__experimentalHeading, {
     className: "edit-site-global-styles-header",
     level: 2,

package/build/components/global-styles/header.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_icons","ScreenHeader","title","description","_react","createElement","__experimentalVStack","spacing","__experimentalView","__experimentalSpacer","marginBottom","paddingX","paddingY","__experimentalHStack","__experimentalNavigatorToParentButton","style","minWidth","padding","icon","isRTL","chevronRight","chevronLeft","isSmall","__","__experimentalHeading","className","level","size","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/header.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalHeading as Heading,\n\t__experimentalView as View,\n\t__experimentalNavigatorToParentButton as NavigatorToParentButton,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<NavigatorToParentButton\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t// TODO: This style override is also used in ToolsPanelHeader.\n\t\t\t\t\t\t\t\t// It should be supported out-of-the-box by Button.\n\t\t\t\t\t\t\t\t{ minWidth: 24, padding: 0 }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\taria-label={ __( 'Navigate to the previous view' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\n\t\t\t{ description && (\n\t\t\t\t<p className=\"edit-site-global-styles-header__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default ScreenHeader;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAQA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAZA;AACA;AACA;;AAYA,SAASG,YAAYA,CAAE;EAAEC,KAAK;EAAEC;AAAY,CAAC,EAAG;EAC/C,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAAS,oBAAM;IAACC,OAAO,EAAG;EAAG,GACpB,IAAAH,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAAW,kBAAI,QACJ,IAAAJ,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAAY,oBAAM;IAACC,YAAY,EAAG,CAAG;IAACC,QAAQ,EAAG,CAAG;IAACC,QAAQ,EAAG;EAAG,GACvD,IAAAR,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAAgB,oBAAM;IAACN,OAAO,EAAG;EAAG,GACpB,IAAAH,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAAiB,qCAAuB;IACvBC,KAAK;IACJ;IACA;IACA;MAAEC,QAAQ,EAAE,EAAE;MAAEC,OAAO,EAAE;IAAE,CAC3B;IACDC,IAAI,EAAG,IAAAC,WAAK,EAAC,CAAC,GAAGC,mBAAY,GAAGC,kBAAa;IAC7CC,OAAO;IACP,cAAa,IAAAC,QAAE,EAAE,+BAAgC;EAAG,CACpD,CAAC,EACF,IAAAnB,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAAY,oBAAM,QACN,IAAAL,MAAA,CAAAC,aAAA,EAACR,WAAA,CAAA2B,qBAAO;IACPC,SAAS,EAAC,gCAAgC;IAC1CC,KAAK,EAAG,CAAG;IACXC,IAAI,EAAG;EAAI,GAETzB,KACM,CACF,CACD,CACD,CACH,CAAC,EACLC,WAAW,IACZ,IAAAC,MAAA,CAAAC,aAAA;IAAGoB,SAAS,EAAC;EAA6C,GACvDtB,WACA,CAEG,CAAC;AAEX;AAAC,IAAAyB,QAAA,GAEc3B,YAAY;AAAA4B,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_components","require","_i18n","_icons","ScreenHeader","title","description","onBack","_react","createElement","__experimentalVStack","spacing","__experimentalView","__experimentalSpacer","marginBottom","paddingX","paddingY","__experimentalHStack","__experimentalNavigatorToParentButton","style","minWidth","padding","icon","isRTL","chevronRight","chevronLeft","isSmall","__","onClick","__experimentalHeading","className","level","size","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/header.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalHeading as Heading,\n\t__experimentalView as View,\n\t__experimentalNavigatorToParentButton as NavigatorToParentButton,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description, onBack } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<NavigatorToParentButton\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t// TODO: This style override is also used in ToolsPanelHeader.\n\t\t\t\t\t\t\t\t// It should be supported out-of-the-box by Button.\n\t\t\t\t\t\t\t\t{ minWidth: 24, padding: 0 }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\taria-label={ __( 'Navigate to the previous view' ) }\n\t\t\t\t\t\t\tonClick={ onBack }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\n\t\t\t{ description && (\n\t\t\t\t<p className=\"edit-site-global-styles-header__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default ScreenHeader;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAQA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAZA;AACA;AACA;;AAYA,SAASG,YAAYA,CAAE;EAAEC,KAAK;EAAEC,WAAW;EAAEC;AAAO,CAAC,EAAG;EACvD,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAAU,oBAAM;IAACC,OAAO,EAAG;EAAG,GACpB,IAAAH,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAAY,kBAAI,QACJ,IAAAJ,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAAa,oBAAM;IAACC,YAAY,EAAG,CAAG;IAACC,QAAQ,EAAG,CAAG;IAACC,QAAQ,EAAG;EAAG,GACvD,IAAAR,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAAiB,oBAAM;IAACN,OAAO,EAAG;EAAG,GACpB,IAAAH,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAAkB,qCAAuB;IACvBC,KAAK;IACJ;IACA;IACA;MAAEC,QAAQ,EAAE,EAAE;MAAEC,OAAO,EAAE;IAAE,CAC3B;IACDC,IAAI,EAAG,IAAAC,WAAK,EAAC,CAAC,GAAGC,mBAAY,GAAGC,kBAAa;IAC7CC,OAAO;IACP,cAAa,IAAAC,QAAE,EAAE,+BAAgC,CAAG;IACpDC,OAAO,EAAGrB;EAAQ,CAClB,CAAC,EACF,IAAAC,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAAa,oBAAM,QACN,IAAAL,MAAA,CAAAC,aAAA,EAACT,WAAA,CAAA6B,qBAAO;IACPC,SAAS,EAAC,gCAAgC;IAC1CC,KAAK,EAAG,CAAG;IACXC,IAAI,EAAG;EAAI,GAET3B,KACM,CACF,CACD,CACD,CACH,CAAC,EACLC,WAAW,IACZ,IAAAE,MAAA,CAAAC,aAAA;IAAGqB,SAAS,EAAC;EAA6C,GACvDxB,WACA,CAEG,CAAC;AAEX;AAAC,IAAA2B,QAAA,GAEc7B,YAAY;AAAA8B,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/components/global-styles/screen-block-list.js

@@ -91,17 +91,15 @@ function BlockMenuItem({
     icon: block.icon
   }), (0, _react.createElement)(_components.FlexItem, null, block.title)));
 }
-function ScreenBlockList() {
+function BlockList({
+  filterValue
+}) {
   const sortedBlockTypes = useSortedBlockTypes();
-  const [filterValue, setFilterValue] = (0, _element.useState)('');
   const debouncedSpeak = (0, _compose.useDebounce)(_a11y.speak, 500);
-  const isMatchingSearchTerm = (0, _data.useSelect)(select => select(_blocks.store).isMatchingSearchTerm, []);
-  const filteredBlockTypes = (0, _element.useMemo)(() => {
-    if (!filterValue) {
-      return sortedBlockTypes;
-    }
-    return sortedBlockTypes.filter(blockType => isMatchingSearchTerm(blockType, filterValue));
-  }, [filterValue, sortedBlockTypes, isMatchingSearchTerm]);
+  const {
+    isMatchingSearchTerm
+  } = (0, _data.useSelect)(_blocks.store);
+  const filteredBlockTypes = !filterValue ? sortedBlockTypes : sortedBlockTypes.filter(blockType => isMatchingSearchTerm(blockType, filterValue));
   const blockTypesListRef = (0, _element.useRef)();
 
   // Announce search results on change
@@ -122,6 +120,18 @@ function ScreenBlockList() {
     (0, _i18n._n)('%d result found.', '%d results found.', count), count);
     debouncedSpeak(resultsFoundMessage, count);
   }, [filterValue, debouncedSpeak]);
+  return (0, _react.createElement)("div", {
+    ref: blockTypesListRef,
+    className: "edit-site-block-types-item-list"
+  }, filteredBlockTypes.map(block => (0, _react.createElement)(BlockMenuItem, {
+    block: block,
+    key: 'menu-itemblock-' + block.name
+  })));
+}
+const MemoizedBlockList = (0, _element.memo)(BlockList);
+function ScreenBlockList() {
+  const [filterValue, setFilterValue] = (0, _element.useState)('');
+  const deferredFilterValue = (0, _element.useDeferredValue)(filterValue);
   return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_header.default, {
     title: (0, _i18n.__)('Blocks'),
     description: (0, _i18n.__)('Customize the appearance of specific blocks and for the whole site.')
@@ -132,13 +142,9 @@ function ScreenBlockList() {
     value: filterValue,
     label: (0, _i18n.__)('Search for blocks'),
     placeholder: (0, _i18n.__)('Search')
-  }), (0, _react.createElement)("div", {
-    ref: blockTypesListRef,
-    className: "edit-site-block-types-item-list"
-  }, filteredBlockTypes.map(block => (0, _react.createElement)(BlockMenuItem, {
-    block: block,
-    key: 'menu-itemblock-' + block.name
-  }))));
+  }), (0, _react.createElement)(MemoizedBlockList, {
+    filterValue: deferredFilterValue
+  }));
 }
 var _default = ScreenBlockList;
 exports.default = _default;

package/build/components/global-styles/screen-block-list.js.map

@@ -1 +1 @@
-{"version":3,"names":["_blocks","require","_i18n","_components","_data","_element","_blockEditor","_compose","_a11y","_variationsPanel","_header","_interopRequireDefault","_navigationButton","_lockUnlock","useHasDimensionsPanel","useHasTypographyPanel","useHasBorderPanel","useGlobalSetting","useSettingsForBlockElement","useHasColorPanel","unlock","blockEditorPrivateApis","useSortedBlockTypes","blockItems","useSelect","select","blocksStore","getBlockTypes","groupByType","blocks","block","core","noncore","type","name","startsWith","push","coreItems","nonCoreItems","reduce","useBlockHasGlobalStyles","blockName","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasDimensionsPanel","hasLayoutPanel","hasVariationsPanel","useBlockVariations","length","hasGlobalStyles","BlockMenuItem","hasBlockMenuItem","navigationButtonLabel","sprintf","__","title","_react","createElement","NavigationButtonAsItem","path","encodeURIComponent","__experimentalHStack","justify","BlockIcon","icon","FlexItem","ScreenBlockList","sortedBlockTypes","filterValue","setFilterValue","useState","debouncedSpeak","useDebounce","speak","isMatchingSearchTerm","filteredBlockTypes","useMemo","filter","blockType","blockTypesListRef","useRef","useEffect","count","current","childElementCount","resultsFoundMessage","_n","Fragment","default","description","SearchControl","__nextHasNoMarginBottom","className","onChange","value","label","placeholder","ref","map","key","_default","exports"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-block-list.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { __, sprintf, _n } from '@wordpress/i18n';\nimport {\n\tFlexItem,\n\tSearchControl,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useMemo, useEffect, useRef } from '@wordpress/element';\nimport {\n\tBlockIcon,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useDebounce } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport { useBlockVariations } from './variations-panel';\nimport ScreenHeader from './header';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasBorderPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasColorPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction useSortedBlockTypes() {\n\tconst blockItems = useSelect(\n\t\t( select ) => select( blocksStore ).getBlockTypes(),\n\t\t[]\n\t);\n\t// Ensure core blocks are prioritized in the returned results,\n\t// because third party blocks can be registered earlier than\n\t// the core blocks (usually by using the `init` action),\n\t// thus affecting the display order.\n\t// We don't sort reusable blocks as they are handled differently.\n\tconst groupByType = ( blocks, block ) => {\n\t\tconst { core, noncore } = blocks;\n\t\tconst type = block.name.startsWith( 'core/' ) ? core : noncore;\n\t\ttype.push( block );\n\t\treturn blocks;\n\t};\n\tconst { core: coreItems, noncore: nonCoreItems } = blockItems.reduce(\n\t\tgroupByType,\n\t\t{ core: [], noncore: [] }\n\t);\n\treturn [ ...coreItems, ...nonCoreItems ];\n}\n\nexport function useBlockHasGlobalStyles( blockName ) {\n\tconst [ rawSettings ] = useGlobalSetting( '', blockName );\n\tconst settings = useSettingsForBlockElement( rawSettings, blockName );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasBorderPanel = useHasBorderPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;\n\tconst hasVariationsPanel = !! useBlockVariations( blockName )?.length;\n\tconst hasGlobalStyles =\n\t\thasTypographyPanel ||\n\t\thasColorPanel ||\n\t\thasLayoutPanel ||\n\t\thasVariationsPanel;\n\treturn hasGlobalStyles;\n}\n\nfunction BlockMenuItem( { block } ) {\n\tconst hasBlockMenuItem = useBlockHasGlobalStyles( block.name );\n\tif ( ! hasBlockMenuItem ) {\n\t\treturn null;\n\t}\n\n\tconst navigationButtonLabel = sprintf(\n\t\t// translators: %s: is the name of a block e.g., 'Image' or 'Table'.\n\t\t__( '%s block styles' ),\n\t\tblock.title\n\t);\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\taria-label={ navigationButtonLabel }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<BlockIcon icon={ block.icon } />\n\t\t\t\t<FlexItem>{ block.title }</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ScreenBlockList() {\n\tconst sortedBlockTypes = useSortedBlockTypes();\n\tconst [ filterValue, setFilterValue ] = useState( '' );\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst isMatchingSearchTerm = useSelect(\n\t\t( select ) => select( blocksStore ).isMatchingSearchTerm,\n\t\t[]\n\t);\n\tconst filteredBlockTypes = useMemo( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn sortedBlockTypes;\n\t\t}\n\t\treturn sortedBlockTypes.filter( ( blockType ) =>\n\t\t\tisMatchingSearchTerm( blockType, filterValue )\n\t\t);\n\t}, [ filterValue, sortedBlockTypes, isMatchingSearchTerm ] );\n\n\tconst blockTypesListRef = useRef();\n\n\t// Announce search results on change\n\tuseEffect( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn;\n\t\t}\n\t\t// We extract the results from the wrapper div's `ref` because\n\t\t// filtered items can contain items that will eventually not\n\t\t// render and there is no reliable way to detect when a child\n\t\t// will return `null`.\n\t\t// TODO: We should find a better way of handling this as it's\n\t\t// fragile and depends on the number of rendered elements of `BlockMenuItem`,\n\t\t// which is now one.\n\t\t// @see https://github.com/WordPress/gutenberg/pull/39117#discussion_r816022116\n\t\tconst count = blockTypesListRef.current.childElementCount;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/* translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage, count );\n\t}, [ filterValue, debouncedSpeak ] );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Blocks' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Customize the appearance of specific blocks and for the whole site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<SearchControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tclassName=\"edit-site-block-types-search\"\n\t\t\t\tonChange={ setFilterValue }\n\t\t\t\tvalue={ filterValue }\n\t\t\t\tlabel={ __( 'Search for blocks' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tref={ blockTypesListRef }\n\t\t\t\tclassName=\"edit-site-block-types-item-list\"\n\t\t\t>\n\t\t\t\t{ filteredBlockTypes.map( ( block ) => (\n\t\t\t\t\t<BlockMenuItem\n\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\tkey={ 'menu-itemblock-' + block.name }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ScreenBlockList;\n"],"mappings":"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"}
+{"version":3,"names":["_blocks","require","_i18n","_components","_data","_element","_blockEditor","_compose","_a11y","_variationsPanel","_header","_interopRequireDefault","_navigationButton","_lockUnlock","useHasDimensionsPanel","useHasTypographyPanel","useHasBorderPanel","useGlobalSetting","useSettingsForBlockElement","useHasColorPanel","unlock","blockEditorPrivateApis","useSortedBlockTypes","blockItems","useSelect","select","blocksStore","getBlockTypes","groupByType","blocks","block","core","noncore","type","name","startsWith","push","coreItems","nonCoreItems","reduce","useBlockHasGlobalStyles","blockName","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasDimensionsPanel","hasLayoutPanel","hasVariationsPanel","useBlockVariations","length","hasGlobalStyles","BlockMenuItem","hasBlockMenuItem","navigationButtonLabel","sprintf","__","title","_react","createElement","NavigationButtonAsItem","path","encodeURIComponent","__experimentalHStack","justify","BlockIcon","icon","FlexItem","BlockList","filterValue","sortedBlockTypes","debouncedSpeak","useDebounce","speak","isMatchingSearchTerm","filteredBlockTypes","filter","blockType","blockTypesListRef","useRef","useEffect","count","current","childElementCount","resultsFoundMessage","_n","ref","className","map","key","MemoizedBlockList","memo","ScreenBlockList","setFilterValue","useState","deferredFilterValue","useDeferredValue","Fragment","default","description","SearchControl","__nextHasNoMarginBottom","onChange","value","label","placeholder","_default","exports"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-block-list.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { __, sprintf, _n } from '@wordpress/i18n';\nimport {\n\tFlexItem,\n\tSearchControl,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tuseState,\n\tuseEffect,\n\tuseRef,\n\tuseDeferredValue,\n\tmemo,\n} from '@wordpress/element';\nimport {\n\tBlockIcon,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useDebounce } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport { useBlockVariations } from './variations-panel';\nimport ScreenHeader from './header';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasBorderPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasColorPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction useSortedBlockTypes() {\n\tconst blockItems = useSelect(\n\t\t( select ) => select( blocksStore ).getBlockTypes(),\n\t\t[]\n\t);\n\t// Ensure core blocks are prioritized in the returned results,\n\t// because third party blocks can be registered earlier than\n\t// the core blocks (usually by using the `init` action),\n\t// thus affecting the display order.\n\t// We don't sort reusable blocks as they are handled differently.\n\tconst groupByType = ( blocks, block ) => {\n\t\tconst { core, noncore } = blocks;\n\t\tconst type = block.name.startsWith( 'core/' ) ? core : noncore;\n\t\ttype.push( block );\n\t\treturn blocks;\n\t};\n\tconst { core: coreItems, noncore: nonCoreItems } = blockItems.reduce(\n\t\tgroupByType,\n\t\t{ core: [], noncore: [] }\n\t);\n\treturn [ ...coreItems, ...nonCoreItems ];\n}\n\nexport function useBlockHasGlobalStyles( blockName ) {\n\tconst [ rawSettings ] = useGlobalSetting( '', blockName );\n\tconst settings = useSettingsForBlockElement( rawSettings, blockName );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasBorderPanel = useHasBorderPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;\n\tconst hasVariationsPanel = !! useBlockVariations( blockName )?.length;\n\tconst hasGlobalStyles =\n\t\thasTypographyPanel ||\n\t\thasColorPanel ||\n\t\thasLayoutPanel ||\n\t\thasVariationsPanel;\n\treturn hasGlobalStyles;\n}\n\nfunction BlockMenuItem( { block } ) {\n\tconst hasBlockMenuItem = useBlockHasGlobalStyles( block.name );\n\tif ( ! hasBlockMenuItem ) {\n\t\treturn null;\n\t}\n\n\tconst navigationButtonLabel = sprintf(\n\t\t// translators: %s: is the name of a block e.g., 'Image' or 'Table'.\n\t\t__( '%s block styles' ),\n\t\tblock.title\n\t);\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\taria-label={ navigationButtonLabel }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<BlockIcon icon={ block.icon } />\n\t\t\t\t<FlexItem>{ block.title }</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction BlockList( { filterValue } ) {\n\tconst sortedBlockTypes = useSortedBlockTypes();\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst { isMatchingSearchTerm } = useSelect( blocksStore );\n\n\tconst filteredBlockTypes = ! filterValue\n\t\t? sortedBlockTypes\n\t\t: sortedBlockTypes.filter( ( blockType ) =>\n\t\t\t\tisMatchingSearchTerm( blockType, filterValue )\n\t\t  );\n\n\tconst blockTypesListRef = useRef();\n\n\t// Announce search results on change\n\tuseEffect( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn;\n\t\t}\n\t\t// We extract the results from the wrapper div's `ref` because\n\t\t// filtered items can contain items that will eventually not\n\t\t// render and there is no reliable way to detect when a child\n\t\t// will return `null`.\n\t\t// TODO: We should find a better way of handling this as it's\n\t\t// fragile and depends on the number of rendered elements of `BlockMenuItem`,\n\t\t// which is now one.\n\t\t// @see https://github.com/WordPress/gutenberg/pull/39117#discussion_r816022116\n\t\tconst count = blockTypesListRef.current.childElementCount;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/* translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage, count );\n\t}, [ filterValue, debouncedSpeak ] );\n\n\treturn (\n\t\t<div\n\t\t\tref={ blockTypesListRef }\n\t\t\tclassName=\"edit-site-block-types-item-list\"\n\t\t>\n\t\t\t{ filteredBlockTypes.map( ( block ) => (\n\t\t\t\t<BlockMenuItem\n\t\t\t\t\tblock={ block }\n\t\t\t\t\tkey={ 'menu-itemblock-' + block.name }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</div>\n\t);\n}\n\nconst MemoizedBlockList = memo( BlockList );\n\nfunction ScreenBlockList() {\n\tconst [ filterValue, setFilterValue ] = useState( '' );\n\tconst deferredFilterValue = useDeferredValue( filterValue );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Blocks' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Customize the appearance of specific blocks and for the whole site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<SearchControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tclassName=\"edit-site-block-types-search\"\n\t\t\t\tonChange={ setFilterValue }\n\t\t\t\tvalue={ filterValue }\n\t\t\t\tlabel={ __( 'Search for blocks' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t\t<MemoizedBlockList filterValue={ deferredFilterValue } />\n\t\t</>\n\t);\n}\n\nexport default ScreenBlockList;\n"],"mappings":"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"}

package/build/components/global-styles/screen-revisions/index.js

@@ -9,6 +9,7 @@ var _react = require("react");
 var _i18n = require("@wordpress/i18n");
 var _components = require("@wordpress/components");
 var _data = require("@wordpress/data");
+var _coreData = require("@wordpress/core-data");
 var _element = require("@wordpress/element");
 var _blockEditor = require("@wordpress/block-editor");
 var _header = _interopRequireDefault(require("../header"));
@@ -32,19 +33,36 @@ const {
 } = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
 function ScreenRevisions() {
   const {
-    goBack
+    goTo
   } = (0, _components.__experimentalUseNavigator)();
   const {
-    user: userConfig,
+    user: currentEditorGlobalStyles,
     setUserConfig
   } = (0, _element.useContext)(GlobalStylesContext);
   const {
     blocks,
-    editorCanvasContainerView
+    editorCanvasContainerView,
+    revisionsCount
   } = (0, _data.useSelect)(select => {
+    const {
+      getEntityRecord,
+      __experimentalGetCurrentGlobalStylesId,
+      __experimentalGetDirtyEntityRecords
+    } = select(_coreData.store);
+    const isDirty = __experimentalGetDirtyEntityRecords().length > 0;
+    const globalStylesId = __experimentalGetCurrentGlobalStylesId();
+    const globalStyles = globalStylesId ? getEntityRecord('root', 'globalStyles', globalStylesId) : undefined;
+    let _revisionsCount = globalStyles?._links?.['version-history']?.[0]?.count || 0;
+    // one for the reset item.
+    _revisionsCount++;
+    // one for any dirty changes (unsaved).
+    if (isDirty) {
+      _revisionsCount++;
+    }
     return {
       editorCanvasContainerView: (0, _lockUnlock.unlock)(select(_store.store)).getEditorCanvasContainerView(),
-      blocks: select(_blockEditor.store).getBlocks()
+      blocks: select(_blockEditor.store).getBlocks(),
+      revisionsCount: _revisionsCount
     };
   }, []);
   const {
@@ -52,20 +70,15 @@ function ScreenRevisions() {
     isLoading,
     hasUnsavedChanges
   } = (0, _useGlobalStylesRevisions.default)();
-  const [selectedRevisionId, setSelectedRevisionId] = (0, _element.useState)();
-  const [globalStylesRevision, setGlobalStylesRevision] = (0, _element.useState)(userConfig);
+  const [currentlySelectedRevision, setCurrentlySelectedRevision] = (0, _element.useState)(currentEditorGlobalStyles);
   const [isLoadingRevisionWithUnsavedChanges, setIsLoadingRevisionWithUnsavedChanges] = (0, _element.useState)(false);
   const {
     setEditorCanvasContainerView
   } = (0, _lockUnlock.unlock)((0, _data.useDispatch)(_store.store));
-  (0, _element.useEffect)(() => {
-    if (editorCanvasContainerView !== 'global-styles-revisions') {
-      goBack();
-      setEditorCanvasContainerView(editorCanvasContainerView);
-    }
-  }, [editorCanvasContainerView]);
+  const selectedRevisionMatchesEditorStyles = areGlobalStyleConfigsEqual(currentlySelectedRevision, currentEditorGlobalStyles);
   const onCloseRevisions = () => {
-    goBack();
+    goTo('/'); // Return to global styles main panel.
+    setEditorCanvasContainerView(undefined);
   };
   const restoreRevision = revision => {
     setUserConfig(() => ({
@@ -76,45 +89,74 @@ function ScreenRevisions() {
     onCloseRevisions();
   };
   const selectRevision = revision => {
-    setGlobalStylesRevision({
+    setCurrentlySelectedRevision({
       styles: revision?.styles || {},
       settings: revision?.settings || {},
       id: revision?.id
     });
-    setSelectedRevisionId(revision?.id);
   };
-  const isLoadButtonEnabled = !!globalStylesRevision?.id && !areGlobalStyleConfigsEqual(globalStylesRevision, userConfig);
+  (0, _element.useEffect)(() => {
+    if (editorCanvasContainerView !== 'global-styles-revisions') {
+      goTo('/'); // Return to global styles main panel.
+      setEditorCanvasContainerView(editorCanvasContainerView);
+    }
+  }, [editorCanvasContainerView]);
+  const firstRevision = revisions[0];
+  const currentlySelectedRevisionId = currentlySelectedRevision?.id;
+  const shouldSelectFirstItem = !!firstRevision?.id && !selectedRevisionMatchesEditorStyles && !currentlySelectedRevisionId;
+  (0, _element.useEffect)(() => {
+    /*
+     * Ensure that the first item is selected and loaded into the preview pane
+     * when no revision is selected and the selected styles don't match the current editor styles.
+     * This is required in case editor styles are changed outside the revisions panel,
+     * e.g., via the reset styles function of useGlobalStylesReset().
+     * See: https://github.com/WordPress/gutenberg/issues/55866
+     */
+    if (shouldSelectFirstItem) {
+      setCurrentlySelectedRevision({
+        styles: firstRevision?.styles || {},
+        settings: firstRevision?.settings || {},
+        id: firstRevision?.id
+      });
+    }
+  }, [shouldSelectFirstItem, firstRevision]);
+
+  // Only display load button if there is a revision to load and it is different from the current editor styles.
+  const isLoadButtonEnabled = !!currentlySelectedRevisionId && !selectedRevisionMatchesEditorStyles;
   const shouldShowRevisions = !isLoading && revisions.length;
   return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_header.default, {
-    title: (0, _i18n.__)('Revisions'),
-    description: (0, _i18n.__)('Revisions are added to the timeline when style changes are saved.')
+    title: revisionsCount &&
+    // translators: %s: number of revisions.
+    (0, _i18n.sprintf)((0, _i18n.__)('Revisions (%s)'), revisionsCount),
+    description: (0, _i18n.__)('Click on previously saved styles to preview them. To restore a selected version to the editor, hit "Apply." When you\'re ready, use the Save button to save your changes.'),
+    onBack: onCloseRevisions
   }), isLoading && (0, _react.createElement)(_components.Spinner, {
     className: "edit-site-global-styles-screen-revisions__loading"
   }), shouldShowRevisions ? (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_revisions.default, {
     blocks: blocks,
-    userConfig: globalStylesRevision,
+    userConfig: currentlySelectedRevision,
     onClose: onCloseRevisions
   }), (0, _react.createElement)("div", {
     className: "edit-site-global-styles-screen-revisions"
   }, (0, _react.createElement)(_revisionsButtons.default, {
     onChange: selectRevision,
-    selectedRevisionId: selectedRevisionId,
+    selectedRevisionId: currentlySelectedRevisionId,
     userRevisions: revisions
   }), isLoadButtonEnabled && (0, _react.createElement)(_sidebarFixedBottom.default, null, (0, _react.createElement)(_components.Button, {
     variant: "primary",
     className: "edit-site-global-styles-screen-revisions__button",
-    disabled: !globalStylesRevision?.id || globalStylesRevision?.id === 'unsaved',
+    disabled: !currentlySelectedRevisionId || currentlySelectedRevisionId === 'unsaved',
     onClick: () => {
       if (hasUnsavedChanges) {
         setIsLoadingRevisionWithUnsavedChanges(true);
       } else {
-        restoreRevision(globalStylesRevision);
+        restoreRevision(currentlySelectedRevision);
       }
     }
-  }, globalStylesRevision?.id === 'parent' ? (0, _i18n.__)('Reset to defaults') : (0, _i18n.__)('Apply')))), isLoadingRevisionWithUnsavedChanges && (0, _react.createElement)(_components.__experimentalConfirmDialog, {
+  }, currentlySelectedRevisionId === 'parent' ? (0, _i18n.__)('Reset to defaults') : (0, _i18n.__)('Apply')))), isLoadingRevisionWithUnsavedChanges && (0, _react.createElement)(_components.__experimentalConfirmDialog, {
     isOpen: isLoadingRevisionWithUnsavedChanges,
     confirmButtonText: (0, _i18n.__)('Apply'),
-    onConfirm: () => restoreRevision(globalStylesRevision),
+    onConfirm: () => restoreRevision(currentlySelectedRevision),
     onCancel: () => setIsLoadingRevisionWithUnsavedChanges(false)
   }, (0, _i18n.__)('Any unsaved changes will be lost when you apply this revision.'))) : (0, _react.createElement)(_components.__experimentalSpacer, {
     marginX: 4,

package/build/components/global-styles/screen-revisions/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_components","_data","_element","_blockEditor","_header","_interopRequireDefault","_lockUnlock","_revisions","_sidebarFixedBottom","_store","_useGlobalStylesRevisions","_revisionsButtons","GlobalStylesContext","areGlobalStyleConfigsEqual","unlock","blockEditorPrivateApis","ScreenRevisions","goBack","useNavigator","user","userConfig","setUserConfig","useContext","blocks","editorCanvasContainerView","useSelect","select","editSiteStore","getEditorCanvasContainerView","blockEditorStore","getBlocks","revisions","isLoading","hasUnsavedChanges","useGlobalStylesRevisions","selectedRevisionId","setSelectedRevisionId","useState","globalStylesRevision","setGlobalStylesRevision","isLoadingRevisionWithUnsavedChanges","setIsLoadingRevisionWithUnsavedChanges","setEditorCanvasContainerView","useDispatch","useEffect","onCloseRevisions","restoreRevision","revision","styles","settings","selectRevision","id","isLoadButtonEnabled","shouldShowRevisions","length","_react","createElement","Fragment","default","title","__","description","Spinner","className","onClose","onChange","userRevisions","Button","variant","disabled","onClick","__experimentalConfirmDialog","isOpen","confirmButtonText","onConfirm","onCancel","__experimentalSpacer","marginX","_default","exports"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-revisions/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tButton,\n\t__experimentalUseNavigator as useNavigator,\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tSpinner,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useContext, useState, useEffect } from '@wordpress/element';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from '../header';\nimport { unlock } from '../../../lock-unlock';\nimport Revisions from '../../revisions';\nimport SidebarFixedBottom from '../../sidebar-edit-mode/sidebar-fixed-bottom';\nimport { store as editSiteStore } from '../../../store';\nimport useGlobalStylesRevisions from './use-global-styles-revisions';\nimport RevisionsButtons from './revisions-buttons';\n\nconst { GlobalStylesContext, areGlobalStyleConfigsEqual } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction ScreenRevisions() {\n\tconst { goBack } = useNavigator();\n\tconst { user: userConfig, setUserConfig } =\n\t\tuseContext( GlobalStylesContext );\n\tconst { blocks, editorCanvasContainerView } = useSelect( ( select ) => {\n\t\treturn {\n\t\t\teditorCanvasContainerView: unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t).getEditorCanvasContainerView(),\n\t\t\tblocks: select( blockEditorStore ).getBlocks(),\n\t\t};\n\t}, [] );\n\tconst { revisions, isLoading, hasUnsavedChanges } =\n\t\tuseGlobalStylesRevisions();\n\tconst [ selectedRevisionId, setSelectedRevisionId ] = useState();\n\tconst [ globalStylesRevision, setGlobalStylesRevision ] =\n\t\tuseState( userConfig );\n\tconst [\n\t\tisLoadingRevisionWithUnsavedChanges,\n\t\tsetIsLoadingRevisionWithUnsavedChanges,\n\t] = useState( false );\n\tconst { setEditorCanvasContainerView } = unlock(\n\t\tuseDispatch( editSiteStore )\n\t);\n\n\tuseEffect( () => {\n\t\tif ( editorCanvasContainerView !== 'global-styles-revisions' ) {\n\t\t\tgoBack();\n\t\t\tsetEditorCanvasContainerView( editorCanvasContainerView );\n\t\t}\n\t}, [ editorCanvasContainerView ] );\n\n\tconst onCloseRevisions = () => {\n\t\tgoBack();\n\t};\n\n\tconst restoreRevision = ( revision ) => {\n\t\tsetUserConfig( () => ( {\n\t\t\tstyles: revision?.styles,\n\t\t\tsettings: revision?.settings,\n\t\t} ) );\n\t\tsetIsLoadingRevisionWithUnsavedChanges( false );\n\t\tonCloseRevisions();\n\t};\n\n\tconst selectRevision = ( revision ) => {\n\t\tsetGlobalStylesRevision( {\n\t\t\tstyles: revision?.styles || {},\n\t\t\tsettings: revision?.settings || {},\n\t\t\tid: revision?.id,\n\t\t} );\n\t\tsetSelectedRevisionId( revision?.id );\n\t};\n\n\tconst isLoadButtonEnabled =\n\t\t!! globalStylesRevision?.id &&\n\t\t! areGlobalStyleConfigsEqual( globalStylesRevision, userConfig );\n\tconst shouldShowRevisions = ! isLoading && revisions.length;\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Revisions' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Revisions are added to the timeline when style changes are saved.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t{ isLoading && (\n\t\t\t\t<Spinner className=\"edit-site-global-styles-screen-revisions__loading\" />\n\t\t\t) }\n\t\t\t{ shouldShowRevisions ? (\n\t\t\t\t<>\n\t\t\t\t\t<Revisions\n\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\tuserConfig={ globalStylesRevision }\n\t\t\t\t\t\tonClose={ onCloseRevisions }\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"edit-site-global-styles-screen-revisions\">\n\t\t\t\t\t\t<RevisionsButtons\n\t\t\t\t\t\t\tonChange={ selectRevision }\n\t\t\t\t\t\t\tselectedRevisionId={ selectedRevisionId }\n\t\t\t\t\t\t\tuserRevisions={ revisions }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isLoadButtonEnabled && (\n\t\t\t\t\t\t\t<SidebarFixedBottom>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__button\"\n\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\t! globalStylesRevision?.id ||\n\t\t\t\t\t\t\t\t\t\tglobalStylesRevision?.id === 'unsaved'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif ( hasUnsavedChanges ) {\n\t\t\t\t\t\t\t\t\t\t\tsetIsLoadingRevisionWithUnsavedChanges(\n\t\t\t\t\t\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\trestoreRevision(\n\t\t\t\t\t\t\t\t\t\t\t\tglobalStylesRevision\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ globalStylesRevision?.id === 'parent'\n\t\t\t\t\t\t\t\t\t\t? __( 'Reset to defaults' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Apply' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</SidebarFixedBottom>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t{ isLoadingRevisionWithUnsavedChanges && (\n\t\t\t\t\t\t<ConfirmDialog\n\t\t\t\t\t\t\tisOpen={ isLoadingRevisionWithUnsavedChanges }\n\t\t\t\t\t\t\tconfirmButtonText={ __( 'Apply' ) }\n\t\t\t\t\t\t\tonConfirm={ () =>\n\t\t\t\t\t\t\t\trestoreRevision( globalStylesRevision )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonCancel={ () =>\n\t\t\t\t\t\t\t\tsetIsLoadingRevisionWithUnsavedChanges( false )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Any unsaved changes will be lost when you apply this revision.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</ConfirmDialog>\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<Spacer marginX={ 4 } data-testid=\"global-styles-no-revisions\">\n\t\t\t\t\t{\n\t\t\t\t\t\t// Adding an existing translation here in case these changes are shipped to WordPress 6.3.\n\t\t\t\t\t\t// Later we could update to something better, e.g., \"There are currently no style revisions.\".\n\t\t\t\t\t\t__( 'No results found.' )\n\t\t\t\t\t}\n\t\t\t\t</Spacer>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default ScreenRevisions;\n"],"mappings":"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"}
+{"version":3,"names":["_i18n","require","_components","_data","_coreData","_element","_blockEditor","_header","_interopRequireDefault","_lockUnlock","_revisions","_sidebarFixedBottom","_store","_useGlobalStylesRevisions","_revisionsButtons","GlobalStylesContext","areGlobalStyleConfigsEqual","unlock","blockEditorPrivateApis","ScreenRevisions","goTo","useNavigator","user","currentEditorGlobalStyles","setUserConfig","useContext","blocks","editorCanvasContainerView","revisionsCount","useSelect","select","getEntityRecord","__experimentalGetCurrentGlobalStylesId","__experimentalGetDirtyEntityRecords","coreStore","isDirty","length","globalStylesId","globalStyles","undefined","_revisionsCount","_links","count","editSiteStore","getEditorCanvasContainerView","blockEditorStore","getBlocks","revisions","isLoading","hasUnsavedChanges","useGlobalStylesRevisions","currentlySelectedRevision","setCurrentlySelectedRevision","useState","isLoadingRevisionWithUnsavedChanges","setIsLoadingRevisionWithUnsavedChanges","setEditorCanvasContainerView","useDispatch","selectedRevisionMatchesEditorStyles","onCloseRevisions","restoreRevision","revision","styles","settings","selectRevision","id","useEffect","firstRevision","currentlySelectedRevisionId","shouldSelectFirstItem","isLoadButtonEnabled","shouldShowRevisions","_react","createElement","Fragment","default","title","sprintf","__","description","onBack","Spinner","className","userConfig","onClose","onChange","selectedRevisionId","userRevisions","Button","variant","disabled","onClick","__experimentalConfirmDialog","isOpen","confirmButtonText","onConfirm","onCancel","__experimentalSpacer","marginX","_default","exports"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-revisions/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tButton,\n\t__experimentalUseNavigator as useNavigator,\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tSpinner,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useContext, useState, useEffect } from '@wordpress/element';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from '../header';\nimport { unlock } from '../../../lock-unlock';\nimport Revisions from '../../revisions';\nimport SidebarFixedBottom from '../../sidebar-edit-mode/sidebar-fixed-bottom';\nimport { store as editSiteStore } from '../../../store';\nimport useGlobalStylesRevisions from './use-global-styles-revisions';\nimport RevisionsButtons from './revisions-buttons';\n\nconst { GlobalStylesContext, areGlobalStyleConfigsEqual } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction ScreenRevisions() {\n\tconst { goTo } = useNavigator();\n\tconst { user: currentEditorGlobalStyles, setUserConfig } =\n\t\tuseContext( GlobalStylesContext );\n\tconst { blocks, editorCanvasContainerView, revisionsCount } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetEntityRecord,\n\t\t\t\t__experimentalGetCurrentGlobalStylesId,\n\t\t\t\t__experimentalGetDirtyEntityRecords,\n\t\t\t} = select( coreStore );\n\t\t\tconst isDirty = __experimentalGetDirtyEntityRecords().length > 0;\n\t\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\t\tconst globalStyles = globalStylesId\n\t\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t\t: undefined;\n\t\t\tlet _revisionsCount =\n\t\t\t\tglobalStyles?._links?.[ 'version-history' ]?.[ 0 ]?.count || 0;\n\t\t\t// one for the reset item.\n\t\t\t_revisionsCount++;\n\t\t\t// one for any dirty changes (unsaved).\n\t\t\tif ( isDirty ) {\n\t\t\t\t_revisionsCount++;\n\t\t\t}\n\t\t\treturn {\n\t\t\t\teditorCanvasContainerView: unlock(\n\t\t\t\t\tselect( editSiteStore )\n\t\t\t\t).getEditorCanvasContainerView(),\n\t\t\t\tblocks: select( blockEditorStore ).getBlocks(),\n\t\t\t\trevisionsCount: _revisionsCount,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { revisions, isLoading, hasUnsavedChanges } =\n\t\tuseGlobalStylesRevisions();\n\tconst [ currentlySelectedRevision, setCurrentlySelectedRevision ] =\n\t\tuseState( currentEditorGlobalStyles );\n\tconst [\n\t\tisLoadingRevisionWithUnsavedChanges,\n\t\tsetIsLoadingRevisionWithUnsavedChanges,\n\t] = useState( false );\n\tconst { setEditorCanvasContainerView } = unlock(\n\t\tuseDispatch( editSiteStore )\n\t);\n\tconst selectedRevisionMatchesEditorStyles = areGlobalStyleConfigsEqual(\n\t\tcurrentlySelectedRevision,\n\t\tcurrentEditorGlobalStyles\n\t);\n\n\tconst onCloseRevisions = () => {\n\t\tgoTo( '/' ); // Return to global styles main panel.\n\t\tsetEditorCanvasContainerView( undefined );\n\t};\n\n\tconst restoreRevision = ( revision ) => {\n\t\tsetUserConfig( () => ( {\n\t\t\tstyles: revision?.styles,\n\t\t\tsettings: revision?.settings,\n\t\t} ) );\n\t\tsetIsLoadingRevisionWithUnsavedChanges( false );\n\t\tonCloseRevisions();\n\t};\n\n\tconst selectRevision = ( revision ) => {\n\t\tsetCurrentlySelectedRevision( {\n\t\t\tstyles: revision?.styles || {},\n\t\t\tsettings: revision?.settings || {},\n\t\t\tid: revision?.id,\n\t\t} );\n\t};\n\n\tuseEffect( () => {\n\t\tif ( editorCanvasContainerView !== 'global-styles-revisions' ) {\n\t\t\tgoTo( '/' ); // Return to global styles main panel.\n\t\t\tsetEditorCanvasContainerView( editorCanvasContainerView );\n\t\t}\n\t}, [ editorCanvasContainerView ] );\n\n\tconst firstRevision = revisions[ 0 ];\n\tconst currentlySelectedRevisionId = currentlySelectedRevision?.id;\n\tconst shouldSelectFirstItem =\n\t\t!! firstRevision?.id &&\n\t\t! selectedRevisionMatchesEditorStyles &&\n\t\t! currentlySelectedRevisionId;\n\n\tuseEffect( () => {\n\t\t/*\n\t\t * Ensure that the first item is selected and loaded into the preview pane\n\t\t * when no revision is selected and the selected styles don't match the current editor styles.\n\t\t * This is required in case editor styles are changed outside the revisions panel,\n\t\t * e.g., via the reset styles function of useGlobalStylesReset().\n\t\t * See: https://github.com/WordPress/gutenberg/issues/55866\n\t\t */\n\t\tif ( shouldSelectFirstItem ) {\n\t\t\tsetCurrentlySelectedRevision( {\n\t\t\t\tstyles: firstRevision?.styles || {},\n\t\t\t\tsettings: firstRevision?.settings || {},\n\t\t\t\tid: firstRevision?.id,\n\t\t\t} );\n\t\t}\n\t}, [ shouldSelectFirstItem, firstRevision ] );\n\n\t// Only display load button if there is a revision to load and it is different from the current editor styles.\n\tconst isLoadButtonEnabled =\n\t\t!! currentlySelectedRevisionId && ! selectedRevisionMatchesEditorStyles;\n\tconst shouldShowRevisions = ! isLoading && revisions.length;\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={\n\t\t\t\t\trevisionsCount &&\n\t\t\t\t\t// translators: %s: number of revisions.\n\t\t\t\t\tsprintf( __( 'Revisions (%s)' ), revisionsCount )\n\t\t\t\t}\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Click on previously saved styles to preview them. To restore a selected version to the editor, hit \"Apply.\" When you\\'re ready, use the Save button to save your changes.'\n\t\t\t\t) }\n\t\t\t\tonBack={ onCloseRevisions }\n\t\t\t/>\n\t\t\t{ isLoading && (\n\t\t\t\t<Spinner className=\"edit-site-global-styles-screen-revisions__loading\" />\n\t\t\t) }\n\t\t\t{ shouldShowRevisions ? (\n\t\t\t\t<>\n\t\t\t\t\t<Revisions\n\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\tuserConfig={ currentlySelectedRevision }\n\t\t\t\t\t\tonClose={ onCloseRevisions }\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"edit-site-global-styles-screen-revisions\">\n\t\t\t\t\t\t<RevisionsButtons\n\t\t\t\t\t\t\tonChange={ selectRevision }\n\t\t\t\t\t\t\tselectedRevisionId={ currentlySelectedRevisionId }\n\t\t\t\t\t\t\tuserRevisions={ revisions }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isLoadButtonEnabled && (\n\t\t\t\t\t\t\t<SidebarFixedBottom>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__button\"\n\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\t! currentlySelectedRevisionId ||\n\t\t\t\t\t\t\t\t\t\tcurrentlySelectedRevisionId ===\n\t\t\t\t\t\t\t\t\t\t\t'unsaved'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif ( hasUnsavedChanges ) {\n\t\t\t\t\t\t\t\t\t\t\tsetIsLoadingRevisionWithUnsavedChanges(\n\t\t\t\t\t\t\t\t\t\t\t\ttrue\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\trestoreRevision(\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentlySelectedRevision\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ currentlySelectedRevisionId === 'parent'\n\t\t\t\t\t\t\t\t\t\t? __( 'Reset to defaults' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Apply' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</SidebarFixedBottom>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t{ isLoadingRevisionWithUnsavedChanges && (\n\t\t\t\t\t\t<ConfirmDialog\n\t\t\t\t\t\t\tisOpen={ isLoadingRevisionWithUnsavedChanges }\n\t\t\t\t\t\t\tconfirmButtonText={ __( 'Apply' ) }\n\t\t\t\t\t\t\tonConfirm={ () =>\n\t\t\t\t\t\t\t\trestoreRevision( currentlySelectedRevision )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonCancel={ () =>\n\t\t\t\t\t\t\t\tsetIsLoadingRevisionWithUnsavedChanges( false )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Any unsaved changes will be lost when you apply this revision.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</ConfirmDialog>\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<Spacer marginX={ 4 } data-testid=\"global-styles-no-revisions\">\n\t\t\t\t\t{\n\t\t\t\t\t\t// Adding an existing translation here in case these changes are shipped to WordPress 6.3.\n\t\t\t\t\t\t// Later we could update to something better, e.g., \"There are currently no style revisions.\".\n\t\t\t\t\t\t__( 'No results found.' )\n\t\t\t\t\t}\n\t\t\t\t</Spacer>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default ScreenRevisions;\n"],"mappings":"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"}

package/build/components/global-styles/screen-revisions/revisions-buttons.js

@@ -20,25 +20,28 @@ var _data = require("@wordpress/data");
  * WordPress dependencies
  */
 
+const DAY_IN_MILLISECONDS = 60 * 60 * 1000 * 24;
+
 /**
  * Returns a button label for the revision.
  *
- * @param {Object} revision A revision object.
+ * @param {string|number} id                    A revision object.
+ * @param {boolean}       isLatest              Whether the revision is the most current.
+ * @param {string}        authorDisplayName     Author name.
+ * @param {string}        formattedModifiedDate Revision modified date formatted.
  * @return {string} Translated label.
  */
-function getRevisionLabel(revision) {
-  const authorDisplayName = revision?.author?.name || (0, _i18n.__)('User');
-  if ('parent' === revision?.id) {
+function getRevisionLabel(id, isLatest, authorDisplayName, formattedModifiedDate) {
+  if ('parent' === id) {
     return (0, _i18n.__)('Reset the styles to the theme defaults');
   }
-  if ('unsaved' === revision?.id) {
+  if ('unsaved' === id) {
     return (0, _i18n.sprintf)( /* translators: %s author display name */
     (0, _i18n.__)('Unsaved changes by %s'), authorDisplayName);
   }
-  const formattedDate = (0, _date.dateI18n)((0, _date.getSettings)().formats.datetimeAbbreviated, (0, _date.getDate)(revision?.modified));
-  return revision?.isLatest ? (0, _i18n.sprintf)( /* translators: %1$s author display name, %2$s: revision creation date */
-  (0, _i18n.__)('Changes saved by %1$s on %2$s (current)'), authorDisplayName, formattedDate) : (0, _i18n.sprintf)( /* translators: %1$s author display name, %2$s: revision creation date */
-  (0, _i18n.__)('Changes saved by %1$s on %2$s'), authorDisplayName, formattedDate);
+  return isLatest ? (0, _i18n.sprintf)( /* translators: %1$s author display name, %2$s: revision creation date */
+  (0, _i18n.__)('Changes saved by %1$s on %2$s (current)'), authorDisplayName, formattedModifiedDate) : (0, _i18n.sprintf)( /* translators: %1$s author display name, %2$s: revision creation date */
+  (0, _i18n.__)('Changes saved by %1$s on %2$s'), authorDisplayName, formattedModifiedDate);
 }
 
 /**
@@ -57,7 +60,25 @@ function RevisionsButtons({
   selectedRevisionId,
   onChange
 }) {
-  const currentTheme = (0, _data.useSelect)(select => select(_coreData.store).getCurrentTheme(), []);
+  const {
+    currentThemeName,
+    currentUser
+  } = (0, _data.useSelect)(select => {
+    const {
+      getCurrentTheme,
+      getCurrentUser
+    } = select(_coreData.store);
+    const currentTheme = getCurrentTheme();
+    return {
+      currentThemeName: currentTheme?.name?.rendered || currentTheme?.stylesheet,
+      currentUser: getCurrentUser()
+    };
+  }, []);
+  const dateNowInMs = (0, _date.getDate)().getTime();
+  const {
+    date: dateFormat,
+    datetimeAbbreviated
+  } = (0, _date.getSettings)().formats;
   return (0, _react.createElement)("ol", {
     className: "edit-site-global-styles-screen-revisions__revisions-list",
     "aria-label": (0, _i18n.__)('Global styles revisions'),
@@ -65,14 +86,20 @@ function RevisionsButtons({
   }, userRevisions.map((revision, index) => {
     const {
       id,
+      isLatest,
       author,
       modified
     } = revision;
-    const authorDisplayName = author?.name || (0, _i18n.__)('User');
-    const authorAvatar = author?.avatar_urls?.['48'];
-    const isUnsaved = 'unsaved' === revision?.id;
-    const isSelected = selectedRevisionId ? selectedRevisionId === revision?.id : index === 0;
-    const isReset = 'parent' === revision?.id;
+    const isUnsaved = 'unsaved' === id;
+    // Unsaved changes are created by the current user.
+    const revisionAuthor = isUnsaved ? currentUser : author;
+    const authorDisplayName = revisionAuthor?.name || (0, _i18n.__)('User');
+    const authorAvatar = revisionAuthor?.avatar_urls?.['48'];
+    const isSelected = selectedRevisionId ? selectedRevisionId === id : index === 0;
+    const isReset = 'parent' === id;
+    const modifiedDate = (0, _date.getDate)(modified);
+    const displayDate = modified && dateNowInMs - modifiedDate.getTime() > DAY_IN_MILLISECONDS ? (0, _date.dateI18n)(dateFormat, modifiedDate) : (0, _date.humanTimeDiff)(modified);
+    const revisionLabel = getRevisionLabel(id, isLatest, authorDisplayName, (0, _date.dateI18n)(datetimeAbbreviated, modifiedDate));
     return (0, _react.createElement)("li", {
       className: (0, _classnames.default)('edit-site-global-styles-screen-revisions__revision-item', {
         'is-selected': isSelected,
@@ -85,23 +112,24 @@ function RevisionsButtons({
       onClick: () => {
         onChange(revision);
       },
-      label: getRevisionLabel(revision)
+      label: revisionLabel
     }, isReset ? (0, _react.createElement)("span", {
       className: "edit-site-global-styles-screen-revisions__description"
     }, (0, _i18n.__)('Default styles'), (0, _react.createElement)("span", {
       className: "edit-site-global-styles-screen-revisions__meta"
-    }, currentTheme?.name?.rendered || currentTheme?.stylesheet)) : (0, _react.createElement)("span", {
+    }, currentThemeName)) : (0, _react.createElement)("span", {
       className: "edit-site-global-styles-screen-revisions__description"
-    }, (0, _react.createElement)("time", {
+    }, isUnsaved ? (0, _react.createElement)("span", {
+      className: "edit-site-global-styles-screen-revisions__date"
+    }, (0, _i18n.__)('(Unsaved)')) : (0, _react.createElement)("time", {
+      className: "edit-site-global-styles-screen-revisions__date",
       dateTime: modified
-    }, (0, _date.humanTimeDiff)(modified)), (0, _react.createElement)("span", {
+    }, displayDate), (0, _react.createElement)("span", {
       className: "edit-site-global-styles-screen-revisions__meta"
-    }, isUnsaved ? (0, _i18n.sprintf)( /* translators: %s author display name */
-    (0, _i18n.__)('Unsaved changes by %s'), authorDisplayName) : (0, _i18n.sprintf)( /* translators: %s author display name */
-    (0, _i18n.__)('Changes saved by %s'), authorDisplayName), (0, _react.createElement)("img", {
-      alt: author?.name,
+    }, (0, _react.createElement)("img", {
+      alt: authorDisplayName,
       src: authorAvatar
-    })))));
+    }), authorDisplayName))));
   }));
 }
 var _default = RevisionsButtons;

package/build/components/global-styles/screen-revisions/revisions-buttons.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_i18n","_components","_date","_coreData","_data","getRevisionLabel","revision","authorDisplayName","author","name","__","id","sprintf","formattedDate","dateI18n","getSettings","formats","datetimeAbbreviated","getDate","modified","isLatest","RevisionsButtons","userRevisions","selectedRevisionId","onChange","currentTheme","useSelect","select","coreStore","getCurrentTheme","_react","createElement","className","role","map","index","authorAvatar","avatar_urls","isUnsaved","isSelected","isReset","classnames","key","Button","disabled","onClick","label","rendered","stylesheet","dateTime","humanTimeDiff","alt","src","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-revisions/revisions-buttons.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\nimport { dateI18n, getDate, humanTimeDiff, getSettings } from '@wordpress/date';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Returns a button label for the revision.\n *\n * @param {Object} revision A revision object.\n * @return {string} Translated label.\n */\nfunction getRevisionLabel( revision ) {\n\tconst authorDisplayName = revision?.author?.name || __( 'User' );\n\n\tif ( 'parent' === revision?.id ) {\n\t\treturn __( 'Reset the styles to the theme defaults' );\n\t}\n\n\tif ( 'unsaved' === revision?.id ) {\n\t\treturn sprintf(\n\t\t\t/* translators: %s author display name */\n\t\t\t__( 'Unsaved changes by %s' ),\n\t\t\tauthorDisplayName\n\t\t);\n\t}\n\n\tconst formattedDate = dateI18n(\n\t\tgetSettings().formats.datetimeAbbreviated,\n\t\tgetDate( revision?.modified )\n\t);\n\n\treturn revision?.isLatest\n\t\t? sprintf(\n\t\t\t\t/* translators: %1$s author display name, %2$s: revision creation date */\n\t\t\t\t__( 'Changes saved by %1$s on %2$s (current)' ),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedDate\n\t\t  )\n\t\t: sprintf(\n\t\t\t\t/* translators: %1$s author display name, %2$s: revision creation date */\n\t\t\t\t__( 'Changes saved by %1$s on %2$s' ),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedDate\n\t\t  );\n}\n\n/**\n * Returns a rendered list of revisions buttons.\n *\n * @typedef {Object} props\n * @property {Array<Object>} userRevisions      A collection of user revisions.\n * @property {number}        selectedRevisionId The id of the currently-selected revision.\n * @property {Function}      onChange           Callback fired when a revision is selected.\n *\n * @param    {props}         Component          props.\n * @return {JSX.Element} The modal component.\n */\nfunction RevisionsButtons( { userRevisions, selectedRevisionId, onChange } ) {\n\tconst currentTheme = useSelect(\n\t\t( select ) => select( coreStore ).getCurrentTheme(),\n\t\t[]\n\t);\n\treturn (\n\t\t<ol\n\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revisions-list\"\n\t\t\taria-label={ __( 'Global styles revisions' ) }\n\t\t\trole=\"group\"\n\t\t>\n\t\t\t{ userRevisions.map( ( revision, index ) => {\n\t\t\t\tconst { id, author, modified } = revision;\n\t\t\t\tconst authorDisplayName = author?.name || __( 'User' );\n\t\t\t\tconst authorAvatar = author?.avatar_urls?.[ '48' ];\n\t\t\t\tconst isUnsaved = 'unsaved' === revision?.id;\n\t\t\t\tconst isSelected = selectedRevisionId\n\t\t\t\t\t? selectedRevisionId === revision?.id\n\t\t\t\t\t: index === 0;\n\t\t\t\tconst isReset = 'parent' === revision?.id;\n\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-global-styles-screen-revisions__revision-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t\t\t'is-reset': isReset,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revision-button\"\n\t\t\t\t\t\t\tdisabled={ isSelected }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonChange( revision );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tlabel={ getRevisionLabel( revision ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ isReset ? (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ __( 'Default styles' ) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t{ currentTheme?.name?.rendered ||\n\t\t\t\t\t\t\t\t\t\t\tcurrentTheme?.stylesheet }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t<time dateTime={ modified }>\n\t\t\t\t\t\t\t\t\t\t{ humanTimeDiff( modified ) }\n\t\t\t\t\t\t\t\t\t</time>\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t{ isUnsaved\n\t\t\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t\t/* translators: %s author display name */\n\t\t\t\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Unsaved changes by %s'\n\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\tauthorDisplayName\n\t\t\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t\t/* translators: %s author display name */\n\t\t\t\t\t\t\t\t\t\t\t\t\t__( 'Changes saved by %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\t\tauthorDisplayName\n\t\t\t\t\t\t\t\t\t\t\t  ) }\n\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\talt={ author?.name }\n\t\t\t\t\t\t\t\t\t\t\tsrc={ authorAvatar }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ol>\n\t);\n}\n\nexport default RevisionsButtons;\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_i18n","_components","_date","_coreData","_data","DAY_IN_MILLISECONDS","getRevisionLabel","id","isLatest","authorDisplayName","formattedModifiedDate","__","sprintf","RevisionsButtons","userRevisions","selectedRevisionId","onChange","currentThemeName","currentUser","useSelect","select","getCurrentTheme","getCurrentUser","coreStore","currentTheme","name","rendered","stylesheet","dateNowInMs","getDate","getTime","date","dateFormat","datetimeAbbreviated","getSettings","formats","_react","createElement","className","role","map","revision","index","author","modified","isUnsaved","revisionAuthor","authorAvatar","avatar_urls","isSelected","isReset","modifiedDate","displayDate","dateI18n","humanTimeDiff","revisionLabel","classnames","key","Button","disabled","onClick","label","dateTime","alt","src","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-revisions/revisions-buttons.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\nimport { dateI18n, getDate, humanTimeDiff, getSettings } from '@wordpress/date';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\n\nconst DAY_IN_MILLISECONDS = 60 * 60 * 1000 * 24;\n\n/**\n * Returns a button label for the revision.\n *\n * @param {string|number} id                    A revision object.\n * @param {boolean}       isLatest              Whether the revision is the most current.\n * @param {string}        authorDisplayName     Author name.\n * @param {string}        formattedModifiedDate Revision modified date formatted.\n * @return {string} Translated label.\n */\nfunction getRevisionLabel(\n\tid,\n\tisLatest,\n\tauthorDisplayName,\n\tformattedModifiedDate\n) {\n\tif ( 'parent' === id ) {\n\t\treturn __( 'Reset the styles to the theme defaults' );\n\t}\n\n\tif ( 'unsaved' === id ) {\n\t\treturn sprintf(\n\t\t\t/* translators: %s author display name */\n\t\t\t__( 'Unsaved changes by %s' ),\n\t\t\tauthorDisplayName\n\t\t);\n\t}\n\n\treturn isLatest\n\t\t? sprintf(\n\t\t\t\t/* translators: %1$s author display name, %2$s: revision creation date */\n\t\t\t\t__( 'Changes saved by %1$s on %2$s (current)' ),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedModifiedDate\n\t\t  )\n\t\t: sprintf(\n\t\t\t\t/* translators: %1$s author display name, %2$s: revision creation date */\n\t\t\t\t__( 'Changes saved by %1$s on %2$s' ),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedModifiedDate\n\t\t  );\n}\n\n/**\n * Returns a rendered list of revisions buttons.\n *\n * @typedef {Object} props\n * @property {Array<Object>} userRevisions      A collection of user revisions.\n * @property {number}        selectedRevisionId The id of the currently-selected revision.\n * @property {Function}      onChange           Callback fired when a revision is selected.\n *\n * @param    {props}         Component          props.\n * @return {JSX.Element} The modal component.\n */\nfunction RevisionsButtons( { userRevisions, selectedRevisionId, onChange } ) {\n\tconst { currentThemeName, currentUser } = useSelect( ( select ) => {\n\t\tconst { getCurrentTheme, getCurrentUser } = select( coreStore );\n\t\tconst currentTheme = getCurrentTheme();\n\t\treturn {\n\t\t\tcurrentThemeName:\n\t\t\t\tcurrentTheme?.name?.rendered || currentTheme?.stylesheet,\n\t\t\tcurrentUser: getCurrentUser(),\n\t\t};\n\t}, [] );\n\tconst dateNowInMs = getDate().getTime();\n\tconst { date: dateFormat, datetimeAbbreviated } = getSettings().formats;\n\n\treturn (\n\t\t<ol\n\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revisions-list\"\n\t\t\taria-label={ __( 'Global styles revisions' ) }\n\t\t\trole=\"group\"\n\t\t>\n\t\t\t{ userRevisions.map( ( revision, index ) => {\n\t\t\t\tconst { id, isLatest, author, modified } = revision;\n\t\t\t\tconst isUnsaved = 'unsaved' === id;\n\t\t\t\t// Unsaved changes are created by the current user.\n\t\t\t\tconst revisionAuthor = isUnsaved ? currentUser : author;\n\t\t\t\tconst authorDisplayName = revisionAuthor?.name || __( 'User' );\n\t\t\t\tconst authorAvatar = revisionAuthor?.avatar_urls?.[ '48' ];\n\t\t\t\tconst isSelected = selectedRevisionId\n\t\t\t\t\t? selectedRevisionId === id\n\t\t\t\t\t: index === 0;\n\t\t\t\tconst isReset = 'parent' === id;\n\t\t\t\tconst modifiedDate = getDate( modified );\n\t\t\t\tconst displayDate =\n\t\t\t\t\tmodified &&\n\t\t\t\t\tdateNowInMs - modifiedDate.getTime() > DAY_IN_MILLISECONDS\n\t\t\t\t\t\t? dateI18n( dateFormat, modifiedDate )\n\t\t\t\t\t\t: humanTimeDiff( modified );\n\t\t\t\tconst revisionLabel = getRevisionLabel(\n\t\t\t\t\tid,\n\t\t\t\t\tisLatest,\n\t\t\t\t\tauthorDisplayName,\n\t\t\t\t\tdateI18n( datetimeAbbreviated, modifiedDate )\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-global-styles-screen-revisions__revision-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t\t\t'is-reset': isReset,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revision-button\"\n\t\t\t\t\t\t\tdisabled={ isSelected }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonChange( revision );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tlabel={ revisionLabel }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ isReset ? (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ __( 'Default styles' ) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t{ currentThemeName }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ isUnsaved ? (\n\t\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__date\">\n\t\t\t\t\t\t\t\t\t\t\t{ __( '(Unsaved)' ) }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<time\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__date\"\n\t\t\t\t\t\t\t\t\t\t\tdateTime={ modified }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ displayDate }\n\t\t\t\t\t\t\t\t\t\t</time>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\talt={ authorDisplayName }\n\t\t\t\t\t\t\t\t\t\t\tsrc={ authorAvatar }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{ authorDisplayName }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ol>\n\t);\n}\n\nexport default RevisionsButtons;\n"],"mappings":"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"}

package/build/components/global-styles/screen-revisions/use-global-styles-revisions.js

@@ -42,20 +42,26 @@ function useGlobalStylesRevisions() {
       __experimentalGetDirtyEntityRecords,
       getCurrentUser,
       getUsers,
-      getCurrentThemeGlobalStylesRevisions,
+      getRevisions,
+      __experimentalGetCurrentGlobalStylesId,
       isResolving
     } = select(_coreData.store);
     const dirtyEntityRecords = __experimentalGetDirtyEntityRecords();
     const _currentUser = getCurrentUser();
     const _isDirty = dirtyEntityRecords.length > 0;
-    const globalStylesRevisions = getCurrentThemeGlobalStylesRevisions() || EMPTY_ARRAY;
+    const query = {
+      per_page: 100
+    };
+    const globalStylesId = __experimentalGetCurrentGlobalStylesId();
+    const globalStylesRevisions = getRevisions('root', 'globalStyles', globalStylesId, query) || EMPTY_ARRAY;
     const _authors = getUsers(SITE_EDITOR_AUTHORS_QUERY) || EMPTY_ARRAY;
+    const _isResolving = isResolving('getRevisions', ['root', 'globalStyles', globalStylesId, query]);
     return {
       authors: _authors,
       currentUser: _currentUser,
       isDirty: _isDirty,
       revisions: globalStylesRevisions,
-      isLoadingGlobalStylesRevisions: isResolving('getCurrentThemeGlobalStylesRevisions')
+      isLoadingGlobalStylesRevisions: _isResolving
     };
   }, []);
   return (0, _element.useMemo)(() => {