hamid
55 lines
2.0 KiB
TypeScript
55 lines
2.0 KiB
TypeScript
'use client';
|
|
import { FunctionComponent } from 'react';
|
|
import { useLocale, useTranslations } from 'next-intl';
|
|
import { Skeleton, Stack, Typography } from '@mui/material';
|
|
import { AppLink, EmptyState, ErrorState } from '@/components';
|
|
import RefundStatusCard from '@/components/RefundStatusCard';
|
|
import { bookingRefundStatusPath } from '@/constants';
|
|
import { useMyRefunds } from '@/services/refunds';
|
|
|
|
/**
|
|
* The wallet «استردادها» section — every refund the customer owns (REQ-048), each rendered via the shared
|
|
* `RefundStatusCard` (step timeline + amount + per-channel ETA) with a link back to its booking.
|
|
*/
|
|
const WalletRefunds: FunctionComponent = () => {
|
|
const t = useTranslations('refunds');
|
|
const tw = useTranslations('bnpl');
|
|
const tc = useTranslations('common');
|
|
const locale = useLocale();
|
|
const { data: refunds, isLoading, isError, refetch } = useMyRefunds();
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<Stack sx={{ gap: 1.5 }}>
|
|
<Skeleton variant="rounded" height={160} />
|
|
</Stack>
|
|
);
|
|
}
|
|
if (isError) {
|
|
return <ErrorState message={tw('wallet_error_body')} retryLabel={tc('retry')} onRetry={() => refetch()} />;
|
|
}
|
|
if (!refunds || refunds.length === 0) {
|
|
return <EmptyState icon="refunds" title={t('wallet_empty_title')} body={t('wallet_empty_body')} />;
|
|
}
|
|
|
|
return (
|
|
<Stack sx={{ gap: 3 }}>
|
|
{refunds.map((refund) => (
|
|
<Stack key={refund.id} sx={{ gap: 1 }}>
|
|
<Stack direction="row" sx={{ justifyContent: 'space-between', alignItems: 'center' }}>
|
|
<Typography variant="caption" sx={{ color: 'text.secondary' }}>
|
|
{t('wallet_booking_label', { id: refund.bookingId })}
|
|
</Typography>
|
|
<AppLink to={`/${locale}${bookingRefundStatusPath(refund.bookingId)}`} sx={{ fontSize: '0.75rem' }}>
|
|
{t('view_refund_status')}
|
|
</AppLink>
|
|
</Stack>
|
|
<RefundStatusCard refund={refund} />
|
|
</Stack>
|
|
))}
|
|
</Stack>
|
|
);
|
|
};
|
|
|
|
export default WalletRefunds;
|