* feat: remove tabs and unify columns
This removes the tabs from Query Performance with unified columns in the table.
* chore: remove unused imports
* chore: small adjustment to min max and mean time col size
* chore: remove unused prop
* init
* Infinite scrolling pagination for projects in table view
* Infinite scrolling pagination for projects in cards view
* Shift searching projects to URL state + to server side
* Shift status filter to URL state
* opt to use local storage query for view moe
* update wildcard project route
* add created at value, and shift filter status to server side
* Nit
* final nit
* Address comments
* Fix
* Prettier
* Raise page limit to 96
The cron jobs details detail will throw a client side exception while
cron jobs are in running status. This is because the types that we've
defined for cron job details expect both return_message and end_time to
be strings, but they will be null until the cron job is finished.
Fixed the types and added some defensive checks to fix the bug.
Also made some minor tweaks to the table. Figured that end time and
duration can also be shown for failed jobs, doesn't only have to be
succeeded ones.
* feat: tidy up query perf column headers
* feat: update col widths and which ones are sortable
This gives a reasonable column width to all cols as well as adds an option for us to filter out which columns we dont want to make the table sortable by.
* feat: column order and word wrapping for query
* feat: column data text align for numbers
* fix: pointer event was preventing index advisor icon popover
* feat: use code block instead of editor
Swapped Editor out for Code block as its less expensive and modified it to add pgsql syntax highlighting
* fix: small truncation issue
* chore: remove unused sort function
* fix: sort menu closing on first click
Sort menu of a column no longer disappears on first click
* feat: move sorting and ordering over to nuqs
This removes the usage of Next Router params and uses Nuqs instead for managing the QP table sorting and ordering.
* feat: add clear sorting button to filter bar
* chore: remove unused files
* fix: add highlighting for selected sort
* Nit update sort
* nit: smol styling update for direction
* feat: inian feedback on time based numbers
* fix: return number instead of string for total time
We were returning a string for total time percentage which meant the sorting was a little bit off
* Shift roles to nuqs
* chore: clean up
* fix: smaller viewport filter bar
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Wrap up remaining swapping of useCheckPermissions
* remove OrganizationSettingsLayout on billing, team, integrations and usage org pages
* Fix missing loading state in usage page
* Add comments for next step
Security approval is required for PCI compliance. This means we need security approval wherever we embed Stripe for payment methods.
Security approval was previously very coarse and most billing changes required security approval unnecessarily.
This PR aims to move all files relevant for payment method display/changes into a single folder and adjusts the ownership to only require security approval for that.
For compliance reasons we need a billing address for all paying customers. This PR adds a nudge for customers that have not yet put down their billing address.
* change the location of importing SpreadsheetImportPreview component
* Refactor error handling in SpreadsheetImport components
- show the row number with an issue to give users more actionable message
- show only the first error since Papaparse has an issue for row value in errors array
* Refactor error message for spreadsheet import alerts
* Remove items from `results.errors` with duplicate row and code values
* add comment
* Update error badge to show dynamic issue count
* Make errors stand out
* Refactor import/export for SpreadsheetImportPreview component
* Refactor import statements for SpreadsheetImport component
* use size-[value] class
* Refactor error handling to remove duplicates in preview
* Make only items with details clickable
* use proper list element
* use `button` element for clickable items
* add transition for transform
---------
Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>
* 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
* add-ons design
* chore: new generated llms
* Rebuild the pnpm-lock file.
* fix: update vaul dep in ui for drawer
* chore: update radix dialog deps
* fix: clipPath prop on chart tooltip svg
* fix: update dialog deps
* fix: update hover card deps
* fix: remove legacy next link from nav menu docs
* fix: radio group dep update
* fix: scroll area example key
* fix: sheet form readOnly
* fix: slider dep update
* fix: hide empty toast view
* fix: toggle and toggle group dep update
* Rebuild the lockfile.
* chore: updating branch
* fix: remove unused prop in docs
Removes unused prop on Drawer component inside docs causing type error
* filtering refactor
filter refactor
more
* styling
* use popovers instead
* refactor and fine tune
* remove code
* fix portal popover dismissing
* custom component popover
* tests fix
* fix ts
* rm unrelated changes
* fix type error - remove type cast
* undo previewfilterpanel
* fix type
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: kemal <hello@kemal.earth>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
There is a bug in the Table Editor mobile view:
1. Open the Table Editor in mobile.
2. Open a tab with a table.
3. Use the Table Editor Menu to switch schemas. This switches the schema
in the URL and in local storage, but the Table Editor Menu closes
immediately and you can't see the list of tables in the new schema to
pick.
4. Open the Table Editor Menu again to pick a new table. The schema
automatically flips back to the previous schema, and the Table Editor
Menu only flickers open temporarily before closing again. There is no
way to access the tables for your newly selected schema.
The cause of the bug:
There is a useEffect that triggers every time the Table Editor Menu is
opened in mobile. (It technically has selectedTable?.schema in its
dependency array, but since the menu unmounts and remounts on visibility
toggle, the effect runs regardless of whether global selectedTable state
has changed. That's also why desktop works fine, because the menu is
continuously mounted in desktop view.)
When the useEffect runs, it sets the schema to the schema of the
currently selected table. Therefore, what actually happens:
1. Schema is set to `schema_a`. The currently selected table is
`schema_a.table_a`.
2. User changes schema to `schema_b`.
3. User reopens Table Editor Menu. useEffect runs. Currently selected
table is `schema_a.table_a`, so the schema automatically changes back
to `schema_a`. Menu automatically closes.
The fix:
The actual behavior on desktop right now is probably what we want:
- The selected table is only used to set the schema if no explicit
schema is provided.
- If an explicit schema is provided, the user probably chose it, so we
allow the schema to not match the currently selected table. The table tabs
update to include the table schema anyway if the schema changes, so it should
be somewhat obvious that the schema of the menu and the selected table
don't match.
Therefore, the logic we want is `!!selectedTable?.schema &&
!selectedSchema`. Because of this change, we can also take it out of the
useEffect, which means less circular logic.
that
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* feat: remove redundant sort by
We had conflicting sort by dropdown which clashed with the individual column sorting itself. Either we do something similar to our table editor or leave it out for now. Opting to leave it out for now.
* fix: alignment of download dropdown
This aligns the download dropdown on the Query Performance page to look visually correct.
* feat: improved query search
This improves our query search in the Query Performance area. Now it does a local search through the available queries in the table. I removed it requesting the string from server for now. Simple
:x
q
* fix: increased width of filter popover
The roles filter popover is was too narrow for its contents. Increased teh size slightly.
* chore: remove commented out component
* chore: update placeholder for query filter
* fix: leftover prop on query performance page
* feat: reintroduce sql based query for search
Bringing back a hybrid approach - seems to work fine but also returns items that are not in your visible queries.
* feat: use debounce on search query
* feat: use nuqs instead of next router for roles
* Tiny optimization for debounced search to immediately run query if clearing input
* Add clear search CTA
* Remove client side searching
* Revert changes in useIndexInvalidation
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* fix: estimate data branch cost before creation
* chore: comments to clarify conditionals
* Use addons endpoint to check for compute size instead
* Revert branchComputeSize changes
* Fix
* chore: update compute size only on data branch
* chore: replace slow query with disk size estimate
* Add loading and error states for disk attr, and update copy in create branch modal
* Update copy to improve transparency on billing
* Tiny fix
* Nit
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* 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>
* fix: date range picker dropdown width
This fixes the date range pickers width on the Usage section. No more crumpled up menu items.
* chore: remove AI slop empty classes
* feat: get rid of legacy scaffold header on usage page
* chore: remove legacy scaffold from no permissions layout on usage
* feat: improve styling for sticky header area
* nit: small uppercase for a p
* fix: padding for no permission banner
Was missing the ScaffoldHeader wrapper
* feat: update loading skeleton for header area
* style: same breakpoints for header loading skeletons
* feat: remove ListBox in favour or Select_Shadcn_ for our project dropdown
* fix: logic for admonition when project is selected
* fix: remove rogue border from total usage grid
* fix: use proper background colour for sticky bar
* fix: more info link click area
* fix: reduce width of hover card on compute metrics
* feat: remove separator from usage section headers
* fix: revert width of hover cards for compute and billing metric
* fix type size and chevron tint
* only wrap anchored metrics in Link
otherwise non-anchored metrics get #undefined Link and unnecessary pointer
* style: shore up sections with headers
* fix: reset select state to undefined
The setSelectedProjectRef was causing our rings not to show on the usage table.
* Fixy
* Nit refactors and fixes
---------
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
For customers who have not yet put down a billing address, we want to ensure that they put down an address when they upgrade their plan.
Customers can also no longer unset their billing address.
* rm dupped value
* use zod in reportsnumericfilter
* use zod in reportsselectfilter
* use nuqs in filters
* validate data before change
* unnecessary changes
* fix some type errs update tests
* use command to add search to select filter
* update styles / clear btn in num filter
* add search to edge fn report
* fix clickable area
* fix test
* default true
* fix availablein
* sum paddin
* fix default values in tests
* Add CodeBlock for SQL query display to add syntax highlight
* use monaco editor for better highlighting
* create `SqlMonacoBlock` component for SQL in detail panel
* add mean_time to most_time_comsuming queries
* make outline transparent
* Add keyboard navigation for query performance grid
* Stop default RDG behavior on arrow key navigation
* Update column minWidth values to remove horizontal scrollbar
* Load SqlMonacoBlock and Editor client-side only
- following a pattern in `SQLEditor.tsx`
kemal.earth