46 lines
946 B
JavaScript
46 lines
946 B
JavaScript
/**
|
|
* External dependencies
|
|
*/
|
|
import {
|
|
__experimentalItemGroup as ItemGroup,
|
|
__experimentalItem as Item,
|
|
Button,
|
|
} from '@wordpress/components';
|
|
import { getNewPath, navigateTo, getQuery } from '@woocommerce/navigation';
|
|
import classnames from 'classnames';
|
|
|
|
export const SectionNav = ( { data, section } ) => {
|
|
const { sections } = data;
|
|
const sectionKeys = Object.keys( sections );
|
|
|
|
if ( sectionKeys.length === 1 ) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<ItemGroup className="woocommerce-settings-section-nav">
|
|
{ sectionKeys.map( ( key ) => (
|
|
<Item
|
|
key={ key }
|
|
className={ classnames( {
|
|
'active-section': section === key,
|
|
} ) }
|
|
>
|
|
<Button
|
|
variant="tertiary"
|
|
onClick={ () => {
|
|
navigateTo( {
|
|
url: getNewPath( { section: key } ),
|
|
} );
|
|
} }
|
|
>
|
|
{ sections[ key ].label }
|
|
</Button>
|
|
</Item>
|
|
) ) }
|
|
</ItemGroup>
|
|
</>
|
|
);
|
|
};
|