# Today's Deal (صفقة اليوم) and Trending (تريندات) on the home screen — mobile app contract

The website's homepage has two product sections the app does not show yet:

- **صفقة اليوم** (Today's Deal)
- **تريندات** (Trending; called "Featured Products" in the code and the API)

The admin manages both in **Products → صفقة اليوم / تريندات**. That page sets:

- which products are in the section, and **their order** (drag, or type the position);
- the **section name** in Arabic and English.

The website shows exactly that list in that order. The app should do the same.

**Nothing new on the backend.** Both endpoints already exist on the live site and already return the
admin's products in the admin's order, the same as the website (checked side by side). The app only
has to call them and draw the sections.

Base: `/api/v2`, usual headers (`System-Key`, `App-Language`). No sign-in needed.

## 1. Today's Deal — `GET products/todays-deal` (existing)

```json
{
  "data": [
    {
      "id": 1988,
      "slug": "...",
      "name": "...",
      "usd_price": 9.44,
      "thumbnail_image": "https://kapitano.shop/public/uploads/all/....png",
      "has_discount": true,
      "discount": "-10%",
      "stroked_price": "1,305 ل.س",
      "main_price": "1,170 ل.س",
      "rating": 0,
      "sales": 3,
      "current_stock": 3,
      "is_wholesale": false,
      "links": { "details": "https://kapitano.shop/api/v2/products/1988" }
    }
  ],
  "success": true,
  "status": 200
}
```

- At most **20** products, already in the admin's order. There is no paging, so make one call.
- Every item is the usual product card object (`ProductMiniCollection`), the same one returned by
  `products/search`, `products/category/{slug}` and the other lists. Reuse the existing product card widget.
- `data` empty (`[]`) → **hide the whole section** (the website hides it too).

## 2. Trending — `GET products/featured` (existing)

Same product objects, but **paginated by 10**: the response also has `links` and
`meta` (`current_page`, `last_page`, `per_page`, `total`).

The website shows the **first 12** Trending products. To show the same in the app:

1. Call `products/featured` (page 1).
2. If `links.next` is not `null`, call `products/featured?page=2`.
3. Show the products of page 1 followed by those of page 2, **keeping only the first 12**.

- Keep the order received. Never sort and never shuffle.
- No products (`total == 0`) → **hide the whole section**.

## 3. Section names — `GET business-settings` (existing, the app already calls it)

The admin can rename each section. The names are rows of `data[]` (`{"type": ..., "value": ...}`):

| section | Arabic | English |
|---|---|---|
| Today's Deal | `todays_deal_title_ar` | `todays_deal_title_en` |
| Trending | `featured_title_ar` | `featured_title_en` |

Pick the row of the app's current language. If the row is **missing or empty**, use the default:

| section | default Arabic | default English |
|---|---|---|
| Today's Deal | صفقة اليوم | Today's Deal |
| Trending | تريندات | Trending |

(The same rows exist for Best Selling: `best_selling_title_ar` / `best_selling_title_en`, default
"المنتجات الأكثر مبيعا" / "Best Selling". If the app shows a Best Selling section, give its title the same treatment.)

## 4. What to draw (same as the website)

Both sections look like the other product rows of the home screen:

1. A header line with the section name (bold). Neither section has a "عرض الكل" button on the website.
2. Under it, a horizontal scrolling list of the products, using the existing product card
   (photo, name, `main_price`, `stroked_price` crossed out when `has_discount`, the `discount` badge).
   Tapping a card opens the product as everywhere else.

Website look, if the design wants to match it:
- The **first product section of the homepage order** (Today's Deal unless staff moved another one up) sits on a dark navy band (`#10164C`) with the title in white and white product cards; the others sit on white with a dark title. The order and that rule: `docs/api/home-sections-app-handoff.md`.

Order on the website's homepage: Today's Deal comes near the top, under the slider. Trending
comes further down, among the other product sections. Place them where they fit the app's home screen.

## 5. Checklist for the app

- [ ] Today's Deal: `GET /api/v2/products/todays-deal`, one call, horizontal list, hidden when empty.
- [ ] Trending: `GET /api/v2/products/featured` (+ `?page=2` when `links.next` is set), first 12, hidden when empty.
- [ ] Titles from `business-settings` (`todays_deal_title_*`, `featured_title_*`), with the defaults above.
- [ ] Keep the order received in both lists.
- [ ] Refresh both with the rest of the home screen (pull-to-refresh).
- [ ] Test: in the admin (Products → صفقة اليوم / تريندات), reorder the products, remove one and
  rename the section. Then reload the app home screen: it must match the website's homepage.
