Skip to main content
The navigation feature gives the agent awareness of your site’s page structure. When a user asks “Where can I change my billing info?” the agent can point them to the exact page instead of giving a generic answer.

​
How it works

  1. You generate a routes.csv file describing your application’s pages.
  2. You upload the CSV in the dashboard.
  3. The agent receives the route structure as context and references specific pages when guiding users.

​
Downloads

routes-template.csv

Starter CSV template. Fill in your pages and upload.

AI skill (file)

Download the skill for Cursor, Codex, or any AI editor.

Install in Cursor

One-click install as a reusable Cursor command.

​
Adding navigation routes

1

Generate your routes.csv

Create a routes.csv file following the format below. You can:
  • One-click with Cursor — install the build-routes command and let the AI generate it from your codebase.
  • Start from the template — download the routes-template.csv and fill in your own pages.
  • Use the AI skill — download the build-routes skill for any AI coding editor.
  • Build manually — follow the format specification and examples below.
2

Upload in the dashboard

Navigate to Navigation in the dashboard sidebar and upload your routes.csv file.
3

The agent uses it automatically

The navigation context is included in the agent’s system prompt. No additional configuration needed.

​
CSV format

The routes.csv file uses four columns: 
name,path,description,parameters
dashboard_home,/dashboard,Main dashboard with project overview,
settings_general,/settings,Account and project settings,
settings_billing,/settings/billing,Billing and subscription management,
user_detail,/users/:userId,Individual user profile and account info,userId:string
ColumnDescription
nameA unique snake_case identifier for the route (e.g. settings_billing, user_detail)
pathThe URL path. Use :paramName for dynamic segments (e.g. /users/:userId)
descriptionA short plain-English summary of what the page shows or does
parametersDynamic parameter definitions as paramName:type pairs, separated by semicolons. Leave empty for static routes

​
Formatting rules

  • The first row must be the header: name,path,description,parameters
  • Every name must be unique across the file
  • Every path must start with /
  • Dynamic segments in path must use :paramName syntax and have a matching entry in parameters
  • Only quote fields if they contain a comma
  • Group related routes together for readability

​
Generating routes from your codebase

You can extract routes from common frontend frameworks:
Each directory under app/ with a page.tsx maps to a route. Dynamic segments use [paramName] folders.
app/
├── dashboard/page.tsx        → /dashboard
├── settings/page.tsx         → /settings
├── settings/billing/page.tsx → /settings/billing
└── users/[userId]/page.tsx   → /users/:userId
Convert bracket syntax to colon syntax: [userId] becomes :userId.
Search your router configuration for path properties:
createBrowserRouter([
  { path: "/dashboard", element: <Dashboard /> },
  { path: "/users/:userId", element: <UserDetail /> },
]);
Each path value maps directly to a row in the CSV.
Look for route arrays in your router config. Vue uses path in routes: [...], Angular uses RouterModule.forRoot(...). The path format is the same.
Navigate your application and record each page’s URL. Replace dynamic values (IDs, slugs) with :paramName placeholders. Check your sidebar, navbar, tabs, and settings pages for the full list.

​
Examples

A small application with a dashboard, settings, and user management: 
name,path,description,parameters
dashboard,/dashboard,Main dashboard with project overview,
dashboard_analytics,/dashboard/analytics,Usage analytics and charts,
settings_general,/settings,General account settings,
settings_billing,/settings/billing,Billing and subscription management,
settings_api_keys,/settings/api-keys,API key management and rotation,
users,/users,User listing and search,
user_detail,/users/:userId,Individual user profile and account info,userId:string
user_permissions,/users/:userId/permissions,User role and permission management,userId:string
help,/help,Help center and documentation,
help_getting_started,/help/getting-started,Getting started guide for new users,
A larger application with nested routes and multiple parameter types: 
name,path,description,parameters
workspaces,/workspaces,Workspace listing and management,
test_cases,/td/:workspaceId/cases,Test case listing and management,workspaceId:string
test_case_detail,/td/cases/:testCaseId,Individual test case detail and steps,testCaseId:string
environments,/td/:workspaceId/environments,Environment listing and management,workspaceId:string
Write descriptions that match how users ask about each page. “Billing and subscription management” is better than just “Billing” because it helps the agent match user intent more accurately.

​
Auto-generate with AI

Let your AI coding agent scan your codebase and produce the routes.csv for you.
Click the link below to install build-routes as a reusable command in Cursor. You’ll be asked to review the command before it’s saved.Install build-routes command in CursorOnce installed, run the command from Cursor’s command palette anytime you need to regenerate routes.
The agent scans your source code for route definitions (Next.js pages, React Router configs, Vue/Angular routers), explores the live app if it’s running, and produces a properly formatted CSV ready to upload.

​
When to use navigation

Navigation is most useful when:
  • Your product has many pages and users frequently ask “where do I find X?”
  • You want the agent to link directly to relevant pages in its answers
  • Your site structure changes and you want the agent to stay current
Navigation routes are processed and stored per project. Re-upload your routes.csv whenever your site structure changes.