Add a new local “isBusy” flag for busy-wrapper

This commit is contained in:
Philipp Stracker 2024-12-20 13:38:12 +01:00
parent 1e26852aa1
commit 827e08d91f
No known key found for this signature in database

View file

@ -24,6 +24,7 @@ const BusyContext = createContext( false );
* @param {boolean} props.busySpinner - Allows disabling the spinner in busy-state. * @param {boolean} props.busySpinner - Allows disabling the spinner in busy-state.
* @param {string} props.className - Additional class names for the wrapper. * @param {string} props.className - Additional class names for the wrapper.
* @param {Function} props.onBusy - Callback to process child props when busy. * @param {Function} props.onBusy - Callback to process child props when busy.
* @param {boolean} props.isBusy - Optional. Additional condition to determine if the component is busy.
*/ */
const BusyStateWrapper = ( { const BusyStateWrapper = ( {
children, children,
@ -31,11 +32,12 @@ const BusyStateWrapper = ( {
busySpinner = true, busySpinner = true,
className = '', className = '',
onBusy = () => ( { disabled: true } ), onBusy = () => ( { disabled: true } ),
isBusy = false,
} ) => { } ) => {
const { isBusy } = CommonHooks.useBusyState(); const { isBusy: globalIsBusy } = CommonHooks.useBusyState();
const hasBusyParent = useContext( BusyContext ); const hasBusyParent = useContext( BusyContext );
const isBusyComponent = isBusy && enabled; const isBusyComponent = ( isBusy || globalIsBusy ) && enabled;
const showSpinner = busySpinner && isBusyComponent && ! hasBusyParent; const showSpinner = busySpinner && isBusyComponent && ! hasBusyParent;
const wrapperClassName = classNames( 'ppcp-r-busy-wrapper', className, { const wrapperClassName = classNames( 'ppcp-r-busy-wrapper', className, {