{"id":30112522,"url":"https://github.com/debrajhyper/hotel-listing-application","last_synced_at":"2025-08-10T06:47:14.785Z","repository":{"id":305664104,"uuid":"1022986738","full_name":"debrajhyper/Hotel-Listing-Application","owner":"debrajhyper","description":null,"archived":false,"fork":false,"pushed_at":"2025-07-21T10:00:56.000Z","size":557,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-07-21T12:07:58.122Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://hotel-listing-application.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/debrajhyper.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-20T09:29:27.000Z","updated_at":"2025-07-21T10:01:00.000Z","dependencies_parsed_at":"2025-07-21T12:18:42.701Z","dependency_job_id":null,"html_url":"https://github.com/debrajhyper/Hotel-Listing-Application","commit_stats":null,"previous_names":["debrajhyper/hotel-listing-application"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/debrajhyper/Hotel-Listing-Application","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/debrajhyper%2FHotel-Listing-Application","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/debrajhyper%2FHotel-Listing-Application/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/debrajhyper%2FHotel-Listing-Application/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/debrajhyper%2FHotel-Listing-Application/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/debrajhyper","download_url":"https://codeload.github.com/debrajhyper/Hotel-Listing-Application/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/debrajhyper%2FHotel-Listing-Application/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269688024,"owners_count":24459399,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-10T02:00:08.965Z","response_time":71,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-08-10T06:47:12.165Z","updated_at":"2025-08-10T06:47:14.717Z","avatar_url":"https://github.com/debrajhyper.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Hotel Listing App\n\n\u003e **🧪 Dummy Test Application Mode:**\n\u003e \n\u003e If API calls fail or you want to preview the UI without backend data, you can use the built-in dummy data:\n\u003e 1. Uncomment the `dummyHotels` export in `app/services/hotel-service.ts`.\n\u003e 2. In `app/components/hotels/hotel-list.tsx`, set:\n\u003e    ```js\n\u003e    import { dummyHotels } from '../../services/hotel-service';\n\u003e    // ...\n\u003e    const displayHotels = dummyHotels;\n\u003e    ```\n\u003e This allows you to explore all UI features, dialogs, and filtering with sample hotel data, even if the API is unavailable.\n\nA modern, feature-rich hotel search and listing application built with React, Redux Toolkit, and TypeScript.\n\n## 🚀 Features\n\n- **Hotel Search**: Search for hotels by destination, dates, rooms, adults, children, and more.\n- **Dynamic Filtering**: Filter hotels by price range, star rating, TripAdvisor rating, board types, and property name.\n- **Sorting**: Sort results by price (low to high, high to low).\n- **Debounced Search**: Destination search and price range filtering are debounced for optimal API usage and smooth UX.\n- **Responsive UI**: Fully responsive, mobile-friendly design with modern UI components.\n- **Hotel Details Dialog**: View detailed hotel info, image gallery, facilities, room types, rates, cancellation policies, contact info, and points of interest.\n- **State Persistence via Query Params**: All search/filter state is encoded in the URL, so users can share or reload and retain their search.\n- **Global State Management**: Uses Redux Toolkit for robust, scalable state management.\n- **Error Handling**: Graceful error messages and retry logic for failed API calls.\n- **Skeleton Loading**: Beautiful skeletons for loading states, matching the card layout.\n\n## 🏆 Core Advantages\n\n- **User Experience**: Fast, intuitive, and visually appealing interface.\n- **Shareable/Reloadable State**: All search/filter state is encoded in the URL, so users can share or reload and retain their search.\n- **Performance**: Debounced API calls and efficient state updates minimize unnecessary network requests and re-renders.\n- **Scalability**: Modular codebase with Redux Toolkit, hooks, and reusable UI components.\n- **Robustness**: Handles missing data, API errors, and edge cases gracefully.\n\n## 🔑 Technical Highlights\n\n### 1. **Debouncing**\n- Debounced destination search and price range filtering using a custom `useDebounce` hook.\n- Reduces API calls and improves user experience.\n\n### 2. **API Integration**\n- All hotel and destination data is fetched via API calls (with dummy data fallback for demo/testing).\n- API calls are triggered on search, filter, and sort changes, with proper error handling and loading states.\n\n### 3. **Redux Global Store**\n- All search, filter, and hotel data is managed in a global Redux store (Redux Toolkit).\n- Enables consistent state across components and easy debugging with Redux DevTools.\n\n### 4. **Query Params State Sync**\n- All search/filter state is encoded in the URL as query params.\n- On page load or retry, the app restores the Redux store from the query params, ensuring the UI is always in sync with the URL.\n- Enables deep linking, sharing, and reload persistence.\n\n### 5. **Filtering, Searching, Sorting**\n- **Filtering**: Price range, star rating, TripAdvisor rating, board types, property name, and more.\n- **Searching**: Destination search with debounced API calls and auto-complete.\n- **Sorting**: Sort by price (asc/desc) with a select dropdown.\n- **All filters and sorts are reflected in the URL and Redux store.**\n\n### 6. **Modern UI/UX**\n- Built with custom and third-party UI components (e.g., Carousel, Dialog, Skeleton, Select, Tooltip).\n- Responsive grid layouts, beautiful skeletons, and accessible forms.\n- Collapsible/expandable hotel descriptions for better readability.\n\n### 7. **Error Handling \u0026 Retry**\n- All API errors are caught and displayed with user-friendly messages.\n- Retry button restores state from query params and re-fetches data.\n\n## 📝 Usage Instructions\n\n1. **Install dependencies:**\n   ```bash\n   npm install\n   ```\n\n2. **Start the development server:**\n   ```bash\n   npm run dev\n   ```\n\n3. **Open the app:**\n   Visit [http://localhost:3000](http://localhost:3000) in your browser.\n\n4. **Search for hotels:**\n   - Enter a destination, dates, rooms, adults, and children.\n   - Use filters and sort options to refine your search.\n   - Click on a hotel card to view detailed information.\n\n5. **Share or reload:**\n   - Copy the URL to share your search with others.\n   - Reload the page to see your search restored from the URL.\n\n## 🧩 Project Structure\n\n- `app/components/` — UI and feature components (hotels, filters, cards, dialogs, etc.)\n- `app/store/` — Redux Toolkit slices, hooks, and store setup\n- `app/services/` — API service logic and dummy data\n- `app/utils/` — Utility functions (e.g., price min/max, debouncing)\n- `app/types/` — TypeScript types for hotels, search, etc.\n\n## 💡 Extending the App\n- Add more filters (amenities, location, etc.)\n- Integrate real hotel APIs\n- Add authentication and user accounts\n- Enhance accessibility and internationalization\n\n## 🤝 Contributing\nPull requests and suggestions are welcome! Please open an issue or PR for any improvements or bug fixes.\n\n---\n\n**Enjoy your stay with the Hotel Listing App!** 🏨✨\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdebrajhyper%2Fhotel-listing-application","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdebrajhyper%2Fhotel-listing-application","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdebrajhyper%2Fhotel-listing-application/lists"}