- Add Stripe payment provider with Checkout Session flow - Payment provider abstraction layer (EasyPay + Stripe unified interface) - Stripe webhook with proper raw body handling and signature verification - Frontend: Stripe button with URL validation, anti-duplicate click, noopener - Active timeout cancellation: query platform before expiring, recover paid orders - Singleton Stripe client, idempotency keys, Math.round for amounts - Handle async_payment events, return null for unknown webhook events - Set Checkout Session expires_at aligned with order timeout - Add cancelPayment to provider interface (Stripe: sessions.expire, EasyPay: no-op) - Enable stripe in frontend payment type list
34 lines
1.1 KiB
TypeScript
34 lines
1.1 KiB
TypeScript
import { FILTER_OPTIONS, type OrderStatusFilter } from '@/lib/pay-utils';
|
|
|
|
interface OrderFilterBarProps {
|
|
isDark: boolean;
|
|
activeFilter: OrderStatusFilter;
|
|
onChange: (filter: OrderStatusFilter) => void;
|
|
}
|
|
|
|
export default function OrderFilterBar({ isDark, activeFilter, onChange }: OrderFilterBarProps) {
|
|
return (
|
|
<div className="flex flex-wrap gap-2">
|
|
{FILTER_OPTIONS.map((item) => (
|
|
<button
|
|
key={item.key}
|
|
type="button"
|
|
onClick={() => onChange(item.key)}
|
|
className={[
|
|
'rounded-full border px-3 py-1.5 text-xs font-medium transition-colors',
|
|
activeFilter === item.key
|
|
? isDark
|
|
? 'border-slate-500 bg-slate-700 text-slate-100'
|
|
: 'border-slate-400 bg-slate-900 text-white'
|
|
: isDark
|
|
? 'border-slate-600 text-slate-300 hover:bg-slate-800'
|
|
: 'border-slate-300 text-slate-600 hover:bg-slate-100',
|
|
].join(' ')}
|
|
>
|
|
{item.label}
|
|
</button>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|