/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { useState } from '@wordpress/element';
import {
Card,
CardHeader,
CardBody,
CardFooter,
Flex,
FlexItem,
FlexBlock,
} from '@wordpress/components';
import { Icon, megaphone, cancelCircleFilled } from '@wordpress/icons';
import {
Pagination,
Table,
TablePlaceholder,
Link,
} from '@woocommerce/components';
/**
* Internal dependencies
*/
import { CardHeaderTitle } from '~/marketing/components';
import { useCampaigns } from './useCampaigns';
import './Campaigns.scss';
const tableCaption = __( 'Campaigns', 'woocommerce' );
const tableHeaders = [
{
key: 'campaign',
label: __( 'Campaign', 'woocommerce' ),
},
{
key: 'cost',
label: __( 'Cost', 'woocommerce' ),
isNumeric: true,
},
];
const perPage = 5;
export const Campaigns = () => {
const [ page, setPage ] = useState( 1 );
const { loading, data, meta } = useCampaigns( page, perPage );
const total = meta?.total;
const getContent = () => {
if ( loading ) {
return (