> ## Documentation Index
> Fetch the complete documentation index at: https://docs.assistantscenter.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Create Custom Page

> This method allows you to create a custom page type. This is useful if you want to create a page that is not passed within the theme.

There are 3 types of Custom Pages: redirect to another page, custom HTML and JSON Api.

* endpoint is stuff after url to your project. For example, endpoint: /test/stuff will be accessible from the localhost/test/stuff URL. Localhost can be also your domain or IP adress.

* getDataFunction function is function to get data to return. For redirect, it will be an URL string. For custom HTML, it will be HTML string. For JSON Api, it will be an JSON Object.

Where user is logged-in user or null.

## Redirect to URL

```js theme={null}
DBD.customPagesTypes.redirectToUrl(
    endpoint: String,
    getDataFunction: Function({user})<String>
),
```

## Render HTML

```js theme={null}
DBD.customPagesTypes.renderHtml(
    endpoint: String,
    getDataFunction: Function({user})<String>
),
```

## Send JSON

```js theme={null}
DBD.customPagesTypes.sendJson(
    endpoint: String,
    getDataFunction: Function({user})<Object>
),
```

## Example Usage

```js theme={null}
customPages: [
  DBD.customPagesTypes.redirectToUrl("/redirect-to-foo", ({ user }) => {
    if (user.id) return `https://foo.com/?user=${user.id}`;
    return "https://foo.com/?user=false";
  }),
  DBD.customPagesTypes.renderHtml("/html-render", ({ user }) => {
    return `
            <!DOCTYPE html>
            <html>
                <head>
                    <title>Test</title>
                </head>
                <body>
                    <h1>${
                      user.id
                        ? `Hello, ${user.username}!`
                        : `You are not logged in.`
                    }</h1>
                </body>
            </html>
            `;
  }),
  DBD.customPagesTypes.sendJson("/json-test", ({ user }) => {
    return {
      error: user.id ? false : true,
      message: user.id ? null : "User not logged in.",
      user: user,
    };
  }),
];
```

## Props

<ParamField path="endpoint" type="String" required>
  The path the page will be accessible from.
</ParamField>
