dncmaduro/dntt

Purpose and Runtime

This is a Next.js App Router application for internal payment-request management: employees submit requests and expense evidence, reviewers process them, and users can view payment QR information, notifications, and profiles. It runs as a TypeScript React application, with server-rendered routes, Route Handlers, and Server Actions.

Core entry and application boundaries:

• app/layout.tsx

• app/(protected)/layout.tsx

• proxy.ts

Routing, Access Control, and Shell

The route tree separates unauthenticated authentication screens from authenticated operational screens. The protected layout is the principal authorization/UI boundary and likely hosts the shared application shell; proxy.ts is the request-level middleware boundary for session refresh or route protection.

Primary route groups:

• app/(auth)/login/page.tsx

• app/(protected)/layout.tsx

• components/shared/app-shell.tsx

Authenticated users land in the protected dashboard and navigate to personal requests, reviewer request queues, expenses, notifications, profile maintenance, and payment-QR lookup.

Authentication and Identity

Authentication is implemented as a feature with server actions for login, password recovery/reset, and password changes. Session and authorization concerns are centralized under lib/auth, rather than embedded in individual pages. An auth confirmation route supports provider callback/token confirmation flows.

Key paths:

• features/auth/actions.ts

• lib/auth/session.ts

• lib/auth/permissions.ts

• app/auth/confirm/route.ts

Payment Request Lifecycle

features/payment-requests is the dominant business domain. It owns request schemas/types, read queries, write actions, and UI for request creation/editing, details, status timeline, review, deletion, attachments, bills, and QR proof uploads. Page routes act mainly as workflow entry points for an employee’s requests and a reviewer’s queue.

Main lifecycle surfaces:

• features/payment-requests/actions.ts

• features/payment-requests/queries.ts

• features/payment-requests/components/request-form.tsx

• app/(protected)/my-requests/[id]/page.tsx

• app/(protected)/requests/[id]/page.tsx

Control flow is: authenticated user → page/query loads request data → form or review component invokes server action → persistence/storage updates → status/detail/list views refresh. Employee-owned routes (my-requests) and organization review routes (requests) form an important permissions boundary.

Expenses, Documents, and Export

Expense reporting is derived from payment-request data. The application supports filtering request/expense lists, storing bill and QR artifacts, showing galleries, and producing a downloadable monthly export from an Excel template. The export Route Handler is a server-side delivery boundary.

Key paths:

• app/(protected)/expenses/export/route.ts

• features/payment-requests/expense-export.ts

• features/payment-requests/payment-bill-storage.ts

• features/payment-requests/templates/expense-monthly-export-template.xlsx

Supabase Data and External Integration

Supabase is the material backend integration, with separate browser, server, and proxy clients. Generated database types establish the application’s persistence contract. Supabase likely supplies authentication, relational data, and object storage used by payment evidence modules.

Backend integration paths:

• lib/supabase/browser.ts

• lib/supabase/server.ts

• lib/supabase/proxy.ts

• types/database.ts

An inbound webhook endpoint handles notification-email events, separating external delivery/integration traffic from interactive application routes:

• app/api/webhooks/notification-email/route.ts

Notifications and Payment QR

Notifications are a self-contained domain with queries, actions, service logic, provider state, and bell/list UI; it is surfaced globally and on its own protected page. Payment QR is a distinct lookup/selection workflow that loads unpaid requests, selects employee/request context, and renders QR-related payment information.

Key paths:

• features/notifications/service.ts

• features/notifications/components/notifications-provider.tsx

• features/payment-qr/queries.ts

• app/(protected)/payment-qr/page.tsx