# Alrifai — Frontend ↔ API Integration

This frontend is fully wired to the backend described in
`Alrifai.postman_collection.json` (imported at the project root).

## Configure the API base URL

Copy `.env.example` to `.env.local` and set the base URL (the value of the
Postman `{{url}}` variable). It must end with a trailing slash:

```
NEXT_PUBLIC_API_URL=http://127.0.0.1:8000/api/v1/
```

If unset, the client defaults to `http://127.0.0.1:8000/api/v1/`.

## Where the integration lives

`lib/api.ts` is a typed client with one function per Postman request. The
response envelope is `{ key, msg, data }`; GET helpers return `data`, POST
helpers return `{ ok, msg, data }`.

| Page / component            | Endpoint(s)                                            |
|-----------------------------|--------------------------------------------------------|
| `/` (home)                  | `GET home`                                             |
| `/about/bio`                | `GET about/biography`, `GET socials`, `GET latest-blogs` |
| `/about/vision`             | `GET about/vision`                                     |
| `/about/mission`            | `GET about/mission`                                    |
| `/about/core-values`        | `GET about/our-core-values`                            |
| `/business`                 | `GET businesses-page`, `GET latest-blogs`              |
| `/blog`                     | `GET blogs`, `GET blog-categories`                     |
| `/inspirations`             | `GET inspirations`, `GET inspiration-categories`       |
| `/contact`                  | `POST contact`                                         |
| Newsletter (all pages)      | `POST subscribe`                                       |
| Footer (all pages)          | `GET latest-blogs`, `GET socials`                      |

Also available in `lib/api.ts` (ready to use for detail pages):
`getBlogPost`, `getInspirationPost`, `getBlogComments`, `addBlogComment`,
`toggleBlogLike`, `getInspirationComments`, `addInspirationComment`,
`toggleInspirationLike`, `getCategoryBlogs`, `getCategoryInspirations`,
`getTagBlogs`, `getTagInspirations`, `getPopularTagBlogs`, `getPopularTags`,
`getProjectDetails`, `getTeamDetails`, `getInsights`, `getSettings`,
`getSiteSettings`, `getBusinessDetails`.

## Important request details (from the collection)

- All POST endpoints use **multipart/form-data** (not JSON).
- `POST contact` fields: `full_name`, `email`, `subject`, `message`.
- `POST subscribe` field: `email`.
- `POST .../comments` fields: `name`, `email`, `website`, `comment`.

## Graceful fallbacks

Every page renders themed fallback content when the API is unreachable, so the
UI matches the design even before the backend is connected. Once
`NEXT_PUBLIC_API_URL` points at a live server, real data takes over
automatically.
