Learning & Training sessions

build an UI interface
attend training class
visit the maqam.com site

studying project flow

visited and navigated the site, performed hotel searches, checked availability with criteria and understood booking flow with hotel management modules,
attended product training class.

Test Case-wise checking

Test Case-wise checking -Customer Details Page/Payment Page/Gateway Page/Ticket/My Booking & My Profile

Project building - Started working on the maqaam site, Completed the first page design,and added basic functionalities

project building- implemented one-way search functionality

Implemented complete round-trip flight search functionality with proper validations and API integration

Build Multicity Flight Search UI- Features include autocomplete airport search, date validation, passenger and class selection

Implemented Search Button & API Integration for GetSearchID and Search

Result-data API calling, error fixing

Result API connected successfully
Attended product training class

Studied how data binding works on the Flight Result Page.
Started working on the Result Panel UI.

Accepts flight data | Flight Details Rendering: Airline name, Flight codes, Departure & arrival times/airports.

Implemented improved flight search results fetching with polling, loading progress, error handling, Grouped flight trips by total fare to organize results.

Implement sorting bar UI and Logic for flight result- sortbyPrice|sortbyDuration|getbestFlight

Applied onward and return stop filters
Added collapsible behavior for: Stops | FareType |Price

Implemented multi-select checkboxes for fare types-refundable | non-refundable | refundable-with-charge.
Initialized min, max, and selected price ranges based on available flight prices.

Layover Filter panel
-implemented dynamic filtering for flight layover based on time duration -onward/return
-Added toggle functionality -onward/return

ModifySearch Component
- Added tabs for One Way, Round Trip, and Multi City flight modes with corresponding components.
- airport data fetching to enrich journey information with airport names| error occured
- dynamically parses URL parameters to initialize search journeys and passenger details.

Flight Search – Modify OneWay
Introduced controlled state variables adults, children, infants /Applied validation rules/
Journey Data Pre-Fill from Props/Implemented airport autocomplete using backend API/
Search Trigger Logic

Modify Round Trip Flight Search
-implemented round trip form for the components
-Airport autocomplete | Date pickers for departure and return date
-Passenger selector | Cabin class dropdown.

Modify - Multicity Flight Search
-Enabled adding/removing journey segments with min journey count.
-Added validation logic for traveller counts |city autocomplete API calls with data fetching

Multicity flight search update
Added click-outside detection to close dropdowns;|on city selection,
updated inputs and auto-filled next segment’s -from with previous -to
Applied inline styles and hover effects to suggestions

Flight Details
-Fetch flight data and Ancillary data
-track flight trip key and fare key

Done Flight Details -itinerary | baggage | fare rule sections

More + Modal Search Component
Implemented component(More) to fetch and display additional ancillary flight data using API calls
-added proper authorization headers
-extracting journey details - departure and arrival cities, flight durations, formatted dates.
-added modal component to show flight ancillary details

Implemented dynamic rendering of trip headers
-Updated branded fare section
-Displayed baggage, meals, and cabin details dynamically using data from ancillaries
-Linked booking button.

-Calling multiple APIs (Detail, Ancillaries, GetPax, GetPayment)
-Fetches and stores all essential booking data

Pax Details /Review Your Flight
-Integrated Redux state via useSelector to access flight-related data (flight, farekey, flighttripkey, ancillariesData, paxDetails, paymentGateways).
-Dispatched setFlightData action in useEffect to update Redux store
-Rendered flight itinerary details including multiple flight legs

Pax Details
- Nationality & Country Data Integration
- Passenger Form State & Validation
- Stored and updated passengerForm, selectedPaidBaggage, and selectedPaidMeal(error)

Fare Details & Payment Integration
-Integrated PayNow component into FareDetails.
-Added validation for passenger details before initiating payment.
-Implemented terms & conditions checkbox to control access to the payment flow.
-Add Baggage Component-done
-Add Meals Component-done

-Implemented passenger details validation on Pay now.
-Fetched passenger data from sessionStorage for validation.
-Displayed a modal popup with a clear message if any required fields are missing.
-Disabled payment process until all mandatory fields are correctly filled.

- Added handlePayNow to: Retrieve passenger data from session storage / Validate passenger form / Submit passenger details to backend API / Handle success/failure responses.
- Added handlePreBooking to: Use selected payment gateway info from local storage / Call PreBooking API to validate booking conditions / Update booking flags and show modal if there are fare/class/schedule changes or unavailability / Navigate to failure page on booking failure.

Flight Booking & Payment Integration
-Implemented handleDoBooking function to Call DoBooking API and retrieve booking details.
-Implemented handleDoPayment function to Call DoPayment API using saved ProcessAction.
-Redirect to payment URL for other gateways.

-Implemented payment verification and ticket polling logic in PaymentHandler component.
-Handled successful payment response and started ticket issuance flow.

-Displayed flight booking details dynamically using the API response.
-Added logic to generate tickets dynamically per passenger based on TicketDetails.
-Debugged data binding issues to ensure ticket and passenger details render correctly.
-Ticketed Successfully

Node(Server)
-Initialized Node.js server with Express.
-Set up CORS to allow frontend communication.
-Implemented session management using express-session.
-Created test API endpoints: GET /-test server running, /GET /api/session-token - check session token/Configured JSON request parsing and cookie options for session.
-Implement /api/token route to generate and store access token in session.

- PostgreSQL (CREATE , DELETE , ADD , INSERT)

Studied - PostgreSQL / Node