58 lines
1.6 KiB
TypeScript
58 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import * as React from 'react';
|
|
import Avatar from '@mui/material/Avatar';
|
|
import Button from '@mui/material/Button';
|
|
import Card from '@mui/material/Card';
|
|
import CardContent from '@mui/material/CardContent';
|
|
import CardHeader from '@mui/material/CardHeader';
|
|
import Grid from '@mui/material/Unstable_Grid2';
|
|
import { House as HouseIcon } from '@phosphor-icons/react/dist/ssr/House';
|
|
import { Plus as PlusIcon } from '@phosphor-icons/react/dist/ssr/Plus';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
import type { Address } from '@/types/Address';
|
|
import { ShippingAddress } from '@/components/dashboard/lp/categories/shipping-address';
|
|
|
|
import { SampleAddresses } from './SampleAddresses';
|
|
|
|
export default function SampleAddressCard(): React.JSX.Element {
|
|
const { t } = useTranslation();
|
|
return (
|
|
<Card>
|
|
<CardHeader
|
|
action={
|
|
<Button
|
|
color="secondary"
|
|
startIcon={<PlusIcon />}
|
|
>
|
|
{t('list.add')}
|
|
</Button>
|
|
}
|
|
avatar={
|
|
<Avatar>
|
|
<HouseIcon fontSize="var(--Icon-fontSize)" />
|
|
</Avatar>
|
|
}
|
|
title={t('list.shipping-addresses')}
|
|
/>
|
|
<CardContent>
|
|
<Grid
|
|
container
|
|
spacing={3}
|
|
>
|
|
{(SampleAddresses satisfies Address[]).map((address) => (
|
|
<Grid
|
|
key={address.id}
|
|
md={6}
|
|
xs={12}
|
|
>
|
|
<ShippingAddress address={address} />
|
|
</Grid>
|
|
))}
|
|
</Grid>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|