import { useState } from 'react'; import { capturePosPayment, loadDashboard, type CapturePosPaymentRequest, type CapturePosPaymentResponse, type PosTransactionSummaryResponse } from './api/dashboardApi'; import { SessionProvider, useSessionContext } from './auth/sessionContext'; import type { IdentityProvider } from './api/sessionApi'; type RouteKey = 'overview' | 'actions'; function App() { return ( ); } function PosTransactionsShell() { const session = useSessionContext(); const [route, setRoute] = useState('overview'); const [contextId, setContextId] = useState('demo-context'); const [summaryPayload, setSummaryPayload] = useState(null); const [paymentRequest, setPaymentRequest] = useState({ contextId: 'demo-context', transactionId: 'POS-9001', amount: 25.5, currency: 'USD', paymentMethod: 'card' }); const [paymentResponse, setPaymentResponse] = useState(null); const [error, setError] = useState(null); const [loading, setLoading] = useState(false); const loadSummary = async () => { setLoading(true); setError(null); try { const payload = await loadDashboard(contextId); setSummaryPayload(payload); setPaymentRequest((previous) => ({ ...previous, contextId })); } catch (err) { setError(err instanceof Error ? err.message : 'Failed to load transaction summary.'); } finally { setLoading(false); } }; const capturePayment = async () => { setLoading(true); setError(null); try { const payload = await capturePosPayment(paymentRequest); setPaymentResponse(payload); } catch (err) { setError(err instanceof Error ? err.message : 'Failed to capture payment.'); } finally { setLoading(false); } }; if (session.status === 'loading') { return (

POS Transactions Web

Restoring session...

); } if (session.status !== 'authenticated' || !session.profile) { return (

POS Transactions Web

Sign in with Thalos to access protected routes.

{session.error &&
{session.error}
}
); } return (

POS Transactions Web

Transaction summary and payment capture MVP workflows.

subject: {session.profile.subjectId} tenant: {session.profile.tenantId} provider: {providerLabel(session.profile.provider)}
{session.error &&
{session.error}
} {error &&
{error}
} {route === 'overview' && (
{JSON.stringify(summaryPayload, null, 2)}
)} {route === 'actions' && (
{JSON.stringify(paymentResponse, null, 2)}
)}
); } function LoginCard() { const session = useSessionContext(); const [subjectId, setSubjectId] = useState('demo-user'); const [tenantId, setTenantId] = useState('demo-tenant'); const [provider, setProvider] = useState(0); const [externalToken, setExternalToken] = useState(''); const [error, setError] = useState(null); const [submitting, setSubmitting] = useState(false); const onSubmit = async () => { setSubmitting(true); setError(null); try { await session.login({ subjectId, tenantId, provider, externalToken }); } catch (err) { setError(err instanceof Error ? err.message : 'Login failed.'); } finally { setSubmitting(false); } }; return (
{error &&
{error}
}
); } function providerLabel(provider: IdentityProvider): string { if (provider === 0 || provider === '0' || provider === 'InternalJwt') { return 'Internal JWT'; } if (provider === 1 || provider === '1' || provider === 'AzureAd') { return 'Azure AD'; } if (provider === 2 || provider === '2' || provider === 'Google') { return 'Google'; } return String(provider); } export default App;