## 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?
Tidying up the bottom panel in unified logs. Taking care of some visual
quirks etc. Also preparing this area to house some other future concepts
via tabs.
| Before | After |
|--------|--------|
| <img width="828" height="384" alt="Screenshot 2026-04-30 at 11 24 09"
src="https://github.com/user-attachments/assets/804bdf1c-7cdb-4dd8-bf1e-31c434ef1436"
/> | <img width="830" height="407" alt="Screenshot 2026-04-30 at 11 22
53"
src="https://github.com/user-attachments/assets/28555efe-f893-4bae-bcb0-284e6db733e6"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Redesigned service flow panel with Overview and Raw JSON tabs
* Added Previous/Next navigation controls with Arrow Up/Down keyboard
support
* New detail components and section headers with icons for clearer
organization
* Improved Postgres detail view and message/session display
* **Bug Fixes / Changes**
* Removed legacy header UI and related controls
* **UI / Style**
* Enhanced copy-to-clipboard feedback animation
* Updated "Load more" button styling
* Adjusted panel sizing for improved resizing behavior
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Ali Waseem <waseema393@gmail.com>
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.
---------
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
## 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?
A little bit of tidy up here so the header area of unified logs isn't so
dominant. Moved actions to the same line as search bar and made other
parts a little more subtle, so the focus reamains on the logs
themselves.
| Before | After |
|--------|--------|
| <img width="980" height="213" alt="Screenshot 2026-04-27 at 11 47 37"
src="https://github.com/user-attachments/assets/ae22e7dd-272f-4433-a270-67b550a00536"
/> | <img width="893" height="153" alt="Screenshot 2026-04-27 at 12 27
17"
src="https://github.com/user-attachments/assets/87b8cfc9-66a4-4634-a3c6-c45e4b8fc486"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Keyboard shortcut to toggle filter visibility in logs.
* Consolidated top bar with refresh, view options, download, and live
controls—desktop and mobile optimized.
* **Style**
* More compact, organized header with tooltips showing live status and
shortcut hints.
* Reduced filter input typography and streamlined mobile filter trigger.
* **Other**
* Side panel sizing and logs area layout refined for clearer visuals and
consistent header/body styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This PR preps the monorepo for a migration to Tailwind v4:
- Bump all Tailwind dependencies and libraries to the latest possible
version, while still compatible with Tailwind 3.
- Cleans up obsolete Tailwind 3 specific options and configs.
- Cleans up unused CSS files and fixes the CSS imports.
- Migrates all `important` uses in `@apply` lines to using the `!`
prefix.
- Move `typography.css` to the `config` package and import it from the
apps.
- Migrated all occurrences of `flex-grow`, `flex-shrink`,
`overflow-clip` and `overflow-ellipsis` since they're deprecated and
will be removed in Tailwind 4.
- Make the default theme object typesafe in the `ui` package.
- Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and
`divider-opacity` to the new format where they're declared as part of
the property color.
- Bump and unify all imports of `postcss` dependency.
## Problem
With #45211 and #45218 merged, we don't need the `_Shadcn_` suffix
anymore
## Solution
- [x] Remove the `_Shadcn_` suffix
- [x] Update exports and imports
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized UI component exports by removing legacy naming
conventions and providing direct imports for checkbox and radio group
components throughout the design system.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
In order to update to react 19, we need to update several dependencies
## Solution
- migrate to the `radix` umbrella package to ease upgrade
- update some dependencies
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Consolidated Radix UI usage to a single unified package across apps
and packages, updated package manifests and workspace catalog entries.
No user-facing behavior, visuals, or public APIs changed.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
## 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 changes the guard to expose unified logs to Enterprise.
**To test:**
- Create an Enterprise org.
- Go to a project and then Logs.
- Default view should be unified logs (with a CTA offering to switch
back to old logs).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added enterprise/Supabase-org eligibility checks and loading state for
the unified logs preview.
* **UX**
* Updated messaging to state unified logs are only available to
Enterprise plan organizations.
* Sidebar and filter panels now show unified-logs preview panels based
on eligibility.
* **Analytics**
* Track unified logs row clicks with a new telemetry event.
* **Bug Fixes**
* Prevent navigation until unified-logs eligibility and preview flag
loading are resolved.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Summary
- Migrates all 11 `useHotKey` call sites across 9 files to
`useShortcut`, backed by `SHORTCUT_DEFINITIONS` in
`state/shortcuts/registry.ts`.
- Adds 10 new registry entries (all `showInSettings: false` to keep
behavior identical to today — these were not previously
user-configurable).
- Deletes `apps/studio/hooks/ui/useHotKey.ts`.
- Simplifies `ActionBar.handleSave` — the legacy hook passed a
`KeyboardEvent` the callback used for `preventDefault`/`stopPropagation`
and a textarea-plain-Enter guard; all of that is redundant under
`useShortcut` (TanStack handles default/propagation; `Mod+Enter` never
fires on plain Enter).
- Removes a stale commented-out `useHotKey` reference in
`DataTableFilterCommand.tsx`.
Part of FE-3025 (legacy hotkey hook cleanup). `useKeyboardShortcuts` in
`grid/components/common/Hooks.tsx` will be migrated in a follow-up.
## Test plan
All shortcuts should still fire with **Cmd** (macOS) / **Ctrl**
(Win/Linux).
**Table Editor — operation queue** (requires pending unsaved edits on a
row)
- [x] `Cmd+S` saves pending edits
- [x] `Cmd+.` toggles the operation queue side panel
- [x] `Cmd+Z` undoes the latest edit and re-fetches the affected table
rows
- [x] With no pending edits, none of the above fire (gated by
`isEnabled`)
**Table Editor — side panel editor forms** (row, table, column, policy,
etc.)
- [x] `Cmd+Enter` submits the form when the panel is visible
- [x] Does not submit if the form is disabled/loading or the panel is
hidden
**Unified Logs — data table**
- [x] `Cmd+B` toggles the filter controls sidebar (desktop)
- [x] `Cmd+B` opens the filter drawer (mobile, `<sm` breakpoint)
- [x] `Cmd+Esc` resets active column filters (reset button visible)
- [x] `Cmd+U` resets column order + visibility
- [x] `Cmd+J` toggles live mode
**Unified Logs — reset focus**
- [x] `Cmd+.` blurs the currently focused element / resets focus to body
**AI Assistant panel**
- [x] While editing a message, `Cmd+Esc` cancels the edit
**Regression checks**
- [x] `pnpm --filter=studio typecheck` passes (verified locally)
- [x] None of the new shortcut entries appear in Account → Preferences →
Keyboard shortcuts (all `showInSettings: false`)
- [x] Existing shortcuts (`Cmd+K`, `Cmd+I`, `Cmd+E`, results
copy/download) still work unchanged
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Refactor
* Implemented a centralized keyboard shortcut registry system for
managing shortcuts consistently across the application
* Updated multiple UI components throughout the interface to use the new
shortcut management system
* All existing keyboard shortcuts continue to function without any
changes in behavior or user experience
## Chores
* Removed legacy keyboard shortcut hook implementation
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
While trying to update `react` to version `19`, I noticed type related
errors that can be fixed in version `18`, mostly usage of `JSX.Element`
instead of `ReactNode`.
## Solution
- Use `ReactNode` instead of `JSX.Element`
- Fix some invalid usage of `rechart`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Release Notes
* **Refactor**
* Standardized React component type annotations across the codebase for
improved type consistency and flexibility.
* Updated component prop types to accept a broader range of renderable
content.
* **Bug Fixes**
* Adjusted chart layout positioning to improve visual alignment.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Component update.
## What is the current behaviour?
TanStack tables in the repo are split between the shared `TableHeadSort`
primitive and the older Studio-local `DataTableColumnHeader` helper,
which makes the sorting UI and integration path inconsistent.
If you were to just use `DataTableColumnHeader` in `ui-patterns/Table`,
you’d get a very different visual result to the `TableHeadSort` UI you
see in most other tables.
## What is the new behaviour?
Adds a shared `TanStackTableHeadSort` adapter in `ui-patterns/Table`,
backed by the existing `TableHeadSort` primitive, and switches the
webhook table plus the design-system TanStack demo to that canonical
path. `DataTableColumnHeader` stays as a deprecated wrapper for now,
Studio gets a lint guard to block new imports of it, and the table docs
now point TanStack tables at the shared adapter explicitly.
## To test
Check out column sorting on the Platform Webhook endpoint deliveries
table.
This PR fixes some prettier issues:
- Bump and unify all prettier versions to 3.7.3 across teh whole repo
- Bump the SQL prettier plugin
- When running `test:prettier`, check `mdx` files also
- Run the new prettier format on all files
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
This pull request standardizes the usage of props and value types for
the `ResizablePanelGroup` and `ResizablePanel` components across
multiple files in the codebase. Specifically, it replaces the deprecated
`direction` prop with `orientation`, and updates numeric prop values
(such as `defaultSize`, `minSize`, and `maxSize`) to be passed as
strings. This ensures consistency with the updated component API and
improves type safety.
**Component API Updates:**
* Replaced the `direction` prop with `orientation` for all usages of
`ResizablePanelGroup`
* Updated all `ResizablePanel` props (`defaultSize`, `minSize`,
`maxSize`) to be passed as strings instead of numbers, ensuring
compatibility with the latest API requirements.
* Removed deprecated or unnecessary props such as `order` from
`ResizablePanel` components, and ensured all size-related props are
consistently formatted as strings.
This pull request upgrades the `react-resizable-panels` dependency from
version 2.x to 3.x. It also includes some minor improvements to
component props and key usage for React elements.
**Dependency upgrade:**
* Upgraded `react-resizable-panels` from version 2.1.4 to 3.0.0.
**Component improvements:**
* Added a `key` prop to the `ResizablePanelGroup` in `LogTable.tsx` and
to action buttons in `UnifiedLogs.tsx` to help React identify elements
more efficiently.
* Ensured unique `key` props for icons rendered in a map in
`FilterSideBar.tsx` to prevent React warnings.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added OpenTelemetry Protocol (OTLP) as a log drain destination with
configurable endpoint, protocol (HTTP/Protobuf), gzip compression, and
custom headers.
* OTLP appears as a selectable destination in the Log Drains UI with its
own icon and form fields.
* **Documentation**
* Added a full OTLP guide including HTTP/Protobuf details, Collector
example, and authentication examples.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Popover ui component to use portal by default, remove all manual declaration of portal for PopoverContent in dashboard
* Forgot to add ui changes lol
* Clean uop
* Bump the deps, refactor deprecated code.
* Migrate keepPreviousData usage.
* Migrate all uses of InfiniteQuery.
* Fix refetchInterval in queries.
* Migrate all use of isLoading to isPending in mutations.
* Fix accessing location in claim-project.
* Fix a bug in duplicate query keys.
* Migrate all queries to use isPending.
* Revert "Fix accessing location in claim-project."
This reverts commit 2a07df64b5.
* Revert the rss.xml file to master.
* fix: field reference button padding
* fix: remove overriding button style on field ref button
* fix: tidy up the asChild stuff on side panel trigger element
* fix: bunch of type errors on logs sidebar
Theres a temp any fix in there dont kill me frontend team :D
* feat: add to new logs sidebar too
* feat: add to download dropdown menus
* chore: alphabetical order on new logs dropdown
* chore: add target blank to sheet footer
* fix: gap between buttons on old logs toolbar
* feat: add a separator on old logs
* style: new logs top buttons correct types
* chore: update react-day-picker
* fix(design system): date picker demos
* refactor(date picker): change logs date picker to use react-day-picker
* refactor(date pickers): change remaining date pickers to use react-day-picker
* cleanup(date pickers): minor code cleanup
* fix(date picker): fix behavior for single day selection
* Refactor Drawer component and add date-fns dependency
Refactored the Drawer component for improved slot-based structure, updated styles, and added 'use client' directive. Added 'date-fns' as a dependency in design-system, updated tsconfig paths for icons, and marked ToggleGroup as a client component.
* nit: add env for svg path
* fix: instructions
* accent color docs and basic tidy
* copy value feature
* improve color contrast
* increase contrast on text-warning in light mode
* update changelog
* replace outdated text-warning utility classes
* remove redundant warning-600
* minor design-system docs updates
* docs updates
* remove unused brand-button class
* update docs
* fix: restore brand default
* update docs brand text color
* low hanging branded text fruit
* Nit refactor and clean up
* re-add Kemal’s README instructions for hot reload
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* decouple editor panel from global state
* refactor again
* dont close assistant
* remove async
* onsave props
* Fix TS errors
* Remove editorPanel state from app-state, use useHotKey hooks for keyboard shortcuts
* Minor UX improvements to EditorPanel
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Prevent arrow key propagation in filter command
Adds an onKeyDown handler to stop ArrowUp and ArrowDown key events from propagating to parent components in DataTableFilterCommand. This prevents unintended navigation behavior when using the filter input.
* Integrate LogsDatePicker into DataTable timerange filter
Replaces DatePickerWithRange with LogsDatePicker in DataTableFilterTimerange, enabling use of helper presets and improved date range selection. Adds support for passing button props and synchronizes filter value logic with the new date picker component.
* Add upgrade prompt for log date range limit
Introduces an upgrade prompt when users select a log date range that exceeds their current plan's retention limits. Uses `maybeShowUpgradePrompt` and `useCurrentOrgPlan` to determine when to show the prompt, improving user awareness of plan restrictions.
* Add unified logs feature preview and toggle controls
Introduces a unified logs feature preview, allowing users to enable or disable a new logs interface with enhanced filtering and real-time updates. Adds context hooks, UI components (UnifiedLogsPreview, LogsSwitchBox), and conditional logic to display the new interface or revert to the old one. Updates routing and feature preview modal to support the unified logs preview, and extends local storage keys for feature flag management.
* Refactor log UI components and remove LogsSwitchBox
Replaced custom SVG icons with Lucide React icons in LogsSidebarMenuV2 and FilterSideBar for consistency and maintainability. Removed the unused LogsSwitchBox component and cleaned up related imports in FeaturePreviewModal.
* Refactor sidebar panels to use FeaturePreviewSidebarPanel
Introduces a reusable FeaturePreviewSidebarPanel component and replaces InnerSideBarEmptyPanel usages in LogsSidebarMenuV2 and FilterSideBar. Removes unified logs feature flag logic from Sidebar and NavigationBar.utils, simplifying route generation and UI logic.
* Refine sidebar panel styles and remove unused icon
Removed the unused Sparkles icon import from LogsSidebarMenuV2. Updated FeaturePreviewSidebarPanel to use 'bg-muted/10' for background, simplified class names for text alignment, and cleaned up redundant text-left classes for improved styling consistency.
* Update FeaturePreviewModal.tsx
* Update FeaturePreview.constants.tsx
* Clean up
* Final clean up
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Improve function logs styling + add copy button
* Add tooltips for buttons in toolbar
* Remove 'info' from levels
* Add export logs to csv and json functionality
* Add duration selection for download logs if no time range specified in search
* Fix TS
* Fix TS
* Update DataTableColumnStatusCode.tsx
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
* Update QueryOptions.ts
* Create UnifiedLogs_InspectionPanel_Architecture.md
* init new queries
* Create UnifiedLogs_ServiceFlow_Implementation_Plan.md
* Add service flow blocks to UnifiedLogs panel
Introduces ServiceFlowBlocks components to visually represent the service flow in UnifiedLogs, including Origin, Network, PostgREST, Postgres, and Response steps. Adds utility formatters and updates ServiceFlowPanel to render the new blocks with enriched data and loading/error states.
* Enable filterable fields in ServiceFlow blocks
Refactored ServiceFlow blocks to support filterable fields by passing filterFields and table props, updating BlockField to render filterable values as clickable actions, and aligning field configs with filterable IDs. Updated ServiceFlowPanel to use new block names and pass required props. This enhances interactivity and consistency in the UnifiedLogs service flow UI.
* Update ServiceFlowBlocks.tsx
* Enhance Service Flow with enriched fields and filtering
Expanded the Service Flow SQL query to extract 35+ flattened, meaningful fields including request, response, client location, network, headers, and JWT data. Updated the implementation plan to reflect new block architecture, filtering integration, and future enhancements. Added debug logging for enriched and raw log data in ServiceFlowPanel.
* Start adding inspection panel
* Moar logs
* Add Postgres service flow support to Unified Logs
Introduces Postgres as a first-class service flow type in Unified Logs, including SQL query, type definitions, UI blocks, and filtering. Updates ServiceFlow queries, types, and UI components to display enriched Postgres log details and event messages. Also refines filter fields, log type ordering, and minor UI adjustments for clarity and consistency.
* Lots of tidying up, moving blocks into their own files.
* Remove UnifiedLogs architecture and service flow docs
Deleted documentation files related to UnifiedLogs inspection panel architecture, service flow field mapping, implementation plan, and integration example. This cleans up outdated or redundant design and implementation reference materials.
* Refactor service flow blocks to use unified config system
Replaces individual service block components with a generic, config-driven system. Introduces a shared Block component and centralizes block configuration in blockConfigs.ts, reducing duplication and improving maintainability. Updates imports and removes now-unnecessary block files. Also refactors ServiceFlowPanel to use the new block structure and simplifies layer icon logic.
* Refactor ServiceFlow blocks and utilities structure
Consolidates edge service flow SQL queries to reduce duplication, removes ServiceFlowBlocks.tsx in favor of more modular block/component structure, and moves storage-specific utilities to a new utils/storageUtils.ts file. Updates imports in config files and ServiceFlowPanel to reflect the new structure. Type definitions are clarified and extended in types.ts.
* Update ServiceFlow.sql.ts
* Refactor ServiceFlow types for stronger type safety
Replaces generic 'any' types with specific types such as ColumnSchema, QuerySearchParamsType, and SearchParamsType in ServiceFlow components and ServiceFlowPanel. This improves type safety and code clarity, and removes unused metadata and workaround variables from ServiceFlowPanel.
* Remove debug flags and console logs from ServiceFlow components
Eliminated unused DEBUG_SERVICE_FLOW flags and related console logging from ServiceFlow.sql.ts and ServiceFlowPanel.tsx to clean up the codebase and reduce unnecessary output.
* Remove unused log query and filtering functions
Deleted unused functions related to log level filtering, base condition building, and the edge/supavisor logs queries. This cleanup simplifies the UnifiedLogs.queries.ts file by removing legacy or currently unused code.
* revert
* Remove ServiceFlow panel and types, update DataTableToolbar
Deleted the ServiceFlowPanel component and its associated types from the UnifiedLogs interface. Updated DataTableToolbar to toggle between PanelLeftClose and PanelLeftOpen icons based on the open state.
* Remove unused totalRows prop from DataTable
Eliminates the totalRows prop from UnifiedLogs and its context interface, as it is no longer used. This helps clean up the component API and related type definitions.
* Refactor log field configs and unify event message component
Replaces specialized PostgresEventMessage with a generic EventMessage component and updates references accordingly. Consolidates all log field configuration files into serviceFlowFields.ts, removing separate config files for each service. Cleans up unused types and utility imports, and deletes redundant formatters.
* Enhance UnifiedLogs filters and facets handling
Added PATCH to allowed HTTP methods and improved status code rendering in filters. Changed Host, Pathname, and Auth User filters to use dynamic checkbox options populated from facets. Updated SQL queries to provide global facets for hardcoded fields and filtered facets for dynamic fields, and fixed field naming for path/pathname consistency. Improved UI to show an empty state when no filter options are available.
* Fix method options mapping and add debug logs
Corrects the mapping variable name in UnifiedLogs.fields.tsx from 'region' to 'method' for clarity. Adds debug console logs in unified-logs-count-query.ts to inspect count query responses and help diagnose missing data.
* Show empty state for Postgres block with no data
Added logic to display an empty state in the Postgres block when no Postgres data is available in non-Postgres logs. Also updated ServiceFlowPanel to render both PostgREST and Postgres blocks, ensuring the empty state is shown when appropriate.
* Remove Log Details tab from ServiceFlowPanel
The Log Details tab and its associated content have been removed from the ServiceFlowPanel component. This simplifies the UI by focusing on the Overview and Raw JSON tabs.
* Enhance UnifiedLogs filters with status code labels and facet logic
Added human-readable labels for HTTP and Postgres status codes and improved the UnifiedLogs filter UI to display these labels. Refactored the logs count query to avoid self-filtering for facet counts, ensuring accurate facet behavior. Improved filter option rendering for better usability and consistency, and updated input styling for filter search.
* Update UnifiedLogs.queries.ts
* Update UnifiedLogs.queries.ts
* Update apps/studio/components/interfaces/UnifiedLogs/ServiceFlow/components/shared/BlockField.tsx
* Refactor UnifiedLogs layout and improve service type formatting
Refactored UnifiedLogs.tsx to use a more flexible ResizablePanelGroup layout, replaced inline function logs panel with a new LogsListPanel component, and removed unused imports and code. Updated ServiceFlow.sql.ts to simplify JWT payload extraction and added a dedicated query for edge function service flow. Added a utility to format service type strings for display in UnifiedLogs.utils.ts.
* Refactor logs UI and improve service flow handling
Renamed FunctionLogsTab to LogsList and added a new LogsListPanel for displaying function logs in a side panel. Improved ServiceFlowPanel with better panel sizing, conditional query enabling, and UI adjustments. Enhanced EventMessage with badge styling and service type formatting. Updated CollapsibleSection for cleaner layout. Enabled debug mode in unified-log-inspection-query. Updated FilterSideBar to use ResizablePanel for improved layout flexibility.
* Refactor UnifiedLogs UI and ServiceFlow query fields
Removes unused skeletonClassName from BlockFieldConfig and related UI, simplifies ServiceFlow SQL query by returning null for unused JWT fields, and updates UnifiedLogs and LogsListPanel for improved layout and collapsible logs panel. Also adjusts table and log list row heights for better visual consistency.
* Update ServiceFlowHeader.tsx
* Update ServiceFlowHeader.tsx
* Refactor ServiceFlowPanel and header tooltip logic
Replaces custom tooltip implementation in ServiceFlowHeader with ButtonTooltip for navigation buttons. Simplifies serviceFlowType logic in ServiceFlowPanel by removing the getServiceFlowType helper and using direct mapping, reducing code complexity.
* Update UnifiedLogs.constants.tsx
* Remove commented code and add doc comment in UnifiedLogs
Removed an unused commented-out span in UnifiedLogs.fields.tsx and added a documentation comment for the Supabase storage logs query fragment in UnifiedLogs.queries.ts.
* Update UnifiedLogs.tsx
* Remove 'live' level from DataTable components
Eliminated the 'live' level from LEVELS constant and related color utility logic. Also removed commented code and references to 'live' in DataTableFilterControls and LiveRow, streamlining the DataTable component's status handling.
* Update UnifiedLogs.constants.tsx
* cleanup
* remove console logs
* Update status filter parsing to use string arrays
Changed the status filter in UnifiedLogs to parse and validate as arrays of strings instead of numbers. This affects both the search params parser and the column filter schema, aligning the status filter handling with other string-based filters.
---------
Co-authored-by: Alaister Young <a@alaisteryoung.com>
* Update QueryOptions.ts
* Create UnifiedLogs_InspectionPanel_Architecture.md
* init new queries
* Create UnifiedLogs_ServiceFlow_Implementation_Plan.md
* Add service flow blocks to UnifiedLogs panel
Introduces ServiceFlowBlocks components to visually represent the service flow in UnifiedLogs, including Origin, Network, PostgREST, Postgres, and Response steps. Adds utility formatters and updates ServiceFlowPanel to render the new blocks with enriched data and loading/error states.
* Enable filterable fields in ServiceFlow blocks
Refactored ServiceFlow blocks to support filterable fields by passing filterFields and table props, updating BlockField to render filterable values as clickable actions, and aligning field configs with filterable IDs. Updated ServiceFlowPanel to use new block names and pass required props. This enhances interactivity and consistency in the UnifiedLogs service flow UI.
* Update ServiceFlowBlocks.tsx
* Enhance Service Flow with enriched fields and filtering
Expanded the Service Flow SQL query to extract 35+ flattened, meaningful fields including request, response, client location, network, headers, and JWT data. Updated the implementation plan to reflect new block architecture, filtering integration, and future enhancements. Added debug logging for enriched and raw log data in ServiceFlowPanel.
* Start adding inspection panel
* Moar logs
* Add Postgres service flow support to Unified Logs
Introduces Postgres as a first-class service flow type in Unified Logs, including SQL query, type definitions, UI blocks, and filtering. Updates ServiceFlow queries, types, and UI components to display enriched Postgres log details and event messages. Also refines filter fields, log type ordering, and minor UI adjustments for clarity and consistency.
* Lots of tidying up, moving blocks into their own files.
* Remove UnifiedLogs architecture and service flow docs
Deleted documentation files related to UnifiedLogs inspection panel architecture, service flow field mapping, implementation plan, and integration example. This cleans up outdated or redundant design and implementation reference materials.
* Refactor service flow blocks to use unified config system
Replaces individual service block components with a generic, config-driven system. Introduces a shared Block component and centralizes block configuration in blockConfigs.ts, reducing duplication and improving maintainability. Updates imports and removes now-unnecessary block files. Also refactors ServiceFlowPanel to use the new block structure and simplifies layer icon logic.
* Refactor ServiceFlow blocks and utilities structure
Consolidates edge service flow SQL queries to reduce duplication, removes ServiceFlowBlocks.tsx in favor of more modular block/component structure, and moves storage-specific utilities to a new utils/storageUtils.ts file. Updates imports in config files and ServiceFlowPanel to reflect the new structure. Type definitions are clarified and extended in types.ts.
* Update ServiceFlow.sql.ts
* Refactor ServiceFlow types for stronger type safety
Replaces generic 'any' types with specific types such as ColumnSchema, QuerySearchParamsType, and SearchParamsType in ServiceFlow components and ServiceFlowPanel. This improves type safety and code clarity, and removes unused metadata and workaround variables from ServiceFlowPanel.
* Remove debug flags and console logs from ServiceFlow components
Eliminated unused DEBUG_SERVICE_FLOW flags and related console logging from ServiceFlow.sql.ts and ServiceFlowPanel.tsx to clean up the codebase and reduce unnecessary output.
* Remove unused log query and filtering functions
Deleted unused functions related to log level filtering, base condition building, and the edge/supavisor logs queries. This cleanup simplifies the UnifiedLogs.queries.ts file by removing legacy or currently unused code.
* revert
* Remove ServiceFlow panel and types, update DataTableToolbar
Deleted the ServiceFlowPanel component and its associated types from the UnifiedLogs interface. Updated DataTableToolbar to toggle between PanelLeftClose and PanelLeftOpen icons based on the open state.
* Remove unused totalRows prop from DataTable
Eliminates the totalRows prop from UnifiedLogs and its context interface, as it is no longer used. This helps clean up the component API and related type definitions.
* Refactor log field configs and unify event message component
Replaces specialized PostgresEventMessage with a generic EventMessage component and updates references accordingly. Consolidates all log field configuration files into serviceFlowFields.ts, removing separate config files for each service. Cleans up unused types and utility imports, and deletes redundant formatters.
* Show empty state for Postgres block with no data
Added logic to display an empty state in the Postgres block when no Postgres data is available in non-Postgres logs. Also updated ServiceFlowPanel to render both PostgREST and Postgres blocks, ensuring the empty state is shown when appropriate.
* Remove Log Details tab from ServiceFlowPanel
The Log Details tab and its associated content have been removed from the ServiceFlowPanel component. This simplifies the UI by focusing on the Overview and Raw JSON tabs.
* Update UnifiedLogs.queries.ts
* Update UnifiedLogs.queries.ts
* Update apps/studio/components/interfaces/UnifiedLogs/ServiceFlow/components/shared/BlockField.tsx
* Refactor UnifiedLogs layout and improve service type formatting
Refactored UnifiedLogs.tsx to use a more flexible ResizablePanelGroup layout, replaced inline function logs panel with a new LogsListPanel component, and removed unused imports and code. Updated ServiceFlow.sql.ts to simplify JWT payload extraction and added a dedicated query for edge function service flow. Added a utility to format service type strings for display in UnifiedLogs.utils.ts.
* Refactor logs UI and improve service flow handling
Renamed FunctionLogsTab to LogsList and added a new LogsListPanel for displaying function logs in a side panel. Improved ServiceFlowPanel with better panel sizing, conditional query enabling, and UI adjustments. Enhanced EventMessage with badge styling and service type formatting. Updated CollapsibleSection for cleaner layout. Enabled debug mode in unified-log-inspection-query. Updated FilterSideBar to use ResizablePanel for improved layout flexibility.
* Refactor UnifiedLogs UI and ServiceFlow query fields
Removes unused skeletonClassName from BlockFieldConfig and related UI, simplifies ServiceFlow SQL query by returning null for unused JWT fields, and updates UnifiedLogs and LogsListPanel for improved layout and collapsible logs panel. Also adjusts table and log list row heights for better visual consistency.
* Update ServiceFlowHeader.tsx
* Update ServiceFlowHeader.tsx
* Refactor ServiceFlowPanel and header tooltip logic
Replaces custom tooltip implementation in ServiceFlowHeader with ButtonTooltip for navigation buttons. Simplifies serviceFlowType logic in ServiceFlowPanel by removing the getServiceFlowType helper and using direct mapping, reducing code complexity.
* Update UnifiedLogs.constants.tsx
* Remove commented code and add doc comment in UnifiedLogs
Removed an unused commented-out span in UnifiedLogs.fields.tsx and added a documentation comment for the Supabase storage logs query fragment in UnifiedLogs.queries.ts.
* Update UnifiedLogs.tsx
* Remove 'live' level from DataTable components
Eliminated the 'live' level from LEVELS constant and related color utility logic. Also removed commented code and references to 'live' in DataTableFilterControls and LiveRow, streamlining the DataTable component's status handling.
* Update UnifiedLogs.constants.tsx
* cleanup
---------
Co-authored-by: Alaister Young <a@alaisteryoung.com>
* Fix z-index position of row
* Fix column widths to make it fit a laptop viewport better
* Fix auto fetching when scrolling to the bottom
* Small style fixes + decouple count loading state from table loading state
* Refactor row uuid to just id, add de-duping logic to logs data, standardise unified logs query options
* Clean up logs
* Misc styling tweaks
* Reinstate prev cursor and direction for live mode
* Clean
* Revert text sizes
* Remove now resolved comments
* Split unified logs count into its own infinite query and refactor main UI to use that new query
* Split unified logs into its own infinite query and refactor main UI to use that new query
* Shift useChartData into unified-logs-chart-query, and refactor main UI to use that new query
* Rename unified-logs-query to unified-logs-infinite-query
* Remove uuid and live params from query string in react queries for unified logs
* init new unified page
* moar logs
* init
* add infinite and live logs example
* Update useLogsPreview.tsx
* add more sources
* wrapped auth logs with edge logs
* add role and user id
* move unified logs
* init
* move demo pages. create a new directory to work in
* extracted beta unified logs into own components
* add example base page and components
* add new files to use actual logging query
* more organization
* change import
* adds new logs page. adds new query
* add data table to UI pacakges
* revert
* table styles
* text size
* add timestamp, table, icons for log types, status code styling
* add host
* add log count to edge functions
* starts to add dynamic filtering
* spiking trace UI
* Update status-code.ts
* add new linik
* now using POST
* fix chart data for default 1 hour view
* update API to accept POST requests
* new filters
* Update level.ts
* fixed up chart to work on level filter. split up the logic into new files
* prep for log type
* prepped query for WHERE
* fix: issue with white space in url param column parsing
* level param now being removed correctly.
* fix issue with chart showing wrong buckets for different time ranges
* remove old query
* refactor the queries into function for each source
* total count fixed
* lots of layout
* start fixing log counts
* comment out min and max for a while
* added trace logging prototype in
* random trace logs added for demo
* added logs and ui to view logs if any
* add Auth user
* fix the live logs issue
* some left over code
* Midway
* First pass refactor + clean up + reorganize files
* Fix TS issues
* Remove unused files
* Clean up
* Final clean up
* more clean up
* More clean up
* Remove unused packages
* Fix
* Lint
* Add feature flag for unified logs
* Refactor
* Remove trace UI
* Snake case log types
* more clean up
* More clean up
* Fix ts
* more clean up
* fixes
* add flag check and redirect if flag is false
* Update middleware.ts
* Nit lint
* Fix
* Last refactors
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
kemal.earth