doc.mdx

title	Documentation
icon	pencil
iconType	light
description	Rebrand and host this website.

import { companyName, emailAddress } from '/snippets/whitelabel/config.mdx';

**{companyName}** documentation is compatible with the **Mintlify** platform out of the box. If you use another documentation platform, get in touch for assistance.

Mintlify integration

Follow the steps below to whitelabel our documentation using Mintlify.

Go to your **Mintlify** directory then import the whitelabel project:

```shell
git submodule add https://github.com/agentfirstdev/whitelabel
```

Switch to the whitelabel subdirectory then customize the documentation by calling the whitelabel script with a subdirectory name and URL path to nest the documentation under, as well as your company name, support email address, API domain, usage dashboard URL, and checkout URL:

```shell
cd whitelabel
npm run whitelabel -- \
--path '[subdirectory/pathname here]' \
--company '[company name here]' \
--email [support address here] \
--endpoint [API domain here] \
--dashboard [dashboard URL here] \
--checkout [top-up URL here]
```

<Accordion icon='code' title='View customization example'>
  We used `endpoints`, as in https://doc.agentfirst.dev/endpoints/search, `Agent First`,
  `brain@agentfirst.dev`, `api.agentfirst.dev`, `https://agentfirst.dev/dashboard`, and
  `https://agentfirst.dev/#pricing`:

  ```shell
  cd whitelabel
  npm run whitelabel -- \
  --path endpoints \
  --company 'Agent First' \
  --email brain@agentfirst.dev \
  --endpoint api.agentfirst.dev \
  --dashboard https://agentfirst.dev/dashboard \
  --checkout https://agentfirst.dev/#pricing
  ```
</Accordion>

Link to whichever tutorial and reference pages you want in your navigation by editing the `docs.json` file at the **Mintlify** root.

<Accordion icon='code' title='View navigation example'>
  Here's how we link from
  [our configuration file](https://github.com/agentfirstdev/doc/blob/main/docs.json#L13-L53):

  ```json
  ...
  "navigation": {
    "groups": [
      ...
      {
        "group": "API",
        "pages": [
          "endpoints/search",
          "endpoints/browser",
          "endpoints/geotargeting",
          "endpoints/scheduling",
          "endpoints/reporting",
          {
            "group": "Reference",
            "icon": "book",
            "iconType": "light",
            "pages": [
              {
                "group": "Search",
                "pages": [
                  "endpoints/reference/search",
                  "endpoints/reference/search/results"
                ]
              },
              {
                "group": "Browsing",
                "pages": [
                  "endpoints/reference/browser",
                  "endpoints/reference/browser/content",
                  "endpoints/reference/browser/devices"
                ]
              },
              {
                "group": "Reporting",
                "pages": ["endpoints/reference/usage"]
              },
              ...
            ]
          }
        ]
      },
      ...
    ]
  },
  ...
  ```
</Accordion>

Switch back to the **Mintlify** root then preview your changes as usual:

```shell
cd ..
mint dev
```

A local copy of your documentation will be hosted at http://localhost:3000/.

Publish your changes after reviewing them:

```shell
git push
```

If you've connected your repository to **Mintlify**, your documentation will be automatically
deployed.

To incorporate documentation updates later, resync the whitelabel project from your **Mintlify** directory then invoke the customization script again:

```shell
git submodule update --remote
cd whitelabel
npm run whitelabel -- \
--path '[subdirectory/pathname here]' \
--company '[company name here]' \
--email [support address here] \
--endpoint [API domain here] \
--dashboard [dashboard URL here] \
--checkout [top-up URL here]
```