Commit Graph

20 Commits

Author SHA1 Message Date
Gildas Garcia
96d43099bb chore: refactor Button API so that it can be used a standard button (#46880)
## Problem

Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.

## Solution

- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code

## How to test

As this is just prop renaming, if it builds it's ok

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-06-16 23:59:58 +02:00
Ali Waseem
6f88585a7e feat(studio): add keyboard shortcuts for Advisors (#46238)
## Summary

Adds discoverable keyboard shortcuts for the Advisors area, covering
both navigation between advisor sub-pages and in-page actions on the
Security/Performance Advisor pages. Built on the shared shortcut
registry (`apps/studio/state/shortcuts/`) so they show up in the command
menu and follow the existing chord conventions (`V` for adVisor,
mirroring auth-nav / database-nav).

Linear: [FE-3413](https://linear.app/supabase/issue/FE-3413)

### Shortcuts

| Shortcut | Action | Scope |
| --- | --- | --- |
| `V` then `S` | Go to Security Advisor | Anywhere under
`/project/<ref>/advisors/*` |
| `V` then `P` | Go to Performance Advisor | Anywhere under
`/project/<ref>/advisors/*` |
| `V` then `R` | Go to Advisor Settings (Rules) | Anywhere under
`/project/<ref>/advisors/*` |
| `1` | Switch to Errors tab | Security / Performance Advisor page |
| `2` | Switch to Warnings tab | Security / Performance Advisor page |
| `3` | Switch to Info tab | Security / Performance Advisor page |
| `Shift+R` | Refresh / rerun the advisor | Security / Performance
Advisor page |
| `Escape` | Close lint details panel | When a lint row is selected |

## Test plan

- [x] From anywhere in Advisors, `V S` / `V P` / `V R` route to Security
/ Performance / Rules
- [x] On Security and Performance Advisor pages, `1` / `2` / `3` switch
tabs and update the `preset` query param
- [x] `Shift+R` reruns the linter (disabled while a refresh is
in-flight)
- [x] `Escape` closes the lint details side panel when a lint is
selected
- [x] Digit shortcuts do not fire while typing in inputs (`ignoreInputs:
true`)
- [x] Shortcuts appear in the command menu under the Advisors group

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Added keyboard shortcuts for Advisors (tab navigation, refresh/rerun,
close detail) with visible shortcut hints on tabs, refresh/rerun
buttons, close controls, and the Advisors menu; pages wire shortcuts to
tab switching, refresh, and close actions.

* **Chores**
* Registered Advisors shortcuts globally and added an Advisors
navigation group for discovery in the shortcuts reference.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46238?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: Danny White <3104761+dnywh@users.noreply.github.com>
2026-05-22 14:46:59 +00:00
Joshen Lim
50eea124e7 Small tweaks to feature preview badge (#45409)
## Context

Small improvements from this PR:
https://github.com/supabase/supabase/pull/45373

- Fix feature preview badge alignment
  - Before:
<img width="341" height="75" alt="image"
src="https://github.com/user-attachments/assets/e6e2f727-fc75-4f70-b9cd-94d67aed8c5d"
/>
  - After:
<img width="365" height="64" alt="image"
src="https://github.com/user-attachments/assets/3d6e5e5d-c285-48f4-8f8f-251c23101e41"
/>
- Shift feature preview badge for policies into tester side panel
<img width="640" height="93" alt="image"
src="https://github.com/user-attachments/assets/3efb73a7-f7f5-4ae0-8560-d1e0ba989626"
/>
- Realised that advisor settings wasn't set up to be behind the feature
preview
  - Fixing that in this PR

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
  * Added preview badge indicator to the RLS Tester feature

* **Style**
* Improved spacing and layout alignment across authentication, database
access, webhook, logging, and advisor interface components
  * Enhanced badge component styling for better vertical alignment

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-01 10:18:20 +08:00
Monica Khoury
49ff97af06 feat: add global feature preview badge for enabled preview features (#45373)
## What kind of change does this PR introduce?

Fixes FE-2526. 

Adds a global Feature Preview badge to pages enabled via Feature
Previews, improving visibility and making it clearer to users that the
feature can be managed (or disabled) from the Feature Previews settings.

## Why

Previously, once a feature preview was enabled, there was no clear
indication within the UI that:

- the feature was still in preview, or
- where to go to disable it

This lead to confusion and made the feature feel “permanent”.

## What’s included

New FeaturePreviewBadge UI component

<img width="417" height="80" alt="CleanShot 2026-04-29 at 17 20 10"
src="https://github.com/user-attachments/assets/6fbc96e3-35ef-46d1-893a-2188c4d237a3"
/>

</br>

Added badge across pages enabled via Feature Previews:
- Webhooks
- Unified Logs
- JIT DB Access
- Column Privileges
- Policies
- Merge page
- Advisor Rules

Consistent placement and styling.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
* Feature preview badges now appear across the platform on preview
features, including Platform Webhooks, Database functionality, Unified
Logs, Advisor Rules, and other features, providing quick identification
and access to manage preview settings.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-29 20:47:30 +03:00
Charis
4a0bb36ca8 style: require sorted imports in studio/components (#44408)
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-04-01 10:22:37 +02:00
Joshen Lim
564f4f66ee Joshen/fe 2660 clean up stale feature flags enabled for 2 months part 1 (#43329)
## Context 

Just cleaning up feature flags that have been toggled on for all users
and unchanged for the past 2 months
- advisorRules
- newJwtSecrets
- isWorkOSTPAEnabled
- EnableOAuth21
- gitlessBranching
- showRefreshToast
- awsPrivateLinkIntegration
- useBedrockAssistant (Already not used)
- enableStripeSyncEngineIntegration
- ShowExplainWithAiInQueryPerformance

Doing it in 2 parts so its easier for review
2026-03-04 13:08:39 +08:00
Ali Waseem
a909c0869d chore: enable new filter bar as a default opt in (#43028)
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

This is the first step for the GA rollout

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-02-20 09:33:32 -07:00
Danny White
031b227165 studio(chore): badge component defrag (#40118)
* component clean up

* optically center

* docs and type size

* code badge variant

* sensible defaults

* fix product menu flex

* badge sweep

* new project badges

* logs

* compute badge

* studio badge sweep

* www sweep

* docs sweep

* clean up

* fixes

* cleanup

* fixes

* better docs

* fixes

* misc fixes

* consistency

* Minor fixes for issues i found

* simplify mt-0

* mt simplification

* remaining optical alignment

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-12-02 11:15:50 +11:00
kemal.earth
4a9def58c1 feat(studio): rename reports to observability (#40317)
* feat: rename reports to observability on nav sidebar

* fix: observability route

* feat: observability navigation and redirects

* fix: first time load redirects

* feat: change auth overview reports link

* feat: clean up of other links to observability sections

* fix: query perf redirects

* chore: find exhaustive deps and disable for time being

* fix: charis suggested fixes

* fix: forgotten suggested fix

* chore: delete old reports views files

* fix: paths in reports tests

* fix: url sync useEffect should trigger only once

* feat: reorganise observability sidebar

* fix: data api not being selected

* fix: wrong layout for realitime

* fix: custom reports reloading

---------

Co-authored-by: Charis Lam <26616127+charislam@users.noreply.github.com>
Co-authored-by: Ali Waseem <waseema393@gmail.com>
2025-11-18 17:54:05 +00:00
Joshen Lim
75e1717a02 Remove barrel files part 02 (#39956)
* Remove barrel files part 02

* Clean up
2025-10-30 23:50:14 +08:00
Saxon Fletcher
d10001b7a7 Advisor sidebar manager (#39889)
* sidebar-manager

* storage keys

* tests

* more ai spots

* test fix

* revert to default

* remove ref

* Update apps/studio/state/sidebar-manager-state.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update apps/studio/components/ui/AIAssistantPanel/AIAssistant.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* fix ts

* fix

* fux

* fux query param

* clean

* fix

* more

* mock local storage

* simplify

* remove provider test

* remve useopensidebar

* fix(new homepage): open ai assistant on advisor card button clicks

* Update apps/studio/components/layouts/ProjectLayout/LayoutSidebar/index.tsx

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

* Update apps/studio/state/sidebar-manager-state.tsx

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

* refine

* editor sidebar manager

* reset results

* advisor sidebar manager

* empty state and notice

* event tracking

* remove variable

* remove use effect

* open in sidebar

* use sidebar old home

* Update apps/studio/components/ui/EditorPanel/EditorPanel.tsx

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

* connect hotkey

* Update apps/studio/components/layouts/AppLayout/AssistantButton.tsx

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

* Update apps/studio/state/advisor-state.ts

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

* Update apps/studio/state/advisor-state.ts

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

* fix

* initial prompt

* fix(inline editor button): only show keyboard shortcut if hotkey active

* cleanup(advisor panel): minor code cleanup

* fix(advisor panel): misplaced key on list

* fix(advisor panel): add error state

* fix(advisor panel): improve a11y

* fix(advisor panel): cannot find selected item

* fix

* fix

* tooltip

* link

* sidebar move up

* LayoutSidebarProvider to only sendEvent if in a project

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Charis Lam <26616127+charislam@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-10-30 17:43:02 +10:00
Charis
3eb7da7766 feat(preferences): allow disable hotkeys (#39573)
* feat(preferences): allow disable hotkeys

Add a section in /account/me for disabling hotkeys. Only added one
hotkey for now (Cmd + E for toggling editor side panel) but we can add
more with the same pattern.

* refactor: remove default export on ProjectLayout

* feat(hotkeys): allow toggling of command menu and ai assistant hotkeys

* Nit

* PRettier lint

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-10-17 08:09:38 -04:00
kemal.earth
70a64f8c00 feat(studio): query performance metrics chart (#39431)
* feat: setup chart area and tabs

This sets up the area where we can expect the insights chart as well as the tabs mechanism.

* feat: parse pg_stat_monitor logs as json

* feat: create query perf chart utils and move transfrom function

Created a utils file for our QueryPerformanceChart component. This moves the logs to JSON transform function there.

* feat: add timerange to chart

* feat: add date selector to query perf overview

This adds the selector to the top right of the page allowing the user to switch between last hour, 3 hours and 24 hours

* feat: modify chart component to accomodate hiding bits

* feat: add metrics to each tab

* chore: update to 60 min by default and some css

* feat: centralise data parsing for logs

* feat: clean up filters bar

This rewires the export to give you the aggregate pg_stat_monitor data. Also removes unused buttons and filters.

* feat: percentiles for query latency chart

* feat: filter out non evenets from pg_stat_monitor logs

* feat: utils for cache misses and hits

* feat: add selected query to chart on click

* feat: add click through to query panel

* chore: tidy up files

* chore: distinction between selected and open panel

* feat: move query performance fully into reports area

* fix: preserve query params on reports link

* fix: remove right icon syntax in report menu

* chore: remove cache misses from cache chart

* refactor: backwards compatibility for statements if right db version isnt available

* chore: delete randomly generated empty file

* chore: tidy up unused imports and vars

* chore: remove console logs

* chore: remove isMounted from query perf

* fix: cmd k query perf path

* feat: simplify query latency only p50 and p95

This seems to give us a more accurate reading as we can calculate these two

* fix: cache hit rate not showing inside query details

* chore: chart bg colour adjust

So it contrasts a little better on light mode.

* feat: show selected query on other verticals

* feat: bring back symlink in advisors
2025-10-15 13:39:29 +01:00
Joshen Lim
cab0585533 Fe 1799/consolidate to useselectedprojectquery and (#37684)
* Replace all usage of useProjectContext with useSelectedProjectQuery

* Replace all usage of useSelectedProject with useSelectedProjectQuery

* Replace all usage of useProjectByRef with useProjectByRefQuery

* Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery

* Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks

* Deprecate ProjecContext
2025-08-06 10:53:10 +07:00
Joshen Lim
bcf943ee88 Advisor rules update for LW15 (#37202)
* Advisor rules update for LW15

* Simplify UX to confirmation modal

* Rename section to settings

* fix

* patchy

* further simplify

* Smol styling fix

* Create + Delete lint rules to also invalidate lints
2025-07-16 22:20:08 +08:00
Joshen Lim
8dc3ed42b8 Advisor Rules (Part 1) (#34175)
* Scaffold advisor rules

* Wrap up implementation

* Add feature flag

* Fix type issues

* Fix types

* fix

* Scaffold

* Revise UI for advisor rules

* Hide edit button

* Refactor AdvisorRulesLayout

* Some fixes from PR feedback
2025-03-28 15:51:19 +08:00
Terry Sutton
dd4788bce4 Chore/move advisors (#30283)
* Move advisory things to Advisors page, move schema visualizer to top of database section

* Tiny clean up

* Tiny clean up

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2024-11-05 17:25:23 +08:00
Charis
84732ff44c feat: add new command menu to studio (#28432)
Add new command menu to studio. Ports over commands from old menu (with some minor reorganization), then adds:
- Branch switcher
- Project switcher
2024-08-08 16:42:07 -04:00
Alaister Young
70da0f1d1d chore: cleanup packages (#27770)
* chore: cleanup packages

- Avoid circular imports
- Export API-types as types
- pg-format without depending on Node internal Buffer (not browser-compatible)
- Avoid importing from barrel files in ui dir

* chore: avoid barrel file imports in studio (#27771)

* chore: avoid barrel file imports

- Removes some unused imports
- Avoids barrel file import for faster builds + less memory

* add eslint rule

* type fixes

* delete layouts barrel

* delete components/grid barrel file

* delete components/grid/utils barrel file

* delete components/grid/components/common barrel file

* delete components/grid/components/editor barrel file

* delete components/grid/components/formatter barrel file

* delete components/grid/components/grid barrel file

* delete components/grid/components/header/filter barrel file

* remote components/grid/store barrel file

* remove components/interfaces/Auth/Policies barrel file

* delete components/interfaces/Settings/Logs barrel file

* delete components/ui/CodeEditor barrel file

* delete components/ui/Forms barrel file

* delete components/ui/Shimmers barrel file

* delete data/analytics barrel file

* delete hooks barrel file

* cleanup lib/common/fetch barrel file

* final * barral files cleanup

* global react-data-grid styles

* remove console.log

---------

Co-authored-by: Kevin Grüneberg <k.grueneberg1994@gmail.com>

* fix build

---------

Co-authored-by: Kevin Grüneberg <k.grueneberg1994@gmail.com>
2024-07-04 14:48:10 +08:00
Terry Sutton
83679e3ddf Chore/move security advisor basics (#26669)
* Start

* Start

* Move advisors

* cleanup

* Add redirects

* Check for an id

* Cleanup

* Link to the advisor from the table editor

* Cleanup

* Link to rows in performance grid
2024-05-28 16:05:21 -02:30