61 lines
2.1 KiB
TypeScript
61 lines
2.1 KiB
TypeScript
import {VStack} from '@astryxdesign/core/Layout';
|
|
import {Badge} from '@astryxdesign/core/Badge';
|
|
import {Text} from '@astryxdesign/core/Text';
|
|
import {Divider} from '@astryxdesign/core/Divider';
|
|
import {PageHeader} from '@/components/primitives/PageHeader';
|
|
import {StaticPanel} from '@/components/patterns/PanelCard';
|
|
import {StatPair, StatRow} from '@/components/patterns/StatPair';
|
|
import {EmptyPanel} from '@/components/patterns/EmptyPanel';
|
|
import {readProfile} from '@/lib/mock/settings';
|
|
import {formatInr} from '@/lib/format';
|
|
|
|
/**
|
|
* Billing is read-only for now.
|
|
*
|
|
* The plan and settlement figures are real shapes, but there is no payment
|
|
* provider wired up — so rather than render fake "Change plan" flows that do
|
|
* nothing, the actions are absent and the invoice list says plainly that it
|
|
* is not connected yet. A disabled button that never becomes enabled is worse
|
|
* than no button.
|
|
*/
|
|
export default function SettingsBillingPage() {
|
|
const profile = readProfile();
|
|
|
|
return (
|
|
<VStack gap={5}>
|
|
<PageHeader
|
|
title="Billing"
|
|
description="Plan, LYT settlement and invoices."
|
|
/>
|
|
|
|
<StaticPanel
|
|
title="Plan"
|
|
subtitle={profile.businessName}
|
|
actions={<Badge variant="success" label="Active" />}
|
|
>
|
|
<VStack gap={4}>
|
|
<StatRow>
|
|
<StatPair label="Plan" value="Growth — 5 stores" />
|
|
<StatPair label="Billed" value="Monthly" />
|
|
<StatPair label="Next charge" value="1 Sep 2026" />
|
|
<StatPair label="Amount" value={formatInr(14999)} align="end" />
|
|
</StatRow>
|
|
<Divider />
|
|
<Text size="sm" color="secondary">
|
|
LYTs are settled monthly against redemptions, at 1 LYT = ₹1. Your
|
|
outstanding liability is shown on the Lyts page.
|
|
</Text>
|
|
</VStack>
|
|
</StaticPanel>
|
|
|
|
<StaticPanel title="Invoices" subtitle="Past statements">
|
|
<EmptyPanel
|
|
icon="revenue"
|
|
title="No billing provider connected"
|
|
description="Invoices appear here once payments are wired up."
|
|
/>
|
|
</StaticPanel>
|
|
</VStack>
|
|
);
|
|
}
|