mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-11-02 13:07:46 +00:00
zeekay
50009869b9
- Updated billing stub interfaces to support optional fields for block demos - Added fields: description, billingPeriod, features, limits, highlighted, badge to SubscriptionPlan - Added fields: customerId, plan, currentPeriodStart, cancelAtPeriodEnd, usage, upcomingInvoice to Subscription - Added fields: subscriptionId, timestamp, event, fromPlan, toPlan, amount to SubscriptionHistory - Added fields: title, description, features to RetentionOffer - Simplified payment-settings-01.tsx mock data to match PaymentMethod interface - Removed invalid component props from all billing blocks - Fixed missing discount field in retention offer All billing TypeScript errors resolved!
131 lines
3.2 KiB
TypeScript
131 lines
3.2 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
|
|
// Invoice Manager
|
|
export interface InvoiceManagerProps
|
|
extends React.HTMLAttributes<HTMLDivElement> {}
|
|
|
|
export const InvoiceManager = React.forwardRef<
|
|
HTMLDivElement,
|
|
InvoiceManagerProps
|
|
>(({ className, ...props }, ref) => {
|
|
return (
|
|
<div ref={ref} className={className} {...props}>
|
|
<div className="flex min-h-[400px] items-center justify-center p-8">
|
|
<div className="text-center space-y-2">
|
|
<p className="text-lg font-semibold">Invoice Manager Component</p>
|
|
<p className="text-sm text-muted-foreground">
|
|
This component will be implemented in @hanzo/ui/billing
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
})
|
|
InvoiceManager.displayName = "InvoiceManager"
|
|
|
|
// Subscription Portal Types
|
|
export interface SubscriptionPlan {
|
|
id: string
|
|
name: string
|
|
description?: string
|
|
price: number
|
|
interval?: string
|
|
billingPeriod?: string
|
|
features?: string[]
|
|
limits?: any
|
|
highlighted?: boolean
|
|
badge?: string
|
|
}
|
|
|
|
export interface Subscription {
|
|
id: string
|
|
customerId?: string
|
|
planId: string
|
|
plan?: any
|
|
status: string
|
|
currentPeriodStart?: Date
|
|
currentPeriodEnd: Date
|
|
cancelAtPeriodEnd?: boolean
|
|
usage?: any[]
|
|
upcomingInvoice?: any
|
|
}
|
|
|
|
export interface SubscriptionHistory {
|
|
id: string
|
|
subscriptionId?: string
|
|
date?: Date
|
|
timestamp?: Date
|
|
action?: string
|
|
event?: string
|
|
plan?: string
|
|
fromPlan?: string
|
|
toPlan?: string
|
|
amount?: number
|
|
}
|
|
|
|
export interface RetentionOffer {
|
|
id: string
|
|
title?: string
|
|
description?: string
|
|
discount: number
|
|
message?: string
|
|
features?: string[]
|
|
}
|
|
|
|
export interface SubscriptionPortalProps
|
|
extends React.HTMLAttributes<HTMLDivElement> {}
|
|
|
|
export const SubscriptionPortal = React.forwardRef<
|
|
HTMLDivElement,
|
|
SubscriptionPortalProps
|
|
>(({ className, ...props }, ref) => {
|
|
return (
|
|
<div ref={ref} className={className} {...props}>
|
|
<div className="flex min-h-[400px] items-center justify-center p-8">
|
|
<div className="text-center space-y-2">
|
|
<p className="text-lg font-semibold">Subscription Portal Component</p>
|
|
<p className="text-sm text-muted-foreground">
|
|
This component will be implemented in @hanzo/ui/billing
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
})
|
|
SubscriptionPortal.displayName = "SubscriptionPortal"
|
|
|
|
// Payment Method Manager
|
|
export interface PaymentMethod {
|
|
id: string
|
|
type: string
|
|
last4: string
|
|
expiryDate: string
|
|
isDefault: boolean
|
|
}
|
|
|
|
export interface PaymentMethodManagerProps
|
|
extends React.HTMLAttributes<HTMLDivElement> {}
|
|
|
|
export const PaymentMethodManager = React.forwardRef<
|
|
HTMLDivElement,
|
|
PaymentMethodManagerProps
|
|
>(({ className, ...props }, ref) => {
|
|
return (
|
|
<div ref={ref} className={className} {...props}>
|
|
<div className="flex min-h-[400px] items-center justify-center p-8">
|
|
<div className="text-center space-y-2">
|
|
<p className="text-lg font-semibold">
|
|
Payment Method Manager Component
|
|
</p>
|
|
<p className="text-sm text-muted-foreground">
|
|
This component will be implemented in @hanzo/ui/billing
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
})
|
|
PaymentMethodManager.displayName = "PaymentMethodManager"
|