Back to Projects

The Wild Oasis

A hotel operations dashboard for managing cabins, bookings, guests, check-ins, and daily business activity from one place.

Overview

The Wild Oasis is a hotel operations dashboard designed for staff to manage daily business activities efficiently from a single interface. It provides a centralized system for handling cabins, bookings, guests, check-ins, check-outs, and account settings. The application is built with React 19, TypeScript, and Vite, using Supabase as the backend service for authentication and data management. It features secure authentication with protected routes, a dashboard with business metrics and charts, and full CRUD functionality for cabins and bookings. The system also includes guest management workflows, real-time booking operations, and customizable account settings with dark mode support. The project is structured using a feature-based architecture, separating domain logic, UI components, services, hooks, and context providers to ensure scalability and maintainability.

Challenges & Solutions

Designing a feature-based architecture that keeps complex domains like bookings, cabins, and guests isolated yet reusable.Managing authentication and route protection securely using Supabase while maintaining a smooth user experience.Handling synchronized state between React Query cache and Supabase backend without data inconsistencies.Building a clean and scalable UI system for dashboards, tables, and forms with reusable components.Implementing real-time-like updates for bookings and check-in/check-out workflows while preserving performance.

Tech Stack

React 19TypeScriptViteTanStack React QuerySupabasestyled-componentsReact Hook FormReact RouterRechartsStyledComponents