57 lines
1.4 KiB
TypeScript
57 lines
1.4 KiB
TypeScript
|
/* eslint-disable @woocommerce/dependency-group */
|
||
|
|
/* eslint-disable @typescript-eslint/ban-ts-comment */
|
||
|
|
/**
|
||
|
|
* External dependencies
|
||
|
|
*/
|
||
|
|
import { useSelect } from '@wordpress/data';
|
||
|
|
// @ts-ignore No types for this exist yet.
|
||
|
|
import { store as coreStore } from '@wordpress/core-data';
|
||
|
|
import { useMemo } from '@wordpress/element';
|
||
|
|
import { BlockInstance, parse } from '@wordpress/blocks';
|
||
|
|
|
||
|
|
type Pattern = {
|
||
|
|
blockTypes: string[];
|
||
|
|
categories: string[];
|
||
|
|
content: string;
|
||
|
|
name: string;
|
||
|
|
source: string;
|
||
|
|
title: string;
|
||
|
|
};
|
||
|
|
|
||
|
|
type PatternWithBlocks = Pattern & {
|
||
|
|
blocks: BlockInstance[];
|
||
|
|
};
|
||
|
|
|
||
|
|
export const usePatternsByCategory = ( category: string ) => {
|
||
|
|
const { blockPatterns, isLoading } = useSelect(
|
||
|
|
( select ) => ( {
|
||
|
|
// @ts-ignore - This is valid.
|
||
|
|
blockPatterns: select( coreStore ).getBlockPatterns(),
|
||
|
|
isLoading:
|
||
|
|
// @ts-ignore - This is valid.
|
||
|
|
! select( coreStore ).hasFinishedResolution(
|
||
|
|
'getBlockPatterns'
|
||
|
|
),
|
||
|
|
} ),
|
||
|
|
[]
|
||
|
|
);
|
||
|
|
|
||
|
|
const patternsByCategory: PatternWithBlocks[] = useMemo( () => {
|
||
|
|
return ( blockPatterns || [] )
|
||
|
|
.filter( ( pattern: Pattern ) =>
|
||
|
|
pattern.categories?.includes( category )
|
||
|
|
)
|
||
|
|
.map( ( pattern: Pattern ) => {
|
||
|
|
return {
|
||
|
|
...pattern,
|
||
|
|
// @ts-ignore - Passing options is valid, but not in the type.
|
||
|
|
blocks: parse( pattern.content, {
|
||
|
|
__unstableSkipMigrationLogs: true,
|
||
|
|
} ),
|
||
|
|
};
|
||
|
|
} );
|
||
|
|
}, [ blockPatterns, category ] );
|
||
|
|
|
||
|
|
return { isLoading, patterns: patternsByCategory };
|
||
|
|
};
|