@burdenoff/microfe-billing 2026.530.2 → 2026.530.3

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

@@ -1 +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, useRef, type FC } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { usePaginatedInvoices } 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 [filterStatus, setFilterStatus] = useState<FilterStatus>('all');\n  const [searchQuery, setSearchQuery] = useState('');\n  const [debouncedSearch, setDebouncedSearch] = useState('');\n  const [page, setPage] = useState(1);\n  const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (debounceTimer.current) clearTimeout(debounceTimer.current);\n    debounceTimer.current = setTimeout(() => {\n      setDebouncedSearch(searchQuery);\n      setPage(1);\n    }, 400);\n    return () => {\n      if (debounceTimer.current) clearTimeout(debounceTimer.current);\n    };\n  }, [searchQuery]);\n\n  const { invoices, totalPages, isLoading, error, refetch } = usePaginatedInvoices({\n    billingAccountId: selectedAccountId ?? undefined,\n    status: filterStatus !== 'all' ? (filterStatus as InvoiceStatus) : undefined,\n    search: debouncedSearch || undefined,\n    page,\n    pageSize: 20,\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=\"size-12 mx-auto rounded-full bg-muted flex items-center justify-center\">\n            <svg\n              className=\"size-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 && 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=\"size-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=\"size-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n            <svg\n              className=\"size-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            type=\"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      {/* 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              type=\"button\"\n              key={status}\n              onClick={() => {\n                setFilterStatus(status);\n                setPage(1);\n              }}\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-0 w-full sm:max-w-md\">\n          <svg\n            className=\"absolute left-3 top-1/2 -translate-y-1/2 size-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      {!isLoading && invoices.length === 0 ? (\n        <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n          <div className=\"size-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n            <svg\n              className=\"size-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' || debouncedSearch\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        <>\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                {invoices.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          {totalPages > 1 && (\n            <div className=\"flex items-center justify-between pt-2\">\n              <p className=\"text-sm text-muted-foreground\">\n                Page {page} of {totalPages}\n              </p>\n              <div className=\"flex items-center gap-2\">\n                <button\n                  type=\"button\"\n                  onClick={() => setPage((p) => Math.max(1, p - 1))}\n                  disabled={page <= 1}\n                  className=\"px-3 py-1.5 text-sm font-medium border border-border rounded-md bg-background text-foreground hover:bg-muted disabled:opacity-40 disabled:cursor-not-allowed transition-colors\"\n                >\n                  Previous\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setPage((p) => Math.min(totalPages, p + 1))}\n                  disabled={page >= totalPages}\n                  className=\"px-3 py-1.5 text-sm font-medium border border-border rounded-md bg-background text-foreground hover:bg-muted disabled:opacity-40 disabled:cursor-not-allowed transition-colors\"\n                >\n                  Next\n                </button>\n              </div>\n            </div>\n          )}\n        </>\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=\"p-4\">\n        <button\n          type=\"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=\"p-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=\"p-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=\"p-4 text-sm text-muted-foreground hidden sm:table-cell\">\n        {formatDate(invoice.createdAt, 'short')}\n      </td>\n      <td className=\"p-4 text-sm text-muted-foreground hidden md:table-cell\">\n        {invoice.dueDate ? formatDate(invoice.dueDate, 'short') : '—'}\n      </td>\n      <td className=\"p-4 text-right font-medium text-foreground\">\n        {formatCurrency(invoice.total, invoice.currency)}\n      </td>\n      <td className=\"p-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              type=\"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\n              type=\"button\"\n              className=\"px-3 py-1.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n            >\n              Pay\n            </button>\n          )}\n          {(isOpen || isDraft) && canVoid && (\n            <button\n              type=\"button\"\n              className=\"px-3 py-1.5 text-sm font-medium text-destructive hover:bg-destructive/10 rounded-md transition-colors\"\n            >\n              Void\n            </button>\n          )}\n        </div>\n      </td>\n    </tr>\n  );\n};\n"],"mappings":"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"}
+{"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, useRef, type FC } from 'react';\nimport { RotateCcw } from 'lucide-react';\nimport { useSearchParams } from 'react-router-dom';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { usePaginatedInvoices } 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 [filterStatus, setFilterStatus] = useState<FilterStatus>('all');\n  const [searchQuery, setSearchQuery] = useState('');\n  const [debouncedSearch, setDebouncedSearch] = useState('');\n  const [page, setPage] = useState(1);\n  const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (debounceTimer.current) clearTimeout(debounceTimer.current);\n    debounceTimer.current = setTimeout(() => {\n      setDebouncedSearch(searchQuery);\n      setPage(1);\n    }, 400);\n    return () => {\n      if (debounceTimer.current) clearTimeout(debounceTimer.current);\n    };\n  }, [searchQuery]);\n\n  const { invoices, totalPages, isLoading, error, refetch } = usePaginatedInvoices({\n    billingAccountId: selectedAccountId ?? undefined,\n    status: filterStatus !== 'all' ? (filterStatus as InvoiceStatus) : undefined,\n    search: debouncedSearch || undefined,\n    page,\n    pageSize: 20,\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=\"size-12 mx-auto rounded-full bg-muted flex items-center justify-center\">\n            <svg\n              className=\"size-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 && 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=\"size-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=\"size-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n            <svg\n              className=\"size-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            type=\"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        <div className=\"flex items-center gap-3\">\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('/refunds')}\n            className=\"inline-flex items-center gap-2 px-3 py-2 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n          >\n            <RotateCcw className=\"size-4\" />\n            {tr('billing.invoices.myRefunds', 'My Refunds')}\n          </button>\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      </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              type=\"button\"\n              key={status}\n              onClick={() => {\n                setFilterStatus(status);\n                setPage(1);\n              }}\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-0 w-full sm:max-w-md\">\n          <svg\n            className=\"absolute left-3 top-1/2 -translate-y-1/2 size-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      {!isLoading && invoices.length === 0 ? (\n        <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n          <div className=\"size-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n            <svg\n              className=\"size-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' || debouncedSearch\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        <>\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                {invoices.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          {totalPages > 1 && (\n            <div className=\"flex items-center justify-between pt-2\">\n              <p className=\"text-sm text-muted-foreground\">\n                Page {page} of {totalPages}\n              </p>\n              <div className=\"flex items-center gap-2\">\n                <button\n                  type=\"button\"\n                  onClick={() => setPage((p) => Math.max(1, p - 1))}\n                  disabled={page <= 1}\n                  className=\"px-3 py-1.5 text-sm font-medium border border-border rounded-md bg-background text-foreground hover:bg-muted disabled:opacity-40 disabled:cursor-not-allowed transition-colors\"\n                >\n                  Previous\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setPage((p) => Math.min(totalPages, p + 1))}\n                  disabled={page >= totalPages}\n                  className=\"px-3 py-1.5 text-sm font-medium border border-border rounded-md bg-background text-foreground hover:bg-muted disabled:opacity-40 disabled:cursor-not-allowed transition-colors\"\n                >\n                  Next\n                </button>\n              </div>\n            </div>\n          )}\n        </>\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=\"p-4\">\n        <button\n          type=\"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=\"p-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=\"p-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=\"p-4 text-sm text-muted-foreground hidden sm:table-cell\">\n        {formatDate(invoice.createdAt, 'short')}\n      </td>\n      <td className=\"p-4 text-sm text-muted-foreground hidden md:table-cell\">\n        {invoice.dueDate ? formatDate(invoice.dueDate, 'short') : '—'}\n      </td>\n      <td className=\"p-4 text-right font-medium text-foreground\">\n        {formatCurrency(invoice.total, invoice.currency)}\n      </td>\n      <td className=\"p-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              type=\"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\n              type=\"button\"\n              className=\"px-3 py-1.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n            >\n              Pay\n            </button>\n          )}\n          {(isOpen || isDraft) && canVoid && (\n            <button\n              type=\"button\"\n              className=\"px-3 py-1.5 text-sm font-medium text-destructive hover:bg-destructive/10 rounded-md transition-colors\"\n            >\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/UserRefundsPage.js

@@ -0,0 +1,417 @@
+import { PageHeader as e } from "../../../shared/components/PageHeader.js";
+import "../../../shared/components/index.js";
+import { formatCurrency as t, formatDateTime as n } from "../../../shared/utils/format.js";
+import "../../../shared/utils/index.js";
+import { useCreateRefundRecordMutation as r, useGetBillingAccountsCheckoutQuery as i, useGetRefundRecordsQuery as a, useGetTransactionLazyQuery as o } from "../../../../generated/global-operations.js";
+import { useBillingNavigate as s } from "../../../hooks/useBillingNavigate.js";
+import { RefundRecordStatus as c } from "../../../../generated/global-types.js";
+import { useEffect as l, useRef as u, useState as d } from "react";
+import { CheckCircle as f, Clock as p, CreditCard as m, Loader2 as h, PlusCircle as ee, RotateCcw as te, Search as ne, X as g, XCircle as _ } from "lucide-react";
+import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { useI18n as b } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+//#region src/billing/modules/billing/pages/UserRefundsPage.tsx
+var x = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i, S = {
+	[c.Pending]: {
+		label: "In Review",
+		className: "bg-status-warning-bg/20 text-status-warning-text border-status-warning-border",
+		icon: ({ className: e }) => /* @__PURE__ */ v(p, { className: e })
+	},
+	[c.Processing]: {
+		label: "Processing",
+		className: "bg-action-primary-bg/15 text-action-primary-bg border-action-primary-bg/30",
+		icon: ({ className: e }) => /* @__PURE__ */ v(h, { className: `${e} animate-spin` })
+	},
+	[c.Completed]: {
+		label: "Refunded",
+		className: "bg-status-success-bg/20 text-status-success-text border-status-success-border",
+		icon: ({ className: e }) => /* @__PURE__ */ v(f, { className: e })
+	},
+	[c.Failed]: {
+		label: "Failed",
+		className: "bg-status-error-bg/20 text-status-error-text border-status-error-border",
+		icon: ({ className: e }) => /* @__PURE__ */ v(_, { className: e })
+	},
+	[c.Skipped]: {
+		label: "Closed",
+		className: "bg-muted text-muted-foreground border-border",
+		icon: ({ className: e }) => /* @__PURE__ */ v(_, { className: e })
+	}
+};
+function re({ status: e }) {
+	let t = S[e] ?? {
+		label: e,
+		className: "bg-muted text-muted-foreground border-border",
+		icon: ({ className: e }) => /* @__PURE__ */ v(p, { className: e })
+	}, n = t.icon;
+	return /* @__PURE__ */ y("span", {
+		className: `inline-flex items-center gap-1 px-2 py-0.5 rounded-full border text-xs font-medium ${t.className}`,
+		children: [/* @__PURE__ */ v(n, { className: "size-3" }), t.label]
+	});
+}
+var C = () => {
+	let { t: p } = b(), _ = (e, t) => {
+		let n = p(e);
+		return n === e ? t : n;
+	}, S = s(), [C, w] = d(!1), [T, E] = d(""), [D, O] = d(null), [k, A] = d(!1), [j, M] = d(""), [N, P] = d(""), [F, I] = d(null), [ie, L] = d(!1), { data: ae, loading: R } = i({ fetchPolicy: "cache-and-network" }), z = ae?.getBillingAccountsByOrg ?? [], [B, V] = d(void 0);
+	l(() => {
+		!B && z.length > 0 && V(z[0].id);
+	}, [z, B]);
+	let H = z.find((e) => e.id === B), [U, { data: W, loading: G, error: K }] = o({ fetchPolicy: "network-only" }), q = u("");
+	l(() => {
+		if (G) return;
+		let e = W?.getTransaction;
+		e ? (O(e), A(!1), P(String(e.amount))) : (W !== void 0 || K) && (O(null), A(!0), P(""));
+	}, [
+		W,
+		G,
+		K
+	]);
+	let J = (e, t) => {
+		q.current = `${e}::${t}`, O(null), A(!1), P(""), U({ variables: {
+			id: e,
+			billingAccountId: t
+		} });
+	}, oe = (e) => {
+		E(e), O(null), A(!1), P(""), x.test(e.trim()) && B && J(e.trim(), B);
+	}, se = (e) => {
+		V(e), O(null), A(!1), P(""), x.test(T.trim()) && J(T.trim(), e);
+	}, { data: ce, loading: le, refetch: ue } = a({
+		variables: {
+			billingAccountId: B,
+			pageSize: 20,
+			page: 1
+		},
+		skip: !B,
+		fetchPolicy: "cache-and-network"
+	}), Y = ce?.getRefundRecords.records ?? [], [de, { loading: X }] = r({ refetchQueries: ["GetRefundRecords"] }), Z = (e) => e ? e.stripePaymentId ? {
+		provider: "STRIPE",
+		gatewayPaymentId: e.stripePaymentId
+	} : e.razorpayPaymentId ? {
+		provider: "RAZORPAY",
+		gatewayPaymentId: e.razorpayPaymentId
+	} : null : null, fe = async (e) => {
+		if (e.preventDefault(), I(null), !D || !j.trim() || !N) {
+			I("Enter a valid transaction ID, an amount, and a reason.");
+			return;
+		}
+		let n = Z(D);
+		if (!n) {
+			I("No payment gateway info found for this transaction. Please contact support.");
+			return;
+		}
+		let r = parseFloat(N);
+		if (isNaN(r) || r <= 0) {
+			I("Please enter a valid amount greater than 0.");
+			return;
+		}
+		if (r > D.amount) {
+			I(`Cannot exceed the original payment amount (${t(D.amount, D.currency)}).`);
+			return;
+		}
+		try {
+			await de({ variables: {
+				billingAccountId: B,
+				provider: n.provider,
+				gatewayPaymentId: n.gatewayPaymentId,
+				amount: r,
+				currency: D.currency ?? H?.currency ?? "USD",
+				transactionId: D.id,
+				reason: j.trim(),
+				notes: "Requested by user via billing portal"
+			} }), L(!0), w(!1), Q(), await ue();
+		} catch (e) {
+			I(e instanceof Error ? e.message : "Failed to submit refund request.");
+		}
+	}, Q = () => {
+		E(""), O(null), A(!1), M(""), P(""), I(null);
+	}, $ = () => {
+		w(!1), L(!1), Q();
+	};
+	return /* @__PURE__ */ y("div", {
+		className: "space-y-6 p-6 max-w-3xl",
+		children: [
+			/* @__PURE__ */ v(e, {
+				title: _("billing.refunds.title", "Refunds"),
+				description: _("billing.refunds.description", "View your refund requests and submit new ones"),
+				actions: C ? void 0 : /* @__PURE__ */ y("button", {
+					type: "button",
+					onClick: () => {
+						w(!0), L(!1);
+					},
+					className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors",
+					children: [/* @__PURE__ */ v(ee, { className: "size-4" }), _("billing.refunds.requestRefund", "Request Refund")]
+				})
+			}),
+			!R && z.length > 1 && /* @__PURE__ */ y("div", {
+				className: "flex items-center gap-3",
+				children: [
+					/* @__PURE__ */ v(m, { className: "size-4 text-muted-foreground shrink-0" }),
+					/* @__PURE__ */ v("label", {
+						htmlFor: "accountSwitch",
+						className: "text-sm text-muted-foreground shrink-0",
+						children: _("billing.refunds.account", "Billing account")
+					}),
+					/* @__PURE__ */ v("select", {
+						id: "accountSwitch",
+						value: B ?? "",
+						onChange: (e) => se(e.target.value),
+						className: "flex-1 px-3 py-1.5 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm",
+						children: z.map((e) => /* @__PURE__ */ y("option", {
+							value: e.id,
+							children: [
+								e.name,
+								" (",
+								e.currency,
+								") — ",
+								e.email
+							]
+						}, e.id))
+					})
+				]
+			}),
+			ie && /* @__PURE__ */ y("div", {
+				className: "flex items-center justify-between p-4 rounded-lg border border-status-success-border bg-status-success-bg/10",
+				children: [/* @__PURE__ */ y("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ v(f, { className: "size-4 text-status-success-text" }), /* @__PURE__ */ v("p", {
+						className: "text-sm text-status-success-text font-medium",
+						children: _("billing.refunds.submitted", "Refund request submitted. Our team will review it shortly.")
+					})]
+				}), /* @__PURE__ */ v("button", {
+					type: "button",
+					onClick: () => L(!1),
+					className: "text-status-success-text hover:opacity-70",
+					children: /* @__PURE__ */ v(g, { className: "size-4" })
+				})]
+			}),
+			C && /* @__PURE__ */ y("div", {
+				className: "border border-border rounded-lg bg-card overflow-hidden",
+				children: [/* @__PURE__ */ y("div", {
+					className: "flex items-center justify-between p-4 border-b border-border bg-muted/30",
+					children: [/* @__PURE__ */ v("h2", {
+						className: "font-semibold text-foreground",
+						children: _("billing.refunds.newRequest", "New Refund Request")
+					}), /* @__PURE__ */ v("button", {
+						type: "button",
+						onClick: $,
+						className: "p-1 rounded hover:bg-muted transition-colors",
+						children: /* @__PURE__ */ v(g, { className: "size-4 text-muted-foreground" })
+					})]
+				}), /* @__PURE__ */ y("form", {
+					onSubmit: fe,
+					className: "p-4 space-y-4",
+					children: [
+						F && /* @__PURE__ */ v("div", {
+							className: "p-3 rounded-lg border border-status-error-border bg-status-error-bg/10",
+							children: /* @__PURE__ */ v("p", {
+								className: "text-sm text-status-error-text",
+								children: F
+							})
+						}),
+						/* @__PURE__ */ y("div", { children: [
+							/* @__PURE__ */ y("label", {
+								htmlFor: "txnId",
+								className: "block text-sm font-medium text-foreground mb-1",
+								children: [_("billing.refunds.transactionId", "Transaction ID"), " *"]
+							}),
+							/* @__PURE__ */ y("div", {
+								className: "relative",
+								children: [/* @__PURE__ */ v("input", {
+									id: "txnId",
+									type: "text",
+									value: T,
+									onChange: (e) => oe(e.target.value),
+									placeholder: "Paste your transaction ID...",
+									className: "w-full pl-3 pr-9 py-2 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm font-mono"
+								}), /* @__PURE__ */ v("div", {
+									className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-muted-foreground",
+									children: G ? /* @__PURE__ */ v(h, { className: "size-4 animate-spin" }) : /* @__PURE__ */ v(ne, { className: "size-4" })
+								})]
+							}),
+							D && /* @__PURE__ */ y("div", {
+								className: "mt-2 p-3 rounded-md border border-status-success-border bg-status-success-bg/10 text-sm space-y-0.5",
+								children: [/* @__PURE__ */ y("div", {
+									className: "flex items-center gap-2",
+									children: [
+										/* @__PURE__ */ v(f, { className: "size-3.5 text-status-success-text shrink-0" }),
+										/* @__PURE__ */ v("span", {
+											className: "font-medium text-foreground",
+											children: t(D.amount, D.currency)
+										}),
+										/* @__PURE__ */ v("span", {
+											className: "text-muted-foreground",
+											children: "·"
+										}),
+										/* @__PURE__ */ v("span", {
+											className: "text-muted-foreground",
+											children: n(D.createdAt)
+										}),
+										D.stripePaymentId && /* @__PURE__ */ v("span", {
+											className: "text-xs text-muted-foreground",
+											children: "Stripe"
+										}),
+										D.razorpayPaymentId && /* @__PURE__ */ v("span", {
+											className: "text-xs text-muted-foreground",
+											children: "Razorpay"
+										})
+									]
+								}), D.description && /* @__PURE__ */ v("p", {
+									className: "text-xs text-muted-foreground pl-5",
+									children: D.description
+								})]
+							}),
+							k && T.length > 0 && !G && /* @__PURE__ */ v("p", {
+								className: "mt-1 text-xs text-status-error-text",
+								children: _("billing.refunds.txnNotFound", "Transaction not found in this billing account.")
+							}),
+							!x.test(T.trim()) && T.length > 4 && /* @__PURE__ */ v("p", {
+								className: "mt-1 text-xs text-muted-foreground",
+								children: _("billing.refunds.txnIdHint", "Transaction IDs look like: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx")
+							})
+						] }),
+						D && /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ y("label", {
+							htmlFor: "refundAmount",
+							className: "block text-sm font-medium text-foreground mb-1",
+							children: [_("billing.refunds.amount", "Refund Amount"), " *"]
+						}), /* @__PURE__ */ y("div", {
+							className: "flex items-center gap-2",
+							children: [
+								/* @__PURE__ */ v("input", {
+									id: "refundAmount",
+									type: "number",
+									step: "0.01",
+									min: "0.01",
+									max: D.amount,
+									value: N,
+									onChange: (e) => P(e.target.value),
+									required: !0,
+									className: "w-40 px-3 py-2 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm",
+									placeholder: "0.00"
+								}),
+								/* @__PURE__ */ v("span", {
+									className: "text-sm text-muted-foreground",
+									children: D.currency ?? H?.currency ?? "USD"
+								}),
+								/* @__PURE__ */ y("span", {
+									className: "text-xs text-muted-foreground",
+									children: ["max ", t(D.amount, D.currency)]
+								})
+							]
+						})] }),
+						/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ y("label", {
+							htmlFor: "reason",
+							className: "block text-sm font-medium text-foreground mb-1",
+							children: [_("billing.refunds.reason", "Reason for refund"), " *"]
+						}), /* @__PURE__ */ v("textarea", {
+							id: "reason",
+							value: j,
+							onChange: (e) => M(e.target.value),
+							required: !0,
+							rows: 3,
+							className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm resize-none",
+							placeholder: _("billing.refunds.reasonPlaceholder", "Describe why you are requesting a refund...")
+						})] }),
+						/* @__PURE__ */ y("div", {
+							className: "flex items-center gap-3 pt-1",
+							children: [/* @__PURE__ */ v("button", {
+								type: "submit",
+								disabled: X || !D || !j.trim() || !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 disabled:cursor-not-allowed",
+								children: X ? _("billing.refunds.submitting", "Submitting...") : _("billing.refunds.submitRequest", "Submit Request")
+							}), /* @__PURE__ */ v("button", {
+								type: "button",
+								onClick: $,
+								className: "px-4 py-2 text-sm border border-border text-foreground rounded-md hover:bg-muted transition-colors",
+								children: _("billing.common.cancel", "Cancel")
+							})]
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ y("div", {
+				className: "border border-border rounded-lg bg-card overflow-hidden",
+				children: [/* @__PURE__ */ v("div", {
+					className: "p-4 border-b border-border bg-muted/30",
+					children: /* @__PURE__ */ v("h2", {
+						className: "font-semibold text-foreground",
+						children: _("billing.refunds.history", "Refund History")
+					})
+				}), R || le ? /* @__PURE__ */ v("div", {
+					className: "p-8 flex items-center justify-center",
+					children: /* @__PURE__ */ v(h, { className: "size-5 animate-spin text-muted-foreground" })
+				}) : Y.length === 0 ? /* @__PURE__ */ y("div", {
+					className: "p-10 flex flex-col items-center text-center gap-3",
+					children: [
+						/* @__PURE__ */ v(te, { className: "size-8 text-muted-foreground" }),
+						/* @__PURE__ */ v("p", {
+							className: "text-sm font-medium text-foreground",
+							children: _("billing.refunds.noRefunds", "No refund requests yet")
+						}),
+						/* @__PURE__ */ v("p", {
+							className: "text-xs text-muted-foreground max-w-sm",
+							children: _("billing.refunds.noRefundsHint", "If you have an issue with a payment, click \"Request Refund\" to get started.")
+						})
+					]
+				}) : /* @__PURE__ */ v("ul", {
+					className: "divide-y divide-border",
+					children: Y.map((e) => /* @__PURE__ */ y("li", {
+						className: "flex items-start gap-4 p-4 hover:bg-muted/30 transition-colors",
+						children: [/* @__PURE__ */ y("div", {
+							className: "flex-1 min-w-0",
+							children: [
+								/* @__PURE__ */ y("div", {
+									className: "flex items-center gap-2 flex-wrap",
+									children: [
+										/* @__PURE__ */ v("span", {
+											className: "text-sm font-medium text-foreground",
+											children: t(e.amount, e.currency)
+										}),
+										/* @__PURE__ */ v(re, { status: e.status }),
+										e.purchaseDetail && /* @__PURE__ */ v("span", {
+											className: "text-xs text-muted-foreground truncate",
+											children: e.purchaseDetail
+										})
+									]
+								}),
+								e.reason && /* @__PURE__ */ v("p", {
+									className: "text-xs text-muted-foreground mt-1 line-clamp-2",
+									children: e.reason
+								}),
+								e.errorMessage && e.status === c.Failed && /* @__PURE__ */ v("p", {
+									className: "text-xs text-status-error-text mt-1",
+									children: e.errorMessage
+								})
+							]
+						}), /* @__PURE__ */ y("div", {
+							className: "text-right shrink-0",
+							children: [/* @__PURE__ */ v("p", {
+								className: "text-xs text-muted-foreground",
+								children: n(e.createdAt)
+							}), e.processedAt && /* @__PURE__ */ y("p", {
+								className: "text-xs text-muted-foreground mt-0.5",
+								children: ["Processed ", n(e.processedAt)]
+							})]
+						})]
+					}, e.id))
+				})]
+			}),
+			/* @__PURE__ */ y("p", {
+				className: "text-xs text-muted-foreground",
+				children: [
+					_("billing.refunds.footer", "Refund requests are reviewed by our team within 3–5 business days. For urgent issues, contact support."),
+					" ",
+					/* @__PURE__ */ v("button", {
+						type: "button",
+						onClick: () => S("/transactions/" + B),
+						className: "underline hover:no-underline",
+						children: _("billing.refunds.viewTransactions", "View all transactions")
+					})
+				]
+			})
+		]
+	});
+};
+//#endregion
+export { C as UserRefundsPage };
+
+//# sourceMappingURL=UserRefundsPage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UserRefundsPage.js","names":[],"sources":["../../../../../src/billing/modules/billing/pages/UserRefundsPage.tsx"],"sourcesContent":["/**\n * Billing Module - User Refunds Page\n * Shows the user's refund request history and allows submitting new requests.\n */\n\nimport { useState, useEffect, useRef, type FC, type FormEvent } from 'react';\nimport {\n  RotateCcw,\n  PlusCircle,\n  X,\n  Clock,\n  CheckCircle,\n  XCircle,\n  Loader2,\n  Search,\n  CreditCard,\n} from 'lucide-react';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { formatCurrency, formatDateTime } from '../../../shared/utils';\nimport { PageHeader } from '../../../shared/components';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n  useGetBillingAccountsCheckoutQuery,\n  useGetTransactionLazyQuery,\n  useGetRefundRecordsQuery,\n  useCreateRefundRecordMutation,\n  type GetRefundRecordsQuery,\n  type GetTransactionQuery,\n} from '../../../../generated/global-operations';\nimport { RefundRecordStatus } from '../../../../generated/global-types';\n\ntype RefundItem = NonNullable<GetRefundRecordsQuery['getRefundRecords']['records']>[number];\ntype TxnLookup = NonNullable<GetTransactionQuery['getTransaction']>;\n\nconst UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;\n\n// ============================================================================\n// Status helpers\n// ============================================================================\n\nconst STATUS_CONFIG: Record<\n  RefundRecordStatus,\n  { label: string; className: string; icon: FC<{ className?: string }> }\n> = {\n  [RefundRecordStatus.Pending]: {\n    label: 'In Review',\n    className: 'bg-status-warning-bg/20 text-status-warning-text border-status-warning-border',\n    icon: ({ className }) => <Clock className={className} />,\n  },\n  [RefundRecordStatus.Processing]: {\n    label: 'Processing',\n    className: 'bg-action-primary-bg/15 text-action-primary-bg border-action-primary-bg/30',\n    icon: ({ className }) => <Loader2 className={`${className} animate-spin`} />,\n  },\n  [RefundRecordStatus.Completed]: {\n    label: 'Refunded',\n    className: 'bg-status-success-bg/20 text-status-success-text border-status-success-border',\n    icon: ({ className }) => <CheckCircle className={className} />,\n  },\n  [RefundRecordStatus.Failed]: {\n    label: 'Failed',\n    className: 'bg-status-error-bg/20 text-status-error-text border-status-error-border',\n    icon: ({ className }) => <XCircle className={className} />,\n  },\n  [RefundRecordStatus.Skipped]: {\n    label: 'Closed',\n    className: 'bg-muted text-muted-foreground border-border',\n    icon: ({ className }) => <XCircle className={className} />,\n  },\n};\n\nfunction StatusBadge({ status }: { status: string }) {\n  const cfg = STATUS_CONFIG[status as RefundRecordStatus] ?? {\n    label: status,\n    className: 'bg-muted text-muted-foreground border-border',\n    icon: ({ className }: { className?: string }) => <Clock className={className} />,\n  };\n  const Icon = cfg.icon;\n  return (\n    <span\n      className={`inline-flex items-center gap-1 px-2 py-0.5 rounded-full border text-xs font-medium ${cfg.className}`}\n    >\n      <Icon className=\"size-3\" />\n      {cfg.label}\n    </span>\n  );\n}\n\n// ============================================================================\n// Main page\n// ============================================================================\n\nexport const UserRefundsPage: FC = () => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string) => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n  const navigateTo = useBillingNavigate();\n\n  // Form state\n  const [showForm, setShowForm] = useState(false);\n  const [txnIdInput, setTxnIdInput] = useState('');\n  const [lookedUpTxn, setLookedUpTxn] = useState<TxnLookup | null>(null);\n  const [txnNotFound, setTxnNotFound] = useState(false);\n  const [reason, setReason] = useState('');\n  const [amount, setAmount] = useState('');\n  const [formError, setFormError] = useState<string | null>(null);\n  const [formSuccess, setFormSuccess] = useState(false);\n\n  // All billing accounts\n  const { data: accountsData, loading: accountsLoading } = useGetBillingAccountsCheckoutQuery({\n    fetchPolicy: 'cache-and-network',\n  });\n  type BillingAccount = NonNullable<typeof accountsData>['getBillingAccountsByOrg'][number];\n  const accounts: BillingAccount[] = accountsData?.getBillingAccountsByOrg ?? [];\n\n  // Default to the first account; user can switch\n  const [selectedAccountId, setSelectedAccountId] = useState<string | undefined>(undefined);\n  useEffect(() => {\n    if (!selectedAccountId && accounts.length > 0) {\n      setSelectedAccountId(accounts[0].id);\n    }\n  }, [accounts, selectedAccountId]);\n\n  const selectedAccount = accounts.find((a) => a.id === selectedAccountId);\n\n  // Transaction lookup by ID (lazy — fires when user enters a valid UUID)\n  const [fetchTxn, { data: txnLookupData, loading: txnLookupLoading, error: txnLookupError }] =\n    useGetTransactionLazyQuery({ fetchPolicy: 'network-only' });\n\n  // Track the \"active\" lookup key so we only apply results for the latest request\n  const lastLookupKey = useRef('');\n\n  useEffect(() => {\n    if (txnLookupLoading) return;\n    const txn = txnLookupData?.getTransaction;\n    if (txn) {\n      setLookedUpTxn(txn);\n      setTxnNotFound(false);\n      setAmount(String(txn.amount));\n    } else if (txnLookupData !== undefined || txnLookupError) {\n      setLookedUpTxn(null);\n      setTxnNotFound(true);\n      setAmount('');\n    }\n  }, [txnLookupData, txnLookupLoading, txnLookupError]);\n\n  const triggerLookup = (txnId: string, accountId: string) => {\n    const key = `${txnId}::${accountId}`;\n    lastLookupKey.current = key;\n    setLookedUpTxn(null);\n    setTxnNotFound(false);\n    setAmount('');\n    fetchTxn({ variables: { id: txnId, billingAccountId: accountId } });\n  };\n\n  const handleTxnIdChange = (value: string) => {\n    setTxnIdInput(value);\n    setLookedUpTxn(null);\n    setTxnNotFound(false);\n    setAmount('');\n    if (UUID_RE.test(value.trim()) && selectedAccountId) {\n      triggerLookup(value.trim(), selectedAccountId);\n    }\n  };\n\n  // When account changes, re-fetch the transaction if one is entered\n  const handleAccountChange = (accountId: string) => {\n    setSelectedAccountId(accountId);\n    setLookedUpTxn(null);\n    setTxnNotFound(false);\n    setAmount('');\n    if (UUID_RE.test(txnIdInput.trim())) {\n      triggerLookup(txnIdInput.trim(), accountId);\n    }\n  };\n\n  // Refund history for selected account\n  const {\n    data: refundsData,\n    loading: refundsLoading,\n    refetch: refetchRefunds,\n  } = useGetRefundRecordsQuery({\n    variables: { billingAccountId: selectedAccountId, pageSize: 20, page: 1 },\n    skip: !selectedAccountId,\n    fetchPolicy: 'cache-and-network',\n  });\n  const refunds = refundsData?.getRefundRecords.records ?? [];\n\n  const [createRefund, { loading: isSubmitting }] = useCreateRefundRecordMutation({\n    refetchQueries: ['GetRefundRecords'],\n  });\n\n  const getGatewayInfo = (txn: TxnLookup | null) => {\n    if (!txn) return null;\n    if (txn.stripePaymentId) return { provider: 'STRIPE', gatewayPaymentId: txn.stripePaymentId };\n    if (txn.razorpayPaymentId)\n      return { provider: 'RAZORPAY', gatewayPaymentId: txn.razorpayPaymentId };\n    return null;\n  };\n\n  const handleSubmit = async (e: FormEvent) => {\n    e.preventDefault();\n    setFormError(null);\n\n    if (!lookedUpTxn || !reason.trim() || !amount) {\n      setFormError('Enter a valid transaction ID, an amount, and a reason.');\n      return;\n    }\n    const gatewayInfo = getGatewayInfo(lookedUpTxn);\n    if (!gatewayInfo) {\n      setFormError('No payment gateway info found for this transaction. Please contact support.');\n      return;\n    }\n    const parsedAmount = parseFloat(amount);\n    if (isNaN(parsedAmount) || parsedAmount <= 0) {\n      setFormError('Please enter a valid amount greater than 0.');\n      return;\n    }\n    if (parsedAmount > lookedUpTxn.amount) {\n      setFormError(\n        `Cannot exceed the original payment amount (${formatCurrency(lookedUpTxn.amount, lookedUpTxn.currency)}).`\n      );\n      return;\n    }\n\n    try {\n      await createRefund({\n        variables: {\n          billingAccountId: selectedAccountId,\n          provider: gatewayInfo.provider,\n          gatewayPaymentId: gatewayInfo.gatewayPaymentId,\n          amount: parsedAmount,\n          currency: lookedUpTxn.currency ?? selectedAccount?.currency ?? 'USD',\n          transactionId: lookedUpTxn.id,\n          reason: reason.trim(),\n          notes: `Requested by user via billing portal`,\n        },\n      });\n      setFormSuccess(true);\n      setShowForm(false);\n      resetFormFields();\n      await refetchRefunds();\n    } catch (err) {\n      setFormError(err instanceof Error ? err.message : 'Failed to submit refund request.');\n    }\n  };\n\n  const resetFormFields = () => {\n    setTxnIdInput('');\n    setLookedUpTxn(null);\n    setTxnNotFound(false);\n    setReason('');\n    setAmount('');\n    setFormError(null);\n  };\n\n  const resetForm = () => {\n    setShowForm(false);\n    setFormSuccess(false);\n    resetFormFields();\n  };\n\n  return (\n    <div className=\"space-y-6 p-6 max-w-3xl\">\n      <PageHeader\n        title={tr('billing.refunds.title', 'Refunds')}\n        description={tr(\n          'billing.refunds.description',\n          'View your refund requests and submit new ones'\n        )}\n        actions={\n          !showForm ? (\n            <button\n              type=\"button\"\n              onClick={() => {\n                setShowForm(true);\n                setFormSuccess(false);\n              }}\n              className=\"inline-flex items-center gap-2 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n            >\n              <PlusCircle className=\"size-4\" />\n              {tr('billing.refunds.requestRefund', 'Request Refund')}\n            </button>\n          ) : undefined\n        }\n      />\n\n      {/* Billing account switcher */}\n      {!accountsLoading && accounts.length > 1 && (\n        <div className=\"flex items-center gap-3\">\n          <CreditCard className=\"size-4 text-muted-foreground shrink-0\" />\n          <label htmlFor=\"accountSwitch\" className=\"text-sm text-muted-foreground shrink-0\">\n            {tr('billing.refunds.account', 'Billing account')}\n          </label>\n          <select\n            id=\"accountSwitch\"\n            value={selectedAccountId ?? ''}\n            onChange={(e) => handleAccountChange(e.target.value)}\n            className=\"flex-1 px-3 py-1.5 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm\"\n          >\n            {accounts.map((a) => (\n              <option key={a.id} value={a.id}>\n                {a.name} ({a.currency}) — {a.email}\n              </option>\n            ))}\n          </select>\n        </div>\n      )}\n\n      {/* Success banner */}\n      {formSuccess && (\n        <div className=\"flex items-center justify-between p-4 rounded-lg border border-status-success-border bg-status-success-bg/10\">\n          <div className=\"flex items-center gap-2\">\n            <CheckCircle className=\"size-4 text-status-success-text\" />\n            <p className=\"text-sm text-status-success-text font-medium\">\n              {tr(\n                'billing.refunds.submitted',\n                'Refund request submitted. Our team will review it shortly.'\n              )}\n            </p>\n          </div>\n          <button\n            type=\"button\"\n            onClick={() => setFormSuccess(false)}\n            className=\"text-status-success-text hover:opacity-70\"\n          >\n            <X className=\"size-4\" />\n          </button>\n        </div>\n      )}\n\n      {/* Request Refund Form */}\n      {showForm && (\n        <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n          <div className=\"flex items-center justify-between p-4 border-b border-border bg-muted/30\">\n            <h2 className=\"font-semibold text-foreground\">\n              {tr('billing.refunds.newRequest', 'New Refund Request')}\n            </h2>\n            <button\n              type=\"button\"\n              onClick={resetForm}\n              className=\"p-1 rounded hover:bg-muted transition-colors\"\n            >\n              <X className=\"size-4 text-muted-foreground\" />\n            </button>\n          </div>\n\n          <form onSubmit={handleSubmit} className=\"p-4 space-y-4\">\n            {formError && (\n              <div className=\"p-3 rounded-lg border border-status-error-border bg-status-error-bg/10\">\n                <p className=\"text-sm text-status-error-text\">{formError}</p>\n              </div>\n            )}\n\n            {/* Transaction ID lookup */}\n            <div>\n              <label htmlFor=\"txnId\" className=\"block text-sm font-medium text-foreground mb-1\">\n                {tr('billing.refunds.transactionId', 'Transaction ID')} *\n              </label>\n              <div className=\"relative\">\n                <input\n                  id=\"txnId\"\n                  type=\"text\"\n                  value={txnIdInput}\n                  onChange={(e) => handleTxnIdChange(e.target.value)}\n                  placeholder=\"Paste your transaction ID...\"\n                  className=\"w-full pl-3 pr-9 py-2 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm font-mono\"\n                />\n                <div className=\"absolute right-2.5 top-1/2 -translate-y-1/2 text-muted-foreground\">\n                  {txnLookupLoading ? (\n                    <Loader2 className=\"size-4 animate-spin\" />\n                  ) : (\n                    <Search className=\"size-4\" />\n                  )}\n                </div>\n              </div>\n\n              {/* Transaction lookup result */}\n              {lookedUpTxn && (\n                <div className=\"mt-2 p-3 rounded-md border border-status-success-border bg-status-success-bg/10 text-sm space-y-0.5\">\n                  <div className=\"flex items-center gap-2\">\n                    <CheckCircle className=\"size-3.5 text-status-success-text shrink-0\" />\n                    <span className=\"font-medium text-foreground\">\n                      {formatCurrency(lookedUpTxn.amount, lookedUpTxn.currency)}\n                    </span>\n                    <span className=\"text-muted-foreground\">·</span>\n                    <span className=\"text-muted-foreground\">\n                      {formatDateTime(lookedUpTxn.createdAt)}\n                    </span>\n                    {lookedUpTxn.stripePaymentId && (\n                      <span className=\"text-xs text-muted-foreground\">Stripe</span>\n                    )}\n                    {lookedUpTxn.razorpayPaymentId && (\n                      <span className=\"text-xs text-muted-foreground\">Razorpay</span>\n                    )}\n                  </div>\n                  {lookedUpTxn.description && (\n                    <p className=\"text-xs text-muted-foreground pl-5\">{lookedUpTxn.description}</p>\n                  )}\n                </div>\n              )}\n              {txnNotFound && txnIdInput.length > 0 && !txnLookupLoading && (\n                <p className=\"mt-1 text-xs text-status-error-text\">\n                  {tr(\n                    'billing.refunds.txnNotFound',\n                    'Transaction not found in this billing account.'\n                  )}\n                </p>\n              )}\n              {!UUID_RE.test(txnIdInput.trim()) && txnIdInput.length > 4 && (\n                <p className=\"mt-1 text-xs text-muted-foreground\">\n                  {tr(\n                    'billing.refunds.txnIdHint',\n                    'Transaction IDs look like: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'\n                  )}\n                </p>\n              )}\n            </div>\n\n            {/* Amount — only shown once transaction is found */}\n            {lookedUpTxn && (\n              <div>\n                <label\n                  htmlFor=\"refundAmount\"\n                  className=\"block text-sm font-medium text-foreground mb-1\"\n                >\n                  {tr('billing.refunds.amount', 'Refund Amount')} *\n                </label>\n                <div className=\"flex items-center gap-2\">\n                  <input\n                    id=\"refundAmount\"\n                    type=\"number\"\n                    step=\"0.01\"\n                    min=\"0.01\"\n                    max={lookedUpTxn.amount}\n                    value={amount}\n                    onChange={(e) => setAmount(e.target.value)}\n                    required\n                    className=\"w-40 px-3 py-2 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm\"\n                    placeholder=\"0.00\"\n                  />\n                  <span className=\"text-sm text-muted-foreground\">\n                    {lookedUpTxn.currency ?? selectedAccount?.currency ?? 'USD'}\n                  </span>\n                  <span className=\"text-xs text-muted-foreground\">\n                    max {formatCurrency(lookedUpTxn.amount, lookedUpTxn.currency)}\n                  </span>\n                </div>\n              </div>\n            )}\n\n            {/* Reason */}\n            <div>\n              <label htmlFor=\"reason\" className=\"block text-sm font-medium text-foreground mb-1\">\n                {tr('billing.refunds.reason', 'Reason for refund')} *\n              </label>\n              <textarea\n                id=\"reason\"\n                value={reason}\n                onChange={(e) => setReason(e.target.value)}\n                required\n                rows={3}\n                className=\"w-full px-3 py-2 border border-border rounded-md bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary text-sm resize-none\"\n                placeholder={tr(\n                  'billing.refunds.reasonPlaceholder',\n                  'Describe why you are requesting a refund...'\n                )}\n              />\n            </div>\n\n            <div className=\"flex items-center gap-3 pt-1\">\n              <button\n                type=\"submit\"\n                disabled={isSubmitting || !lookedUpTxn || !reason.trim() || !amount}\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 disabled:cursor-not-allowed\"\n              >\n                {isSubmitting\n                  ? tr('billing.refunds.submitting', 'Submitting...')\n                  : tr('billing.refunds.submitRequest', 'Submit Request')}\n              </button>\n              <button\n                type=\"button\"\n                onClick={resetForm}\n                className=\"px-4 py-2 text-sm border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n              >\n                {tr('billing.common.cancel', 'Cancel')}\n              </button>\n            </div>\n          </form>\n        </div>\n      )}\n\n      {/* Refund history */}\n      <div className=\"border border-border rounded-lg bg-card overflow-hidden\">\n        <div className=\"p-4 border-b border-border bg-muted/30\">\n          <h2 className=\"font-semibold text-foreground\">\n            {tr('billing.refunds.history', 'Refund History')}\n          </h2>\n        </div>\n\n        {accountsLoading || refundsLoading ? (\n          <div className=\"p-8 flex items-center justify-center\">\n            <Loader2 className=\"size-5 animate-spin text-muted-foreground\" />\n          </div>\n        ) : refunds.length === 0 ? (\n          <div className=\"p-10 flex flex-col items-center text-center gap-3\">\n            <RotateCcw className=\"size-8 text-muted-foreground\" />\n            <p className=\"text-sm font-medium text-foreground\">\n              {tr('billing.refunds.noRefunds', 'No refund requests yet')}\n            </p>\n            <p className=\"text-xs text-muted-foreground max-w-sm\">\n              {tr(\n                'billing.refunds.noRefundsHint',\n                'If you have an issue with a payment, click \"Request Refund\" to get started.'\n              )}\n            </p>\n          </div>\n        ) : (\n          <ul className=\"divide-y divide-border\">\n            {refunds.map((r: RefundItem) => (\n              <li\n                key={r.id}\n                className=\"flex items-start gap-4 p-4 hover:bg-muted/30 transition-colors\"\n              >\n                <div className=\"flex-1 min-w-0\">\n                  <div className=\"flex items-center gap-2 flex-wrap\">\n                    <span className=\"text-sm font-medium text-foreground\">\n                      {formatCurrency(r.amount, r.currency)}\n                    </span>\n                    <StatusBadge status={r.status} />\n                    {r.purchaseDetail && (\n                      <span className=\"text-xs text-muted-foreground truncate\">\n                        {r.purchaseDetail}\n                      </span>\n                    )}\n                  </div>\n                  {r.reason && (\n                    <p className=\"text-xs text-muted-foreground mt-1 line-clamp-2\">{r.reason}</p>\n                  )}\n                  {r.errorMessage && r.status === RefundRecordStatus.Failed && (\n                    <p className=\"text-xs text-status-error-text mt-1\">{r.errorMessage}</p>\n                  )}\n                </div>\n                <div className=\"text-right shrink-0\">\n                  <p className=\"text-xs text-muted-foreground\">{formatDateTime(r.createdAt)}</p>\n                  {r.processedAt && (\n                    <p className=\"text-xs text-muted-foreground mt-0.5\">\n                      Processed {formatDateTime(r.processedAt)}\n                    </p>\n                  )}\n                </div>\n              </li>\n            ))}\n          </ul>\n        )}\n      </div>\n\n      <p className=\"text-xs text-muted-foreground\">\n        {tr(\n          'billing.refunds.footer',\n          'Refund requests are reviewed by our team within 3–5 business days. For urgent issues, contact support.'\n        )}{' '}\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/transactions/' + selectedAccountId)}\n          className=\"underline hover:no-underline\"\n        >\n          {tr('billing.refunds.viewTransactions', 'View all transactions')}\n        </button>\n      </p>\n    </div>\n  );\n};\n"],"mappings":"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"}

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

@@ -3,3 +3,4 @@ import "./InvoiceDetailPage.js";
 import "./TransactionsPage.js";
 import "./PaymentMethodsPage.js";
 import "./RefundsPage.js";
+import "./UserRefundsPage.js";