## What kind of change does this PR introduce?
Feature. Resolves FE-3418
## What is the current behaviour?
Platform webhooks (org and project) have no keyboard shortcut coverage.
Every action requires a mouse click.
## What is the new behaviour?
Adds seven shortcuts across the four UI states of the platform webhooks
pages:
**List page**
| Shortcut | Action |
|---|---|
| `Shift+F` | Focus search input |
| `Shift+N` | Open "New endpoint" sheet |
**Endpoint detail page** (when viewing a specific endpoint)
| Shortcut | Action |
|---|---|
| `Shift+E` | Open the edit sheet |
| `Shift+U` | Copy the endpoint URL |
**Create / edit form sheet**
| Shortcut | Action |
|---|---|
| `Mod+Enter` | Submit the form (create or save) |
**Delivery details sheet** (when a delivery row is open)
| Shortcut | Action |
|---|---|
| `Shift+R` | Retry the delivery (only active for non-success
deliveries) |
| `Shift+C` | Copy the active tab's payload (switches label between
"Copy event payload" / "Copy response payload") |
All shortcuts:
- Are surfaced via `ShortcutTooltip` / `Shortcut` tooltips on their
buttons
- Appear in the keyboard shortcuts reference sheet (`Mod+/`) under a new
**Platform Webhooks** group
- Are gated so they only fire in the appropriate UI state (e.g.
`Shift+E` is disabled while the edit sheet is already open)
- Apply to both the org-level (`/org/[slug]/webhooks`) and project-level
(`/project/[ref]/settings/webhooks`) pages as both use the same
`PlatformWebhooksPage` component
**Shared shortcuts reused** (no new IDs): `LIST_PAGE_FOCUS_SEARCH`,
`LIST_PAGE_NEW_ITEM`, `ACTION_BAR_SAVE`.
## To test
The platform webhooks UI is behind a feature flag for internal folks.
Enable it in Studio via **Account → Feature Previews → Platform
Webhooks**. The backend is not yet integrated, so you can test all the
shortcuts on the 1–2 mock endpoints (and their deliveries) that appear.
**List page** (`/org/[slug]/webhooks` or
`/project/[ref]/settings/webhooks`):
- [ ] `Shift+F` moves focus to the search input
- [ ] `Shift+N` opens the "New endpoint" sheet (tooltip visible on hover
of the button)
**New endpoint sheet**:
- [ ] Fill in a name and a valid URL, select at least one event type
- [ ] `Mod+Enter` submits and creates the endpoint
**Endpoint detail page**:
- [ ] `Shift+E` opens the edit sheet (tooltip visible on the Edit
button)
- [ ] `Shift+U` copies the endpoint URL and shows a toast (tooltip
visible on the copy icon next to the URL)
**Edit sheet**:
- [ ] `Mod+Enter` saves changes
**Delivery details sheet** (click a delivery row to open):
- [ ] `Shift+R` retries a failed/pending delivery (button and shortcut
absent for successful deliveries)
- [ ] On the **Event** tab: `Shift+C` copies the event payload, toast
reads "Copied event payload"
- [ ] On the **Response** tab: `Shift+C` copies the response payload,
toast reads "Copied response payload"
- [ ] Tooltip on both Copy buttons reflects the active tab label
**Shortcuts reference sheet** (`Mod+/`):
- [ ] A **Platform Webhooks** group appears when on an endpoint detail
page or with the delivery sheet open with the relevant shortcuts listed
- [ ] The basic shortcuts are shown under **List pages** when on the
root Webhooks page
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
## What kind of change does this PR introduce?
Feature, docs update.
- Resolves FE-3419
- First pass for DEPR-578
## What is the current behaviour?
The Connect sheet can be opened from visible UI and command-menu
actions, but it does not have a direct keyboard shortcut. Studio also
has shortcut conventions in code, but limited agent-facing review
guidance for contributors adding or touching Studio UI.
## What is the new behaviour?
FE-3419:
- Adds `O then C` to open the Connect sheet for active healthy projects.
- Mounts the shortcut from the always-rendered Connect sheet, so it
works without first opening the lazy command menu.
- Surfaces the shortcut on the Connect button tooltip, in the shortcuts
reference sheet, and on the Connect command-menu action.
- Forces the tooltip closed while the sheet is open so Escape closes the
sheet without also driving tooltip state.
- Tracks keyboard shortcut opens with the existing Connect sheet
telemetry event.
- Moves single-item AI Assistant and Inline Editor shortcuts to the
_Global Actions_ section in the cheatsheet.
DEPR-578:
- Adds a short Studio shortcut convention to `.claude/CLAUDE.md`.
- Adds scoped Copilot review guidance for Studio shortcut coverage,
discovery, and collision checks.
- Points the guidance back to the existing shortcut registry,
`useShortcut`, `Shortcut`, and `ShortcutTooltip` implementation context.
| After |
| --- |
| <img width="1576" height="188" alt="CleanShot 2026-05-21 at 11 30
40@2x"
src="https://github.com/user-attachments/assets/ba9d68c8-27ea-4c89-8016-d95d5bcea3ea"
/> |
| <img width="830" height="364" alt="CleanShot 2026-05-21 at 11 48
51@2x-FC627CB5-4A1C-49E2-B748-8AF0A3EBD7BC"
src="https://github.com/user-attachments/assets/d6aa52c1-56b2-4731-8e6b-088e29da43ed"
/> |
Validation:
- `pnpm --dir apps/studio exec vitest --run
components/ui/GlobalShortcuts/ShortcutsReferenceSheet.test.tsx
components/interfaces/ConnectButton/Connect.Commands.test.tsx
components/interfaces/ConnectSheet/useConnectSheetShortcut.test.ts`
- `git diff --check`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Keyboard shortcut to open the Connect sheet from anywhere; Connect
button displays the shortcut and is enabled only for eligible projects.
* New "Global Actions" group in the shortcuts reference including AI
Assistant, Inline Editor, and Connect.
* **Documentation**
* Added Studio keyboard-shortcuts guidance and linked it in project
instructions.
* **Tests**
* Added tests covering connect shortcut behavior and command
registration.
* **Telemetry**
* Connect-sheet open events now record keyboard shortcut as a source.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46185?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Ali Waseem <waseema393@gmail.com>
## Context
Noticed while working on #43913 that `copilot-instructions.md` is
currently at ~4,600 characters. Per [GitHub's docs on Copilot code
review](https://docs.github.com/en/copilot/how-tos/use-copilot-agents/request-a-code-review/use-code-review):
> Copilot code review only reads the first 4,000 characters of any
custom instruction file. Any instructions beyond this limit will not
affect the reviews generated by Copilot code review.
This means the testing section at the bottom of our current file isn't
being read during reviews.
## Proposal
Split the single file into path-specific instruction files under
`.github/instructions/`, following [GitHub's recommended pattern for
repository custom
instructions](https://docs.github.com/en/copilot/how-tos/configure-custom-instructions/add-repository-instructions):
> These are specified in one or more `NAME.instructions.md` files within
or below the `.github/instructions` directory.
> If the path you specify matches a file that Copilot is working on, and
a repository-wide custom instructions file also exists, then the
instructions from both files are used.
This gives us separate files that each stay under the 4K limit and get
combined automatically by Copilot during reviews:
| File | Size | Scope |
|------|------|-------|
| `copilot-instructions.md` | 929 chars | General repo context +
pointers |
| `instructions/studio-telemetry.instructions.md` | 3,570 chars |
Telemetry rules for `apps/studio/**` |
| `instructions/studio-testing.instructions.md` | 1,228 chars | Testing
rules for `apps/studio/**` |
Note: Copilot reads instructions from the **base branch** of a PR, not
the feature branch — so these won't take effect until merged to master.
### New telemetry guidance
The telemetry file adds guidance we've been missing — specifically
around feature-flagged rollouts:
- Flag PRs that use `usePHFlag`/`useFlag` to gate behavior but don't
capture the flag state in telemetry
- Flag rollouts that track flag state but not user response to the new
behavior
- Documents the raw flag pattern (read via `usePHFlag`, not coerced
wrapper hooks) to avoid the `undefined`→`false` data quality bug we hit
in #43913
### What didn't change
All existing telemetry and testing rules are preserved — nothing was
removed, just reorganized. The telemetry rules still reference
`.claude/skills/telemetry-standards/SKILL.md` as the authoritative
source.
## References
- [Adding repository custom instructions for GitHub
Copilot](https://docs.github.com/en/copilot/how-tos/configure-custom-instructions/add-repository-instructions)
— file structure, path-specific instructions, frontmatter format
- [Using Copilot code
review](https://docs.github.com/en/copilot/how-tos/use-copilot-agents/request-a-code-review/use-code-review)
— 4K character limit, base branch behavior
## Open questions
Would love the team's input on:
- Does the file split make sense, or would you prefer keeping everything
in one file (and trimming to fit)?
- Are there other topics that should get their own instruction file?
- Any concerns with the new feature flag telemetry guidance?
## Summary
Adds `.github/copilot-instructions.md` to configure GitHub Copilot Code
Review with telemetry and testing guidelines. Replaces CodeRabbit as our
automated PR reviewer. Copilot will now advisory-comment when PRs touch
growth-oriented components (onboarding, upgrade CTAs, A/B experiments)
without telemetry tracking, or when Studio changes lack appropriate test
coverage.
## Changes
- Add `.github/copilot-instructions.md` with:
- Telemetry review rules: event naming (`[object]_[verb]`), property
conventions, `useTrack` enforcement, missing tracking suggestions for
growth surfaces
- Testing review rules: logic extraction to `.utils.ts`, test type
decision tree, file naming conventions
- Repo context and references to full Claude skill docs
## Testing
- [x] Verified `.github/copilot-instructions.md` is the correct path for
Copilot Code Review
- [x] Rules are condensed from existing Claude skills
(`telemetry-standards`, `studio-testing`) — verified alignment
## Linear
- fixes GROWTH-698
---------
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
