ui phase 0

This commit is contained in:
hamid
2026-07-17 14:00:22 +03:30
parent 9051bb3e18
commit f1cba6cf74
139 changed files with 1242 additions and 667 deletions
@@ -102,7 +102,7 @@ export default function AddressesPage() {
</Typography>
</Box>
{!isEmpty ? (
<AppButton color="primary" variant="contained" startIcon="add" onClick={openAdd} sx={{ m: 0, flexShrink: 0 }}>
<AppButton color="primary" variant="contained" startIcon="add" onClick={openAdd} sx={{ flexShrink: 0 }}>
{t('add')}
</AppButton>
) : null}
@@ -93,11 +93,10 @@ export default function CancelBookingPage() {
variant="contained"
color="primary"
onClick={() => router.push(`/${locale}${bookingRefundStatusPath(bookingId)}`)}
sx={{ m: 0 }}
>
{t('view_refund_status')}
</AppButton>
<AppButton variant="text" color="inherit" onClick={() => router.push(bookingHref)} sx={{ m: 0 }}>
<AppButton variant="text" color="inherit" onClick={() => router.push(bookingHref)}>
{t('back_to_booking')}
</AppButton>
</Stack>
@@ -157,7 +156,7 @@ export default function CancelBookingPage() {
/>
<Stack direction="row" sx={{ gap: 1, justifyContent: 'space-between', flexWrap: 'wrap' }}>
<AppButton variant="text" color="inherit" onClick={() => router.push(bookingHref)} sx={{ m: 0 }}>
<AppButton variant="text" color="inherit" onClick={() => router.push(bookingHref)}>
{t('back_to_booking')}
</AppButton>
<AppButton
@@ -165,7 +164,6 @@ export default function CancelBookingPage() {
color="primary"
disabled={!acknowledged}
onClick={() => setStep(1)}
sx={{ m: 0 }}
>
{t('continue_cta')}
</AppButton>
@@ -192,7 +190,6 @@ export default function CancelBookingPage() {
color="inherit"
onClick={() => setStep(0)}
disabled={cancel.isPending}
sx={{ m: 0 }}
>
{tc('back')}
</AppButton>
@@ -201,7 +198,6 @@ export default function CancelBookingPage() {
color="error"
onClick={submit}
disabled={cancel.isPending}
sx={{ m: 0 }}
>
{cancel.isPending ? t('submitting') : t('confirm_cta')}
</AppButton>
@@ -51,7 +51,7 @@ export default function BookingInvoicePage() {
<Typography variant="body2" sx={{ color: 'text.secondary' }}>
{t('invalid_link_body')}
</Typography>
<AppButton variant="contained" onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}`)} sx={{ m: 0 }}>
<AppButton variant="contained" onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}`)}>
{t('view_booking')}
</AppButton>
</Stack>
@@ -82,11 +82,11 @@ export default function BookingInvoicePage() {
{notIssued ? t('invoice_not_issued_body') : t('error_body')}
</Typography>
{notIssued ? (
<AppButton variant="contained" onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}/${bookingId}`)} sx={{ m: 0 }}>
<AppButton variant="contained" onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}/${bookingId}`)}>
{t('view_booking')}
</AppButton>
) : (
<AppButton variant="contained" onClick={() => refetch()} sx={{ m: 0 }}>
<AppButton variant="contained" onClick={() => refetch()}>
{tc('retry')}
</AppButton>
)}
@@ -185,15 +185,15 @@ export default function BookingInvoicePage() {
<Stack sx={{ gap: 1 }}>
{invoice.pdfUrl ? (
<AppButton color="primary" variant="contained" startIcon="document" href={invoice.pdfUrl} openInNewTab sx={{ m: 0 }}>
<AppButton color="primary" variant="contained" startIcon="document" href={invoice.pdfUrl} openInNewTab>
{t('download_invoice')}
</AppButton>
) : (
<AppButton color="primary" variant="contained" startIcon="document" onClick={handlePrint} sx={{ m: 0 }}>
<AppButton color="primary" variant="contained" startIcon="document" onClick={handlePrint}>
{t('print_invoice')}
</AppButton>
)}
<AppButton variant="text" onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}/${bookingId}`)} sx={{ m: 0 }}>
<AppButton variant="text" onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}/${bookingId}`)}>
{t('view_booking')}
</AppButton>
</Stack>
@@ -207,7 +207,7 @@ function MetaRow({ label, value, ltr }: { label: string; value: string; ltr?: bo
<Typography variant="body2" sx={{ color: 'text.secondary' }}>
{label}
</Typography>
<Typography variant="body2" sx={{ fontWeight: 600 }} dir={ltr ? 'ltr' : undefined}>
<Typography variant="body2" sx={{ fontWeight: 500 }} dir={ltr ? 'ltr' : undefined}>
{value}
</Typography>
</Stack>
@@ -63,7 +63,6 @@ function LeaveReviewCta({ bookingId }: { bookingId: number }) {
color="primary"
startIcon="star"
onClick={() => router.push(`/${locale}${bookingReviewPath(bookingId)}`)}
sx={{ m: 0 }}
>
{alreadyReviewed ? (underReview ? t('cta_under_review') : t('cta_view_review')) : t('cta_leave')}
</AppButton>
@@ -95,7 +94,6 @@ function CustomerBookingActions({ bookingId }: { bookingId: number }) {
color="error"
startIcon="rejected"
onClick={() => router.push(`/${locale}${bookingCancelPath(bookingId)}`)}
sx={{ m: 0 }}
>
{t('cancel_booking_cta')}
</AppButton>
@@ -114,7 +112,7 @@ function CustomerBookingActions({ bookingId }: { bookingId: number }) {
variant="text"
color="primary"
onClick={() => router.push(`/${locale}${bookingRefundStatusPath(bookingId)}`)}
sx={{ m: 0, alignSelf: 'flex-start' }}
sx={{ alignSelf: 'flex-start' }}
>
{t('view_refund_status')}
</AppButton>
@@ -66,7 +66,7 @@ export default function RefundStatusPage() {
variant="text"
color="inherit"
onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}/${bookingId}`)}
sx={{ m: 0, alignSelf: 'flex-start' }}
sx={{ alignSelf: 'flex-start' }}
>
{t('back_to_booking')}
</AppButton>
@@ -95,7 +95,7 @@ export default function LeaveReviewPage() {
) : null}
</Stack>
</Paper>
<AppButton variant="outlined" color="primary" onClick={() => router.back()} sx={{ m: 0, alignSelf: 'flex-start' }}>
<AppButton variant="outlined" color="primary" onClick={() => router.back()} sx={{ alignSelf: 'flex-start' }}>
{tc('back')}
</AppButton>
</Stack>
@@ -124,7 +124,7 @@ export default function LeaveReviewPage() {
{t(`reason_${reason}`)}
</Typography>
</Paper>
<AppButton variant="outlined" color="primary" onClick={() => router.back()} sx={{ m: 0, alignSelf: 'flex-start' }}>
<AppButton variant="outlined" color="primary" onClick={() => router.back()} sx={{ alignSelf: 'flex-start' }}>
{tc('back')}
</AppButton>
</Stack>
@@ -167,7 +167,7 @@ export default function LeaveReviewPage() {
</Stack>
<Stack direction="row" sx={{ gap: 1, justifyContent: 'flex-end' }}>
<AppButton variant="text" color="primary" onClick={() => router.back()} sx={{ m: 0 }} disabled={createReview.isPending}>
<AppButton variant="text" color="primary" onClick={() => router.back()} disabled={createReview.isPending}>
{tc('cancel')}
</AppButton>
<AppButton
@@ -176,7 +176,6 @@ export default function LeaveReviewPage() {
onClick={submit}
disabled={rating < 1 || createReview.isPending}
startIcon="star"
sx={{ m: 0 }}
>
{createReview.isPending ? t('submitting') : t('submit')}
</AppButton>
@@ -86,7 +86,7 @@ const EligibilityStep: FunctionComponent<EligibilityStepProps> = ({
) : null}
</Stack>
</Paper>
<AppButton color="secondary" variant="contained" size="large" onClick={() => onApproved(result)} sx={{ m: 0 }}>
<AppButton color="secondary" variant="contained" size="large" onClick={() => onApproved(result)}>
{t('approve_continue')}
</AppButton>
</Stack>
@@ -162,11 +162,10 @@ const EligibilityStep: FunctionComponent<EligibilityStepProps> = ({
size="large"
disabled={!consent || check.isPending}
onClick={handleSubmit}
sx={{ m: 0 }}
>
{t('check_eligibility')}
</AppButton>
<AppButton variant="text" color="primary" onClick={onPayWithCard} sx={{ m: 0 }}>
<AppButton variant="text" color="primary" onClick={onPayWithCard}>
{t('pay_with_card')}
</AppButton>
</Stack>
@@ -207,11 +206,11 @@ function DeclinedPanel({
</Paper>
<Stack sx={{ gap: 1 }}>
{onRetry && retryLabel ? (
<AppButton variant="outlined" color="secondary" onClick={onRetry} sx={{ m: 0 }}>
<AppButton variant="outlined" color="secondary" onClick={onRetry}>
{retryLabel}
</AppButton>
) : null}
<AppButton color="primary" variant="contained" size="large" onClick={onPayWithCard} sx={{ m: 0 }}>
<AppButton color="primary" variant="contained" size="large" onClick={onPayWithCard}>
{cardLabel}
</AppButton>
</Stack>
@@ -109,7 +109,6 @@ const MethodStep: FunctionComponent<MethodStepProps> = ({
size="large"
disabled={selectedProvider == null}
onClick={onContinue}
sx={{ m: 0 }}
>
{selectedProvider
? t('continue_with', { provider: t(`provider_${selectedProvider}`) })
@@ -44,7 +44,7 @@ const PlanStep: FunctionComponent<PlanStepProps> = ({
{t('no_plans_body')}
</Typography>
</Paper>
<AppButton variant="outlined" color="primary" onClick={onBack} sx={{ m: 0 }}>
<AppButton variant="outlined" color="primary" onClick={onBack}>
{t('back_to_providers')}
</AppButton>
</Stack>
@@ -93,11 +93,10 @@ const PlanStep: FunctionComponent<PlanStepProps> = ({
size="large"
disabled={selectedPlanId == null}
onClick={onContinue}
sx={{ m: 0 }}
>
{t('continue')}
</AppButton>
<AppButton variant="text" color="primary" onClick={onBack} sx={{ m: 0 }}>
<AppButton variant="text" color="primary" onClick={onBack}>
{tc('back')}
</AppButton>
</Stack>
@@ -82,7 +82,7 @@ const ScheduleStep: FunctionComponent<ScheduleStepProps> = ({
<AppAlert severity="error" variant="outlined" sx={{ marginY: 0 }}>
{t('error_body')}
</AppAlert>
<AppButton variant="outlined" color="secondary" onClick={() => refetch()} sx={{ m: 0 }}>
<AppButton variant="outlined" color="secondary" onClick={() => refetch()}>
{tc('retry')}
</AppButton>
</Stack>
@@ -146,11 +146,11 @@ const ScheduleStep: FunctionComponent<ScheduleStepProps> = ({
size="large"
disabled={!accepted}
onClick={handleConfirm}
sx={{ m: 0, py: 1.25 }}
sx={{ py: 1.25 }}
>
{t('pay_down_payment')}
</AppButton>
<AppButton variant="text" color="primary" onClick={onBack} sx={{ m: 0 }}>
<AppButton variant="text" color="primary" onClick={onBack}>
{tc('back')}
</AppButton>
</Stack>
@@ -61,10 +61,10 @@ function BnplGatewayScreen() {
<Typography variant="body2" sx={{ color: 'text.secondary' }}>
{t('handoff_body', { provider: providerName })}
</Typography>
<AppButton color="secondary" variant="contained" size="large" onClick={() => returnWith('success')} sx={{ m: 0 }}>
<AppButton color="secondary" variant="contained" size="large" onClick={() => returnWith('success')}>
{t('handoff_pay_success')}
</AppButton>
<AppButton variant="text" color="error" onClick={() => returnWith('failure')} sx={{ m: 0 }}>
<AppButton variant="text" color="error" onClick={() => returnWith('failure')}>
{t('handoff_pay_fail')}
</AppButton>
</Stack>
@@ -201,7 +201,7 @@ function MessageCard({
{body}
</Typography>
) : null}
<AppButton variant="contained" color="primary" onClick={onCta} sx={{ m: 0 }}>
<AppButton variant="contained" color="primary" onClick={onCta}>
{ctaLabel}
</AppButton>
</Paper>
@@ -98,7 +98,7 @@ function BnplReturnScreen() {
if (!validId) {
return (
<StateCard icon="error" tone="var(--bal-error)" title={t('error_title')}>
<AppButton variant="contained" onClick={() => router.replace(`/${locale}${ROUTES.BOOKINGS}`)} sx={{ m: 0 }}>
<AppButton variant="contained" onClick={() => router.replace(`/${locale}${ROUTES.BOOKINGS}`)}>
{t('pay_with_card')}
</AppButton>
</StateCard>
@@ -113,7 +113,6 @@ function BnplReturnScreen() {
<AppButton
variant="contained"
onClick={() => router.replace(`/${locale}${ROUTES.BOOKING_REQUEST_STATUS}/${requestId}`)}
sx={{ m: 0 }}
>
{tp('back_to_request')}
</AppButton>
@@ -129,14 +128,12 @@ function BnplReturnScreen() {
variant="contained"
size="large"
onClick={() => router.replace(`/${locale}${ROUTES.CHECKOUT_BNPL}?${BNPL_QUERY_REQUEST_ID}=${requestId}`)}
sx={{ m: 0 }}
>
{t('retry_installments')}
</AppButton>
<AppButton
variant="text"
onClick={() => router.replace(`/${locale}${ROUTES.CHECKOUT}?${CHECKOUT_QUERY_REQUEST_ID}=${requestId}`)}
sx={{ m: 0 }}
>
{t('pay_with_card')}
</AppButton>
@@ -148,7 +145,7 @@ function BnplReturnScreen() {
return (
<StateCard icon="installments" tone="var(--bal-secondary)" title={t('settling_title')} body={t('settling_body')}>
<CircularProgress color="secondary" size="2.5rem" />
<AppButton variant="text" disabled={orderQuery.isFetching} onClick={() => orderQuery.refetch()} sx={{ m: 0 }}>
<AppButton variant="text" disabled={orderQuery.isFetching} onClick={() => orderQuery.refetch()}>
{t('check_again')}
</AppButton>
</StateCard>
@@ -76,7 +76,7 @@ function ConfirmationScreen() {
{summary.variantLabel} · {summary.nurseName}
</Typography>
{isBnpl ? (
<Typography variant="caption" sx={{ color: 'var(--bal-secondary)', fontWeight: 600, mt: 0.5 }}>
<Typography variant="caption" sx={{ color: 'var(--bal-secondary)', fontWeight: 500, mt: 0.5 }}>
{tBnpl('paid_via_installments', {
provider: bnplProvider ? tBnpl(`provider_${bnplProvider}`) : tBnpl('installments_heading'),
})}
@@ -94,7 +94,6 @@ function ConfirmationScreen() {
onClick={() =>
router.push(`/${locale}${bookingId != null ? `${ROUTES.BOOKINGS}/${bookingId}` : ROUTES.BOOKINGS}`)
}
sx={{ m: 0 }}
>
{t('view_booking')}
</AppButton>
@@ -104,7 +103,6 @@ function ConfirmationScreen() {
color="primary"
startIcon="document"
onClick={() => router.push(`/${locale}${bookingInvoicePath(bookingId)}`)}
sx={{ m: 0 }}
>
{t('download_invoice')}
</AppButton>
@@ -206,7 +206,7 @@ function CheckoutScreen() {
size="large"
disabled={busy}
onClick={handlePay}
sx={{ m: 0, py: 1.25 }}
sx={{ py: 1.25 }}
>
{initiate.isPending ? t('state_initiating') : initiate.isSuccess ? t('state_redirecting') : t('cta_pay')}
</AppButton>
@@ -217,7 +217,6 @@ function CheckoutScreen() {
color="secondary"
startIcon="installments"
onClick={() => router.push(`/${locale}${ROUTES.CHECKOUT_BNPL}?${CHECKOUT_QUERY_REQUEST_ID}=${requestId}`)}
sx={{ m: 0 }}
>
{t('bnpl_option')}
</AppButton>
@@ -278,7 +277,7 @@ function MessageCard({
{body}
</Typography>
) : null}
<AppButton variant="contained" color="primary" onClick={onCta} sx={{ m: 0 }}>
<AppButton variant="contained" color="primary" onClick={onCta}>
{ctaLabel}
</AppButton>
</Paper>
@@ -88,7 +88,7 @@ function ReturnScreen() {
if (!validId) {
return (
<StateCard icon="error" tone="var(--bal-error)" title={t('error_title')}>
<AppButton variant="contained" onClick={() => router.replace(`/${locale}${ROUTES.BOOKINGS}`)} sx={{ m: 0 }}>
<AppButton variant="contained" onClick={() => router.replace(`/${locale}${ROUTES.BOOKINGS}`)}>
{t('view_booking')}
</AppButton>
</StateCard>
@@ -101,7 +101,6 @@ function ReturnScreen() {
<AppButton
variant="contained"
onClick={() => router.replace(`/${locale}${ROUTES.BOOKING_REQUEST_STATUS}/${requestId}`)}
sx={{ m: 0 }}
>
{t('back_to_request')}
</AppButton>
@@ -120,14 +119,12 @@ function ReturnScreen() {
onClick={() =>
router.replace(`/${locale}${ROUTES.CHECKOUT}?${CHECKOUT_QUERY_REQUEST_ID}=${requestId}`)
}
sx={{ m: 0 }}
>
{t('retry_payment')}
</AppButton>
<AppButton
variant="text"
onClick={() => router.replace(`/${locale}${ROUTES.BOOKING_REQUEST_STATUS}/${requestId}`)}
sx={{ m: 0 }}
>
{t('back_to_request')}
</AppButton>
@@ -141,7 +138,7 @@ function ReturnScreen() {
<CircularProgress color="primary" size="2.5rem" />
<PaymentStatusBadge status="pending" />
{/* Manual re-check — covers the bounded poll giving up on a very slow callback. */}
<AppButton variant="text" disabled={outcomeQuery.isFetching} onClick={() => outcomeQuery.refetch()} sx={{ m: 0 }}>
<AppButton variant="text" disabled={outcomeQuery.isFetching} onClick={() => outcomeQuery.refetch()}>
{t('check_again')}
</AppButton>
</StateCard>
@@ -93,7 +93,6 @@ function BookingRow({ item }: { item: BookingListItemDto }) {
color="primary"
endIcon="bookings"
onClick={() => router.push(`/${locale}${ROUTES.BOOKINGS}/${item.id}`)}
sx={{ m: 0 }}
>
{t('view_booking')}
</AppButton>
@@ -185,7 +185,7 @@ export default function BookingRequestStatusPage() {
size="large"
endIcon="payment"
onClick={() => router.push(`/${locale}${ROUTES.CHECKOUT}?request_id=${request.id}`)}
sx={{ m: 0, py: 1.25 }}
sx={{ py: 1.25 }}
>
{t('continue_payment')}
</AppButton>
@@ -207,7 +207,7 @@ export default function BookingRequestStatusPage() {
color="error"
disabled={cancelRequest.isPending}
onClick={() => setConfirmCancel(true)}
sx={{ m: 0, alignSelf: 'center' }}
sx={{ alignSelf: 'center' }}
>
{cancelRequest.isPending ? t('cancelling') : t('cancel_request')}
</AppButton>
@@ -273,7 +273,7 @@ function TerminalCard({
{body}
</Typography>
) : null}
<AppButton variant="contained" color="primary" onClick={onCta} sx={{ m: 0 }}>
<AppButton variant="contained" color="primary" onClick={onCta}>
{ctaLabel}
</AppButton>
</Paper>
@@ -384,7 +384,7 @@ function BookingRequestForm() {
'& .MuiToggleButton-root': {
flex: 1,
py: 1.25,
fontWeight: 600,
fontWeight: 700,
borderColor: attempted && gender === '' ? 'var(--bal-error)' : undefined,
},
}}
@@ -438,7 +438,7 @@ function BookingRequestForm() {
startIcon="requests"
disabled={!requiredChosen || genderMismatch || createRequest.isPending}
onClick={handleSubmit}
sx={{ m: 0, py: 1.5 }}
sx={{ py: 1.5 }}
>
{createRequest.isPending ? t('submitting') : t('submit')}
</AppButton>
@@ -494,7 +494,7 @@ function FieldEmpty({
<Typography variant="body2" sx={{ color: 'text.secondary' }}>
{message}
</Typography>
<AppButton variant="outlined" color="primary" startIcon="add" onClick={onCta} sx={{ m: 0 }}>
<AppButton variant="outlined" color="primary" startIcon="add" onClick={onCta}>
{ctaLabel}
</AppButton>
</Stack>
@@ -525,7 +525,7 @@ function EmptyState({
<Typography variant="body2" sx={{ color: 'text.secondary', mb: 2 }}>
{body}
</Typography>
<AppButton variant="contained" color="primary" onClick={onCta} sx={{ m: 0 }}>
<AppButton variant="contained" color="primary" onClick={onCta}>
{ctaLabel}
</AppButton>
</Paper>
@@ -67,7 +67,6 @@ export default function OnboardingPage() {
fullWidth
disabled={!relation}
onClick={() => setStep(1)}
sx={{ m: 0 }}
>
{t('continue')}
</AppButton>
@@ -33,7 +33,7 @@ const NudgeCard: FunctionComponent<NudgeCardProps> = ({ icon, title, body, ctaLa
{body}
</Typography>
</Stack>
<AppButton color="primary" variant="outlined" to={to} sx={{ m: 0, alignSelf: 'flex-start' }}>
<AppButton color="primary" variant="outlined" to={to} sx={{ alignSelf: 'flex-start' }}>
{ctaLabel}
</AppButton>
</Stack>
@@ -180,7 +180,7 @@ const CategoryGrid: FunctionComponent<{ onSelect: (categoryId: number) => void }
<Typography variant="body2" sx={{ color: 'text.secondary', mb: 1 }}>
{t('categories_error')}
</Typography>
<AppButton variant="outlined" color="primary" onClick={() => refetch()} sx={{ m: 0 }}>
<AppButton variant="outlined" color="primary" onClick={() => refetch()}>
{tc('retry')}
</AppButton>
</Paper>
@@ -110,7 +110,7 @@ export default function PatientRecordPage() {
sx={{ p: 2, borderRadius: 2, backgroundColor: 'var(--bal-primary-soft)', display: 'flex', gap: 1, alignItems: 'center' }}
>
<AppIcon icon="family" size={22} color="var(--bal-primary)" />
<Typography variant="body2" sx={{ color: 'var(--bal-primary)', fontWeight: 600 }}>
<Typography variant="body2" sx={{ color: 'var(--bal-primary)', fontWeight: 500 }}>
{t('ownership_banner')}
</Typography>
</Paper>
@@ -435,13 +435,13 @@ function HistoryTab({ patientId }: { patientId: number }) {
))}
{totalPages > 1 ? (
<Stack direction="row" sx={{ gap: 1, justifyContent: 'center', alignItems: 'center' }}>
<AppButton variant="text" color="primary" disabled={page <= 1 || history.isFetching} onClick={() => setPage((n) => Math.max(1, n - 1))} sx={{ m: 0 }}>
<AppButton variant="text" color="primary" disabled={page <= 1 || history.isFetching} onClick={() => setPage((n) => Math.max(1, n - 1))}>
{t('prev')}
</AppButton>
<Typography variant="caption" sx={{ color: 'text.secondary' }}>
{t('page_of', { page, total: totalPages })}
</Typography>
<AppButton variant="text" color="primary" disabled={page >= totalPages || history.isFetching} onClick={() => setPage((n) => n + 1)} sx={{ m: 0 }}>
<AppButton variant="text" color="primary" disabled={page >= totalPages || history.isFetching} onClick={() => setPage((n) => n + 1)}>
{t('next')}
</AppButton>
</Stack>
@@ -468,7 +468,7 @@ function SectionShell({
return (
<Stack sx={{ gap: 1.5 }}>
{canEdit ? (
<AppButton variant="text" color="primary" startIcon="edit" onClick={onEdit} sx={{ m: 0, alignSelf: 'flex-end' }}>
<AppButton variant="text" color="primary" startIcon="edit" onClick={onEdit} sx={{ alignSelf: 'flex-end' }}>
{tc('edit')}
</AppButton>
) : null}
@@ -500,14 +500,14 @@ function EditActions({
const tc = useTranslations('common');
return (
<Stack sx={{ gap: 1 }}>
<AppButton variant="outlined" color="primary" startIcon="add" onClick={onAdd} sx={{ m: 0, alignSelf: 'flex-start' }}>
<AppButton variant="outlined" color="primary" startIcon="add" onClick={onAdd} sx={{ alignSelf: 'flex-start' }}>
{t('add_item')}
</AppButton>
<Stack direction="row" sx={{ gap: 1, justifyContent: 'flex-end' }}>
<AppButton variant="text" color="primary" onClick={onCancel} disabled={saving} sx={{ m: 0 }}>
<AppButton variant="text" color="primary" onClick={onCancel} disabled={saving}>
{tc('cancel')}
</AppButton>
<AppButton variant="contained" color="primary" onClick={onSave} disabled={saving || !canSave} sx={{ m: 0 }}>
<AppButton variant="contained" color="primary" onClick={onSave} disabled={saving || !canSave}>
{saving ? tc('saving') : tc('save')}
</AppButton>
</Stack>
@@ -524,7 +524,7 @@ function BackToPatients() {
variant="outlined"
color="primary"
onClick={() => router.push(`/${locale}${ROUTES.PATIENTS}`)}
sx={{ m: 0, alignSelf: 'flex-start' }}
sx={{ alignSelf: 'flex-start' }}
>
{t('back_to_patients')}
</AppButton>
@@ -94,7 +94,7 @@ export default function PatientsPage() {
</Typography>
</Box>
{!isEmpty ? (
<AppButton color="primary" variant="contained" startIcon="add" onClick={openAdd} sx={{ m: 0, flexShrink: 0 }}>
<AppButton color="primary" variant="contained" startIcon="add" onClick={openAdd} sx={{ flexShrink: 0 }}>
{t('add')}
</AppButton>
) : null}
@@ -131,7 +131,7 @@ const CustomerProfileForm: FunctionComponent<{
variant="contained"
onClick={handleSave}
disabled={upsert.isPending}
sx={{ m: 0, alignSelf: 'flex-start' }}
sx={{ alignSelf: 'flex-start' }}
>
{upsert.isPending ? tc('saving') : t('save')}
</AppButton>
@@ -156,7 +156,7 @@ const CustomerProfileForm: FunctionComponent<{
variant="outlined"
startIcon="location"
to={`/${locale}${ROUTES.ADDRESSES}`}
sx={{ m: 0, alignSelf: 'flex-start' }}
sx={{ alignSelf: 'flex-start' }}
>
{ta('manage_cta')}
</AppButton>
@@ -49,7 +49,6 @@ export default function NurseProfilePage() {
variant="outlined"
color="primary"
onClick={() => (notFound ? router.push(`/${locale}${ROUTES.SEARCH}`) : refetch())}
sx={{ m: 0 }}
>
{notFound ? t('profile_not_found_cta') : t('retry')}
</AppButton>
@@ -95,7 +94,7 @@ export default function NurseProfilePage() {
size="large"
onClick={requestBooking}
startIcon="bookings"
sx={{ m: 0, py: 1.5 }}
sx={{ py: 1.5 }}
>
{t('request_booking')}
</AppButton>
@@ -230,7 +229,7 @@ function ReviewsPanel({ nurseId }: { nurseId: number }) {
<Typography variant="body2" sx={{ color: 'text.secondary', mb: 1.5 }}>
{t('load_error')}
</Typography>
<AppButton variant="outlined" color="primary" onClick={() => refetch()} sx={{ m: 0 }}>
<AppButton variant="outlined" color="primary" onClick={() => refetch()}>
{t('retry')}
</AppButton>
</Paper>
@@ -278,7 +277,7 @@ function ReviewsPanel({ nurseId }: { nurseId: number }) {
color="primary"
onClick={() => fetchNextPage()}
disabled={isFetchingNextPage}
sx={{ m: 0, alignSelf: 'center' }}
sx={{ alignSelf: 'center' }}
>
{isFetchingNextPage ? t('loading') : t('load_more')}
</AppButton>
@@ -134,7 +134,7 @@ function SearchFilterScreen() {
disabled={!controller.isReady}
onClick={goToResults}
startIcon="search"
sx={{ m: 0, py: 1.5 }}
sx={{ py: 1.5 }}
>
{ctaLabel}
</AppButton>
@@ -80,7 +80,7 @@ function ResultsScreen() {
<Typography variant="body2" sx={{ color: 'text.secondary', mb: 2 }}>
{t('results_error')}
</Typography>
<AppButton variant="outlined" color="primary" onClick={() => refetch()} sx={{ m: 0 }}>
<AppButton variant="outlined" color="primary" onClick={() => refetch()}>
{t('retry')}
</AppButton>
</Paper>
@@ -97,7 +97,7 @@ function ResultsScreen() {
color="primary"
onClick={() => setPageSize((size) => size + SEARCH_PAGE_SIZE)}
disabled={isFetching}
sx={{ m: 0, alignSelf: 'center' }}
sx={{ alignSelf: 'center' }}
>
{t('load_more')}
</AppButton>
@@ -128,7 +128,7 @@ function EmptyState({ onRelax }: { onRelax: () => void }) {
{t('empty_suggest_city')}
</Typography>
</Stack>
<AppButton variant="contained" color="primary" onClick={onRelax} startIcon="tune" sx={{ m: 0 }}>
<AppButton variant="contained" color="primary" onClick={onRelax} startIcon="tune">
{t('empty_cta')}
</AppButton>
</Paper>
@@ -42,7 +42,7 @@ const WalletInstallments: FunctionComponent = () => {
<Typography variant="body2" sx={{ color: 'text.secondary' }}>
{t('wallet_error_body')}
</Typography>
<AppButton variant="outlined" color="secondary" onClick={() => refetch()} sx={{ m: 0, mt: 1 }}>
<AppButton variant="outlined" color="secondary" onClick={() => refetch()} sx={{ mt: 1 }}>
{tc('retry')}
</AppButton>
</Stack>
@@ -106,7 +106,7 @@ function InstallmentPlanSection({ plan }: { plan: WalletInstallmentPlan }) {
variant="contained"
size="small"
onClick={handleEarlyPay}
sx={{ m: 0, flex: 'none' }}
sx={{ flex: 'none' }}
>
{t('early_pay')}
</AppButton>