@burdenoff/microfe-billing 2026.510.114

package/dist/billing/modules/billing/pages/InvoiceDetailPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvoiceDetailPage.js","names":[],"sources":["../../../../../src/billing/modules/billing/pages/InvoiceDetailPage.tsx"],"sourcesContent":["/**\n * Billing Module - Invoice Detail Page\n * Displays detailed information about a single invoice\n */\n\nimport { type FC, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { useBilling } from '../../../providers/BillingProvider';\nimport { useBillingAccountSelection } from '../../../hooks/useBillingAccountSelection';\nimport { useInvoice, useInvoiceMutations } from '../hooks/useInvoices';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport { useGetDefaultBillingAccountDashboardQuery } from '../../../../generated/global-operations';\nimport {\n  formatCurrency,\n  formatDate,\n  formatInvoiceStatus,\n  formatInvoiceNumber,\n} from '../../../shared/utils/format';\nimport { withBillingAccountId } from '../../../shared/utils/navigation';\nimport { getInvoiceStatusColor, getStatusBadgeClasses } from '../../../shared/utils/status';\nimport type { InvoiceStatus } from '../../../shared/types';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\nexport const InvoiceDetailPage: FC = () => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n  const { invoiceId } = useParams<{ invoiceId: string }>();\n  const navigateTo = useBillingNavigate();\n  const { orgId } = useBilling();\n  const permissions = useBillingPermissions();\n  const { selectedAccountId } = useBillingAccountSelection({\n    orgId,\n    syncFromUrl: true,\n    urlParamName: 'billingAccountId',\n  });\n  const { data: defaultBillingAccountData } = useGetDefaultBillingAccountDashboardQuery({\n    fetchPolicy: 'cache-first',\n  });\n  const billingAccountId =\n    selectedAccountId ?? defaultBillingAccountData?.getDefaultBillingAccount?.id ?? undefined;\n  const { invoice, isLoading, error, refetch } = useInvoice(invoiceId, billingAccountId);\n  const { payInvoice, voidInvoice, isPaying, isVoiding } = useInvoiceMutations();\n  const defaultPaymentMethodId =\n    defaultBillingAccountData?.getDefaultBillingAccount?.defaultPaymentMethod;\n\n  // Action error state\n  const [actionError, setActionError] = useState<string | null>(null);\n\n  // Handle pay invoice\n  const handlePayInvoice = async () => {\n    if (!invoice) return;\n    if (!defaultPaymentMethodId) {\n      setActionError('Add and set a default payment method before paying this invoice.');\n      return;\n    }\n\n    if (!billingAccountId) {\n      setActionError('No billing account context');\n      return;\n    }\n    setActionError(null);\n    try {\n      await payInvoice(invoice.id, defaultPaymentMethodId, billingAccountId);\n      await refetch();\n    } catch (err) {\n      setActionError(err instanceof Error ? err.message : 'Failed to pay invoice');\n    }\n  };\n\n  // Handle void invoice\n  const handleVoidInvoice = async () => {\n    if (!invoice) return;\n    if (!billingAccountId) {\n      setActionError('No billing account context');\n      return;\n    }\n\n    setActionError(null);\n    try {\n      await voidInvoice(invoice.id, billingAccountId);\n      await refetch();\n    } catch (err) {\n      setActionError(err instanceof Error ? err.message : 'Failed to void invoice');\n    }\n  };\n\n  // Permission check\n  if (!permissions.canViewInvoices) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <div className=\"w-12 h-12 mx-auto rounded-full bg-muted flex items-center justify-center\">\n            <svg\n              className=\"w-6 h-6 text-muted-foreground\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-lg font-semibold text-foreground\">\n            {tr('billing.accessDenied.title', 'Access Denied')}\n          </h2>\n          <p className=\"text-sm text-muted-foreground max-w-sm\">\n            {tr('billing.invoices.noViewPermission', \"You don't have permission to view invoices.\")}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // Loading state\n  if (isLoading) {\n    return (\n      <div className=\"space-y-6 p-6\">\n        <div className=\"flex items-center gap-4\">\n          <div className=\"h-10 w-10 bg-muted animate-pulse rounded\" />\n          <div className=\"space-y-2\">\n            <div className=\"h-8 w-48 bg-muted animate-pulse rounded\" />\n            <div className=\"h-4 w-32 bg-muted animate-pulse rounded\" />\n          </div>\n        </div>\n        <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n          <div className=\"lg:col-span-2 space-y-6\">\n            <div className=\"border border-border rounded-lg p-6 space-y-4\">\n              <div className=\"h-6 w-32 bg-muted animate-pulse rounded\" />\n              <div className=\"h-4 w-full bg-muted animate-pulse rounded\" />\n              <div className=\"h-4 w-3/4 bg-muted animate-pulse rounded\" />\n            </div>\n            <div className=\"border border-border rounded-lg p-6 space-y-4\">\n              <div className=\"h-6 w-24 bg-muted animate-pulse rounded\" />\n              {[1, 2, 3].map((i) => (\n                <div key={i} className=\"flex items-center gap-4\">\n                  <div className=\"h-4 flex-1 bg-muted animate-pulse rounded\" />\n                  <div className=\"h-4 w-16 bg-muted animate-pulse rounded\" />\n                  <div className=\"h-4 w-16 bg-muted animate-pulse rounded\" />\n                  <div className=\"h-4 w-20 bg-muted animate-pulse rounded\" />\n                </div>\n              ))}\n            </div>\n          </div>\n          <div className=\"space-y-6\">\n            <div className=\"border border-border rounded-lg p-6 space-y-4\">\n              <div className=\"h-6 w-24 bg-muted animate-pulse rounded\" />\n              {[1, 2, 3, 4].map((i) => (\n                <div key={i} className=\"space-y-1\">\n                  <div className=\"h-3 w-20 bg-muted animate-pulse rounded\" />\n                  <div className=\"h-4 w-28 bg-muted animate-pulse rounded\" />\n                </div>\n              ))}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Error state\n  if (error || !invoice) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-4\">\n          <div className=\"w-12 h-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n            <svg\n              className=\"w-6 h-6 text-destructive\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-lg font-semibold text-foreground\">\n            {tr('billing.invoices.invoiceNotFound', 'Invoice not found')}\n          </h2>\n          <p className=\"text-sm text-muted-foreground\">\n            {error?.message ||\n              tr(\n                'billing.invoices.invoiceNotFoundMessage',\n                'The invoice you are looking for does not exist.'\n              )}\n          </p>\n          <div className=\"flex items-center justify-center gap-3\">\n            <button\n              onClick={() => refetch()}\n              className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n            >\n              Try Again\n            </button>\n            <button\n              onClick={() => navigateTo(withBillingAccountId('/invoices', billingAccountId))}\n              className=\"px-4 py-2 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n            >\n              Back to Invoices\n            </button>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  const statusColor = getInvoiceStatusColor(invoice.status);\n  const isOpen = invoice.status === ('OPEN' as InvoiceStatus);\n  const isDraft = invoice.status === ('DRAFT' as InvoiceStatus);\n  const items = invoice.items || [];\n  const amountDue = invoice.total - invoice.amountPaid;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      {/* Header */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n        <div className=\"flex items-start gap-4\">\n          <button\n            onClick={() => navigateTo(withBillingAccountId('/invoices', billingAccountId))}\n            className=\"p-2 -ml-2 text-muted-foreground hover:text-foreground hover:bg-muted rounded-md transition-colors\"\n          >\n            <svg className=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M15 19l-7-7 7-7\"\n              />\n            </svg>\n          </button>\n          <div>\n            <div className=\"flex items-center gap-3\">\n              <h1 className=\"text-2xl font-bold text-foreground\">\n                Invoice {formatInvoiceNumber(invoice.invoiceNumber)}\n              </h1>\n              <span\n                className={`px-2 py-1 text-xs font-medium rounded ${getStatusBadgeClasses(statusColor)}`}\n              >\n                {formatInvoiceStatus(invoice.status)}\n              </span>\n            </div>\n            <p className=\"text-sm text-muted-foreground mt-1\">\n              Created {formatDate(invoice.createdAt, 'short')}\n              {invoice.dueDate && ` · Due ${formatDate(invoice.dueDate, 'short')}`}\n            </p>\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2 flex-wrap\">\n          {invoice.pdfUrl && (\n            <a\n              href={invoice.pdfUrl}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"px-4 py-2 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n            >\n              Download PDF\n            </a>\n          )}\n          {invoice.invoiceUrl && (\n            <a\n              href={invoice.invoiceUrl}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"px-4 py-2 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n            >\n              View on Portal\n            </a>\n          )}\n          {isOpen && permissions.canPayInvoice && (\n            <button\n              onClick={handlePayInvoice}\n              disabled={isPaying || !defaultPaymentMethodId}\n              className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors disabled:opacity-50\"\n            >\n              {!defaultPaymentMethodId\n                ? 'Default Payment Method Required'\n                : isPaying\n                  ? 'Processing...'\n                  : 'Pay Invoice'}\n            </button>\n          )}\n          {(isOpen || isDraft) && permissions.canVoidInvoice && (\n            <button\n              onClick={handleVoidInvoice}\n              disabled={isVoiding}\n              className=\"px-4 py-2 text-sm font-medium border border-border text-destructive rounded-md hover:bg-destructive/10 transition-colors disabled:opacity-50\"\n            >\n              {isVoiding\n                ? tr('billing.invoices.voiding', 'Voiding...')\n                : tr('billing.invoices.voidInvoice', 'Void Invoice')}\n            </button>\n          )}\n        </div>\n      </div>\n\n      {/* Action Error */}\n      {actionError && (\n        <div className=\"p-3 bg-destructive/10 border border-destructive/20 rounded-md\">\n          <p className=\"text-sm text-destructive\">{actionError}</p>\n        </div>\n      )}\n\n      <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n        {/* Main Content */}\n        <div className=\"lg:col-span-2 space-y-6\">\n          {/* Line Items */}\n          <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n            <div className=\"p-6 border-b border-border bg-muted/30\">\n              <h2 className=\"text-lg font-semibold text-foreground\">\n                {tr('billing.invoices.lineItems', 'Line Items')} ({items.length})\n              </h2>\n            </div>\n            {items.length === 0 ? (\n              <div className=\"p-6\">\n                <p className=\"text-sm text-muted-foreground\">\n                  {tr('billing.invoices.noLineItems', 'No line items on this invoice.')}\n                </p>\n              </div>\n            ) : (\n              <div className=\"overflow-x-auto\">\n                <table className=\"w-full\">\n                  <thead className=\"bg-muted/50\">\n                    <tr>\n                      <th className=\"text-left px-4 py-3 text-sm font-medium text-muted-foreground\">\n                        Description\n                      </th>\n                      <th className=\"text-right px-4 py-3 text-sm font-medium text-muted-foreground\">\n                        Qty\n                      </th>\n                      <th className=\"text-right px-4 py-3 text-sm font-medium text-muted-foreground\">\n                        Unit Price\n                      </th>\n                      <th className=\"text-right px-4 py-3 text-sm font-medium text-muted-foreground\">\n                        Amount\n                      </th>\n                    </tr>\n                  </thead>\n                  <tbody className=\"divide-y divide-border\">\n                    {items.map((item) => (\n                      <tr key={item.id} className=\"hover:bg-muted/30 transition-colors\">\n                        <td className=\"px-4 py-4 text-sm text-foreground\">{item.description}</td>\n                        <td className=\"px-4 py-4 text-sm text-muted-foreground text-right\">\n                          {item.quantity}\n                        </td>\n                        <td className=\"px-4 py-4 text-sm text-muted-foreground text-right\">\n                          {formatCurrency(item.unitPrice, invoice.currency)}\n                        </td>\n                        <td className=\"px-4 py-4 text-sm font-medium text-foreground text-right\">\n                          {formatCurrency(item.amount, invoice.currency)}\n                        </td>\n                      </tr>\n                    ))}\n                  </tbody>\n                </table>\n              </div>\n            )}\n\n            {/* Totals */}\n            <div className=\"border-t border-border p-4\">\n              <div className=\"max-w-xs ml-auto space-y-2\">\n                <div className=\"flex items-center justify-between text-sm\">\n                  <span className=\"text-muted-foreground\">\n                    {tr('billing.invoices.subtotal', 'Subtotal')}\n                  </span>\n                  <span className=\"text-foreground\">\n                    {formatCurrency(invoice.subtotal, invoice.currency)}\n                  </span>\n                </div>\n                <div className=\"flex items-center justify-between text-sm\">\n                  <span className=\"text-muted-foreground\">{tr('billing.invoices.tax', 'Tax')}</span>\n                  <span className=\"text-foreground\">\n                    {formatCurrency(invoice.tax, invoice.currency)}\n                  </span>\n                </div>\n                <div className=\"flex items-center justify-between text-sm font-semibold border-t border-border pt-2\">\n                  <span className=\"text-foreground\">{tr('billing.invoices.total', 'Total')}</span>\n                  <span className=\"text-foreground\">\n                    {formatCurrency(invoice.total, invoice.currency)}\n                  </span>\n                </div>\n                {invoice.amountPaid > 0 && (\n                  <div className=\"flex items-center justify-between text-sm\">\n                    <span className=\"text-muted-foreground\">\n                      {tr('billing.invoices.amountPaid', 'Amount Paid')}\n                    </span>\n                    <span className=\"text-status-success-text\">\n                      -{formatCurrency(invoice.amountPaid, invoice.currency)}\n                    </span>\n                  </div>\n                )}\n                {amountDue > 0 && (\n                  <div className=\"flex items-center justify-between text-sm font-semibold border-t border-border pt-2\">\n                    <span className=\"text-foreground\">\n                      {tr('billing.invoices.amountDue', 'Amount Due')}\n                    </span>\n                    <span className=\"text-status-warning-text\">\n                      {formatCurrency(amountDue, invoice.currency)}\n                    </span>\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n\n          {/* Subscription Info */}\n          {invoice.subscription && (\n            <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n              <div className=\"p-6 border-b border-border bg-muted/30\">\n                <h2 className=\"text-lg font-semibold text-foreground\">\n                  {tr('billing.invoices.subscription', 'Subscription')}\n                </h2>\n              </div>\n              <div className=\"p-6 space-y-4\">\n                <div className=\"flex items-center justify-between\">\n                  <div>\n                    <p className=\"font-medium text-foreground\">\n                      {invoice.subscription.plan?.name || 'Unknown Plan'}\n                    </p>\n                    <p className=\"text-sm text-muted-foreground mt-0.5\">\n                      Subscription ID:{' '}\n                      <span className=\"font-mono text-xs\">{invoice.subscription.id}</span>\n                    </p>\n                  </div>\n                  <button\n                    onClick={() =>\n                      navigateTo(\n                        withBillingAccountId(\n                          `/subscriptions/${invoice.subscription!.id}`,\n                          billingAccountId\n                        )\n                      )\n                    }\n                    className=\"px-3 py-1.5 text-sm font-medium text-foreground hover:bg-muted rounded-md transition-colors\"\n                  >\n                    View\n                  </button>\n                </div>\n              </div>\n            </div>\n          )}\n\n          {/* Payment Info */}\n          {invoice.payment && (\n            <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n              <div className=\"p-6 border-b border-border bg-muted/30\">\n                <h2 className=\"text-lg font-semibold text-foreground\">\n                  {tr('billing.invoices.payment', 'Payment')}\n                </h2>\n              </div>\n              <div className=\"p-6\">\n                <div className=\"grid grid-cols-2 gap-4\">\n                  <div>\n                    <p className=\"text-sm text-muted-foreground\">Payment ID</p>\n                    <p className=\"font-mono text-sm text-foreground mt-0.5 break-all\">\n                      {invoice.payment.id}\n                    </p>\n                  </div>\n                  <div>\n                    <p className=\"text-sm text-muted-foreground\">Amount</p>\n                    <p className=\"text-sm text-foreground mt-0.5\">\n                      {formatCurrency(invoice.payment.amount, invoice.payment.currency)}\n                    </p>\n                  </div>\n                  <div>\n                    <p className=\"text-sm text-muted-foreground\">Status</p>\n                    <p className=\"text-sm text-foreground mt-0.5 capitalize\">\n                      {invoice.payment.status.toLowerCase()}\n                    </p>\n                  </div>\n                  <div>\n                    <p className=\"text-sm text-muted-foreground\">Method</p>\n                    <p className=\"text-sm text-foreground mt-0.5 capitalize\">\n                      {invoice.payment.method.toLowerCase().replace(/_/g, ' ')}\n                    </p>\n                  </div>\n                  {invoice.payment.provider && (\n                    <div>\n                      <p className=\"text-sm text-muted-foreground\">Provider</p>\n                      <p className=\"text-sm text-foreground mt-0.5 capitalize\">\n                        {invoice.payment.provider}\n                      </p>\n                    </div>\n                  )}\n                  {invoice.payment.paidAt && (\n                    <div>\n                      <p className=\"text-sm text-muted-foreground\">Paid At</p>\n                      <p className=\"text-sm text-foreground mt-0.5\">\n                        {formatDate(invoice.payment.paidAt, 'short')}\n                      </p>\n                    </div>\n                  )}\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n\n        {/* Sidebar */}\n        <div className=\"space-y-6\">\n          {/* Invoice Summary */}\n          <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n            <div className=\"p-6 border-b border-border bg-muted/30\">\n              <h2 className=\"text-lg font-semibold text-foreground\">\n                {tr('billing.invoices.details', 'Details')}\n              </h2>\n            </div>\n            <div className=\"p-6 space-y-4\">\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Invoice ID</p>\n                <p className=\"font-mono text-sm text-foreground mt-0.5 break-all\">{invoice.id}</p>\n              </div>\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Invoice Number</p>\n                <p className=\"text-sm text-foreground mt-0.5\">\n                  {formatInvoiceNumber(invoice.invoiceNumber)}\n                </p>\n              </div>\n              {invoice.itemDescription && (\n                <div>\n                  <p className=\"text-sm text-muted-foreground\">Description</p>\n                  <p className=\"text-sm text-foreground mt-0.5\">{invoice.itemDescription}</p>\n                </div>\n              )}\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Status</p>\n                <span\n                  className={`inline-flex mt-0.5 px-2 py-1 text-xs font-medium rounded ${getStatusBadgeClasses(statusColor)}`}\n                >\n                  {formatInvoiceStatus(invoice.status)}\n                </span>\n              </div>\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Currency</p>\n                <p className=\"text-sm text-foreground mt-0.5\">{invoice.currency}</p>\n              </div>\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Total</p>\n                <p className=\"text-sm font-semibold text-foreground mt-0.5\">\n                  {formatCurrency(invoice.total, invoice.currency)}\n                </p>\n              </div>\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Amount Paid</p>\n                <p className=\"text-sm text-status-success-text mt-0.5\">\n                  {formatCurrency(invoice.amountPaid, invoice.currency)}\n                </p>\n              </div>\n              {amountDue > 0 && (\n                <div>\n                  <p className=\"text-sm text-muted-foreground\">Amount Due</p>\n                  <p className=\"text-sm font-semibold text-status-warning-text mt-0.5\">\n                    {formatCurrency(amountDue, invoice.currency)}\n                  </p>\n                </div>\n              )}\n            </div>\n          </div>\n\n          {/* Dates */}\n          <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n            <div className=\"p-6 border-b border-border bg-muted/30\">\n              <h2 className=\"text-lg font-semibold text-foreground\">\n                {tr('billing.invoices.dates', 'Dates')}\n              </h2>\n            </div>\n            <div className=\"p-6 space-y-4\">\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Created</p>\n                <p className=\"text-sm text-foreground mt-0.5\">{formatDate(invoice.createdAt)}</p>\n              </div>\n              {invoice.dueDate && (\n                <div>\n                  <p className=\"text-sm text-muted-foreground\">Due Date</p>\n                  <p className=\"text-sm text-foreground mt-0.5\">{formatDate(invoice.dueDate)}</p>\n                </div>\n              )}\n              {invoice.paidAt && (\n                <div>\n                  <p className=\"text-sm text-muted-foreground\">Paid At</p>\n                  <p className=\"text-sm text-foreground mt-0.5\">{formatDate(invoice.paidAt)}</p>\n                </div>\n              )}\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Last Updated</p>\n                <p className=\"text-sm text-foreground mt-0.5\">{formatDate(invoice.updatedAt)}</p>\n              </div>\n            </div>\n          </div>\n\n          {/* Organization */}\n          <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n            <div className=\"p-6 border-b border-border bg-muted/30\">\n              <h2 className=\"text-lg font-semibold text-foreground\">\n                {tr('billing.invoices.organization', 'Organization')}\n              </h2>\n            </div>\n            <div className=\"p-6 space-y-4\">\n              <div>\n                <p className=\"text-sm text-muted-foreground\">Organization ID</p>\n                <p className=\"font-mono text-sm text-foreground mt-0.5 break-all\">\n                  {invoice.orgId}\n                </p>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/billing/modules/billing/pages/InvoicesListPage.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+
+export declare const InvoicesListPage: FC;
+//# sourceMappingURL=InvoicesListPage.d.ts.map

package/dist/billing/modules/billing/pages/InvoicesListPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvoicesListPage.d.ts","sourceRoot":"","sources":["../../../../../src/billing/modules/billing/pages/InvoicesListPage.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAgC,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAwB9D,eAAO,MAAM,gBAAgB,EAAE,EAsV9B,CAAC"}

package/dist/billing/modules/billing/pages/InvoicesListPage.js

@@ -0,0 +1,382 @@
+import { formatCurrency as e, formatDate as t, formatInvoiceNumber as n, formatInvoiceStatus as r } from "../../../shared/utils/format.js";
+import { getInvoiceStatusColor as i, getStatusBadgeClasses as a } from "../../../shared/utils/status.js";
+import { useBillingPermissions as o } from "../../../hooks/useBillingPermissions.js";
+import { useGetBillingAccountsByOrgQuery as s } from "../../../../generated/global-operations.js";
+import { useBillingNavigate as c } from "../../../hooks/useBillingNavigate.js";
+import { withBillingAccountId as l } from "../../../shared/utils/navigation.js";
+import { useInvoices as u } from "../hooks/useInvoices.js";
+import { useEffect as d, useMemo as f, useState as p } from "react";
+import { useSearchParams as m } from "react-router-dom";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { useI18n as _ } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+//#region src/billing/modules/billing/pages/InvoicesListPage.tsx
+var v = () => {
+	let { t } = _(), n = (e, n) => {
+		let r = t(e);
+		return r === e ? n : r;
+	}, i = c(), a = o(), [v] = m(), b = v.get("billingAccountId") ?? void 0, { data: x } = s({ fetchPolicy: "cache-first" }), S = x?.getBillingAccountsByOrg ?? [], [C, w] = p(b);
+	d(() => {
+		w(b);
+	}, [b]);
+	let T = f(() => (S.find((e) => e.isDefault) ?? S[0])?.id ?? void 0, [S]), E = C === void 0 ? T ?? null : C, { invoices: D, isLoading: O, error: k, refetch: A } = u({ billingAccountId: E ?? void 0 }), [j, M] = p("all"), [N, P] = p("");
+	if (!a.canViewInvoices) return /* @__PURE__ */ h("div", {
+		className: "flex items-center justify-center h-full min-h-[400px]",
+		children: /* @__PURE__ */ g("div", {
+			className: "text-center space-y-2",
+			children: [
+				/* @__PURE__ */ h("div", {
+					className: "w-12 h-12 mx-auto rounded-full bg-muted flex items-center justify-center",
+					children: /* @__PURE__ */ h("svg", {
+						className: "w-6 h-6 text-muted-foreground",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ h("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 2,
+							d: "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+						})
+					})
+				}),
+				/* @__PURE__ */ h("h2", {
+					className: "text-lg font-semibold text-foreground",
+					children: n("billing.accessDenied.title", "Access Denied")
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "text-sm text-muted-foreground max-w-sm",
+					children: n("billing.invoices.noViewPermission", "You don't have permission to view invoices.")
+				})
+			]
+		})
+	});
+	let F = D.filter((e) => {
+		if (j !== "all" && e.status !== j) return !1;
+		if (N) {
+			let t = N.toLowerCase();
+			return e.invoiceNumber.toLowerCase().includes(t) || e.id.toLowerCase().includes(t);
+		}
+		return !0;
+	}), I = F.reduce((e, t) => e + t.total, 0), L = F.filter((e) => e.status === "PAID").reduce((e, t) => e + t.total, 0), R = F.filter((e) => e.status === "OPEN").reduce((e, t) => e + t.total, 0);
+	return O && D.length === 0 ? /* @__PURE__ */ g("div", {
+		className: "space-y-6 p-6",
+		children: [/* @__PURE__ */ h("div", { className: "h-8 w-48 bg-muted animate-pulse rounded" }), /* @__PURE__ */ h("div", {
+			className: "space-y-3",
+			children: [
+				1,
+				2,
+				3,
+				4,
+				5
+			].map((e) => /* @__PURE__ */ h("div", {
+				className: "border border-border rounded-lg p-4",
+				children: /* @__PURE__ */ g("div", {
+					className: "flex items-center gap-4",
+					children: [/* @__PURE__ */ h("div", { className: "h-10 w-10 bg-muted animate-pulse rounded" }), /* @__PURE__ */ g("div", {
+						className: "flex-1 space-y-2",
+						children: [/* @__PURE__ */ h("div", { className: "h-4 w-32 bg-muted animate-pulse rounded" }), /* @__PURE__ */ h("div", { className: "h-3 w-48 bg-muted animate-pulse rounded" })]
+					})]
+				})
+			}, e))
+		})]
+	}) : k ? /* @__PURE__ */ h("div", {
+		className: "flex items-center justify-center h-full min-h-[400px]",
+		children: /* @__PURE__ */ g("div", {
+			className: "text-center space-y-4",
+			children: [
+				/* @__PURE__ */ h("div", {
+					className: "w-12 h-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center",
+					children: /* @__PURE__ */ h("svg", {
+						className: "w-6 h-6 text-destructive",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ h("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 2,
+							d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
+						})
+					})
+				}),
+				/* @__PURE__ */ h("h2", {
+					className: "text-lg font-semibold text-foreground",
+					children: n("billing.invoices.failedToLoad", "Failed to load invoices")
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "text-sm text-muted-foreground",
+					children: k.message
+				}),
+				/* @__PURE__ */ h("button", {
+					onClick: () => A(),
+					className: "px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
+					children: "Try Again"
+				})
+			]
+		})
+	}) : /* @__PURE__ */ g("div", {
+		className: "space-y-6 p-6",
+		children: [
+			/* @__PURE__ */ g("div", {
+				className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
+				children: [/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("h1", {
+					className: "text-2xl font-bold text-foreground",
+					children: n("billing.invoices.title", "Invoices")
+				}), /* @__PURE__ */ h("p", {
+					className: "text-sm text-muted-foreground mt-1",
+					children: n("billing.invoices.subtitle", "View and manage your billing invoices")
+				})] }), S.length > 1 && /* @__PURE__ */ g("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ h("label", {
+						className: "text-sm text-muted-foreground whitespace-nowrap",
+						children: "Billing Account"
+					}), /* @__PURE__ */ g("select", {
+						value: E ?? "",
+						onChange: (e) => w(e.target.value || null),
+						className: "text-sm border border-border rounded-md bg-background text-foreground px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary",
+						children: [/* @__PURE__ */ h("option", {
+							value: "",
+							children: "All Accounts"
+						}), S.map((e) => /* @__PURE__ */ g("option", {
+							value: e.id ?? "",
+							children: [e.name ?? e.email ?? e.id, e.isDefault ? " (Default)" : ""]
+						}, e.id ?? ""))]
+					})]
+				})]
+			}),
+			/* @__PURE__ */ g("div", {
+				className: "grid grid-cols-1 sm:grid-cols-3 gap-4",
+				children: [
+					/* @__PURE__ */ g("div", {
+						className: "border border-border rounded-lg bg-card p-4",
+						children: [/* @__PURE__ */ h("p", {
+							className: "text-sm text-muted-foreground",
+							children: n("billing.invoices.totalInvoiced", "Total Invoiced")
+						}), /* @__PURE__ */ h("p", {
+							className: "text-xl font-semibold text-foreground mt-1",
+							children: e(I)
+						})]
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "border border-border rounded-lg bg-card p-4",
+						children: [/* @__PURE__ */ h("p", {
+							className: "text-sm text-muted-foreground",
+							children: n("billing.invoices.paid", "Paid")
+						}), /* @__PURE__ */ h("p", {
+							className: "text-xl font-semibold text-status-success-text mt-1",
+							children: e(L)
+						})]
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "border border-border rounded-lg bg-card p-4",
+						children: [/* @__PURE__ */ h("p", {
+							className: "text-sm text-muted-foreground",
+							children: n("billing.invoices.outstanding", "Outstanding")
+						}), /* @__PURE__ */ h("p", {
+							className: "text-xl font-semibold text-status-warning-text mt-1",
+							children: e(R)
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ g("div", {
+				className: "flex flex-wrap items-center gap-4 pb-4 border-b border-border",
+				children: [/* @__PURE__ */ h("div", {
+					className: "inline-flex rounded-lg border border-border p-1 bg-muted/50 flex-wrap",
+					children: [
+						"all",
+						"OPEN",
+						"PAID",
+						"DRAFT",
+						"VOID"
+					].map((e) => /* @__PURE__ */ h("button", {
+						onClick: () => M(e),
+						className: `px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${j === e ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"}`,
+						children: e === "all" ? "All" : r(e)
+					}, e))
+				}), /* @__PURE__ */ g("div", {
+					className: "relative flex-1 min-w-[200px] max-w-md",
+					children: [/* @__PURE__ */ h("svg", {
+						className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ h("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 2,
+							d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
+						})
+					}), /* @__PURE__ */ h("input", {
+						type: "text",
+						placeholder: n("billing.invoices.searchPlaceholder", "Search by invoice number..."),
+						value: N,
+						onChange: (e) => P(e.target.value),
+						className: "w-full pl-[3.25rem] pr-4 py-2 text-sm border border-border rounded-md bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"
+					})]
+				})]
+			}),
+			F.length === 0 ? /* @__PURE__ */ g("div", {
+				className: "flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg",
+				children: [
+					/* @__PURE__ */ h("div", {
+						className: "w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-4",
+						children: /* @__PURE__ */ h("svg", {
+							className: "w-6 h-6 text-muted-foreground",
+							fill: "none",
+							viewBox: "0 0 24 24",
+							stroke: "currentColor",
+							children: /* @__PURE__ */ h("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								strokeWidth: 2,
+								d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+							})
+						})
+					}),
+					/* @__PURE__ */ h("h3", {
+						className: "text-lg font-medium text-foreground",
+						children: n("billing.invoices.noInvoicesFound", "No invoices found")
+					}),
+					/* @__PURE__ */ h("p", {
+						className: "text-sm text-muted-foreground mt-1",
+						children: j !== "all" || N ? n("billing.invoices.noInvoicesFiltered", "No invoices match your filters.") : n("billing.invoices.noInvoicesYet", "You don't have any invoices yet.")
+					})
+				]
+			}) : /* @__PURE__ */ h("div", {
+				className: "border border-border rounded-lg overflow-hidden",
+				children: /* @__PURE__ */ g("table", {
+					className: "w-full",
+					children: [/* @__PURE__ */ h("thead", {
+						className: "bg-muted/50",
+						children: /* @__PURE__ */ g("tr", { children: [
+							/* @__PURE__ */ h("th", {
+								className: "text-left px-4 py-3 text-sm font-medium text-muted-foreground",
+								children: "Invoice"
+							}),
+							/* @__PURE__ */ h("th", {
+								className: "text-left px-4 py-3 text-sm font-medium text-muted-foreground",
+								children: "Status"
+							}),
+							!E && S.length > 1 && /* @__PURE__ */ h("th", {
+								className: "text-left px-4 py-3 text-sm font-medium text-muted-foreground hidden lg:table-cell",
+								children: "Account"
+							}),
+							/* @__PURE__ */ h("th", {
+								className: "text-left px-4 py-3 text-sm font-medium text-muted-foreground hidden sm:table-cell",
+								children: "Date"
+							}),
+							/* @__PURE__ */ h("th", {
+								className: "text-left px-4 py-3 text-sm font-medium text-muted-foreground hidden md:table-cell",
+								children: "Due Date"
+							}),
+							/* @__PURE__ */ h("th", {
+								className: "text-right px-4 py-3 text-sm font-medium text-muted-foreground",
+								children: "Amount"
+							}),
+							/* @__PURE__ */ h("th", {
+								className: "text-right px-4 py-3 text-sm font-medium text-muted-foreground",
+								children: "Actions"
+							})
+						] })
+					}), /* @__PURE__ */ h("tbody", {
+						className: "divide-y divide-border",
+						children: F.map((e) => /* @__PURE__ */ h(y, {
+							invoice: e,
+							onView: () => i(l(`/invoices/${e.id}`, e.billingAccountId)),
+							canPay: a.canPayInvoice,
+							canVoid: a.canVoidInvoice,
+							showAccount: !E && S.length > 1,
+							accountName: S.find((t) => t.id === e.billingAccountId)?.name ?? null
+						}, e.id))
+					})]
+				})
+			})
+		]
+	});
+}, y = ({ invoice: o, onView: s, canPay: c, canVoid: l, showAccount: u = !1, accountName: d }) => {
+	let f = i(o.status), p = o.status === "OPEN", m = o.status === "DRAFT";
+	return /* @__PURE__ */ g("tr", {
+		className: "hover:bg-muted/30 transition-colors",
+		children: [
+			/* @__PURE__ */ g("td", {
+				className: "px-4 py-4",
+				children: [/* @__PURE__ */ h("button", {
+					onClick: s,
+					className: "font-medium text-foreground hover:text-primary transition-colors",
+					children: n(o.invoiceNumber)
+				}), (o.itemDescription ?? o.subscription?.plan?.name) && /* @__PURE__ */ h("p", {
+					className: "text-sm text-muted-foreground mt-0.5",
+					children: o.itemDescription ?? o.subscription?.plan?.name
+				})]
+			}),
+			/* @__PURE__ */ h("td", {
+				className: "px-4 py-4",
+				children: /* @__PURE__ */ h("span", {
+					className: `inline-flex px-2 py-1 text-xs font-medium rounded ${a(f)}`,
+					children: r(o.status)
+				})
+			}),
+			u && /* @__PURE__ */ h("td", {
+				className: "px-4 py-4 hidden lg:table-cell",
+				children: d ? /* @__PURE__ */ h("span", {
+					className: "inline-flex items-center px-2 py-0.5 text-xs font-medium rounded-full bg-muted text-muted-foreground border border-border",
+					children: d
+				}) : /* @__PURE__ */ h("span", {
+					className: "text-sm text-muted-foreground",
+					children: "—"
+				})
+			}),
+			/* @__PURE__ */ h("td", {
+				className: "px-4 py-4 text-sm text-muted-foreground hidden sm:table-cell",
+				children: t(o.createdAt, "short")
+			}),
+			/* @__PURE__ */ h("td", {
+				className: "px-4 py-4 text-sm text-muted-foreground hidden md:table-cell",
+				children: o.dueDate ? t(o.dueDate, "short") : "—"
+			}),
+			/* @__PURE__ */ h("td", {
+				className: "px-4 py-4 text-right font-medium text-foreground",
+				children: e(o.total, o.currency)
+			}),
+			/* @__PURE__ */ h("td", {
+				className: "px-4 py-4 text-right",
+				children: /* @__PURE__ */ g("div", {
+					className: "flex items-center justify-end gap-2",
+					children: [
+						o.invoiceUrl ? /* @__PURE__ */ h("a", {
+							href: o.invoiceUrl,
+							target: "_blank",
+							rel: "noopener noreferrer",
+							className: "px-3 py-1.5 text-sm font-medium text-foreground hover:bg-muted rounded-md transition-colors",
+							children: "View"
+						}) : /* @__PURE__ */ h("button", {
+							onClick: s,
+							className: "px-3 py-1.5 text-sm font-medium text-foreground hover:bg-muted rounded-md transition-colors",
+							children: "View"
+						}),
+						o.pdfUrl && /* @__PURE__ */ h("a", {
+							href: o.pdfUrl,
+							target: "_blank",
+							rel: "noopener noreferrer",
+							className: "px-3 py-1.5 text-sm font-medium text-primary hover:bg-primary/10 rounded-md transition-colors",
+							children: "PDF"
+						}),
+						p && c && /* @__PURE__ */ h("button", {
+							className: "px-3 py-1.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
+							children: "Pay"
+						}),
+						(p || m) && l && /* @__PURE__ */ h("button", {
+							className: "px-3 py-1.5 text-sm font-medium text-destructive hover:bg-destructive/10 rounded-md transition-colors",
+							children: "Void"
+						})
+					]
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { v as InvoicesListPage };
+
+//# sourceMappingURL=InvoicesListPage.js.map

package/dist/billing/modules/billing/pages/InvoicesListPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvoicesListPage.js","names":[],"sources":["../../../../../src/billing/modules/billing/pages/InvoicesListPage.tsx"],"sourcesContent":["/**\n * Billing Module - Invoices List Page\n * Displays all invoices for the current tenant\n */\n\nimport { useEffect, useState, useMemo, type FC } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { useInvoices } from '../hooks/useInvoices';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport {\n  useGetBillingAccountsByOrgQuery,\n  type GetBillingAccountsByOrgQuery,\n} from '../../../../generated/global-operations';\n\ntype BillingAccountItem = GetBillingAccountsByOrgQuery['getBillingAccountsByOrg'][number];\nimport {\n  formatCurrency,\n  formatDate,\n  formatInvoiceStatus,\n  formatInvoiceNumber,\n} from '../../../shared/utils/format';\nimport { withBillingAccountId } from '../../../shared/utils/navigation';\nimport { getInvoiceStatusColor, getStatusBadgeClasses } from '../../../shared/utils/status';\nimport type { Invoice, InvoiceStatus } from '../../../shared/types';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\ntype FilterStatus = 'all' | InvoiceStatus;\n\nexport const InvoicesListPage: FC = () => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n  const navigateTo = useBillingNavigate();\n  const permissions = useBillingPermissions();\n  const [searchParams] = useSearchParams();\n  const urlBillingAccountId = searchParams.get('billingAccountId') ?? undefined;\n\n  const { data: accountsData } = useGetBillingAccountsByOrgQuery({ fetchPolicy: 'cache-first' });\n  const billingAccounts = accountsData?.getBillingAccountsByOrg ?? [];\n\n  // undefined = user hasn't explicitly chosen yet → auto-pick default\n  // null      = user explicitly chose \"All Accounts\"\n  // string    = user explicitly chose a specific account\n  const [explicitAccountId, setExplicitAccountId] = useState<string | null | undefined>(\n    urlBillingAccountId\n  );\n\n  useEffect(() => {\n    setExplicitAccountId(urlBillingAccountId);\n  }, [urlBillingAccountId]);\n\n  const defaultAccountId = useMemo(\n    () =>\n      (billingAccounts.find((a: BillingAccountItem) => a.isDefault) ?? billingAccounts[0])?.id ??\n      undefined,\n    [billingAccounts]\n  );\n\n  // Resolved selection: explicit choice wins; before any choice, use the default\n  const selectedAccountId: string | null =\n    explicitAccountId !== undefined ? explicitAccountId : (defaultAccountId ?? null);\n\n  const { invoices, isLoading, error, refetch } = useInvoices({\n    billingAccountId: selectedAccountId ?? undefined,\n  });\n\n  const [filterStatus, setFilterStatus] = useState<FilterStatus>('all');\n  const [searchQuery, setSearchQuery] = useState('');\n\n  // Permission check\n  if (!permissions.canViewInvoices) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <div className=\"w-12 h-12 mx-auto rounded-full bg-muted flex items-center justify-center\">\n            <svg\n              className=\"w-6 h-6 text-muted-foreground\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-lg font-semibold text-foreground\">\n            {tr('billing.accessDenied.title', 'Access Denied')}\n          </h2>\n          <p className=\"text-sm text-muted-foreground max-w-sm\">\n            {tr('billing.invoices.noViewPermission', \"You don't have permission to view invoices.\")}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // Filter invoices\n  const filteredInvoices = invoices.filter((invoice) => {\n    if (filterStatus !== 'all' && invoice.status !== filterStatus) {\n      return false;\n    }\n    if (searchQuery) {\n      const query = searchQuery.toLowerCase();\n      return (\n        invoice.invoiceNumber.toLowerCase().includes(query) ||\n        invoice.id.toLowerCase().includes(query)\n      );\n    }\n    return true;\n  });\n\n  // Calculate totals\n  const totalAmount = filteredInvoices.reduce((sum, inv) => sum + inv.total, 0);\n  const totalPaid = filteredInvoices\n    .filter((inv) => inv.status === ('PAID' as InvoiceStatus))\n    .reduce((sum, inv) => sum + inv.total, 0);\n  const totalOpen = filteredInvoices\n    .filter((inv) => inv.status === ('OPEN' as InvoiceStatus))\n    .reduce((sum, inv) => sum + inv.total, 0);\n\n  // Loading state\n  if (isLoading && invoices.length === 0) {\n    return (\n      <div className=\"space-y-6 p-6\">\n        <div className=\"h-8 w-48 bg-muted animate-pulse rounded\" />\n        <div className=\"space-y-3\">\n          {[1, 2, 3, 4, 5].map((i) => (\n            <div key={i} className=\"border border-border rounded-lg p-4\">\n              <div className=\"flex items-center gap-4\">\n                <div className=\"h-10 w-10 bg-muted animate-pulse rounded\" />\n                <div className=\"flex-1 space-y-2\">\n                  <div className=\"h-4 w-32 bg-muted animate-pulse rounded\" />\n                  <div className=\"h-3 w-48 bg-muted animate-pulse rounded\" />\n                </div>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n  // Error state\n  if (error) {\n    return (\n      <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n        <div className=\"text-center space-y-4\">\n          <div className=\"w-12 h-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n            <svg\n              className=\"w-6 h-6 text-destructive\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-lg font-semibold text-foreground\">\n            {tr('billing.invoices.failedToLoad', 'Failed to load invoices')}\n          </h2>\n          <p className=\"text-sm text-muted-foreground\">{error.message}</p>\n          <button\n            onClick={() => refetch()}\n            className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n          >\n            Try Again\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      {/* Header */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-bold text-foreground\">\n            {tr('billing.invoices.title', 'Invoices')}\n          </h1>\n          <p className=\"text-sm text-muted-foreground mt-1\">\n            {tr('billing.invoices.subtitle', 'View and manage your billing invoices')}\n          </p>\n        </div>\n        {billingAccounts.length > 1 && (\n          <div className=\"flex items-center gap-2\">\n            <label className=\"text-sm text-muted-foreground whitespace-nowrap\">\n              Billing Account\n            </label>\n            <select\n              value={selectedAccountId ?? ''}\n              onChange={(e) => setExplicitAccountId(e.target.value || null)}\n              className=\"text-sm border border-border rounded-md bg-background text-foreground px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary\"\n            >\n              <option value=\"\">All Accounts</option>\n              {billingAccounts.map((account: BillingAccountItem) => (\n                <option key={account.id ?? ''} value={account.id ?? ''}>\n                  {account.name ?? account.email ?? account.id}\n                  {account.isDefault ? ' (Default)' : ''}\n                </option>\n              ))}\n            </select>\n          </div>\n        )}\n      </div>\n\n      {/* Summary Cards */}\n      <div className=\"grid grid-cols-1 sm:grid-cols-3 gap-4\">\n        <div className=\"border border-border rounded-lg bg-card p-4\">\n          <p className=\"text-sm text-muted-foreground\">\n            {tr('billing.invoices.totalInvoiced', 'Total Invoiced')}\n          </p>\n          <p className=\"text-xl font-semibold text-foreground mt-1\">\n            {formatCurrency(totalAmount)}\n          </p>\n        </div>\n        <div className=\"border border-border rounded-lg bg-card p-4\">\n          <p className=\"text-sm text-muted-foreground\">{tr('billing.invoices.paid', 'Paid')}</p>\n          <p className=\"text-xl font-semibold text-status-success-text mt-1\">\n            {formatCurrency(totalPaid)}\n          </p>\n        </div>\n        <div className=\"border border-border rounded-lg bg-card p-4\">\n          <p className=\"text-sm text-muted-foreground\">\n            {tr('billing.invoices.outstanding', 'Outstanding')}\n          </p>\n          <p className=\"text-xl font-semibold text-status-warning-text mt-1\">\n            {formatCurrency(totalOpen)}\n          </p>\n        </div>\n      </div>\n\n      {/* Filters */}\n      <div className=\"flex flex-wrap items-center gap-4 pb-4 border-b border-border\">\n        {/* Status Filter */}\n        <div className=\"inline-flex rounded-lg border border-border p-1 bg-muted/50 flex-wrap\">\n          {(['all', 'OPEN', 'PAID', 'DRAFT', 'VOID'] as FilterStatus[]).map((status) => (\n            <button\n              key={status}\n              onClick={() => setFilterStatus(status)}\n              className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n                filterStatus === status\n                  ? 'bg-background text-foreground shadow-sm'\n                  : 'text-muted-foreground hover:text-foreground'\n              }`}\n            >\n              {status === 'all' ? 'All' : formatInvoiceStatus(status as InvoiceStatus)}\n            </button>\n          ))}\n        </div>\n\n        {/* Search */}\n        <div className=\"relative flex-1 min-w-[200px] max-w-md\">\n          <svg\n            className=\"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground\"\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n              strokeWidth={2}\n              d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\"\n            />\n          </svg>\n          <input\n            type=\"text\"\n            placeholder={tr('billing.invoices.searchPlaceholder', 'Search by invoice number...')}\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            className=\"w-full pl-[3.25rem] pr-4 py-2 text-sm border border-border rounded-md bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent\"\n          />\n        </div>\n      </div>\n\n      {/* Invoices Table */}\n      {filteredInvoices.length === 0 ? (\n        <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n          <div className=\"w-12 h-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n            <svg\n              className=\"w-6 h-6 text-muted-foreground\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"\n              />\n            </svg>\n          </div>\n          <h3 className=\"text-lg font-medium text-foreground\">\n            {tr('billing.invoices.noInvoicesFound', 'No invoices found')}\n          </h3>\n          <p className=\"text-sm text-muted-foreground mt-1\">\n            {filterStatus !== 'all' || searchQuery\n              ? tr('billing.invoices.noInvoicesFiltered', 'No invoices match your filters.')\n              : tr('billing.invoices.noInvoicesYet', \"You don't have any invoices yet.\")}\n          </p>\n        </div>\n      ) : (\n        <div className=\"border border-border rounded-lg overflow-hidden\">\n          <table className=\"w-full\">\n            <thead className=\"bg-muted/50\">\n              <tr>\n                <th className=\"text-left px-4 py-3 text-sm font-medium text-muted-foreground\">\n                  Invoice\n                </th>\n                <th className=\"text-left px-4 py-3 text-sm font-medium text-muted-foreground\">\n                  Status\n                </th>\n                {!selectedAccountId && billingAccounts.length > 1 && (\n                  <th className=\"text-left px-4 py-3 text-sm font-medium text-muted-foreground hidden lg:table-cell\">\n                    Account\n                  </th>\n                )}\n                <th className=\"text-left px-4 py-3 text-sm font-medium text-muted-foreground hidden sm:table-cell\">\n                  Date\n                </th>\n                <th className=\"text-left px-4 py-3 text-sm font-medium text-muted-foreground hidden md:table-cell\">\n                  Due Date\n                </th>\n                <th className=\"text-right px-4 py-3 text-sm font-medium text-muted-foreground\">\n                  Amount\n                </th>\n                <th className=\"text-right px-4 py-3 text-sm font-medium text-muted-foreground\">\n                  Actions\n                </th>\n              </tr>\n            </thead>\n            <tbody className=\"divide-y divide-border\">\n              {filteredInvoices.map((invoice) => (\n                <InvoiceRow\n                  key={invoice.id}\n                  invoice={invoice}\n                  onView={() =>\n                    navigateTo(\n                      withBillingAccountId(`/invoices/${invoice.id}`, invoice.billingAccountId)\n                    )\n                  }\n                  canPay={permissions.canPayInvoice}\n                  canVoid={permissions.canVoidInvoice}\n                  showAccount={!selectedAccountId && billingAccounts.length > 1}\n                  accountName={\n                    billingAccounts.find(\n                      (a: BillingAccountItem) => a.id === invoice.billingAccountId\n                    )?.name ?? null\n                  }\n                />\n              ))}\n            </tbody>\n          </table>\n        </div>\n      )}\n    </div>\n  );\n};\n\n// ============================================================================\n// Invoice Row Component\n// ============================================================================\n\ninterface InvoiceRowProps {\n  invoice: Invoice;\n  onView: () => void;\n  canPay: boolean;\n  canVoid: boolean;\n  showAccount?: boolean;\n  accountName?: string | null;\n}\n\nconst InvoiceRow: FC<InvoiceRowProps> = ({\n  invoice,\n  onView,\n  canPay,\n  canVoid,\n  showAccount = false,\n  accountName,\n}) => {\n  const statusColor = getInvoiceStatusColor(invoice.status);\n  const isOpen = invoice.status === ('OPEN' as InvoiceStatus);\n  const isDraft = invoice.status === ('DRAFT' as InvoiceStatus);\n\n  return (\n    <tr className=\"hover:bg-muted/30 transition-colors\">\n      <td className=\"px-4 py-4\">\n        <button\n          onClick={onView}\n          className=\"font-medium text-foreground hover:text-primary transition-colors\"\n        >\n          {formatInvoiceNumber(invoice.invoiceNumber)}\n        </button>\n        {(invoice.itemDescription ?? invoice.subscription?.plan?.name) && (\n          <p className=\"text-sm text-muted-foreground mt-0.5\">\n            {invoice.itemDescription ?? invoice.subscription?.plan?.name}\n          </p>\n        )}\n      </td>\n      <td className=\"px-4 py-4\">\n        <span\n          className={`inline-flex px-2 py-1 text-xs font-medium rounded ${getStatusBadgeClasses(statusColor)}`}\n        >\n          {formatInvoiceStatus(invoice.status)}\n        </span>\n      </td>\n      {showAccount && (\n        <td className=\"px-4 py-4 hidden lg:table-cell\">\n          {accountName ? (\n            <span className=\"inline-flex items-center px-2 py-0.5 text-xs font-medium rounded-full bg-muted text-muted-foreground border border-border\">\n              {accountName}\n            </span>\n          ) : (\n            <span className=\"text-sm text-muted-foreground\">—</span>\n          )}\n        </td>\n      )}\n      <td className=\"px-4 py-4 text-sm text-muted-foreground hidden sm:table-cell\">\n        {formatDate(invoice.createdAt, 'short')}\n      </td>\n      <td className=\"px-4 py-4 text-sm text-muted-foreground hidden md:table-cell\">\n        {invoice.dueDate ? formatDate(invoice.dueDate, 'short') : '—'}\n      </td>\n      <td className=\"px-4 py-4 text-right font-medium text-foreground\">\n        {formatCurrency(invoice.total, invoice.currency)}\n      </td>\n      <td className=\"px-4 py-4 text-right\">\n        <div className=\"flex items-center justify-end gap-2\">\n          {invoice.invoiceUrl ? (\n            <a\n              href={invoice.invoiceUrl}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"px-3 py-1.5 text-sm font-medium text-foreground hover:bg-muted rounded-md transition-colors\"\n            >\n              View\n            </a>\n          ) : (\n            <button\n              onClick={onView}\n              className=\"px-3 py-1.5 text-sm font-medium text-foreground hover:bg-muted rounded-md transition-colors\"\n            >\n              View\n            </button>\n          )}\n          {invoice.pdfUrl && (\n            <a\n              href={invoice.pdfUrl}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"px-3 py-1.5 text-sm font-medium text-primary hover:bg-primary/10 rounded-md transition-colors\"\n            >\n              PDF\n            </a>\n          )}\n          {isOpen && canPay && (\n            <button className=\"px-3 py-1.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\">\n              Pay\n            </button>\n          )}\n          {(isOpen || isDraft) && canVoid && (\n            <button className=\"px-3 py-1.5 text-sm font-medium text-destructive hover:bg-destructive/10 rounded-md transition-colors\">\n              Void\n            </button>\n          )}\n        </div>\n      </td>\n    </tr>\n  );\n};\n"],"mappings":"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"}

package/dist/billing/modules/billing/pages/PaymentMethodsPage.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+
+export declare const PaymentMethodsPage: FC;
+//# sourceMappingURL=PaymentMethodsPage.d.ts.map

package/dist/billing/modules/billing/pages/PaymentMethodsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodsPage.d.ts","sourceRoot":"","sources":["../../../../../src/billing/modules/billing/pages/PaymentMethodsPage.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAY,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AA0B1C,eAAO,MAAM,kBAAkB,EAAE,EAqHhC,CAAC"}