Implement four new dashboard pages with full UI: - /dashboard/profile: view/edit profile, agent details, KYC status - /dashboard/kyc: multi-step KYC document submission flow - /dashboard/subscription: plan comparison, quota usage, billing history - /dashboard/payments: transaction history with filters and pagination Also adds API client modules (profile-api, subscription-api, payment-api) and updates dashboard navigation with new page links. Co-Authored-By: Paperclip <noreply@paperclip.ing>
81 lines
1.9 KiB
TypeScript
81 lines
1.9 KiB
TypeScript
import { apiClient } from './api-client';
|
|
|
|
export interface PlanDto {
|
|
id: string;
|
|
tier: string;
|
|
name: string;
|
|
priceMonthlyVND: string;
|
|
priceYearlyVND: string;
|
|
maxListings: number;
|
|
maxSavedSearches: number;
|
|
features: Record<string, boolean | number | string>;
|
|
isActive: boolean;
|
|
}
|
|
|
|
export interface SubscriptionInfo {
|
|
id: string;
|
|
planTier: string;
|
|
status: string;
|
|
currentPeriodStart: string;
|
|
currentPeriodEnd: string;
|
|
cancelledAt: string | null;
|
|
createdAt: string;
|
|
}
|
|
|
|
export interface BillingHistoryDto {
|
|
subscription: SubscriptionInfo | null;
|
|
payments: Array<{
|
|
id: string;
|
|
provider: string;
|
|
type: string;
|
|
amountVND: string;
|
|
status: string;
|
|
createdAt: string;
|
|
}>;
|
|
total: number;
|
|
}
|
|
|
|
export interface QuotaCheckResult {
|
|
metric: string;
|
|
used: number;
|
|
limit: number;
|
|
remaining: number;
|
|
}
|
|
|
|
export interface CreateSubscriptionResult {
|
|
subscriptionId: string;
|
|
planTier: string;
|
|
status: string;
|
|
currentPeriodStart: string;
|
|
currentPeriodEnd: string;
|
|
}
|
|
|
|
export const subscriptionApi = {
|
|
getPlans: () => apiClient.get<PlanDto[]>('/subscriptions/plans'),
|
|
|
|
getPlanByTier: (tier: string) =>
|
|
apiClient.get<PlanDto>(`/subscriptions/plans/${tier}`),
|
|
|
|
getBillingHistory: (limit = 20, offset = 0) =>
|
|
apiClient.get<BillingHistoryDto>(
|
|
`/subscriptions/billing?limit=${limit}&offset=${offset}`,
|
|
),
|
|
|
|
checkQuota: (metric: string) =>
|
|
apiClient.get<QuotaCheckResult>(`/subscriptions/quota/${metric}`),
|
|
|
|
createSubscription: (planTier: string, billingCycle: 'monthly' | 'yearly') =>
|
|
apiClient.post<CreateSubscriptionResult>('/subscriptions', {
|
|
planTier,
|
|
billingCycle,
|
|
}),
|
|
|
|
upgradeSubscription: (newPlanTier: string) =>
|
|
apiClient.post<{ message: string }>('/subscriptions/upgrade', {
|
|
newPlanTier,
|
|
}),
|
|
|
|
cancelSubscription: (_reason: string) =>
|
|
apiClient.delete<{ message: string }>('/subscriptions'),
|
|
};
|