import React from 'react'; import { describe, expect, it, vi } from 'vitest'; import { fireEvent, render, screen, waitFor } from '@testing-library/react'; const navigateMock = vi.fn(); const tMock = ( _key: string, fallback?: string | Record, options?: Record, ) => { let value = typeof fallback === 'string' ? fallback : _key; if (options) { Object.entries(options).forEach(([key, val]) => { value = value.replaceAll(`{{${key}}}`, String(val)); }); } return value; }; const downloadReceiptMock = vi.fn().mockResolvedValue(new Blob(['pdf'], { type: 'application/pdf' })); const triggerDownloadMock = vi.fn(); vi.mock('react-router-dom', () => ({ useNavigate: () => navigateMock, useLocation: () => ({ pathname: '/mobile/billing', search: '', hash: '' }), })); vi.mock('react-i18next', () => ({ useTranslation: () => ({ t: tMock }), initReactI18next: { type: '3rdParty', init: () => undefined, }, })); vi.mock('lucide-react', () => ({ ChevronDown: () => , ChevronUp: () => , Package: () => , Receipt: () => , RefreshCcw: () => , Sparkles: () => , })); vi.mock('react-hot-toast', () => { const toast = Object.assign(vi.fn(), { success: vi.fn(), error: vi.fn(), }); return { default: toast }; }); vi.mock('../hooks/useBackNavigation', () => ({ useBackNavigation: () => vi.fn(), })); vi.mock('../theme', () => ({ useAdminTheme: () => ({ textStrong: '#111827', text: '#111827', muted: '#6b7280', subtle: '#9ca3af', danger: '#b91c1c', border: '#e5e7eb', primary: '#2563eb', accentSoft: '#eef2ff', }), })); vi.mock('../components/MobileShell', () => ({ MobileShell: ({ children }: { children: React.ReactNode }) =>
{children}
, HeaderActionButton: ({ children }: { children: React.ReactNode }) =>
{children}
, })); vi.mock('../components/Primitives', () => ({ MobileCard: ({ children }: { children: React.ReactNode }) =>
{children}
, CTAButton: ({ label, onPress }: { label: string; onPress?: () => void }) => ( ), PillBadge: ({ children }: { children: React.ReactNode }) => {children}, })); vi.mock('../components/ContextHelpLink', () => ({ ContextHelpLink: () =>
, })); vi.mock('@tamagui/stacks', () => ({ YStack: ({ children }: { children: React.ReactNode }) =>
{children}
, XStack: ({ children }: { children: React.ReactNode }) =>
{children}
, })); vi.mock('@tamagui/text', () => ({ SizableText: ({ children }: { children: React.ReactNode }) => {children}, })); vi.mock('@tamagui/react-native-web-lite', () => ({ Pressable: ({ children, onPress, }: { children: React.ReactNode; onPress?: () => void; }) => ( ), })); vi.mock('../../lib/apiError', () => ({ getApiErrorMessage: (_err: unknown, fallback: string) => fallback, })); vi.mock('../../constants', () => ({ ADMIN_EVENT_VIEW_PATH: (slug: string) => `/mobile/events/${slug}`, adminPath: (path: string) => path, })); vi.mock('../billingUsage', () => ({ buildPackageUsageMetrics: () => [], formatPackageEventAllowance: () => '—', getUsageState: () => 'ok', usagePercent: () => 0, })); vi.mock('../lib/packageSummary', () => ({ collectPackageFeatures: () => [], formatEventUsage: () => '', getPackageFeatureLabel: () => '', getPackageLimitEntries: () => [], resolveTenantWatermarkFeatureKey: () => '', })); vi.mock('../lib/billingCheckout', () => ({ loadPendingCheckout: () => null, shouldClearPendingCheckout: () => false, storePendingCheckout: vi.fn(), })); vi.mock('../invite-layout/export-utils', () => ({ triggerDownloadFromBlob: (...args: unknown[]) => triggerDownloadMock(...args), })); vi.mock('../../api', () => ({ getTenantPackagesOverview: vi.fn().mockResolvedValue({ packages: [], activePackage: null }), getTenantBillingTransactions: vi.fn().mockResolvedValue({ data: [ { id: 1, status: 'completed', amount: 49, currency: 'EUR', provider: 'paypal', provider_id: 'ORDER-1', package_name: 'Starter', purchased_at: '2024-01-01T00:00:00Z', receipt_url: '/api/v1/billing/transactions/1/receipt', }, ], }), getTenantAddonHistory: vi.fn().mockResolvedValue({ data: [] }), getTenantPackageCheckoutStatus: vi.fn(), downloadTenantBillingReceipt: (...args: unknown[]) => downloadReceiptMock(...args), })); import MobileBillingPage from '../BillingPage'; import * as api from '../../api'; describe('MobileBillingPage', () => { it('shows linked event information for a package', async () => { vi.mocked(api.getTenantPackagesOverview).mockResolvedValueOnce({ activePackage: { id: 11, package_id: 501, package_name: 'Pro Paket', package_type: 'reseller', included_package_slug: 'pro', active: true, used_events: 2, remaining_events: 1, price: 49, currency: 'EUR', purchased_at: '2024-01-01T00:00:00Z', expires_at: null, package_limits: {}, linked_events_count: 2, current_event: { id: 77, slug: 'sommerfest', name: { de: 'Sommerfest' }, status: 'published', event_date: '2024-08-15T00:00:00Z', linked_at: '2024-08-01T00:00:00Z', }, }, packages: [], }); render(); await screen.findByText('Aktuell genutzt für'); expect(screen.getByText('Sommerfest')).toBeInTheDocument(); expect(screen.getByText('2 verknüpfte Events')).toBeInTheDocument(); }); it('shows only recent package history and can expand the rest', async () => { vi.mocked(api.getTenantPackagesOverview).mockResolvedValueOnce({ activePackage: { id: 1, package_id: 100, package_name: 'Aktives Paket', package_type: 'reseller', included_package_slug: 'standard', active: true, used_events: 0, remaining_events: 1, price: 29, currency: 'EUR', purchased_at: '2024-01-01T00:00:00Z', expires_at: null, package_limits: {}, }, packages: [ { id: 1, package_id: 100, package_name: 'Aktives Paket', package_type: 'reseller', included_package_slug: 'standard', active: true, used_events: 0, remaining_events: 1, price: 29, currency: 'EUR', purchased_at: '2024-01-01T00:00:00Z', expires_at: null, package_limits: {}, }, { id: 2, package_id: 101, package_name: 'Historie 1', package_type: 'reseller', included_package_slug: 'standard', active: false, used_events: 1, remaining_events: 0, price: 29, currency: 'EUR', purchased_at: '2023-12-01T00:00:00Z', expires_at: null, package_limits: {}, }, { id: 3, package_id: 102, package_name: 'Historie 2', package_type: 'reseller', included_package_slug: 'standard', active: false, used_events: 1, remaining_events: 0, price: 29, currency: 'EUR', purchased_at: '2023-11-01T00:00:00Z', expires_at: null, package_limits: {}, }, { id: 4, package_id: 103, package_name: 'Historie 3', package_type: 'reseller', included_package_slug: 'standard', active: false, used_events: 1, remaining_events: 0, price: 29, currency: 'EUR', purchased_at: '2023-10-01T00:00:00Z', expires_at: null, package_limits: {}, }, { id: 5, package_id: 104, package_name: 'Historie 4', package_type: 'reseller', included_package_slug: 'standard', active: false, used_events: 1, remaining_events: 0, price: 29, currency: 'EUR', purchased_at: '2023-09-01T00:00:00Z', expires_at: null, package_limits: {}, }, ], }); render(); await screen.findByText('Aktives Paket'); expect(screen.getByText('Historie 1')).toBeInTheDocument(); expect(screen.getByText('Historie 2')).toBeInTheDocument(); expect(screen.getByText('Historie 3')).toBeInTheDocument(); expect(screen.queryByText('Historie 4')).not.toBeInTheDocument(); fireEvent.click(screen.getByText('Verlauf anzeigen (1)')); expect(await screen.findByText('Historie 4')).toBeInTheDocument(); expect(screen.getByText('Verlauf ausblenden')).toBeInTheDocument(); }); it('downloads receipts via the API helper', async () => { render(); const receiptLink = await screen.findByText('Beleg'); fireEvent.click(receiptLink); await waitFor(() => { expect(downloadReceiptMock).toHaveBeenCalledWith('/api/v1/billing/transactions/1/receipt'); expect(triggerDownloadMock).toHaveBeenCalled(); }); }); });