Return immediately if no alerts found
This commit is contained in:
parent
416d41279f
commit
f8e97b8152
|
@ -61,6 +61,11 @@ class StoreAlerts extends Component {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { alerts } = this.props;
|
const { alerts } = this.props;
|
||||||
|
|
||||||
|
if ( ! alerts || alerts.length === 0 ) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
const { currentIndex } = this.state;
|
const { currentIndex } = this.state;
|
||||||
const numberOfAlerts = alerts.length;
|
const numberOfAlerts = alerts.length;
|
||||||
const alert = alerts[ currentIndex ] ? alerts[ currentIndex ] : null;
|
const alert = alerts[ currentIndex ] ? alerts[ currentIndex ] : null;
|
||||||
|
@ -78,52 +83,50 @@ class StoreAlerts extends Component {
|
||||||
) );
|
) );
|
||||||
|
|
||||||
return (
|
return (
|
||||||
numberOfAlerts > 0 && (
|
<Card
|
||||||
<Card
|
title={ [
|
||||||
title={ [
|
alert.icon && <Dashicon key="icon" icon={ alert.icon } />,
|
||||||
alert.icon && <Dashicon key="icon" icon={ alert.icon } />,
|
<Fragment key="title">{ alert.title }</Fragment>,
|
||||||
<Fragment key="title">{ alert.title }</Fragment>,
|
] }
|
||||||
] }
|
className={ className }
|
||||||
className={ className }
|
action={
|
||||||
action={
|
numberOfAlerts > 1 && (
|
||||||
numberOfAlerts > 1 && (
|
<div className="woocommerce-store-alerts__pagination">
|
||||||
<div className="woocommerce-store-alerts__pagination">
|
<IconButton
|
||||||
<IconButton
|
icon="arrow-left-alt2"
|
||||||
icon="arrow-left-alt2"
|
onClick={ this.previousAlert }
|
||||||
onClick={ this.previousAlert }
|
disabled={ 0 === currentIndex }
|
||||||
disabled={ 0 === currentIndex }
|
label={ __( 'Previous Alert', 'wc-admin' ) }
|
||||||
label={ __( 'Previous Alert', 'wc-admin' ) }
|
/>
|
||||||
/>
|
<span
|
||||||
<span
|
className="woocommerce-store-alerts__pagination-label"
|
||||||
className="woocommerce-store-alerts__pagination-label"
|
role="status"
|
||||||
role="status"
|
aria-live="polite"
|
||||||
aria-live="polite"
|
>
|
||||||
>
|
{ interpolateComponents( {
|
||||||
{ interpolateComponents( {
|
mixedString: __( '{{current /}} of {{total /}}', 'wc-admin' ),
|
||||||
mixedString: __( '{{current /}} of {{total /}}', 'wc-admin' ),
|
components: {
|
||||||
components: {
|
current: <Fragment>{ currentIndex + 1 }</Fragment>,
|
||||||
current: <Fragment>{ currentIndex + 1 }</Fragment>,
|
total: <Fragment>{ numberOfAlerts }</Fragment>,
|
||||||
total: <Fragment>{ numberOfAlerts }</Fragment>,
|
},
|
||||||
},
|
} ) }
|
||||||
} ) }
|
</span>
|
||||||
</span>
|
<IconButton
|
||||||
<IconButton
|
icon="arrow-right-alt2"
|
||||||
icon="arrow-right-alt2"
|
onClick={ this.nextAlert }
|
||||||
onClick={ this.nextAlert }
|
disabled={ numberOfAlerts - 1 === currentIndex }
|
||||||
disabled={ numberOfAlerts - 1 === currentIndex }
|
label={ __( 'Next Alert', 'wc-admin' ) }
|
||||||
label={ __( 'Next Alert', 'wc-admin' ) }
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
)
|
||||||
)
|
}
|
||||||
}
|
>
|
||||||
>
|
<div
|
||||||
<div
|
className="woocommerce-store-alerts__message"
|
||||||
className="woocommerce-store-alerts__message"
|
dangerouslySetInnerHTML={ sanitizeHTML( alert.content ) }
|
||||||
dangerouslySetInnerHTML={ sanitizeHTML( alert.content ) }
|
/>
|
||||||
/>
|
{ actions && <div className="woocommerce-store-alerts__actions">{ actions }</div> }
|
||||||
{ actions && <div className="woocommerce-store-alerts__actions">{ actions }</div> }
|
</Card>
|
||||||
</Card>
|
|
||||||
)
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue