#Resolved issues 17 and 18

[Soumashree-Das]

◻️







Pull Request Summary
Fixes:

Resolves Issue #17: Improve client-side form validation in

Resolves Issue #18: Complete and integrate the feature with full backend support and role-based access control

🧩 Description
🛠️ Issue #17: Improve HotelReg Form Validation (Frontend Only)
The component previously relied on basic HTML validation attributes, resulting in a minimal and inconsistent user experience. To enhance usability and guide users more effectively, I implemented a robust real-time validation system with the following features:

✅ Enhancements:
Real-time validation using onChange handlers for each form field.

Component-level state to manage form inputs and validation errors.

Clear inline error messages for each field (e.g., "Hotel name cannot be empty").

Submit button disabled until all validations pass.

Fully frontend enhancement, independent of backend logic.

🧱 Issue #18: Complete Hotel Registration Feature (Frontend + Backend Integration)
The component was previously inactive and lacked backend integration. This PR completes the feature by implementing:

🧑‍💻 Backend:
Created a Hotel model (hotel.js) using Mongoose.

Added a protected API route (POST /api/hotels/register) accessible only to authenticated users with the hotelOwner role.

Implemented the route controller to save hotel details submitted from the frontend.

🎯 Frontend:
Activated the component.

Wired up form submission using axios to send authenticated POST requests to the /api/hotels/register endpoint.

Added loading and error handling states with feedback to users.

Displayed success and error messages using a toast notification system.

🔐 Authentication & Role-Based Access:
Integrated Clerk authentication with separate Sign In (/sign-in) and Sign Up (/sign-up) pages.

After signing up, users are redirected to a role selection page (/select-role), where their selected role is stored in Clerk's metadata.

Implemented role-based access control:

If the user's role is "hotelOwner", they are granted access to /hotel-reg.

Otherwise, they see an Unauthorized component.

🚀 Additional Features
Added “Register Hotel” button to the Owner Dashboard (/owner) to open the modal.

Improved route structure and protected frontend routes based on user roles.

Ensured a seamless user experience from signup to hotel registration.

🧪 Testing
✅ Tested form validation with various input combinations.

✅ Verified protected route only allows hotelOwner role.

✅ Checked database entries after successful form submissions.

✅ Verified redirection and role assignment flows using Clerk.

[vercel]

Someone is attempting to deploy a commit to the Manish's projects Team on Vercel.

A member of the Team first needs to authorize it.