import {
  AccountBalance,
  AccountBalanceWallet,
  CompareArrows,
  CreditCard,
  QrCode2,
  RequestQuote,
  Savings,
  Send,
} from '@cdx-ui/icons';

export const accounts = [
  {
    id: 'checking',
    icon: AccountBalance,
    title: 'Family Checking',
    last: '···· 4642',
    amount: '$2,814.66',
  },
  { id: 'savings', icon: Savings, title: 'Family Savings', last: '···· 5541', amount: '$3,400.22' },
  { id: 'visa', icon: CreditCard, title: 'Visa Everyday', last: '···· 6677', amount: '$882.40' },
] as const;

export const quickActions = [
  { id: 'pay', icon: Send, label: 'Pay' },
  { id: 'deposit', icon: AccountBalanceWallet, label: 'Deposit' },
  { id: 'transfer', icon: CompareArrows, label: 'Transfer' },
  { id: 'request', icon: RequestQuote, label: 'Request' },
  { id: 'qr', icon: QrCode2, label: 'QR pay' },
] as const;

export interface Transaction {
  id: string;
  merchant: string;
  meta: string;
  amount: string;
  initials: string;
  incoming?: boolean;
}

export const transactions: Transaction[] = [
  { id: 't1', merchant: 'Whole Foods Market', meta: 'Pending', amount: '-$87.43', initials: 'WF' },
  {
    id: 't2',
    merchant: 'Payroll Deposit — ACME',
    meta: 'May 15',
    amount: '+$1,234.56',
    initials: 'AC',
    incoming: true,
  },
  { id: 't3', merchant: 'Transfer to Savings', meta: 'May 15', amount: '-$200.00', initials: 'TS' },
  { id: 't4', merchant: 'Zelle to John Smith', meta: 'May 9', amount: '-$45.00', initials: 'JS' },
  {
    id: 't5',
    merchant: 'City Electric Utility',
    meta: 'May 2',
    amount: '-$142.80',
    initials: 'CE',
  },
  { id: 't6', merchant: 'Blue Bottle Coffee', meta: 'May 1', amount: '-$6.25', initials: 'BB' },
];

export const subcategories = [
  { value: 'food', label: 'Food & Dining' },
  { value: 'shopping', label: 'Shopping' },
  { value: 'bills', label: 'Bills & Utilities' },
  { value: 'travel', label: 'Travel' },
];

export const SECTION_LABEL = 'label-sm font-medium uppercase tracking-widest text-content-tertiary';

export const FILTER_CATEGORIES = [
  'Groceries',
  'Shopping',
  'Utilities',
  'Income',
  'Home',
  'Travel',
  'Health',
  'Education',
] as const;

export type FilterCategory = (typeof FILTER_CATEGORIES)[number];

// Fixed-width "artboard" the preview pans within (vertical + horizontal scroll).
export const CANVAS_WIDTH = 1080;