Skip to content
This repository was archived by the owner on Nov 23, 2025. It is now read-only.

Dev#11

Merged
RandithaK merged 12 commits into
mainfrom
dev
Nov 5, 2025
Merged

Dev#11
RandithaK merged 12 commits into
mainfrom
dev

Conversation

@RandithaK

@RandithaK RandithaK commented Nov 5, 2025

Copy link
Copy Markdown
Member

Summary by CodeRabbit

  • New Features

    • Vehicle management system: add, edit, delete, and view vehicle details
    • Multi-file photo upload with validation and real-time feedback
    • Service history display for vehicles
    • Payment gateway integration
    • Enhanced dashboard with quick action navigation tiles
  • Documentation

    • Added vehicle management frontend implementation guide
  • Chores

    • Added Git configuration for line ending normalization and binary file handling

Akith-002 and others added 12 commits October 17, 2025 13:37
- Add PaymentInitiationRequest and PaymentInitiationResponse interfaces
- Implement initiatePayment API call
- Add payment history and details methods
- Include sandbox flag in response interface
- Create PayHereService class for SDK management
- Implement dynamic PayHere script loading
- Add TypeScript definitions for PayHere SDK
- Support sandbox and live modes
- Handle payment callbacks (success, error, cancel)
- Add proper type definitions for payment data and results
- Create reusable PaymentGateway component with payment summary
- Display item description, amount, and customer details
- Add payment button with loading and success states
- Show error and success messages
- Integrate with payhereService and paymentService
- Include proper TypeScript types and props
- Create payment gateway page at /payment-gateway route
- Handle payment status from URL query params (success/cancel)
- Display status-specific UI feedback
- Integrate PaymentGateway component with hardcoded test data
- Show success and cancellation messages
feat: implement vehicle management features including add, edit, and …
@coderabbitai

coderabbitai Bot commented Nov 5, 2025

Copy link
Copy Markdown

Caution

Review failed

The pull request is closed.

Walkthrough

Vehicle management feature implementation adding TypeScript React components for add/edit/view vehicles, vehicle service API wrapper, PayHere payment gateway integration, photo upload functionality, service history display, and .gitattributes configuration for text/binary handling across the projects.

Changes

Cohort / File(s) Summary
Configuration
\.gitattributes
Added LF end-of-line normalization for TypeScript, JavaScript, Markdown, JSON, CSS, SCSS, HTML, SH, YAML, and Go files; CRLF for batch files; binary treatment for images, PDFs, archives; separate sections for Frontend_Web and API_Gateway projects.
Documentation
VEHICLE_MANAGEMENT_FRONTEND\.md
Comprehensive implementation summary documenting tech stack (Next.js 14, TypeScript, Tailwind CSS), UI components, pages, API service, user-facing features (add, list, view, edit, delete vehicles), photo upload, service history, technical details, and navigation flows.
Vehicle Management Components
src/app/components/AddVehicleForm\.tsx, src/app/components/EditVehicleForm\.tsx, src/app/components/VehicleCard\.tsx
New React components for vehicle form submission (add and edit workflows), vehicle card display with actions, form validation, error handling, and loading states.
Vehicle Pages
src/app/dashboard/vehicles/page\.tsx, src/app/dashboard/vehicles/\[vehicleId\]/page\.tsx
New page components rendering vehicle list with add/edit modals and empty state; vehicle details view with photo gallery, upload feature, service history, and metadata card.
Vehicle Service
src/services/vehicleService\.ts
API wrapper service exposing methods for vehicle lifecycle operations (register, list, fetch, update, delete) and photo/history endpoints; uses FormData for multi-file uploads.
Payment Components
src/app/components/PaymentGateway\.tsx, src/app/payment-gateway/page\.tsx
New payment gateway component managing payment flow with PayHere integration; page component wrapping gateway with state handling (success/cancel/pending states) and navigation.
Payment Services
src/services/paymentService\.ts, src/services/payhereService\.ts
Payment initiation service wrapping backend API endpoints; PayHere SDK integration module with script loading, payment construction, and callback handling.
Dashboard Update
src/app/components/dashboards/CustomerDashboard\.tsx
Refactored dashboard replacing static content with new sections (My Vehicles, Appointments, Service History) and Quick Actions grid with SVG icons; updated navigation to vehicle and appointment pages.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant VehicleUI as Vehicles Page
    participant VehicleService
    participant API
    participant Response

    User->>VehicleUI: Click "Add Vehicle" / Edit
    VehicleUI->>VehicleUI: Show Modal Form
    User->>VehicleUI: Submit Form
    
    alt Add Vehicle
        VehicleUI->>VehicleService: registerVehicle(data)
    else Edit Vehicle
        VehicleUI->>VehicleService: updateVehicle(id, data)
    else Delete Vehicle
        VehicleUI->>VehicleService: deleteVehicle(id)
    end
    
    VehicleService->>API: POST/PUT/DELETE /vehicles/...
    API-->>VehicleService: Response
    VehicleService-->>VehicleUI: Success/Error
    
    alt Success
        VehicleUI->>VehicleUI: Refresh List
        VehicleUI->>VehicleService: getMyVehicles()
        VehicleService->>API: GET /vehicles
        API-->>VehicleService: Vehicle List
        VehicleService-->>VehicleUI: VehicleListItem[]
        VehicleUI->>VehicleUI: Close Modal & Render Grid
    else Error
        VehicleUI->>VehicleUI: Display Error Message
    end
Loading
sequenceDiagram
    participant User
    participant PaymentUI as Payment Gateway
    participant PaymentService
    participant Backend
    participant PayHereSDK as PayHere SDK
    
    User->>PaymentUI: Initiate Payment
    PaymentUI->>PaymentService: initiatePayment(amount, customer)
    PaymentService->>Backend: POST /payments/initiate
    Backend-->>PaymentService: PaymentInitiationResponse<br/>(hash, details)
    PaymentService-->>PaymentUI: Response
    
    PaymentUI->>PayHereSDK: startPayment(paymentData)
    activate PayHereSDK
    PayHereSDK->>User: Show PayHere Modal
    
    alt Payment Successful
        User->>PayHereSDK: Complete Payment
        PayHereSDK-->>PaymentUI: onSuccess(result)
        PaymentUI->>PaymentUI: Show Success Screen
    else Payment Cancelled
        User->>PayHereSDK: Cancel
        PayHereSDK-->>PaymentUI: onCancel()
        PaymentUI->>PaymentUI: Show Cancel Screen
    else Payment Error
        PayHereSDK-->>PaymentUI: onError(errorMsg)
        PaymentUI->>PaymentUI: Show Error Banner
    end
    deactivate PayHereSDK
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

  • Vehicle Service & Components: Review form validation logic, error handling patterns in AddVehicleForm and EditVehicleForm for consistency; verify photo upload FormData construction and file handling constraints (10MB limit enforcement missing from implementation).
  • Payment Integration: Scrutinize payhereService SDK loading, callback binding, and error handling; confirm payment flow state management in PaymentGateway and callback invocation sequence; validate PaymentInitiationRequest/Response contracts align with backend expectations.
  • API Interactions: Verify vehicleService and paymentService methods match backend endpoints and response shapes; confirm JWT interceptor is properly applied via apiClient.
  • State Management: Review modal/loading state handling in VehiclesPage, photo upload state in vehicle details page, and payment status state in PaymentGatewayPage for consistency.

Possibly related PRs

Poem

🐰 A rabbit hops through vehicles anew,
Photos and forms and payments too,
PayHere's secure, the dashboard gleams,
Modal dreams and service streams,
Hop-hop, the fleet now flows with ease! 🚗✨

✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch dev

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 15f4d28 and 4e96ce1.

📒 Files selected for processing (13)
  • .gitattributes (1 hunks)
  • VEHICLE_MANAGEMENT_FRONTEND.md (1 hunks)
  • src/app/components/AddVehicleForm.tsx (1 hunks)
  • src/app/components/EditVehicleForm.tsx (1 hunks)
  • src/app/components/PaymentGateway.tsx (1 hunks)
  • src/app/components/VehicleCard.tsx (1 hunks)
  • src/app/components/dashboards/CustomerDashboard.tsx (3 hunks)
  • src/app/dashboard/vehicles/[vehicleId]/page.tsx (1 hunks)
  • src/app/dashboard/vehicles/page.tsx (1 hunks)
  • src/app/payment-gateway/page.tsx (1 hunks)
  • src/services/payhereService.ts (1 hunks)
  • src/services/paymentService.ts (1 hunks)
  • src/services/vehicleService.ts (1 hunks)

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@RandithaK
RandithaK merged commit a0ed501 into main Nov 5, 2025
0 of 3 checks passed
@coderabbitai coderabbitai Bot mentioned this pull request Nov 11, 2025
Merged
@coderabbitai coderabbitai Bot mentioned this pull request Nov 23, 2025
Merged
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants