From fc0aae8b14f3c40f015eb40f4244e6a5a8d5d4e8 Mon Sep 17 00:00:00 2001 From: Terry Sutton Date: Wed, 22 Apr 2026 10:12:51 -0230 Subject: [PATCH] Add new skills page (#45118) Adds a new Skills page CleanShot 2026-04-22 at 09 20 54 ## Summary by CodeRabbit * **New Features** * Home hero now shows two side-by-side CTAs: "Get Started" and "Install Skills" for quick access. * **Documentation** * Added a new "Skills" docs page describing Agent Skills and installation options (CLI and plugin). * Sidebar navigation updated: section renamed to "AI Skills" and the nav item changed to "Skills" (marked new). * **Removed** * Old "Prompts" documentation page removed. --- apps/ui-library/app/(app)/page.tsx | 11 +++-- apps/ui-library/config/docs.ts | 9 ++-- .../content/docs/ai-editors-rules/prompts.mdx | 21 ---------- .../content/docs/ai-editors-rules/skills.mdx | 42 +++++++++++++++++++ 4 files changed, 55 insertions(+), 28 deletions(-) delete mode 100644 apps/ui-library/content/docs/ai-editors-rules/prompts.mdx create mode 100644 apps/ui-library/content/docs/ai-editors-rules/skills.mdx diff --git a/apps/ui-library/app/(app)/page.tsx b/apps/ui-library/app/(app)/page.tsx index e993da7e4cd..567c15e01b5 100644 --- a/apps/ui-library/app/(app)/page.tsx +++ b/apps/ui-library/app/(app)/page.tsx @@ -45,9 +45,14 @@ export default function Home() { A collection of React components and blocks built on the shadcn/ui library that connect your front-end to your Supabase back-end via a single command. - - Get Started - +
+ + Get Started + + + Install Skills + +
diff --git a/apps/ui-library/config/docs.ts b/apps/ui-library/config/docs.ts index 34c7f4a4893..24a3ac0c1d6 100644 --- a/apps/ui-library/config/docs.ts +++ b/apps/ui-library/config/docs.ts @@ -25,13 +25,14 @@ export const gettingStarted: SidebarNavGroup = { } export const aiEditorsRules: SidebarNavGroup = { - title: 'AI Editors Rules', + title: 'AI Skills', items: [ { - title: 'Prompts', - href: '/docs/ai-editors-rules/prompts', + title: 'Skills', + href: '/docs/ai-editors-rules/skills', items: [], - commandItemLabel: 'AI Editors Rules', + new: true, + commandItemLabel: 'AI Skills', }, ], } diff --git a/apps/ui-library/content/docs/ai-editors-rules/prompts.mdx b/apps/ui-library/content/docs/ai-editors-rules/prompts.mdx deleted file mode 100644 index 3aa4a4457e3..00000000000 --- a/apps/ui-library/content/docs/ai-editors-rules/prompts.mdx +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: Prompts -description: Rules for AI Code Editors for Supabase ---- - -## Installation - - - -## Folder structure - - - -## Usage - -Running the install command above will add the rule to the `.cursor/rules` directory in your project. If you don't have a `.cursor/rules` directory, it will be created for you. - -Rules are project-specific, so you can have different rules for different projects depending on your needs. Rules are automatically included when matching files are referenced. - -If you're installing the rules in a monorepo, you'll need to move the `.cursor` directory at the -root directory and update all paths in the `.mdc` files. diff --git a/apps/ui-library/content/docs/ai-editors-rules/skills.mdx b/apps/ui-library/content/docs/ai-editors-rules/skills.mdx new file mode 100644 index 00000000000..6c1825c44ac --- /dev/null +++ b/apps/ui-library/content/docs/ai-editors-rules/skills.mdx @@ -0,0 +1,42 @@ +--- +title: Skills +description: Agent Skills for Supabase — procedural knowledge and context that AI agents can load on demand +--- + +Agent Skills are folders of instructions, scripts, and resources that agents can discover and use to do things more accurately and efficiently. Skills give agents access to procedural knowledge and Supabase-specific context they can load on demand, so they can do real work reliably. + +Skills work with 18+ AI agents including Claude Code, GitHub Copilot, Cursor, Cline, and many others. + +## Installation + +Run these commands in the root of your project — skills are installed per-project, similar to how you'd add a config file or dev dependency. Once installed, your AI agent will automatically pick them up the next time it runs. + +Install all Supabase skills using the skills CLI: + +```bash +npx skills add supabase/agent-skills +``` + +This installs the full set of Supabase skills — the right choice for most projects. If you're doing a lot of database work, also add the Postgres-specific skill: + +```bash +npx skills add supabase/agent-skills --skill supabase-postgres-best-practices +``` + +The `supabase-postgres-best-practices` skill covers Postgres performance optimization, query design, and schema best practices. It's used automatically when writing, reviewing, or optimizing queries and database configurations. + +### Claude Code + +You can also install the skills as Claude Code plugins: + +```bash +/plugin marketplace add supabase/agent-skills +/plugin install supabase@supabase-agent-skills +``` + +## Learn more + +For the full list of available skills, installation options, and usage guidance, see the [Agent Skills documentation](https://supabase.com/docs/guides/getting-started/ai-skills). + +- [Agent Skills Repository](https://github.com/supabase/agent-skills) +- [Agent Skills Documentation](https://agentskills.io/home)