/**
 * Shared page header for the order ship page.
 */
import { __ } from '@wordpress/i18n';
import { Flex, Button } from '@wordpress/components';

interface OrderShipHeaderProps {
	title: string;
	orderLabel: string;
	onBack: () => void;
}

export default function OrderShipHeader({ title, orderLabel, onBack }: OrderShipHeaderProps) {
	return (
		<Flex justify="space-between" align="center" wrap={true} style={{ marginBottom: 16 }}>
			<h2 style={{ fontSize: '1.25rem' }}>{title} #{orderLabel}</h2>
			<Button variant="secondary" onClick={onBack}>
				{__('← Back to orders', 'parcel2go-shipping')}
			</Button>
		</Flex>
	);
}