559 lines
15 KiB
XML
559 lines
15 KiB
XML
This file is a merged representation of the entire codebase, combined into a single document by Repomix.
|
|
|
|
<file_summary>
|
|
This section contains a summary of this file.
|
|
|
|
<purpose>
|
|
This file contains a packed representation of the entire repository's contents.
|
|
It is designed to be easily consumable by AI systems for analysis, code review,
|
|
or other automated processes.
|
|
</purpose>
|
|
|
|
<file_format>
|
|
The content is organized as follows:
|
|
1. This summary section
|
|
2. Repository information
|
|
3. Directory structure
|
|
4. Repository files, each consisting of:
|
|
- File path as an attribute
|
|
- Full contents of the file
|
|
</file_format>
|
|
|
|
<usage_guidelines>
|
|
- This file should be treated as read-only. Any changes should be made to the
|
|
original repository files, not this packed version.
|
|
- When processing this file, use the file path to distinguish
|
|
between different files in the repository.
|
|
- Be aware that this file may contain sensitive information. Handle it with
|
|
the same level of security as you would the original repository.
|
|
</usage_guidelines>
|
|
|
|
<notes>
|
|
- Some files may have been excluded based on .gitignore rules and Repomix's configuration
|
|
- Binary files are not included in this packed representation. Please refer to the Repository Structure section for a complete list of file paths, including binary files
|
|
- Files matching patterns in .gitignore are excluded
|
|
- Files matching default ignore patterns are excluded
|
|
- Files are sorted by Git change count (files with more changes are at the bottom)
|
|
</notes>
|
|
|
|
<additional_info>
|
|
|
|
</additional_info>
|
|
|
|
</file_summary>
|
|
|
|
<directory_structure>
|
|
AddressCard/
|
|
index.tsx
|
|
SampleAddresses.tsx
|
|
BasicDetailCard/
|
|
index.tsx
|
|
Notifications/
|
|
index.tsx
|
|
type.d.ts
|
|
PaymentCard/
|
|
index.tsx
|
|
SamplePayments.tsx
|
|
SecurityCard/
|
|
index.tsx
|
|
TitleCard/
|
|
index.tsx
|
|
Helloworld.tsx
|
|
</directory_structure>
|
|
|
|
<files>
|
|
This section contains the contents of the repository's files.
|
|
|
|
<file path="AddressCard/index.tsx">
|
|
'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>
|
|
);
|
|
}
|
|
</file>
|
|
|
|
<file path="AddressCard/SampleAddresses.tsx">
|
|
'use client';
|
|
|
|
import type { Address } from '@/types/Address';
|
|
|
|
export const SampleAddresses: Address[] = [
|
|
{
|
|
id: 'ADR-001',
|
|
country: 'United States',
|
|
state: 'Michigan',
|
|
city: 'Lansing',
|
|
zipCode: '48933',
|
|
street: '480 Haven Lane',
|
|
primary: true,
|
|
},
|
|
{
|
|
id: 'ADR-002',
|
|
country: 'United States',
|
|
state: 'Missouri',
|
|
city: 'Springfield',
|
|
zipCode: '65804',
|
|
street: '4807 Lighthouse Drive',
|
|
},
|
|
];
|
|
</file>
|
|
|
|
<file path="BasicDetailCard/index.tsx">
|
|
'use client';
|
|
|
|
import * as React from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
import Avatar from '@mui/material/Avatar';
|
|
import Card from '@mui/material/Card';
|
|
import CardHeader from '@mui/material/CardHeader';
|
|
import Chip from '@mui/material/Chip';
|
|
import Divider from '@mui/material/Divider';
|
|
import IconButton from '@mui/material/IconButton';
|
|
import LinearProgress from '@mui/material/LinearProgress';
|
|
import Stack from '@mui/material/Stack';
|
|
import Typography from '@mui/material/Typography';
|
|
import { PencilSimple as PencilSimpleIcon } from '@phosphor-icons/react/dist/ssr/PencilSimple';
|
|
import { User as UserIcon } from '@phosphor-icons/react/dist/ssr/User';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
import { PropertyItem } from '@/components/core/property-item';
|
|
import { PropertyList } from '@/components/core/property-list';
|
|
|
|
export default function BasicDetailCard({
|
|
lpCatId,
|
|
handleEditClick,
|
|
}: {
|
|
lpCatId: string;
|
|
handleEditClick: () => void;
|
|
}): React.JSX.Element {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<Card>
|
|
<CardHeader
|
|
action={
|
|
<IconButton
|
|
onClick={() => {
|
|
handleEditClick();
|
|
}}
|
|
>
|
|
<PencilSimpleIcon />
|
|
</IconButton>
|
|
}
|
|
avatar={
|
|
<Avatar>
|
|
<UserIcon fontSize="var(--Icon-fontSize)" />
|
|
</Avatar>
|
|
}
|
|
title={t('list.basic-details')}
|
|
/>
|
|
<PropertyList
|
|
divider={<Divider />}
|
|
orientation="vertical"
|
|
sx={{ '--PropertyItem-padding': '12px 24px' }}
|
|
>
|
|
{(
|
|
[
|
|
{
|
|
key: 'Customer ID',
|
|
value: (
|
|
<Chip
|
|
label="USR-001"
|
|
size="small"
|
|
variant="soft"
|
|
/>
|
|
),
|
|
},
|
|
{ key: 'Name', value: 'Miron Vitold' },
|
|
{ key: 'Email', value: 'miron.vitold@domain.com' },
|
|
{ key: 'Phone', value: '(425) 434-5535' },
|
|
{ key: 'Company', value: 'Devias IO' },
|
|
{
|
|
key: 'Quota',
|
|
value: (
|
|
<Stack
|
|
direction="row"
|
|
spacing={2}
|
|
sx={{ alignItems: 'center' }}
|
|
>
|
|
<LinearProgress
|
|
sx={{ flex: '1 1 auto' }}
|
|
value={50}
|
|
variant="determinate"
|
|
/>
|
|
<Typography
|
|
color="text.secondary"
|
|
variant="body2"
|
|
>
|
|
50%
|
|
</Typography>
|
|
</Stack>
|
|
),
|
|
},
|
|
] satisfies { key: string; value: React.ReactNode }[]
|
|
).map(
|
|
(item): React.JSX.Element => (
|
|
<PropertyItem
|
|
key={item.key}
|
|
name={item.key}
|
|
value={item.value}
|
|
/>
|
|
)
|
|
)}
|
|
</PropertyList>
|
|
</Card>
|
|
);
|
|
}
|
|
</file>
|
|
|
|
<file path="Notifications/index.tsx">
|
|
'use client';
|
|
|
|
import { dayjs } from '@/lib/dayjs';
|
|
|
|
import type { Notification } from './type';
|
|
|
|
export const SampleNotifications: Notification[] = [
|
|
{
|
|
id: 'EV-002',
|
|
type: 'Refund request approved',
|
|
status: 'pending',
|
|
createdAt: dayjs().subtract(34, 'minute').subtract(5, 'hour').subtract(3, 'day').toDate(),
|
|
},
|
|
{
|
|
id: 'EV-001',
|
|
type: 'Order confirmation',
|
|
status: 'delivered',
|
|
createdAt: dayjs().subtract(49, 'minute').subtract(11, 'hour').subtract(4, 'day').toDate(),
|
|
},
|
|
];
|
|
</file>
|
|
|
|
<file path="Notifications/type.d.ts">
|
|
export interface Notification {
|
|
id: string;
|
|
type: string;
|
|
status: 'delivered' | 'pending' | 'failed';
|
|
createdAt: Date;
|
|
}
|
|
</file>
|
|
|
|
<file path="PaymentCard/index.tsx">
|
|
'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 Divider from '@mui/material/Divider';
|
|
import { CreditCard as CreditCardIcon } from '@phosphor-icons/react/dist/ssr/CreditCard';
|
|
import { PencilSimple as PencilSimpleIcon } from '@phosphor-icons/react/dist/ssr/PencilSimple';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
import { PropertyItem } from '@/components/core/property-item';
|
|
import { PropertyList } from '@/components/core/property-list';
|
|
import { Payments } from '@/components/dashboard/lp/categories/payments';
|
|
|
|
import { SamplePayments } from './SamplePayments';
|
|
|
|
export default function SamplePaymentCard(): React.JSX.Element {
|
|
const { t } = useTranslation();
|
|
return (
|
|
<>
|
|
<Payments
|
|
ordersValue={2069.48}
|
|
payments={SamplePayments}
|
|
refundsValue={324.5}
|
|
totalOrders={5}
|
|
/>
|
|
<Card>
|
|
<CardHeader
|
|
action={
|
|
<Button
|
|
color="secondary"
|
|
startIcon={<PencilSimpleIcon />}
|
|
>
|
|
{t('list.edit')}
|
|
</Button>
|
|
}
|
|
avatar={
|
|
<Avatar>
|
|
<CreditCardIcon fontSize="var(--Icon-fontSize)" />
|
|
</Avatar>
|
|
}
|
|
title={t('list.billing-details')}
|
|
/>
|
|
<CardContent>
|
|
<Card
|
|
sx={{ borderRadius: 1 }}
|
|
variant="outlined"
|
|
>
|
|
<PropertyList
|
|
divider={<Divider />}
|
|
sx={{ '--PropertyItem-padding': '16px' }}
|
|
>
|
|
{(
|
|
[
|
|
{ key: t('Credit card'), value: '**** 4142' },
|
|
{ key: t('Country'), value: t('United States') },
|
|
{ key: t('State'), value: t('Michigan') },
|
|
{ key: t('City'), value: t('Southfield') },
|
|
{ key: t('Address'), value: t('Address') },
|
|
{ key: t('Tax ID'), value: t('Tax ID') },
|
|
] satisfies { key: string; value: React.ReactNode }[]
|
|
).map(
|
|
(item): React.JSX.Element => (
|
|
<PropertyItem
|
|
key={item.key}
|
|
name={item.key}
|
|
value={item.value}
|
|
/>
|
|
)
|
|
)}
|
|
</PropertyList>
|
|
</Card>
|
|
</CardContent>
|
|
</Card>
|
|
</>
|
|
);
|
|
}
|
|
</file>
|
|
|
|
<file path="PaymentCard/SamplePayments.tsx">
|
|
'use client';
|
|
|
|
// import { dayjs } from 'dayjs';
|
|
import type { Payment } from '@/types/Payment';
|
|
import { dayjs } from '@/lib/dayjs';
|
|
|
|
export const SamplePayments: Payment[] = [
|
|
{
|
|
currency: 'USD',
|
|
amount: 500,
|
|
invoiceId: 'INV-005',
|
|
status: 'completed',
|
|
createdAt: dayjs().subtract(5, 'minute').subtract(1, 'hour').toDate(),
|
|
},
|
|
{
|
|
currency: 'USD',
|
|
amount: 324.5,
|
|
invoiceId: 'INV-004',
|
|
status: 'refunded',
|
|
createdAt: dayjs().subtract(21, 'minute').subtract(2, 'hour').toDate(),
|
|
},
|
|
{
|
|
currency: 'USD',
|
|
amount: 746.5,
|
|
invoiceId: 'INV-003',
|
|
status: 'completed',
|
|
createdAt: dayjs().subtract(7, 'minute').subtract(3, 'hour').toDate(),
|
|
},
|
|
{
|
|
currency: 'USD',
|
|
amount: 56.89,
|
|
invoiceId: 'INV-002',
|
|
status: 'completed',
|
|
createdAt: dayjs().subtract(48, 'minute').subtract(4, 'hour').toDate(),
|
|
},
|
|
{
|
|
currency: 'USD',
|
|
amount: 541.59,
|
|
invoiceId: 'INV-001',
|
|
status: 'completed',
|
|
createdAt: dayjs().subtract(31, 'minute').subtract(5, 'hour').toDate(),
|
|
},
|
|
];
|
|
</file>
|
|
|
|
<file path="SecurityCard/index.tsx">
|
|
'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 Stack from '@mui/material/Stack';
|
|
import Typography from '@mui/material/Typography';
|
|
import { ShieldWarning as ShieldWarningIcon } from '@phosphor-icons/react/dist/ssr/ShieldWarning';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
export default function SampleSecurityCard(): React.JSX.Element {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<Card>
|
|
<CardHeader
|
|
avatar={
|
|
<Avatar>
|
|
<ShieldWarningIcon fontSize="var(--Icon-fontSize)" />
|
|
</Avatar>
|
|
}
|
|
title={t('list.security')}
|
|
/>
|
|
<CardContent>
|
|
<Stack spacing={1}>
|
|
<div>
|
|
<Button
|
|
color="error"
|
|
variant="contained"
|
|
>
|
|
{t('Delete account')}
|
|
</Button>
|
|
</div>
|
|
<Typography
|
|
color="text.secondary"
|
|
variant="body2"
|
|
>
|
|
{t('a-deleted-customer-cannot-be-restored-all-data-will-be-permanently-removed')}
|
|
</Typography>
|
|
</Stack>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|
|
</file>
|
|
|
|
<file path="TitleCard/index.tsx">
|
|
'use client';
|
|
|
|
import * as React from 'react';
|
|
import { Button } from '@mui/material';
|
|
import Avatar from '@mui/material/Avatar';
|
|
import Chip from '@mui/material/Chip';
|
|
import Stack from '@mui/material/Stack';
|
|
import Typography from '@mui/material/Typography';
|
|
import { CaretDown as CaretDownIcon } from '@phosphor-icons/react/dist/ssr/CaretDown';
|
|
import { CheckCircle as CheckCircleIcon } from '@phosphor-icons/react/dist/ssr/CheckCircle';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
export default function SampleTitleCard(): React.JSX.Element {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<>
|
|
<Stack
|
|
direction="row"
|
|
spacing={2}
|
|
sx={{ alignItems: 'center', flex: '1 1 auto' }}
|
|
>
|
|
<Avatar
|
|
src="/assets/avatar-1.png"
|
|
sx={{ '--Avatar-size': '64px' }}
|
|
>
|
|
empty
|
|
</Avatar>
|
|
<div>
|
|
<Stack
|
|
direction="row"
|
|
spacing={2}
|
|
sx={{ alignItems: 'center', flexWrap: 'wrap' }}
|
|
>
|
|
<Typography variant="h4">{t('list.customer-name')}</Typography>
|
|
<Chip
|
|
icon={
|
|
<CheckCircleIcon
|
|
color="var(--mui-palette-success-main)"
|
|
weight="fill"
|
|
/>
|
|
}
|
|
label={t('list.active')}
|
|
size="small"
|
|
variant="outlined"
|
|
/>
|
|
</Stack>
|
|
<Typography
|
|
color="text.secondary"
|
|
variant="body1"
|
|
>
|
|
{t('list.customer-email')}
|
|
</Typography>
|
|
</div>
|
|
</Stack>
|
|
<div>
|
|
<Button
|
|
endIcon={<CaretDownIcon />}
|
|
variant="contained"
|
|
>
|
|
{t('list.action')}
|
|
</Button>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
</file>
|
|
|
|
<file path="Helloworld.tsx">
|
|
'use client';
|
|
|
|
import * as React from 'react';
|
|
import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
|
|
|
|
function Page(): React.JSX.Element {
|
|
React.useLayoutEffect(() => {
|
|
console.log('helloworld');
|
|
}, []);
|
|
|
|
return <>helloworld</>;
|
|
}
|
|
|
|
export default Page;
|
|
</file>
|
|
|
|
</files>
|