mirror of
https://github.com/supabase/supabase.git
synced 2026-10-12 12:55:06 +03:00
* 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
93 lines
2.9 KiB
TypeScript
93 lines
2.9 KiB
TypeScript
import { useMemo } from 'react'
|
|
|
|
import { useParams } from 'common'
|
|
import { COMMAND_MENU_SECTIONS } from 'components/interfaces/App/CommandMenu/CommandMenu.utils'
|
|
import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
|
|
import type { CommandOptions, ICommand } from 'ui-patterns/CommandMenu'
|
|
import { orderSectionFirst, useQuery, useRegisterCommands } from 'ui-patterns/CommandMenu'
|
|
|
|
const QUERY_PERFORMANCE_COMMAND_ID = 'nav-reports-query-performance'
|
|
|
|
export function useReportsGotoCommands(options?: CommandOptions) {
|
|
let { ref } = useParams()
|
|
ref ||= '_'
|
|
|
|
const { reportsAll } = useIsFeatureEnabled(['reports:all'])
|
|
|
|
const commandQuery = useQuery()?.toLowerCase() ?? ''
|
|
const prioritizeQueryPerformance = commandQuery.includes('query')
|
|
|
|
const orderQueryPerformanceCommand = useMemo(() => {
|
|
if (!prioritizeQueryPerformance) return undefined
|
|
|
|
return (existingCommands: ICommand[], incomingCommands: ICommand[]) => {
|
|
const filteredExisting = existingCommands.filter(
|
|
(command) => command.id !== QUERY_PERFORMANCE_COMMAND_ID
|
|
)
|
|
|
|
return [...incomingCommands, ...filteredExisting]
|
|
}
|
|
}, [prioritizeQueryPerformance])
|
|
|
|
const orderNavigateSection = useMemo<CommandOptions['orderSection'] | undefined>(() => {
|
|
return prioritizeQueryPerformance ? orderSectionFirst : options?.orderSection
|
|
}, [options?.orderSection, prioritizeQueryPerformance])
|
|
|
|
useRegisterCommands(
|
|
COMMAND_MENU_SECTIONS.NAVIGATE,
|
|
reportsAll
|
|
? [
|
|
{
|
|
id: 'nav-reports',
|
|
name: 'Reports',
|
|
route: `/project/${ref}/reports`,
|
|
defaultHidden: true,
|
|
},
|
|
{
|
|
id: 'nav-reports-api',
|
|
name: 'API Reports',
|
|
route: `/project/${ref}/reports/api-overview`,
|
|
defaultHidden: true,
|
|
},
|
|
{
|
|
id: 'nav-reports-storage',
|
|
name: 'Storage Reports',
|
|
route: `/project/${ref}/reports/storage`,
|
|
defaultHidden: true,
|
|
},
|
|
{
|
|
id: 'nav-reports-database',
|
|
name: 'Database Reports',
|
|
route: `/project/${ref}/reports/database`,
|
|
defaultHidden: true,
|
|
},
|
|
]
|
|
: [],
|
|
{
|
|
...options,
|
|
orderSection: orderNavigateSection,
|
|
deps: [ref, orderNavigateSection, ...(options?.deps ?? [])],
|
|
}
|
|
)
|
|
|
|
useRegisterCommands(
|
|
COMMAND_MENU_SECTIONS.NAVIGATE,
|
|
reportsAll
|
|
? [
|
|
{
|
|
id: QUERY_PERFORMANCE_COMMAND_ID,
|
|
name: 'Query Performance Reports',
|
|
route: `/project/${ref}/reports/query-performance`,
|
|
defaultHidden: true,
|
|
},
|
|
]
|
|
: [],
|
|
{
|
|
...options,
|
|
orderCommands: orderQueryPerformanceCommand ?? options?.orderCommands,
|
|
orderSection: orderNavigateSection,
|
|
deps: [ref, orderQueryPerformanceCommand, orderNavigateSection, ...(options?.deps ?? [])],
|
|
}
|
|
)
|
|
}
|