/** @format */ /** * External dependencies */ import { __, _n, sprintf } from '@wordpress/i18n'; import { Button } from '@wordpress/components'; import { Fragment } from '@wordpress/element'; import PropTypes from 'prop-types'; import { noop } from 'lodash'; /** * Internal dependencies */ import { ActivityCard } from '../activity-card'; import ActivityHeader from '../activity-header'; import ActivityOutboundLink from '../activity-outbound-link'; import { EllipsisMenu, Gravatar, Flag, MenuTitle, MenuItem, OrderStatus, } from '@woocommerce/components'; import { formatCurrency, getCurrencyFormatDecimal } from 'lib/currency'; import { getOrderRefundTotal } from 'lib/order-values'; import { Section } from 'layout/section'; function OrdersPanel( { orders } ) { const { data = [], isLoading } = orders; const menu = ( Test Test ); const gravatarWithFlag = ( order, address ) => { return (
); }; return (
{ isLoading ? (

Loading

) : ( { data.map( ( order, i ) => { // We want the billing address, but shipping can be used as a fallback. const address = { ...order.shipping, ...order.billing }; const name = `${ address.first_name } ${ address.last_name }`; const productsCount = order.line_items.reduce( ( total, line ) => total + line.quantity, 0 ); const total = order.total; const refundValue = getOrderRefundTotal( order ); const remainingTotal = getCurrencyFormatDecimal( order.total ) + refundValue; return ( { sprintf( _n( '%d product', '%d products', productsCount, 'wc-admin' ), productsCount ) } { refundValue ? ( { formatCurrency( total, order.currency ) }{' '} { formatCurrency( remainingTotal, order.currency ) } ) : ( { formatCurrency( total, order.currency ) } ) } } actions={ } > ); } ) } { __( 'Manage all orders' ) } ) }
); } OrdersPanel.propTypes = { orders: PropTypes.object.isRequired, }; OrdersPanel.defaultProps = { orders: { data: [], isLoading: false, }, }; export default OrdersPanel;