[{"data":1,"prerenderedAt":36},["ShallowReactive",2],{"craft-dinetap-backoffice":3},{"id":4,"slug":5,"sourceId":5,"title":6,"subtitle":7,"description":8,"github":9,"technologies":10,"features":22,"lastModified":29,"imagesPath":30,"imagesFolder":31,"imagesCount":32,"images":33,"imageType":34,"note":34,"showLinks":9,"githubLabel":35,"links":34,"previewSource":34,"previewMediaType":34},1,"dinetap-backoffice","Dinetap Backoffice","Multi-tenant F&B merchant management platform operating across Singapore and Australia.","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.","https:\u002F\u002Fdinetap.com\u002Fback-office",[11,12,13,14,15,16,17,18,19,20,21],"React","TypeScript","TanStack Router","TanStack Query","Zustand","Zod","Vite","Tailwind CSS","Playwright","Vitest","Supabase",[23,24,25,26,27,28],"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.","2026-06-06","\u002Fimages\u002Fprojects-overview\u002F","\u002Fimages\u002Fprojects\u002Fdinetap-backoffice\u002F",0,[],null,"View Product",1783149732108]