woocommerce/plugins/woocommerce-admin/client/layout/footer/footer.tsx

32 lines
668 B
TypeScript

/**
* External dependencies
*/
import { WC_FOOTER_SLOT_NAME, WooFooterItem } from '@woocommerce/admin-layout';
import { useSlot } from '@woocommerce/experimental';
import clsx from 'clsx';
/**
* Internal dependencies
*/
import './footer.scss';
import useIsScrolled from '~/hooks/useIsScrolled';
export const Footer: React.FC = () => {
const slot = useSlot( WC_FOOTER_SLOT_NAME );
const hasFills = Boolean( slot?.fills?.length );
const { atBottom } = useIsScrolled();
if ( ! hasFills ) {
return null;
}
return (
<div
className={ clsx( 'woocommerce-layout__footer', {
'at-bottom': atBottom,
} ) }
>
<WooFooterItem.Slot />
</div>
);
};