mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
Saxon Fletcher
cc6fe2100a
## Summary - define application-owned database and logs source contracts, defaults, validation, labels, and execution endpoints - extract controlled database and logs parameter controls for reuse outside SQL snippets - adapt the SQL editor to the shared source model without changing snippet behavior - standardize source icons at 16px with a 2px stroke - keep relative logs ranges aligned with the existing date picker units ## To test 1. Open an existing query in the SQL Editor and run it against the database. 2. Switch the query source to Logs, change the time range, and confirm the query still runs as expected. ## Why Explorer queries and notebook query cells need to select an execution source without coupling that source to SQL snippets. This provides the shared registry and controlled UI foundation for those consumers. ## Impact Existing SQL snippets retain their current database/logs routing and session behavior. The registry documents the SQL editor legacy database-selector adapter while new consumers own their identifier inline. The shared Logs date picker remains unchanged; query ranges support its existing minute, hour, and day units. This PR does not add the Explorer query tab itself. ## Validation - pnpm --filter studio typecheck - focused Vitest coverage for the registry, canonical log-range utilities, SQL execution adapters, source filtering, retention locking, custom ranges, and preset selection - pnpm --filter studio run lint:ratchet Component and state tests cover this change per the Studio testing guidance; no E2E test is added. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a unified query-source menu for database queries and logs. * Added custom log time-range selection with calendar support and retention-aware upgrade prompts. * Added consistent source icons and improved database selection handling. * Added support for relative and absolute log time ranges. * **Bug Fixes** * Improved log-range validation, defaults, and current-time handling. * Updated query execution to use the correct source-specific endpoints. * **Tests** * Expanded coverage for query sources, log ranges, menus, and retention behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
88 lines
3.2 KiB
TypeScript
88 lines
3.2 KiB
TypeScript
import { screen } from '@testing-library/react'
|
||
import userEvent from '@testing-library/user-event'
|
||
import { mockAnimationsApi } from 'jsdom-testing-mocks'
|
||
import { beforeEach, describe, expect, it } from 'vitest'
|
||
|
||
import { QuerySourceMenu } from '@/components/interfaces/SQLEditor/UtilityPanel/QuerySourceMenu/QuerySourceMenu'
|
||
import { DEFAULT_LOG_TIME_RANGE } from '@/data/query-sources/query-source-registry'
|
||
import { customRender } from '@/tests/lib/custom-render'
|
||
import { addAPIMock } from '@/tests/lib/msw'
|
||
|
||
// QuerySourceMenu renders a Radix dropdown (+ nested dialog), both of which use Web Animations.
|
||
mockAnimationsApi()
|
||
|
||
beforeEach(() => {
|
||
addAPIMock({
|
||
method: 'get',
|
||
path: '/platform/projects/:ref',
|
||
response: {
|
||
id: 1,
|
||
ref: 'default',
|
||
organization_id: 1,
|
||
name: 'Test Project',
|
||
status: 'ACTIVE_HEALTHY',
|
||
cloud_provider: 'AWS',
|
||
region: 'us-east-1',
|
||
db_host: 'db.default.supabase.co',
|
||
restUrl: 'https://default.supabase.co/rest/v1/',
|
||
inserted_at: '2024-01-01T00:00:00Z',
|
||
updated_at: '2024-01-01T00:00:00Z',
|
||
subscription_id: 'sub_123',
|
||
is_branch_enabled: false,
|
||
is_physical_backups_enabled: false,
|
||
high_availability: false,
|
||
integration_source: null,
|
||
connectionString: 'postgresql://postgres@localhost:5432/postgres',
|
||
is_hibernating: false,
|
||
},
|
||
})
|
||
})
|
||
|
||
describe('QuerySourceMenu', () => {
|
||
it('hides logs when creating logs queries is unavailable', async () => {
|
||
customRender(
|
||
<QuerySourceMenu
|
||
id="database-snippet"
|
||
runSource={{ type: 'database' }}
|
||
canCreateLogsSnippet={false}
|
||
/>
|
||
)
|
||
|
||
await userEvent.click(screen.getByRole('button', { name: 'Query source: Database' }))
|
||
|
||
expect(screen.queryByText('Logs')).not.toBeInTheDocument()
|
||
})
|
||
|
||
it('keeps the dropdown open across a source switch, so the new source’s controls appear without reopening it', async () => {
|
||
// Selecting a source doesn't mutate `runSource` in place — it navigates to a
|
||
// fresh tab, and the parent re-renders this component with the new source once
|
||
// the route lands. Rerendering with the switched-to prop below stands in for
|
||
// that navigation, so the test observes exactly what the user does: does the
|
||
// dropdown have to be reopened to see the newly-available controls?
|
||
const { rerender } = customRender(
|
||
<QuerySourceMenu id="new-snippet" runSource={{ type: 'database' }} canCreateLogsSnippet />
|
||
)
|
||
|
||
await userEvent.click(screen.getByRole('button', { name: 'Query source: Database' }))
|
||
|
||
expect(await screen.findByText('Run as')).toBeInTheDocument()
|
||
expect(screen.queryByText('Time range')).not.toBeInTheDocument()
|
||
|
||
await userEvent.click(screen.getByText('Logs'))
|
||
|
||
rerender(
|
||
<QuerySourceMenu
|
||
id="new-snippet"
|
||
runSource={{ type: 'logs', dateRange: DEFAULT_LOG_TIME_RANGE }}
|
||
canCreateLogsSnippet
|
||
/>
|
||
)
|
||
|
||
// The dropdown never closed, so the logs-only "Time range" control is visible
|
||
// immediately, and the database-only controls are gone — without the user
|
||
// having to reopen the menu.
|
||
expect(screen.getByText('Time range')).toBeInTheDocument()
|
||
expect(screen.queryByText('Run as')).not.toBeInTheDocument()
|
||
})
|
||
})
|