Create a dashboard page

1. Create a new page

For this example we are going to create the AI Demo page in the dashboard. We start by creating the new page in the /apps/web/app/(saas)/[teamSlug] folder. To do so, we need to create a subfolder with the name of the page (in this case ai-demo) and in there a page.tsx file.

export default function AiDemoPage() {
  return (
    <div>
      <h1>AI Demo</h1>
    </div>
  );
}

2. Add menu item for the new page

In the NavBar component we need to add a new menu item for the new page:

const menuItems = [
  // ...
  {
    title: 'AI Demo',
    href: '/app/(saas)/[teamSlug]/ai-demo',
    icon: HomeIcon,
  },
];

Now we can navigate to the new page by clicking on the menu item.