Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Extract workflow stats to atomation root component level

Browse Source 
[MAILPOET-4540]
This commit is contained in:
Jan Jakes
2022-10-18 15:27:53 +02:00
committed by David Remer
parent 1cc6d93717
commit c08813be1d
5 changed files with 57 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
mailpoet/assets/css/src/components/_automation_statistics.scss → mailpoet/assets/css/src/components-automation/_statistics.scss
View File

8
mailpoet/assets/css/src/mailpoet-automation-editor.scss
View File

@ -2,6 +2,13 @@
@import '../../../node_modules/@wordpress/edit-site/build-style/style';
@import '../../../node_modules/@wordpress/block-editor/build-style/style'; // for inserter styles
@import 'settings/colors';
// automation components
@import './components-automation/statistics';
// automation editor
@import './components-automation-editor/add-step-button';
@import './components-automation-editor/add-trigger';
@import './components-automation-editor/block-icon';
@ -20,4 +27,3 @@
// integrations
@import './components-automation-integrations/mailpoet';
@import './components/automation_statistics';

8
mailpoet/assets/css/src/mailpoet-automation.scss
View File

@ -1,8 +1,14 @@
@import '../../../node_modules/@woocommerce/components/build-style/style';
@import 'settings/colors';
// automation components
@import './components-automation/statistics';
// automation listing
@import './components-automation-listing/listing';
@import './components-automation-listing/header';
@import './components-automation-listing/search';
@import './components-automation-listing/cells/actions';
@import './components-automation-listing/cells/status';
@import './components/automation_statistics';

23
mailpoet/assets/js/src/automation/components/statistics/index.tsx Normal file
View File

@ -0,0 +1,23 @@
type Item = {
key: string;
label: string;
value: number;
};
type Props = {
items: Item[];
};
export function Statistics({ items }: Props): JSX.Element {
const intl = new Intl.NumberFormat();
return (
<ul className="mailpoet-automation-stats">
{items.map((item) => (
<li key={item.key} className="mailpoet-automation-stats-item">
<span className="mailpoet-automation-stats-label">{item.label}</span>
{intl.format(item.value)}
</li>
))}
</ul>
);
}

42
mailpoet/assets/js/src/automation/editor/components/workflow/statistics.tsx
View File

@ -1,6 +1,7 @@
import { useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
import { storeName } from '../../store';
import { Statistics as BaseStatistics } from '../../../components/statistics';
export function Statistics(): JSX.Element {
const { workflow } = useSelect(
@ -11,27 +12,24 @@ export function Statistics(): JSX.Element {
);
return (
<div>
<ul className="mailpoet-automation-stats">
<li className="mailpoet-automation-stats-item">
<span className="mailpoet-automation-stats-label">
{__('Total Entered', 'mailpoet')}
</span>
{new Intl.NumberFormat().format(workflow.stats.totals.entered)}
</li>
<li className="mailpoet-automation-stats-item">
<span className="mailpoet-automation-stats-label">
{__('Total Processing', 'mailpoet')}
</span>
{new Intl.NumberFormat().format(workflow.stats.totals.in_progress)}
</li>
<li className="mailpoet-automation-stats-item">
<span className="mailpoet-automation-stats-label">
{__('Total Exited', 'mailpoet')}
</span>
{new Intl.NumberFormat().format(workflow.stats.totals.exited)}
</li>
</ul>
</div>
<BaseStatistics
items={[
{
key: 'entered',
label: __('Total Entered', 'mailpoet'),
value: workflow.stats.totals.entered,
},
{
key: 'processing',
label: __('Total Processing', 'mailpoet'),
value: workflow.stats.totals.in_progress,
},
{
key: 'exited',
label: __('Total Exited', 'mailpoet'),
value: workflow.stats.totals.exited,
},
]}
/>
);
}