Step 12 Base Price

Purpose (Product)

• Capture the property's pricing strategy with base price and weekend pricing to enable revenue optimization and channel distribution.

• Offer Smart Pricing service as an optional add-on that automatically adjusts prices based on demand, seasonality, and market conditions.

• Smart Pricing Mode: When enabled, users can set a price range (min-max) for dynamic pricing. When disabled, users set a single fixed price.

• Display property details and room cards for context while setting pricing.

---

UX Flow (What the user sees)

• Left side shows property title, description, and a 2-column grid of room cards with cover images, room type chips, and photo counts.

• Right side displays a large price card with current pricing, interactive slider, and Smart Pricing toggle.

• Single Price Mode (Smart Pricing disabled): Slider shows single value, price display shows "X GBP"

• Range Mode (Smart Pricing enabled): Slider shows min-max range, price display shows "X GBP - Y GBP"

• Price updates in real-time as user moves the slider. Smart Pricing toggle includes service cost (£X/month) and "Learn more" link.

![[Desktop 11.png]]

---

System Flow (How it works)

sequenceDiagram
    actor Landlord
    participant Frontend as Web App (Next.js)
    participant Backend as API (NestJS)
    participant DB as Database
    participant Service as Smart Pricing Service

    %% Load existing data
    Frontend->>Backend: GET /api/services/smart-pricing
    Backend-->>Frontend: Service details + pricing

    %% Price adjustment
    Landlord->>Frontend: Adjust price slider
    alt Smart Pricing enabled
        Frontend->>Frontend: Update minPrice/maxPrice range
    else Smart Pricing disabled
        Frontend->>Frontend: Update single price value
    end

    %% Smart Pricing toggle
    Landlord->>Frontend: Toggle Smart Pricing
    Frontend->>Frontend: Switch between single/range mode
    Frontend->>Frontend: Update slider behavior and display

    %% Submit pricing
    Landlord->>Frontend: Click "Next"
    Frontend->>Frontend: Validate form (basePrice >= 1, weekendBasePrice >= 1)

    alt Smart Pricing enabled
        Frontend->>Backend: POST /api/properties/{id}/cart { serviceId, quantity: 1 }
        Backend->>DB: Add service to property cart
        Frontend->>Backend: PATCH /api/properties/{id} { price: { basePrice, weekendBasePrice, minPrice, maxPrice, currency: "GBP" } }
    else Smart Pricing disabled
        Frontend->>Backend: DELETE /api/properties/{id}/cart { serviceId }
        Backend->>DB: Remove service from property cart
        Frontend->>Backend: PATCH /api/properties/{id} { price: { basePrice, weekendBasePrice, currency: "GBP" } }
    end

    Backend->>DB: Update properties.price fields
    Backend-->>Frontend: 200 OK (updated property)
    Frontend->>Frontend: Advance to next step

---

Data Touched

Properties table:

• price.basePrice (number, required, min: 1)

• price.weekendBasePrice (number, required, min: 1)

• price.currency (string, default: "GBP")

• price.minPrice (number, optional, Smart Pricing only)

• price.maxPrice (number, optional, Smart Pricing only)

Property Cart Items:

• serviceId (Smart Pricing service ID)

• quantity (number, default: 1)

Validation rules:

• Base price and weekend base price must be >= 1

• Smart Pricing requires min/max price range when enabled

• Currency defaults to GBP

---

APIs Called

GET /api/services/smart-pricing

• Method: GET

• Response: Service object with pricing details

• Used to display Smart Pricing cost and enable/disable toggle

POST /api/properties/{id}/cart

• Method: POST

• Payload: { serviceId: string, quantity: number }

• Response: Cart item created

• Used when enabling Smart Pricing

DELETE /api/properties/{id}/cart

• Method: DELETE

• Payload: { serviceId: string }

• Response: 204 No Content

• Used when disabling Smart Pricing

PATCH /api/properties/{id}

• Method: PATCH

• Payload: { price: { basePrice, weekendBasePrice, currency, minPrice?, maxPrice? } }

• Response: Updated property object

• Idempotent: Yes

• Retries: Standard axios retry logic

---

QA Checklist

Basic functionality:

• Price slider updates display in real-time

• Smart Pricing toggle shows/hides min-max range

• Form validation prevents submission with invalid prices

• Room cards display correctly with images and counts

Smart Pricing modes:

• Single Mode: Slider shows single value, price displays "X GBP"

• Range Mode: Slider shows dual handles, price displays "X GBP - Y GBP"

• Mode switching preserves appropriate values

• Enabling Smart Pricing adds service to cart

• Disabling Smart Pricing removes service from cart

• Service cost displays correctly

Data persistence:

• Price changes saved to database

• Smart Pricing state persisted correctly

• Form pre-populates with existing values on page load

Error handling:

• Network errors handled gracefully

• Validation errors display clearly

• Failed operations don't break form state

---