Update: Global Styes: Make the color palette counter count all color …

…origins.
WordPress · Nov 28, 2021 · 80e679b · 80e679b
1 parent ea61004
commit 80e679b
Showing 1 changed file with 22 additions and 4 deletions.
diff --git a/packages/edit-site/src/components/global-styles/palette.js b/packages/edit-site/src/components/global-styles/palette.js
@@ -11,6 +11,7 @@ import {
 	ColorIndicator,
 } from '@wordpress/components';
 import { __, _n, sprintf } from '@wordpress/i18n';
+import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -22,12 +23,29 @@ import { useSetting } from './hooks';
 const EMPTY_COLORS = [];
 
 function Palette( { name } ) {
-	const [ colorsSetting ] = useSetting( 'color.palette.custom', name );
-	const colors = colorsSetting || EMPTY_COLORS;
+	const [ customColors ] = useSetting( 'color.palette.custom' );
+	const [ themeColors ] = useSetting( 'color.palette.theme' );
+	const [ defaultColors ] = useSetting( 'color.palette.default' );
+
+	const [ defaultPaletteEnabled ] = useSetting(
+		'color.defaultPalette',
+		name
+	);
+	const colors = useMemo(
+		() => [
+			...( customColors || EMPTY_COLORS ),
+			...( themeColors || EMPTY_COLORS ),
+			...( defaultColors && defaultPaletteEnabled
+				? defaultColors
+				: EMPTY_COLORS ),
+		],
+		[ customColors, themeColors, defaultColors, defaultPaletteEnabled ]
+	);
+
 	const screenPath = ! name
 		? '/colors/palette'
 		: '/blocks/' + name + '/colors/palette';
-	const palleteButtonText =
+	const paletteButtonText =
 		colors.length > 0
 			? sprintf(
 					// Translators: %d: Number of palette colors.
@@ -52,7 +70,7 @@ function Palette( { name } ) {
 								) ) }
 							</ZStack>
 						</FlexBlock>
-						<FlexItem>{ palleteButtonText }</FlexItem>
+						<FlexItem>{ paletteButtonText }</FlexItem>
 					</HStack>
 				</NavigationButton>
 			</ItemGroup>