mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 18:35:07 +03:00
kemal.earth
70a64f8c00
* 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
29 lines
824 B
TypeScript
29 lines
824 B
TypeScript
import { HTMLAttributes } from 'react'
|
|
|
|
import { cn } from 'ui'
|
|
import { calculateImprovement } from './index-advisor.utils'
|
|
|
|
interface IndexImprovementTextProps extends HTMLAttributes<HTMLParagraphElement> {
|
|
indexStatements: string[]
|
|
totalCostBefore: number
|
|
totalCostAfter: number
|
|
}
|
|
|
|
export const IndexImprovementText = ({
|
|
indexStatements,
|
|
totalCostBefore,
|
|
totalCostAfter,
|
|
className,
|
|
...props
|
|
}: IndexImprovementTextProps) => {
|
|
const improvement = calculateImprovement(totalCostBefore, totalCostAfter)
|
|
|
|
return (
|
|
<p className={cn('text-sm text-foreground-light', className)} {...props}>
|
|
Query's performance can be improved by{' '}
|
|
<span className="text-brand">{improvement.toFixed(2)}%</span> by creating this{' '}
|
|
{indexStatements.length > 1 ? 'indexes' : 'index'}:
|
|
</p>
|
|
)
|
|
}
|