diff --git a/apps/studio/components/grid/components/header/Header.tsx b/apps/studio/components/grid/components/header/Header.tsx
index 45c69218f9981..1b414f79ff1eb 100644
--- a/apps/studio/components/grid/components/header/Header.tsx
+++ b/apps/studio/components/grid/components/header/Header.tsx
@@ -7,7 +7,6 @@ import { toast } from 'sonner'
import { useDispatch, useTrackedState } from 'components/grid/store/Store'
import type { Filter, Sort, SupaTable } from 'components/grid/types'
-import { Markdown } from 'components/interfaces/Markdown'
import { formatTableRowsToSQL } from 'components/interfaces/TableGridEditor/TableEntity.utils'
import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
import { ButtonTooltip } from 'components/ui/ButtonTooltip'
@@ -31,12 +30,22 @@ import {
} from 'ui'
import FilterPopover from './filter/FilterPopover'
import { SortPopover } from './sort'
+import Link from 'next/link'
// [Joshen] CSV exports require this guard as a fail-safe if the table is
// just too large for a browser to keep all the rows in memory before
// exporting. Either that or export as multiple CSV sheets with max n rows each
export const MAX_EXPORT_ROW_COUNT = 500000
-export const MAX_EXPORT_ROW_COUNT_MESSAGE = `Sorry! We're unable to support exporting row counts larger than ${MAX_EXPORT_ROW_COUNT.toLocaleString()} at the moment. Alternatively, you may consider using [pg_dump](https://supabase.com/docs/reference/cli/supabase-db-dump) via our CLI instead.`
+export const MAX_EXPORT_ROW_COUNT_MESSAGE = (
+ <>
+ Sorry! We're unable to support exporting row counts larger than $
+ {MAX_EXPORT_ROW_COUNT.toLocaleString()} at the moment. Alternatively, you may consider using
+
+ pg_dump
+ {' '}
+ via our CLI instead.
+ >
+)
export type HeaderProps = {
table: SupaTable
@@ -290,7 +299,9 @@ const RowHeader = ({ table, sorts, filters }: RowHeaderProps) => {
setIsExporting(true)
if (allRowsSelected && totalRows > MAX_EXPORT_ROW_COUNT) {
- toast.error(
{suggestions.title}
}}
onClick={() => setShowCode(!showCode)}
- tooltip={{ content: { side: 'bottom', text: 'Show query' } }}
+ tooltip={{
+ content: { side: 'bottom', text: showCode ? 'Hide query' : 'Show query' },
+ }}
/>
{!isInSQLEditor || isInNewSnippet ? (
@@ -314,7 +316,7 @@ export const SqlCard = ({
value={sql}
language="sql"
className={cn(
- 'max-w-full max-h-96 block !bg-transparent !py-3 !px-3.5 prose dark:prose-dark border-0 border-t text-foreground !rounded-none w-full',
+ 'max-h-96 max-w-none block !bg-transparent !py-3 !px-3.5 prose dark:prose-dark border-0 border-t text-foreground !rounded-none w-full',
'[&>code]:m-0 [&>code>span]:flex [&>code>span]:flex-wrap [&>code]:block [&>code>span]:text-foreground'
)}
/>
diff --git a/apps/studio/components/ui/Forms/FormHeader.tsx b/apps/studio/components/ui/Forms/FormHeader.tsx
index a29b9caa98ad1..8e7aa44487420 100644
--- a/apps/studio/components/ui/Forms/FormHeader.tsx
+++ b/apps/studio/components/ui/Forms/FormHeader.tsx
@@ -1,6 +1,3 @@
-import ReactMarkdown from 'react-markdown'
-
-import { Markdown } from 'components/interfaces/Markdown'
import { ReactNode } from 'react'
import { cn } from 'ui'
import { DocsButton } from '../DocsButton'
@@ -21,12 +18,8 @@ const FormHeader = ({
return (