Dinetap Backoffice
Multi-tenant F&B merchant management platform operating across Singapore and Australia.
- React
- TypeScript
- TanStack Router
- TanStack Query
- Zustand
- Zod
- Vite
- Tailwind CSS
- Playwright
- Vitest
- Supabase
Multi-tenant restaurant merchant platform operating across Singapore and Australia. I architected the complete frontend: feature module structure, technology stack selection, TanStack-based routing and server state, multi-tenant auth system, and payment-provider-driven access control - used across 13 domain modules by the team.
Highlights
- Designed the complete frontend architecture: feature-sliced module structure across 13 domain modules (auth, payments, menu, employees, reports, payouts, and more), component boundaries, naming conventions, and code review standards adopted by the team.
- Chose and integrated the full TanStack stack: file-based TanStack Router with type-safe params and automatic per-route code-splitting, TanStack Query with per-query staleTime and retry strategy for consistent server state behavior.
- Built the multi-tenant authentication system using Supabase JWT - silent token refresh with throttle protection, cross-tab logout synchronization, and per-restaurant context persisted via Zustand.
- Implemented a route-level feature access system: guards keyed on payment provider (Stripe vs Adyen), payment types, and country - controls merchant-visible routes without centralized middleware.
- Integrated internal design system and DTO libraries, and defined the typed API contract pattern used across all feature modules.
- Set up E2E testing with Playwright (authenticated and unauthenticated project configurations) and component and unit coverage with Vitest.
Last updated: 2026-06-06