63 lines
1.5 KiB
TypeScript
63 lines
1.5 KiB
TypeScript
|
/**
|
||
|
* External dependencies
|
||
|
*/
|
||
|
import { useEffect, useRef, useState } from '@wordpress/element';
|
||
|
import { getTerms } from '@woocommerce/editor-components/utils';
|
||
|
import { getSetting } from '@woocommerce/settings';
|
||
|
import { AttributeSetting } from '@woocommerce/types';
|
||
|
|
||
|
/**
|
||
|
* Internal dependencies
|
||
|
*/
|
||
|
import { AttributeWithTerms } from './types';
|
||
|
|
||
|
export default function useProductAttributes( shouldLoadAttributes: boolean ) {
|
||
|
const STORE_ATTRIBUTES = getSetting< AttributeSetting[] >(
|
||
|
'attributes',
|
||
|
[]
|
||
|
);
|
||
|
const [ isLoadingAttributes, setIsLoadingAttributes ] = useState( false );
|
||
|
const [ productsAttributes, setProductsAttributes ] = useState<
|
||
|
AttributeWithTerms[]
|
||
|
>( [] );
|
||
|
const hasLoadedAttributes = useRef( false );
|
||
|
|
||
|
useEffect( () => {
|
||
|
if (
|
||
|
! shouldLoadAttributes ||
|
||
|
isLoadingAttributes ||
|
||
|
hasLoadedAttributes.current
|
||
|
)
|
||
|
return;
|
||
|
|
||
|
async function fetchTerms() {
|
||
|
setIsLoadingAttributes( true );
|
||
|
|
||
|
for ( const attribute of STORE_ATTRIBUTES ) {
|
||
|
const terms = await getTerms(
|
||
|
Number( attribute.attribute_id )
|
||
|
);
|
||
|
|
||
|
setProductsAttributes( ( oldAttributes ) => [
|
||
|
...oldAttributes,
|
||
|
{
|
||
|
...attribute,
|
||
|
terms,
|
||
|
},
|
||
|
] );
|
||
|
}
|
||
|
|
||
|
hasLoadedAttributes.current = true;
|
||
|
setIsLoadingAttributes( false );
|
||
|
}
|
||
|
|
||
|
fetchTerms();
|
||
|
|
||
|
return () => {
|
||
|
hasLoadedAttributes.current = true;
|
||
|
};
|
||
|
}, [ STORE_ATTRIBUTES, isLoadingAttributes, shouldLoadAttributes ] );
|
||
|
|
||
|
return { isLoadingAttributes, productsAttributes };
|
||
|
}
|