Design Picker: Change the default selections if no selected goals

Automattic · Dec 11, 2024 · 203b3ac · 203b3ac
1 parent d51b299
commit 203b3ac
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/...nt/landing/stepper/declarative-flow/internals/steps-repository/design-setup/categories.ts b/...nt/landing/stepper/declarative-flow/internals/steps-repository/design-setup/categories.ts
@@ -60,17 +60,21 @@ export function getCategorizationOptions(
 	goals: Onboard.SiteGoal[],
 	{ isMultiSelection = false }: CategorizationOptions = {}
 ) {
-	const defaultSelections = Array.from(
+	let defaultSelections = Array.from(
 		new Set(
 			goals
 				.map( ( goal ) => {
 					const preferredCategories = getGoalsPreferredCategories( goal );
 					return isMultiSelection ? preferredCategories : preferredCategories.slice( 0, 1 );
 				} )
-				.flat() ?? [ CATEGORIES.BUSINESS ]
+				.flat()
 		)
 	);
 
+	if ( defaultSelections.length === 0 ) {
+		defaultSelections = [ CATEGORIES.BLOG ];
+	}
+
 	return {
 		defaultSelections,
 		sort: makeSortCategoryToTop( defaultSelections ),

diff --git a/packages/design-picker/src/hooks/use-categorization.ts b/packages/design-picker/src/hooks/use-categorization.ts
@@ -85,9 +85,12 @@ export function useCategorization(
  * @returns the default category or null if none is available
  */
 function chooseDefaultSelections( categories: Category[], defaultSelections: string[] ): string[] {
-	const defaultSelectionsSet = new Set( defaultSelections );
-	if ( defaultSelections && categories.find( ( { slug } ) => defaultSelectionsSet.has( slug ) ) ) {
-		return defaultSelections;
+	const categorySlugsSet = new Set( categories.map( ( { slug } ) => slug ) );
+	const availableDefaultSelections = defaultSelections.filter( ( selection ) =>
+		categorySlugsSet.has( selection )
+	);
+	if ( availableDefaultSelections.length > 0 ) {
+		return availableDefaultSelections;
 	}
 
 	return categories[ 0 ]?.slug ? [ categories[ 0 ]?.slug ] : [];