-
-
- }>
- More about import maps
-
-
-
+ }
+ >
+
+ More about import maps
+
+
- {icon && typeof icon == 'string' ? (
-
- )}
-
+
+ {children ? (
+ children
+ ) : (
+
-
- ) : (
- icon
- )}
- {title}
-{description}
-
+ {icon && typeof icon == 'string' ? (
+
+ )}
)
}
diff --git a/apps/docs/components/CustomHTMLElements/Heading.tsx b/apps/docs/components/CustomHTMLElements/Heading.tsx
index 336dba4d0f..7ef568146c 100644
--- a/apps/docs/components/CustomHTMLElements/Heading.tsx
+++ b/apps/docs/components/CustomHTMLElements/Heading.tsx
@@ -28,7 +28,7 @@ interface Props {
* need to parse the and generate anchors. Custom anchors are used in tsx files.
* (see: /pages/guides/cli/config.tsx)
*/
-const Heading: React.FC
+
+ ) : (
+ icon
+ )}
+ {title}
+{description}
+- {extension.comment.charAt(0).toUpperCase() + extension.comment.slice(1)} -
-+ {extension.comment.charAt(0).toUpperCase() + extension.comment.slice(1)} +
+
//
-
-
-
-
-
+
)
}
@@ -181,23 +179,23 @@ const EditWrapper = () => {
].join(' ')}
>
-
-
diff --git a/apps/docs/components/Flag/FlagProvider.tsx b/apps/docs/components/Flag/FlagProvider.tsx
index 4cb3f362fa..9e777ea190 100644
--- a/apps/docs/components/Flag/FlagProvider.tsx
+++ b/apps/docs/components/Flag/FlagProvider.tsx
@@ -1,8 +1,8 @@
-import { FC, useEffect, useState } from 'react'
+import { FC, PropsWithChildren, useEffect, useState } from 'react'
// import createConfigCatClient from 'configcat-js'
import FlagContext from './FlagContext'
-const FlagProvider: FC = ({ children }) => {
+const FlagProvider: FC> = ({ children }) => {
const [store, setStore] = useState({})
const { Provider } = FlagContext
diff --git a/apps/docs/components/HomePageCover.tsx b/apps/docs/components/HomePageCover.tsx
index 1d887ae3dc..9487e0fc52 100644
--- a/apps/docs/components/HomePageCover.tsx
+++ b/apps/docs/components/HomePageCover.tsx
@@ -84,15 +84,13 @@ const HomePageCover = (props) => {
{frameworks.map((framework, i) => (
-
-
-
diff --git a/apps/docs/components/JwtGenerator.js b/apps/docs/components/JwtGenerator.js
index f435a6db78..884f5fd0af 100644
--- a/apps/docs/components/JwtGenerator.js
+++ b/apps/docs/components/JwtGenerator.js
@@ -1,6 +1,6 @@
-import React, { useState } from 'react'
import KJUR from 'jsrsasign'
-import { Button, Select, Input, CodeBlock } from 'ui'
+import { useState } from 'react'
+import { Button, CodeBlock, Input, Select } from 'ui'
const JWT_HEADER = { alg: 'HS256', typ: 'JWT' }
const now = new Date()
@@ -44,7 +44,7 @@ export default function JwtGenerator({}) {
return (
-
+
diff --git a/studio/components/interfaces/Database/Wrappers/EditWrapper.tsx b/studio/components/interfaces/Database/Wrappers/EditWrapper.tsx
index 0a90ef2115..f34b0e78cf 100644
--- a/studio/components/interfaces/Database/Wrappers/EditWrapper.tsx
+++ b/studio/components/interfaces/Database/Wrappers/EditWrapper.tsx
@@ -125,11 +125,9 @@ const EditWrapper = () => {
wrapper.
-
+
-
- {description ? (
- <>
-
)
}
@@ -130,23 +128,19 @@ const CreateWrapper = () => {
].join(' ')}
>
-
-
{title}
-{description}
- - ) : ( -
- {icon}
-
- )}
-
+
+ {description ? (
+ <>
+ {title}
-{title}
+{description}
+ + ) : ( +
+ {icon}
+
+ )}
)
}
diff --git a/apps/docs/components/Navigation/Footer.tsx b/apps/docs/components/Navigation/Footer.tsx
index b18b0880b7..c5d89404ca 100644
--- a/apps/docs/components/Navigation/Footer.tsx
+++ b/apps/docs/components/Navigation/Footer.tsx
@@ -28,10 +28,13 @@ const Footer = () => (
)}
{Icon && {title}
+{text}
- - - {ctaLabel} - + + {ctaLabel} ))} @@ -40,14 +43,14 @@ const Footer = () => (
-
- © Supabase Inc
+
+ © Supabase Inc
—
{secondaryLinks.map(({ component: Component, ...item }) =>
item.url ? (
-
- {item.title}
+
+ {item.title}
) : (
Component && (
diff --git a/apps/docs/components/Navigation/NavigationMenu/HomeMenu.tsx b/apps/docs/components/Navigation/NavigationMenu/HomeMenu.tsx
index 9800235c5f..28fa29b18f 100644
--- a/apps/docs/components/Navigation/NavigationMenu/HomeMenu.tsx
+++ b/apps/docs/components/Navigation/NavigationMenu/HomeMenu.tsx
@@ -35,22 +35,20 @@ const NavigationMenuHome = () => {
} else {
return (
-
-
- {link?.icon &&
- Community
-
- )}
-
-
+
+ {link?.icon &&
+ Community
+
+ )}
+
)
}
diff --git a/apps/docs/components/Navigation/NavigationMenu/HomeMenuIcons.tsx b/apps/docs/components/Navigation/NavigationMenu/HomeMenuIcons.tsx
index 09ed2ae29f..d2b0636a8b 100644
--- a/apps/docs/components/Navigation/NavigationMenu/HomeMenuIcons.tsx
+++ b/apps/docs/components/Navigation/NavigationMenu/HomeMenuIcons.tsx
@@ -313,8 +313,8 @@ export function IconMenuPlatform({ width = 16, height = 16 }: HomeMenuIcon) {
xmlns="http://www.w3.org/2000/svg"
>
-
-
- {icon && 
}
- {title}
-
+
+ {icon && }
+ {title}
)
@@ -96,20 +97,19 @@ const NavigationMenuCliList = ({ currentLevel, setLevel, id }) => {
].join(' ')}
>
setToggleListenEventValue(null)}
+ onSelectConfirm={() => {
+ toggleListenEvent()
+ }}
+ >
+
+
+
)
}
diff --git a/studio/components/interfaces/Database/Publications/PublicationsTables.tsx b/studio/components/interfaces/Database/Publications/PublicationsTables.tsx
index 9b881dddd5..80e326943b 100644
--- a/studio/components/interfaces/Database/Publications/PublicationsTables.tsx
+++ b/studio/components/interfaces/Database/Publications/PublicationsTables.tsx
@@ -55,7 +55,7 @@ const PublicationsTables = ({ selectedPublication, onSelectBack }: PublicationsT
// const toggleReplicationForAllTables = async (publication: any, disable: boolean) => {
// const toggle = disable ? 'disable' : 'enable'
- // confirmAlert({
+ // ConfirmAlert({
// title: 'Confirm',
// type: 'warn',
// message: `Are you sure you want to ${toggle} replication for all tables in ${publication.name}?`,
diff --git a/studio/components/interfaces/Database/Wrappers/CreateWrapper.tsx b/studio/components/interfaces/Database/Wrappers/CreateWrapper.tsx
index fa28dd5bc2..3f0774206f 100644
--- a/studio/components/interfaces/Database/Wrappers/CreateWrapper.tsx
+++ b/studio/components/interfaces/Database/Wrappers/CreateWrapper.tsx
@@ -76,11 +76,9 @@ const CreateWrapper = () => {
wrapper.
-
-
-
-
-
+
-
-
-
)}
+
+
-
![]()
{
return (
-
- {props.children}
+
+ {props.children}
)
}
@@ -93,17 +93,16 @@ const ContentAccordionLink = React.memo(function ContentAccordionLink(props: any
{props.subItem.items.map((subSubItem) => {
return (
-
-
- {subSubItem.name}
-
+
+ {subSubItem.name}
)
@@ -120,25 +119,19 @@ const ContentLink = React.memo(function ContentLink(props: any) {
return (
-
-
- {props.icon && (
-
)
@@ -149,29 +142,26 @@ const Content = (props) => {
return (
@@ -63,16 +65,13 @@ const Migrations = () => {
variant="warning"
title="Failed to retrieve migration history for database"
actions={[
-
-
-
-
- ,
+ ,
]}
>
-
+
+
+
+ Back to menu
+
- Back to menu
-
+ -
-
-
-
-
-
+
+
+
+ Back to Home
-
-
-
+
- Back to Home
-
+
-
-
+
+
+
{menu.items.map((x) => {
diff --git a/apps/docs/components/Navigation/NavigationMenu/NavigationMenuRefListItems.tsx b/apps/docs/components/Navigation/NavigationMenu/NavigationMenuRefListItems.tsx
index 8c2007c78b..b325efb3a9 100644
--- a/apps/docs/components/Navigation/NavigationMenu/NavigationMenuRefListItems.tsx
+++ b/apps/docs/components/Navigation/NavigationMenu/NavigationMenuRefListItems.tsx
@@ -4,7 +4,7 @@ import { useRouter } from 'next/router'
import { IconChevronLeft, IconChevronUp, cn } from 'ui'
import * as NavItems from './NavigationMenu.constants'
-import Image from 'next/image'
+import Image from 'next/legacy/image'
import RevVersionDropdown from '~/components/RefVersionDropdown'
import { useMenuActiveRefId } from '~/hooks/useMenuState'
@@ -176,20 +176,19 @@ const NavigationMenuRefListItems = ({
return (
-
-
-
diff --git a/studio/components/interfaces/Database/Migrations/Migrations.tsx b/studio/components/interfaces/Database/Migrations/Migrations.tsx
index 324aad1362..93706d22cb 100644
--- a/studio/components/interfaces/Database/Migrations/Migrations.tsx
+++ b/studio/components/interfaces/Database/Migrations/Migrations.tsx
@@ -38,13 +38,15 @@ const Migrations = () => {
-
diff --git a/studio/components/interfaces/Database/Hooks/HooksList/HookList.tsx b/studio/components/interfaces/Database/Hooks/HooksList/HookList.tsx
index 2edb983e96..b890a48919 100644
--- a/studio/components/interfaces/Database/Hooks/HooksList/HookList.tsx
+++ b/studio/components/interfaces/Database/Hooks/HooksList/HookList.tsx
@@ -1,7 +1,7 @@
import * as Tooltip from '@radix-ui/react-tooltip'
import { PermissionAction } from '@supabase/shared-types/out/constants'
import { includes, noop } from 'lodash'
-import Image from 'next/image'
+import Image from 'next/legacy/image'
import { useParams } from 'common/hooks'
import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
diff --git a/studio/components/interfaces/Database/Hooks/HooksList/HooksList.tsx b/studio/components/interfaces/Database/Hooks/HooksList/HooksList.tsx
index f17a940567..1caa2386ae 100644
--- a/studio/components/interfaces/Database/Hooks/HooksList/HooksList.tsx
+++ b/studio/components/interfaces/Database/Hooks/HooksList/HooksList.tsx
@@ -87,13 +87,15 @@ const HooksList = ({
onChange={(e) => setFilterString(e.target.value)}
/>
-
+
+
+
+ Back to Main Menu
+
- Back to Main Menu
-
+ Select which edge function to trigger
No edge functions created yet
- - - - - +{errors.http_url}
}
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
-
- }>
-
- Documentation
-
-
-
-
- }>
-
- Optimization with index_advisor
-
-
-
+ }>
+
+ Documentation
+
+
+ }>
+
+ Optimization with index_advisor
+
+
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
diff --git a/studio/components/interfaces/Database/Publications/PublicationsList.tsx b/studio/components/interfaces/Database/Publications/PublicationsList.tsx
index fa2b16dafc..36c9004a00 100644
--- a/studio/components/interfaces/Database/Publications/PublicationsList.tsx
+++ b/studio/components/interfaces/Database/Publications/PublicationsList.tsx
@@ -2,13 +2,18 @@ import { PermissionAction } from '@supabase/shared-types/out/constants'
import { noop } from 'lodash'
import { observer } from 'mobx-react-lite'
import { useState } from 'react'
-import { Button, IconAlertCircle, IconSearch, Input, Toggle } from 'ui'
-import { confirmAlert } from 'components/to-be-cleaned/ModalsDeprecated/ConfirmModal'
import Table from 'components/to-be-cleaned/Table'
+import ConfirmationModal from 'components/ui/ConfirmationModal'
import InformationBox from 'components/ui/InformationBox'
import NoSearchResults from 'components/ui/NoSearchResults'
import { useCheckPermissions, useStore } from 'hooks'
+import { Button, IconAlertCircle, IconSearch, Input, Modal, Toggle } from 'ui'
+
+interface PublicationEvent {
+ event: string
+ key: string
+}
interface PublicationsListProps {
onSelectPublication: (id: number) => void
@@ -23,7 +28,7 @@ const PublicationsList = ({ onSelectPublication = noop }: PublicationsListProps)
'publications'
)
- const publicationEvents = [
+ const publicationEvents: PublicationEvent[] = [
{ event: 'Insert', key: 'publish_insert' },
{ event: 'Update', key: 'publish_update' },
{ event: 'Delete', key: 'publish_delete' },
@@ -34,30 +39,34 @@ const PublicationsList = ({ onSelectPublication = noop }: PublicationsListProps)
? meta.publications.list()
: meta.publications.list((publication: any) => publication.name.includes(filterString))
- const toggleListenEvent = async (publication: any, event: any, currentStatus: any) => {
- const startStop = currentStatus ? 'stop' : 'start'
- confirmAlert({
- title: 'Confirm',
- message: `Are you sure you want to ${startStop} sending ${event} events for ${publication.name}?`,
- onAsyncConfirm: async () => {
- try {
- let payload: any = { id: publication.id }
- payload[`publish_${event}`] = !currentStatus
- const { data, error }: any = await meta.publications.update(publication.id, payload)
- if (error) {
- throw error
- } else {
- return data
- }
- } catch (error: any) {
- ui.setNotification({
- category: 'error',
- message: `Failed to toggle for ${publication.name}: ${error.message}`,
- })
- return false
- }
- },
- })
+ const [toggleListenEventValue, setToggleListenEventValue] = useState<{
+ publication: any
+ event: PublicationEvent
+ currentStatus: any
+ } | null>(null)
+
+ const toggleListenEvent = async () => {
+ if (!toggleListenEventValue) return
+
+ const { publication, event, currentStatus } = toggleListenEventValue
+
+ try {
+ let payload: any = { id: publication.id }
+ payload[`publish_${event.event.toLowerCase()}`] = !currentStatus
+ const { data, error }: any = await meta.publications.update(publication.id, payload)
+ if (error) {
+ throw error
+ } else {
+ setToggleListenEventValue(null)
+ return data
+ }
+ } catch (error: any) {
+ ui.setNotification({
+ category: 'error',
+ message: `Failed to toggle for ${publication.name}: ${error.message}`,
+ })
+ return false
+ }
}
return (
@@ -101,7 +110,7 @@ const PublicationsList = ({ onSelectPublication = noop }: PublicationsListProps)
Source
,
]}
- body={publications.map((x: any, i: number) => (
+ body={publications.map((x, i) => (
+ Are you sure you want to {toggleListenEventValue?.currentStatus ? 'stop' : 'start'}{' '} + sending {toggleListenEventValue?.event.event.toLowerCase()} events for{' '} + {toggleListenEventValue?.publication.name}? +
+
-
-
+ Back
-
+
Back
+Create a {wrapperMeta.label} Wrapper
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
-
-
+ Back
-
+
Back
+Edit wrapper: {wrapper.name}
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
diff --git a/studio/components/interfaces/Database/Wrappers/InputField.tsx b/studio/components/interfaces/Database/Wrappers/InputField.tsx
index ff44468b97..b85d46da7c 100644
--- a/studio/components/interfaces/Database/Wrappers/InputField.tsx
+++ b/studio/components/interfaces/Database/Wrappers/InputField.tsx
@@ -27,14 +27,12 @@ const InputField = ({ option, loading, error }: InputFieldProps) => {
@@ -55,14 +53,12 @@ const InputField = ({ option, loading, error }: InputFieldProps) => {
diff --git a/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx b/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx
index 2ff3cf2590..d71714ed1b 100644
--- a/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx
+++ b/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx
@@ -1,7 +1,7 @@
import * as Tooltip from '@radix-ui/react-tooltip'
import { PermissionAction } from '@supabase/shared-types/out/constants'
import { partition } from 'lodash'
-import Image from 'next/image'
+import Image from 'next/legacy/image'
import Link from 'next/link'
import { Button, Collapsible, IconChevronUp, IconEdit, IconExternalLink, IconTrash } from 'ui'
@@ -104,11 +104,10 @@ const WrapperRow = ({
{metadata.label}:
- - Encrypted in Vault -
- {table.name}
-
-
+
+ {table.name}
+
))
) : (
@@ -139,13 +133,11 @@ const WrapperRow = ({
{canManageWrappers ? (
-
- }
- className="py-2"
- />
-
+ }
+ className="py-2"
+ />
) : (
diff --git a/studio/components/interfaces/Database/Wrappers/Wrappers.tsx b/studio/components/interfaces/Database/Wrappers/Wrappers.tsx
index 4df6da43ad..da306dddf7 100644
--- a/studio/components/interfaces/Database/Wrappers/Wrappers.tsx
+++ b/studio/components/interfaces/Database/Wrappers/Wrappers.tsx
@@ -49,13 +49,15 @@ const Wrappers = () => {
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
{isWrappersEnabled &&
diff --git a/studio/components/interfaces/Database/Wrappers/WrappersDisabledState.tsx b/studio/components/interfaces/Database/Wrappers/WrappersDisabledState.tsx
index 8473cf4b60..78f87d98a2 100644
--- a/studio/components/interfaces/Database/Wrappers/WrappersDisabledState.tsx
+++ b/studio/components/interfaces/Database/Wrappers/WrappersDisabledState.tsx
@@ -98,34 +98,40 @@ const WrappersDisabledState = () => {
-
-
-
-
-
+
-
-
- }>
- About Wrappers
-
-
-
+ }>
+
+ About Wrappers
+
+
) : (
-
-
- }>
- About Wrappers
-
-
-
+ }>
+
+ About Wrappers
+
+
-
-
+ }>
+
+ Documentation
+
+
diff --git a/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx b/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx
index 49f7565975..9700f810f4 100644
--- a/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx
+++ b/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx
@@ -197,13 +197,19 @@ const EdgeFunctionDetails = () => {
explicit import URLs
diff --git a/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx b/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx
index 1db79118c1..ad89448ea0 100644
--- a/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx
+++ b/studio/components/interfaces/Functions/EdgeFunctionSecrets/EdgeFunctionSecrets.tsx
@@ -65,13 +65,19 @@ const EdgeFunctionSecrets = () => {
icon={
diff --git a/studio/components/interfaces/Functions/FunctionsEmptyState.tsx b/studio/components/interfaces/Functions/FunctionsEmptyState.tsx
index c28db55ccb..d47dfae624 100644
--- a/studio/components/interfaces/Functions/FunctionsEmptyState.tsx
+++ b/studio/components/interfaces/Functions/FunctionsEmptyState.tsx
@@ -16,23 +16,24 @@ const FunctionsEmptyState = () => {
Supabase project with third-parties.
-
-
- }>
- Documentation
-
-
-
+ }
+ >
+
+ Documentation
+
+
-
-
- }>
- Documentation
-
-
-
-
-
- }>
- Examples
-
-
-
+ }>
+
+ Documentation
+
+
+ }>
+
+ Examples
+
+
-
-
- }>
- Documentation
-
-
-
-
-
- }>
- Examples
-
-
-
+ }>
+
+ Documentation
+
+
+ }>
+
+ Examples
+
+
)}
diff --git a/studio/components/interfaces/GraphQL/GraphiQL.tsx b/studio/components/interfaces/GraphQL/GraphiQL.tsx
index 6baa40ddbc..d6e92f003a 100644
--- a/studio/components/interfaces/GraphQL/GraphiQL.tsx
+++ b/studio/components/interfaces/GraphQL/GraphiQL.tsx
@@ -19,6 +19,7 @@ import {
ToolbarButton,
Tooltip,
UnStyledButton,
+ VariableEditor,
useCopyQuery,
useDragResize,
useEditorContext,
@@ -28,20 +29,19 @@ import {
usePrettifyEditors,
useSchemaContext,
useTheme,
- VariableEditor,
} from '@graphiql/react'
import { Fetcher } from '@graphiql/toolkit'
import clsx from 'clsx'
-import { useEffect, useState } from 'react'
+import { MouseEventHandler, useCallback, useEffect, useState } from 'react'
import styles from './graphiql.module.css'
-export type GraphiQLProps = {
+export interface GraphiQLProps {
fetcher: Fetcher
theme?: 'dark' | 'light'
accessToken?: string
}
-const GraphiQL = ({ fetcher, theme = 'dark', accessToken }: GraphiQLProps) => {
+export default function GraphiQL({ fetcher, theme = 'dark', accessToken }: GraphiQLProps) {
// Ensure props are correct
if (typeof fetcher !== 'function') {
throw new TypeError(
@@ -63,7 +63,7 @@ const GraphiQL = ({ fetcher, theme = 'dark', accessToken }: GraphiQLProps) => {
)
}
-type GraphiQLInterfaceProps = {
+interface GraphiQLInterfaceProps {
theme: 'dark' | 'light'
}
@@ -120,42 +120,104 @@ export const GraphiQLInterface = ({ theme }: GraphiQLInterfaceProps) => {
const toolbar = (
<>
-
-
-
-
+
+
+
)
}
-
-export default GraphiQL
diff --git a/studio/components/interfaces/Home/ExampleProject.tsx b/studio/components/interfaces/Home/ExampleProject.tsx
index b3be54260b..d779faf457 100644
--- a/studio/components/interfaces/Home/ExampleProject.tsx
+++ b/studio/components/interfaces/Home/ExampleProject.tsx
@@ -14,52 +14,50 @@ const ExampleProject = ({ framework, title, description, url }: ExampleProjectPr
const { resolvedTheme } = useTheme()
return (
-
-
-
+
-
-
+
-
+ {pluginContext?.visiblePlugin && (
+
+ )}
+
-
- {editorContext.tabs.length > 1 ? (
+
+ {editorContext.tabs.length > 1 && (
<>
{editorContext.tabs.map((tab, index) => (
-
+
{
/>
))}
-
-
- editorContext.addTab()}
- aria-label="Add tab"
- >
-
-
-
-
+ {addTab}
- ) : null}
+ )}
- {hasSingleTab ? (
-
-
- editorContext.addTab()}
- aria-label="Add tab"
- >
-
-
-
-
- ) : null}
+ {hasSingleTab && {addTab}
}
{
>
-
+
+
{
-
+
- {
>
{
- editorToolsResize.setHiddenElement(
- editorToolsResize.hiddenElement === 'second' ? null : 'second'
- )
- }}
+ onClick={toggleEditorTools}
aria-label={
editorToolsResize.hiddenElement === 'second'
? 'Show editor tools'
: 'Hide editor tools'
}
+ className="graphiql-toggle-editor-tools"
>
{editorToolsResize.hiddenElement === 'second' ? (
@@ -304,6 +329,7 @@ export const GraphiQLInterface = ({ theme }: GraphiQLInterfaceProps) => {
- {
- if (editorToolsResize.hiddenElement === 'second') {
- editorToolsResize.setHiddenElement(null)
- }
- setActiveSecondaryEditor('variables')
- }}
- >
- Variables
-
+
+ Variables
+
+
+
+ Headers
+
- {
- if (editorToolsResize.hiddenElement === 'second') {
- editorToolsResize.setHiddenElement(null)
- }
- setActiveSecondaryEditor('headers')
- }}
- >
- Headers
-
-
-
-
+
+
+
{
+
{PluginContent ?
+
- {pluginContext?.visiblePlugin ? (
-
- ) : null}
-
-
-
-
- {PluginContent ?
+
+
+ {pluginContext?.plugins.map((plugin, index) => {
+ const isVisible = plugin === pluginContext.visiblePlugin
+ const label = `${isVisible ? 'Hide' : 'Show'} ${plugin.title}`
+ const Icon = plugin.icon
+ return (
+
+
+
+
+
+ )
+ })}
+
+
+
+
+
+
+
+
-
-
- {pluginContext?.plugins.map((plugin) => {
- const isVisible = plugin === pluginContext.visiblePlugin
- const label = `${isVisible ? 'Hide' : 'Show'} ${plugin.title}`
- const Icon = plugin.icon
- return (
-
- {
- if (isVisible) {
- pluginContext.setVisiblePlugin(null)
- pluginResize.setHiddenElement('second')
- } else {
- pluginContext.setVisiblePlugin(plugin)
- pluginResize.setHiddenElement(null)
- }
- }}
- aria-label={label}
- >
-
-
-
- )
- })}
-
-
-
- schemaContext.introspect()}
- aria-label="Re-fetch GraphQL schema"
- >
-
-
-
-
-
-
- }${)
+
)
}
diff --git a/studio/components/interfaces/Home/NewProjectPanel/APIKeys.tsx b/studio/components/interfaces/Home/NewProjectPanel/APIKeys.tsx
index f861eeedf4..5d3489efd8 100644
--- a/studio/components/interfaces/Home/NewProjectPanel/APIKeys.tsx
+++ b/studio/components/interfaces/Home/NewProjectPanel/APIKeys.tsx
@@ -138,8 +138,11 @@ const APIKeys = () => {
This key is safe to use in a browser if you have enabled Row Level Security (RLS)
for your tables and configured policies. You may also use the service key which
can be found{' '}
-
- here
+
+ here
{' '}
to bypass RLS.
diff --git a/studio/components/interfaces/Home/NewProjectPanel/NewProjectPanel.tsx b/studio/components/interfaces/Home/NewProjectPanel/NewProjectPanel.tsx
index 457ce145d5..0b7917e425 100644
--- a/studio/components/interfaces/Home/NewProjectPanel/NewProjectPanel.tsx
+++ b/studio/components/interfaces/Home/NewProjectPanel/NewProjectPanel.tsx
@@ -46,53 +46,53 @@ const NewProjectPanel = () => {
+
+
-
+
+
-
-
-
-
- {title}
-{description}
-
-
+ : ''
+ }-icon.svg`}
+ alt={`${framework} logo`}
+ width={26}
+ height={26}
+ />
+
+ {title}
+{description}
+
+
+
-
-
-
-
-
}
>
-
-
+
-
-
-
-
- }>
- About Database
-
-
-
+ />
+ }
+ >
+
+ SQL editor
+
+
+ }>
+
+ About Database
+
+
@@ -124,22 +124,24 @@ const NewProjectPanel = () => {
-
-
-
-
-
-
-
- }
- type="default"
- >
- About Auth
-
-
-
+
+
+ }
+ type="default"
+ asChild
+ >
+
+ About Auth
+
+
@@ -158,22 +160,24 @@ const NewProjectPanel = () => {
-
-
-
-
-
-
-
- }
- type="default"
- >
- About Storage
-
-
-
+
+
+ }
+ type="default"
+ asChild
+ >
+
+ About Storage
+
+
@@ -193,22 +197,23 @@ const NewProjectPanel = () => {
-
-
-
-
-
-
-
- }
- type="default"
- >
- About Functions
-
-
-
+
+ }
+ type="default"
+ asChild
+ >
+
+ About Functions
+
+
@@ -226,17 +231,20 @@ const NewProjectPanel = () => {
-
-
- }
- type="default"
- >
- About Realtime
-
-
-
+ }
+ type="default"
+ asChild
+ >
+
+ About Realtime
+
+
@@ -252,8 +260,8 @@ const NewProjectPanel = () => {
Connecting to your new project
Interact with your database through the{' '} - - Supabase client libraries + + Supabase client libraries {' '} with your API keys.
@@ -263,18 +271,23 @@ const NewProjectPanel = () => {
-
-
-
-
-
-
-
- }>
- About APIs
-
-
-
+
+ }
+ >
+
+ About APIs
+
+
diff --git a/studio/components/interfaces/Home/ProjectList/ProjectList.tsx b/studio/components/interfaces/Home/ProjectList/ProjectList.tsx
index 4ad10333d7..0de9baca7f 100644
--- a/studio/components/interfaces/Home/ProjectList/ProjectList.tsx
+++ b/studio/components/interfaces/Home/ProjectList/ProjectList.tsx
@@ -120,11 +120,9 @@ const OrganizationProjects = ({
{!!overdueInvoices.length && (
-
-
-
-
-
+
)}
@@ -195,10 +193,11 @@ const OrganizationProjects = ({
The organization "{name}" still uses the legacy project-based billing. We've recently
made some big improvements to our billing system and require your action. To migrate
to the new organization-based billing, head over to your{' '}
-
-
- organization billing settings
-
+
+ organization billing settings
.
@@ -209,20 +208,24 @@ const OrganizationProjects = ({
-
- }>
-
- Announcement
-
-
-
-
- }>
-
- Documentation
-
-
-
+ }>
+
+ Announcement
+
+
+ }>
+
+ Documentation
+
+
@@ -239,11 +242,9 @@ const NoProjectsState = ({ slug }: { slug: string }) => {
Get started by creating a new project.
-
-
- }>New Project
-
-
+ }>
+ New Project
+
)
diff --git a/studio/components/interfaces/Integrations/IntegrationConnection.tsx b/studio/components/interfaces/Integrations/IntegrationConnection.tsx
index f0b2098b7e..d3d4e3ff2f 100644
--- a/studio/components/interfaces/Integrations/IntegrationConnection.tsx
+++ b/studio/components/interfaces/Integrations/IntegrationConnection.tsx
@@ -83,19 +83,16 @@ const IntegrationConnectionItem = forwardRef
-
-
-
+
@@ -274,7 +275,7 @@ const AuditLogs = () => {
Date
-
- {dateSortDesc ? 'Sort latest first' : 'Sort earliest first'}
-
-
-
+
+ {dateSortDesc ? 'Sort latest first' : 'Sort earliest first'}
+
+
+ {dayjs.unix(currentPeriodEnd).utc().format('MMM D, YYYY')}
diff --git a/studio/components/interfaces/Organization/BillingSettingsV2/BillingBreakdown/BillingMetric.tsx b/studio/components/interfaces/Organization/BillingSettingsV2/BillingBreakdown/BillingMetric.tsx index 0d9a579e65..77040638aa 100644 --- a/studio/components/interfaces/Organization/BillingSettingsV2/BillingBreakdown/BillingMetric.tsx +++ b/studio/components/interfaces/Organization/BillingSettingsV2/BillingBreakdown/BillingMetric.tsx @@ -55,18 +55,16 @@ const BillingMetric = ({ idx, slug, metric, usage, subscription }: BillingMetric >
-
-
@@ -102,10 +104,11 @@ const CostControl = ({}: CostControlProps) => {
>
{currentPlan?.name || ''} plan requires you to have spend cap off at all times.
Your projects will never become unresponsive. Only when your{' '}
-
-
- included usage
-
+
+ included usage
{' '}
is exceeded will you be charged for any additional usage.
@@ -113,10 +116,11 @@ const CostControl = ({}: CostControlProps) => {
}
tooltip={!canUpdateSpendCap ? 'You do not have permission to update spend cap' : undefined}
diff --git a/studio/components/interfaces/Organization/BillingSettingsV2/PaymentMethods/PaymentMethods.tsx b/studio/components/interfaces/Organization/BillingSettingsV2/PaymentMethods/PaymentMethods.tsx
index 4106917e4b..633a3f5958 100644
--- a/studio/components/interfaces/Organization/BillingSettingsV2/PaymentMethods/PaymentMethods.tsx
+++ b/studio/components/interfaces/Organization/BillingSettingsV2/PaymentMethods/PaymentMethods.tsx
@@ -99,14 +99,16 @@ const PaymentMethods = () => {
variant="info"
title="Payment is currently by invoice"
actions={[
-
-
-
-
- ,
+ ,
]}
>
You get a monthly invoice and payment link via email. To change your payment
diff --git a/studio/components/interfaces/Organization/BillingSettingsV2/Subscription/PaymentMethodSelection.tsx b/studio/components/interfaces/Organization/BillingSettingsV2/Subscription/PaymentMethodSelection.tsx
index 40cbb27233..42eccd4a3a 100644
--- a/studio/components/interfaces/Organization/BillingSettingsV2/Subscription/PaymentMethodSelection.tsx
+++ b/studio/components/interfaces/Organization/BillingSettingsV2/Subscription/PaymentMethodSelection.tsx
@@ -86,7 +86,7 @@ const PaymentMethodSelection = ({
-
-
+ - {metric.name} -
-
+
{isUsageBillingEnabled && hasLimit && usageFee && (
diff --git a/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/CostControl.tsx b/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/CostControl.tsx
index 93787f3f8d..800dc53299 100644
--- a/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/CostControl.tsx
+++ b/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/CostControl.tsx
@@ -67,13 +67,15 @@ const CostControl = ({}: CostControlProps) => {
+ {metric.name} +
+More information
-
-
-
-
-
+
+ Spend cap
-
+
Spend cap
+You can control whether your organization is charged for additional usage beyond the{' '} - - - included quota - + + included quota {' '} of your subscription plan. If you need to go beyond the included quota, simply switch off your spend cap to pay for additional usage. diff --git a/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/SpendCapSidePanel.tsx b/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/SpendCapSidePanel.tsx index c42e0d7f45..02787deaba 100644 --- a/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/SpendCapSidePanel.tsx +++ b/studio/components/interfaces/Organization/BillingSettingsV2/CostControl/SpendCapSidePanel.tsx @@ -128,13 +128,15 @@ const SpendCapSidePanel = () => { header={
Spend cap
- - - }> - About spend cap - - - + }> + + About spend cap + +
-
-
- }
- >
-
-
-
-
- <>
- {isPendingInviteAcceptance ? (
- <>
- {canRevokeInvite && (
- handleRevokeInvitation(member)}>
-
- )}
- {/* canResendInvite && isExpired */}
- {true && (
- <>
- handleResendInvite(member)}>
+ <>
+ handleResendInvite(member)}>
+
+
+ )}
+
+ ) : (
+ organizationMembersDeletionEnabled && (
+ {
+ setIsDeleteModalOpen(true)
+ }}
+ >
+
+ )
+ )}
+
+
+
+
+
+
-
- Cancel invitation
-Revoke this invitation.
-
+
+
+ }
+ >
+
+
+
+
+ <>
+ {isPendingInviteAcceptance ? (
+ <>
+ {canRevokeInvite && (
+ handleRevokeInvitation(member)}>
-
- )}
-
- ) : (
- organizationMembersDeletionEnabled && (
-
-
- )
- )}
-
-
-
-
+ )}
+ {/* canResendInvite && isExpired */}
+ {true && (
+ <>
+
-
Resend invitation
-Invites expire after 24hrs.
+Cancel invitation
+Revoke this invitation.
Remove member
-
+
+ Resend invitation
+Invites expire after 24hrs.
+Remove member
++ This is permanent! Are you sure you want to remove {member.primary_email} +
+
+
+ {roles.map((r: any) => (
+
+ {r.name}
+
+ ))}
+
+
+
+ )}
+ {/* if organizationMembersDeletionEnabled is false, you also can't delete yourself */}
+ {organizationMembersDeletionEnabled && (
-
+
+
+
+ {!canLeave && (
+
+
+
+
+ )}
+
)}
- {/* if organizationMembersDeletionEnabled is false, you also can't delete yourself */}
- {organizationMembersDeletionEnabled && (
-
+
+ An organization requires at least 1 owner
+
+
+
-
-
-
-
- {!canLeave && (
-
-
-
-
- )}
-
-
- )}
-
-
- An organization requires at least 1 owner
-
-
- + Are you sure you want to leave this organization? This is permanent. +
+
-
-
-
))}
diff --git a/studio/components/interfaces/Organization/Usage/Usage.tsx b/studio/components/interfaces/Organization/Usage/Usage.tsx
index a57f4084f7..3b18334018 100644
--- a/studio/components/interfaces/Organization/Usage/Usage.tsx
+++ b/studio/components/interfaces/Organization/Usage/Usage.tsx
@@ -175,16 +175,15 @@ const Usage = () => {
variant="danger"
title="Your organization's usage has exceeded its included quota"
actions={[
-
-
- ,
+ ,
]}
>
Your projects can become unresponsive or enter read only mode.{' '}
@@ -210,13 +209,15 @@ const Usage = () => {
"All Projects".
-
-
+
+ {link.name}
-
+
{link.name}
+
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
}
diff --git a/studio/components/interfaces/Organization/Usage/UsageSection/AttributeUsage.tsx b/studio/components/interfaces/Organization/Usage/UsageSection/AttributeUsage.tsx
index 0eaf9d2267..394c9ab25d 100644
--- a/studio/components/interfaces/Organization/Usage/UsageSection/AttributeUsage.tsx
+++ b/studio/components/interfaces/Organization/Usage/UsageSection/AttributeUsage.tsx
@@ -151,15 +151,13 @@ const AttributeUsage = ({
{showUsageWarning && (
-
-
-
+
)}
@@ -284,11 +282,9 @@ const AttributeUsage = ({
-
-
-
+
diff --git a/studio/components/interfaces/ProjectAPIDocs/Content/Content.utils.ts b/studio/components/interfaces/ProjectAPIDocs/Content/Content.utils.ts
index 7a3f2dfb69..da308eb606 100644
--- a/studio/components/interfaces/ProjectAPIDocs/Content/Content.utils.ts
+++ b/studio/components/interfaces/ProjectAPIDocs/Content/Content.utils.ts
@@ -4,3 +4,17 @@ export const navigateToSection = (key: string) => {
if (el) el.scrollIntoView({ behavior: 'smooth' })
}
}
+
+// Removes some auto-generated Postgrest text
+// Ideally PostgREST wouldn't add this if there is already a comment
+export const tempRemovePostgrestText = (content: string) => {
+ const postgrestTextPk = `Note:\nThis is a Primary Key.
-
- }>
-
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
-
- }>
-
- Documentation
-
-
-
-
- }>
-
- REST guide
-
-
-
-
-
-
+ Documentation
+
+
+ }>
+
+ REST guide
+
+
+
)
diff --git a/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx b/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx
index c78fd29ebc..7a71cb23b6 100644
--- a/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx
+++ b/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx
@@ -25,13 +25,11 @@ const ResourceContent = ({ selectedLanguage, snippet, codeSnippets }: ResourceCo
{snippet.title}
{snippet.docsUrl !== undefined && ( - - }> - - Documentation - - - + }> + + Documentation + + )}Head over to our docs site for the full API documentation.
- - } - > - - Documentation - - - + } + > + + Documentation + +
{children}
diff --git a/studio/components/interfaces/SQLEditor/AISettingsModal.tsx b/studio/components/interfaces/SQLEditor/AISettingsModal.tsx
index 3ef85daf75..8ab1da2e8b 100644
--- a/studio/components/interfaces/SQLEditor/AISettingsModal.tsx
+++ b/studio/components/interfaces/SQLEditor/AISettingsModal.tsx
@@ -31,11 +31,14 @@ const AISettingsModal = (props: ModalProps) => {
variant="warning"
title="This option is only available if your organization has opted-in to sending anonymous data to OpenAI."
>
-
-
- Go to your organization's settings to opt-in.
- {name}
}
- const columns: Column
-
- {(result.error.message ?? result.error)?.includes(
- 'canceling statement due to statement timeout'
- ) && (
-
- {formattedError.length > 0 ? (
- formattedError.map((x: string, i: number) => (
-
+ {isTimeout ? (
+
- {x}
-
- ))
- ) : (
- {result.error.error}
- )} -
+
+ ) : (
+ SQL query ran into an upstream timeout
++ You can either{' '} + + optimize your query + + , or{' '} + + increase the statement timeout + + . +
+
+ {formattedError.length > 0 ? (
+ formattedError.map((x: string, i: number) => (
+
+ )}
{supabaseAIEnabled && !hasHipaaAddon && (
)}
+ {x}
+
+ ))
+ ) : (
+ {result.error.error}
+ )} +- You can either{' '} - - optimize your query - - , or{' '} - - increase the statement timeout - - . -
- )}
+
Updating addons are not available while you're on a preview branch. To manage your
addons, you may return to your{' '}
-
- main branch
+
+ main branch
.
@@ -143,23 +146,27 @@ const Addons = () => {
@@ -243,35 +250,31 @@ const Addons = () => {
diff --git a/studio/components/interfaces/Settings/Database/DatabaseSettings/DatabaseSettings.tsx b/studio/components/interfaces/Settings/Database/DatabaseSettings/DatabaseSettings.tsx
index 8497b40720..e7ff73d886 100644
--- a/studio/components/interfaces/Settings/Database/DatabaseSettings/DatabaseSettings.tsx
+++ b/studio/components/interfaces/Settings/Database/DatabaseSettings/DatabaseSettings.tsx
@@ -210,16 +210,15 @@ const DatabaseSettings = () => {
-
-
- }>
- Learn more
-
-
-
+ }>
+
+ Learn more
+
+
)}
diff --git a/studio/components/interfaces/Settings/Database/DiskSizeConfiguration.tsx b/studio/components/interfaces/Settings/Database/DiskSizeConfiguration.tsx
index 685fd82ae5..55dafef487 100644
--- a/studio/components/interfaces/Settings/Database/DiskSizeConfiguration.tsx
+++ b/studio/components/interfaces/Settings/Database/DiskSizeConfiguration.tsx
@@ -159,9 +159,11 @@ const DiskSizeConfiguration = ({ disabled = false }: DiskSizeConfigurationProps)
variant="info"
title={'Disk size configuration is not available for projects on the Free plan'}
actions={
-
-
-
+
}
>
More information
-
-
-
-
-
+
+ About compute add-ons
-
+
About compute add-ons
+
-
-
-
-
-
+
+ Connection Pooler
-
+
Connection Pooler
+
-
-
-
-
+ - CPU -
-
+
+ CPU +
+{computeInstance?.variant?.meta?.cpu_cores ?? 2}-core {cpuArchitecture}{' '} @@ -292,18 +295,16 @@ const Addons = () => {
-
-
-
-
+ - Max Disk Throughput -
-
+
+ Max Disk Throughput +
+{computeInstance?.variant?.meta?.max_disk_io_mbs?.toLocaleString() ?? @@ -313,18 +314,16 @@ const Addons = () => {
-
-
@@ -396,14 +397,13 @@ const Addons = () => {
diff --git a/studio/components/interfaces/Settings/Addons/ComputeInstanceSidePanel.tsx b/studio/components/interfaces/Settings/Addons/ComputeInstanceSidePanel.tsx
index 6cfb75416d..c0fdcd033f 100644
--- a/studio/components/interfaces/Settings/Addons/ComputeInstanceSidePanel.tsx
+++ b/studio/components/interfaces/Settings/Addons/ComputeInstanceSidePanel.tsx
@@ -195,13 +195,15 @@ const ComputeInstanceSidePanel = () => {
header={
}
>
@@ -275,11 +277,11 @@ const ComputeInstanceSidePanel = () => {
title="Changing your compute size is only available on the Pro plan"
actions={
isOrgBilling ? (
-
-
-
-
-
+
) : (
-
-
+ - Baseline Disk Throughput -
-
+
+ Baseline Disk Throughput +
+{computeInstance?.variant?.meta?.baseline_disk_io_mbs?.toLocaleString() ?? @@ -348,13 +347,15 @@ const Addons = () => {
More information
-
-
-
-
-
+
+ About PITR backups
-
+
About PITR backups
+Reach out to us via support if you're interested
- - ) : ( @@ -442,13 +442,15 @@ const Addons = () => {More information
-
-
-
-
-
+
+ About custom domains
-
+
About custom domains
+Change project compute size
- - - }> - About compute sizes - - - + }> + + About compute sizes + +
diff --git a/studio/components/interfaces/Settings/Database/NetworkRestrictions/NetworkRestrictions.tsx b/studio/components/interfaces/Settings/Database/NetworkRestrictions/NetworkRestrictions.tsx
index 0814036169..2e1b95a7f0 100644
--- a/studio/components/interfaces/Settings/Database/NetworkRestrictions/NetworkRestrictions.tsx
+++ b/studio/components/interfaces/Settings/Database/NetworkRestrictions/NetworkRestrictions.tsx
@@ -110,13 +110,15 @@ const NetworkRestrictions = ({}) => {
description="Allow specific IP ranges to have access to your database."
/>
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
diff --git a/studio/components/interfaces/Settings/Vault/Keys/EncryptionKeysManagement.tsx b/studio/components/interfaces/Settings/Vault/Keys/EncryptionKeysManagement.tsx
index 57ac6f3088..3968441d78 100644
--- a/studio/components/interfaces/Settings/Vault/Keys/EncryptionKeysManagement.tsx
+++ b/studio/components/interfaces/Settings/Vault/Keys/EncryptionKeysManagement.tsx
@@ -140,13 +140,15 @@ const EncryptionKeysManagement = () => {
-
-
- }>
- Vault Documentation
-
-
-
+ }>
+
+ Vault Documentation
+
+
diff --git a/studio/components/interfaces/Settings/Vault/Secrets/SecretsManagement.tsx b/studio/components/interfaces/Settings/Vault/Secrets/SecretsManagement.tsx
index 9a4f1b6c54..22ca0db785 100644
--- a/studio/components/interfaces/Settings/Vault/Secrets/SecretsManagement.tsx
+++ b/studio/components/interfaces/Settings/Vault/Secrets/SecretsManagement.tsx
@@ -102,13 +102,15 @@ const SecretsManagement = () => {
-
-
- }>
- Vault Documentation
-
-
-
+ }>
+
+ Vault Documentation
+
+
-
-
-
-
-
+
-
-
- }>
- About Vault
-
-
-
+ }>
+
+ About Vault
+
+
) : (
-
-
- }>
- About Vault
-
-
-
+ }>
+
+ About Vault
+
+
diff --git a/studio/components/interfaces/SignIn/SignInMfaForm.tsx b/studio/components/interfaces/SignIn/SignInMfaForm.tsx
index d18ac5a304..3c4cf01d63 100644
--- a/studio/components/interfaces/SignIn/SignInMfaForm.tsx
+++ b/studio/components/interfaces/SignIn/SignInMfaForm.tsx
@@ -171,16 +171,12 @@ const SignInMfaForm = () => {
)}
Note: The{' '} - - - global upload limit - + + global upload limit {' '} takes precedence over this value ({formattedGlobalUploadLimit})
diff --git a/studio/components/interfaces/Storage/EditBucketModal.tsx b/studio/components/interfaces/Storage/EditBucketModal.tsx index 7316f8a74a..6e3bfc72e5 100644 --- a/studio/components/interfaces/Storage/EditBucketModal.tsx +++ b/studio/components/interfaces/Storage/EditBucketModal.tsx @@ -220,10 +220,11 @@ const EditBucketModal = ({ visible, bucket, onClose }: EditBucketModalProps) =>Note: The{' '} - - - global upload limit - + + global upload limit {' '} takes precedence over this value ({formattedGlobalUploadLimit})
diff --git a/studio/components/interfaces/Support/DisabledStateForFreeTier.tsx b/studio/components/interfaces/Support/DisabledStateForFreeTier.tsx index d2be8f09d0..c4a22e72d4 100644 --- a/studio/components/interfaces/Support/DisabledStateForFreeTier.tsx +++ b/studio/components/interfaces/Support/DisabledStateForFreeTier.tsx @@ -20,20 +20,18 @@ const DisabledStateForFreeTier = ({ projectRef, category }: DisabledStateForFreeUpgrade your project to the Pro plan for support in this area
-
-
-
-
-
-
-
- }>
- About the Pro plan
-
-
-
+
+ }>
+
+ About the Pro plan
+
+
-
-
-
+
diff --git a/studio/components/interfaces/Support/SupportForm.tsx b/studio/components/interfaces/Support/SupportForm.tsx
index bb8f76cf2c..3199917838 100644
--- a/studio/components/interfaces/Support/SupportForm.tsx
+++ b/studio/components/interfaces/Support/SupportForm.tsx
@@ -444,20 +444,22 @@ const SupportForm = ({ setSentCategory }: SupportFormProps) => {
Enhanced SLAs for support are available on our Enterprise Plan.
-
-
-
-
-
-
-
- }>
- Enquire about Enterprise
-
-
-
+
+ }>
+
+ Enquire about Enterprise
+
+
}
@@ -489,15 +491,12 @@ const SupportForm = ({ setSentCategory }: SupportFormProps) => {
-
- Github discussions
-
-
-
- }
- >
- View Github issues
-
-
-
+ }
+ >
+
+ View Github issues
+
+
)
@@ -589,16 +587,19 @@ const SupportForm = ({ setSentCategory }: SupportFormProps) => {
-
-
- }
- >
- View Github issues
-
-
-
+ }
+ >
+
+ View Github issues
+
+
diff --git a/studio/components/interfaces/TableGridEditor/DeleteConfirmationDialogs.tsx b/studio/components/interfaces/TableGridEditor/DeleteConfirmationDialogs.tsx
index c599eca798..cdad1c6d2e 100644
--- a/studio/components/interfaces/TableGridEditor/DeleteConfirmationDialogs.tsx
+++ b/studio/components/interfaces/TableGridEditor/DeleteConfirmationDialogs.tsx
@@ -1,17 +1,23 @@
import { useQueryClient } from '@tanstack/react-query'
import Link from 'next/link'
+import toast from 'react-hot-toast'
+import { Alert, Button, Checkbox, IconExternalLink, Modal } from 'ui'
+import { SupaRow } from 'components/grid'
+import { formatFilterURLParams } from 'components/grid/SupabaseGrid.utils'
import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
import ConfirmationModal from 'components/ui/ConfirmationModal'
import { entityTypeKeys } from 'data/entity-types/keys'
import { sqlKeys } from 'data/sql/keys'
+import { useTableRowDeleteAllMutation } from 'data/table-rows/table-row-delete-all-mutation'
+import { useTableRowDeleteMutation } from 'data/table-rows/table-row-delete-mutation'
+import { useTableRowTruncateMutation } from 'data/table-rows/table-row-truncate-mutation'
import { tableKeys } from 'data/tables/keys'
import { useGetTables } from 'data/tables/tables-query'
import { useStore, useUrlState } from 'hooks'
import { TableLike } from 'hooks/misc/useTable'
import { noop } from 'lib/void'
import { useTableEditorStateSnapshot } from 'state/table-editor'
-import { Alert, Button, Checkbox, IconExternalLink, Modal } from 'ui'
export type DeleteConfirmationDialogsProps = {
projectRef?: string
@@ -24,20 +30,70 @@ const DeleteConfirmationDialogs = ({
selectedTable,
onAfterDeleteTable = noop,
}: DeleteConfirmationDialogsProps) => {
+ const { meta, ui } = useStore()
+ const queryClient = useQueryClient()
const { project } = useProjectContext()
const snap = useTableEditorStateSnapshot()
- const [, setParams] = useUrlState({ arrayKeys: ['filter', 'sort'] })
-
- const queryClient = useQueryClient()
-
- const { meta, ui } = useStore()
+ const [{ filter }, setParams] = useUrlState({ arrayKeys: ['filter', 'sort'] })
+ const filters = formatFilterURLParams(filter as string[])
const getTables = useGetTables({
projectRef: project?.ref,
connectionString: project?.connectionString,
})
+ const { mutate: deleteRows } = useTableRowDeleteMutation({
+ onSuccess: () => {
+ if (snap.confirmationDialog?.type === 'row') {
+ snap.confirmationDialog.callback?.()
+ }
+ toast.success(`Successfully deleted selected row(s)`)
+ snap.closeConfirmationDialog()
+ },
+ onError: (error) => {
+ toast.error(`Failed to delete row: ${error.message}`)
+ snap.closeConfirmationDialog()
+ },
+ })
+
+ const { mutateAsync: deleteAllRows } = useTableRowDeleteAllMutation({
+ onSuccess: () => {
+ if (snap.confirmationDialog?.type === 'row') {
+ snap.confirmationDialog.callback?.()
+ }
+ toast.success(`Successfully deleted selected rows`)
+ snap.closeConfirmationDialog()
+ },
+ onError: (error) => {
+ toast.error(`Failed to delete rows: ${error.message}`)
+ snap.closeConfirmationDialog()
+ },
+ })
+
+ const { mutateAsync: truncateRows } = useTableRowTruncateMutation({
+ onSuccess: () => {
+ if (snap.confirmationDialog?.type === 'row') {
+ snap.confirmationDialog.callback?.()
+ }
+ toast.success(`Successfully deleted all rows from table`)
+ snap.closeConfirmationDialog()
+ },
+ onError: (error) => {
+ toast.error(`Failed to delete rows: ${error.message}`)
+ snap.closeConfirmationDialog()
+ },
+ })
+
+ const isAllRowsSelected =
+ snap.confirmationDialog?.type === 'row' ? snap.confirmationDialog.allRowsSelected : false
+ const numRows =
+ snap.confirmationDialog?.type === 'row'
+ ? snap.confirmationDialog.allRowsSelected
+ ? snap.confirmationDialog.numRows ?? 0
+ : snap.confirmationDialog.rows.length
+ : 0
+
const removeDeletedColumnFromFiltersAndSorts = (columnName: string) => {
setParams((prevParams) => {
const existingFilters = (prevParams?.filter ?? []) as string[]
@@ -57,7 +113,8 @@ const DeleteConfirmationDialogs = ({
})
}
- const isDeleteWithCascade = snap.confirmationDialog?.isDeleteWithCascade ?? false
+ const isDeleteWithCascade =
+ snap.confirmationDialog?.type === 'column' ? snap.confirmationDialog.isDeleteWithCascade : false
const onConfirmDeleteColumn = async () => {
if (!(snap.confirmationDialog?.type === 'column')) return
@@ -136,6 +193,37 @@ const DeleteConfirmationDialogs = ({
}
}
+ const onConfirmDeleteRow = async () => {
+ if (!project) return console.error('Project ref is required')
+ if (!selectedTable) return console.error('Selected table required')
+ if (snap.confirmationDialog?.type !== 'row') return
+ const selectedRowsToDelete = snap.confirmationDialog.rows
+
+ if (snap.confirmationDialog.allRowsSelected) {
+ if (filters.length === 0) {
+ truncateRows({
+ projectRef: project.ref,
+ connectionString: project.connectionString,
+ table: selectedTable as any,
+ })
+ } else {
+ deleteAllRows({
+ projectRef: project.ref,
+ connectionString: project.connectionString,
+ table: selectedTable as any,
+ filters,
+ })
+ }
+ } else {
+ deleteRows({
+ projectRef: project.ref,
+ connectionString: project.connectionString,
+ table: selectedTable as any,
+ rows: selectedRowsToDelete as SupaRow[],
+ })
+ }
+ }
+
return (
<>
+
+ + Are you sure you want to delete {isAllRowsSelected ? 'all' : 'the selected'}{' '} + {numRows > 1 && `${numRows} `}row + {numRows > 1 && 's'}? This action cannot be undone. +
+You can create policies after you create this table.
)}- - - }> - RLS Documentation - - - + }> + + RLS Documentation + +
) : ( @@ -272,13 +274,15 @@ const TableEditor = ({ publicly writable and readable- - - }> - RLS Documentation - - - + }> + + RLS Documentation + +
)} diff --git a/studio/components/interfaces/TableGridEditor/TableDefinition.tsx b/studio/components/interfaces/TableGridEditor/TableDefinition.tsx index 83e00cc868..7e2747b48b 100644 --- a/studio/components/interfaces/TableGridEditor/TableDefinition.tsx +++ b/studio/components/interfaces/TableGridEditor/TableDefinition.tsx @@ -103,14 +103,13 @@ const TableDefinition = ({ id }: TableDefinitionProps) => { return (
-
-
-
+
-
-
+ )}
+
+ {isSubitem ? setOpen(false)} asChild>
- Preferences
-
-
-
- setOpen(false)} asChild>
- Access tokens
-
-
+ setOpen(false)} asChild>
+ Preferences
+
+ setOpen(false)} asChild>
+ Access tokens
+
{showAuditLogs ? (
-
- setOpen(false)} asChild>
- Audit logs
-
-
+ setOpen(false)} asChild>
+ Audit logs
+
) : null}
) => {
diff --git a/studio/components/layouts/ProjectLayout/LayoutHeader/FeedbackDropdown/FeedbackWidget.tsx b/studio/components/layouts/ProjectLayout/LayoutHeader/FeedbackDropdown/FeedbackWidget.tsx
index 62f27f08d3..bc48ae8fe9 100644
--- a/studio/components/layouts/ProjectLayout/LayoutHeader/FeedbackDropdown/FeedbackWidget.tsx
+++ b/studio/components/layouts/ProjectLayout/LayoutHeader/FeedbackDropdown/FeedbackWidget.tsx
@@ -223,11 +223,9 @@ const FeedbackWidget = ({
{label}
: label} + + ) } diff --git a/studio/components/layouts/AccountLayout/WithSidebar.tsx b/studio/components/layouts/AccountLayout/WithSidebar.tsx index 385e15b473..2698722a9f 100644 --- a/studio/components/layouts/AccountLayout/WithSidebar.tsx +++ b/studio/components/layouts/AccountLayout/WithSidebar.tsx @@ -206,22 +206,20 @@ const SidebarLinkItem = ({ } return ( - - - - {isExternal && ( - -{label}
: label} + + + {isExternal && ( + +{label}
: label} - + ) } diff --git a/studio/components/layouts/AppLayout/AppHeader.tsx b/studio/components/layouts/AppLayout/AppHeader.tsx index e5cffc75cb..0ffea0c237 100644 --- a/studio/components/layouts/AppLayout/AppHeader.tsx +++ b/studio/components/layouts/AppLayout/AppHeader.tsx @@ -26,14 +26,15 @@ const AppHeader = () => { return (
-
-
- 
-
+
+
{
@@ -54,12 +53,10 @@ const BranchLink = ({
setOpen(false)
}}
>
-
-
)
@@ -132,22 +129,22 @@ const BranchDropdown = ({ isNewNav = false }: BranchDropdownProps) => {
-
- {
- setOpen(false)
- router.push(`/project/${ref}/branches`)
- }}
- onClick={() => setOpen(false)}
+ {
+ setOpen(false)
+ router.push(`/project/${ref}/branches`)
+ }}
+ onClick={() => setOpen(false)}
+ >
+
-
-
-
+
diff --git a/studio/components/layouts/AppLayout/EnableBranchingButton/BranchingWaitlistPopover.tsx b/studio/components/layouts/AppLayout/EnableBranchingButton/BranchingWaitlistPopover.tsx
index 79af22b360..ee1139cc01 100644
--- a/studio/components/layouts/AppLayout/EnableBranchingButton/BranchingWaitlistPopover.tsx
+++ b/studio/components/layouts/AppLayout/EnableBranchingButton/BranchingWaitlistPopover.tsx
@@ -39,11 +39,15 @@ const BranchingWaitlistPopover = ({ isNewNav = false }: BranchingWaitlistPopover
enrolled in database branching.
Previews can be available by connecting your Supabase project to a Vercel project.
{!integration && (
-
-
-
-
-
+
)}
{integration && !vercelProjectIntegration && {
- setOpen(false)
- router.push(href)
- }}
- onClick={() => setOpen(false)}
- >
-
- {org.name}
- {org.slug === slug &&
-
+ {
+ setOpen(false)
+ router.push(href)
+ }}
+ onClick={() => setOpen(false)}
+ >
+
+ {org.name}
+ {org.slug === slug &&
)
})}
{organizationCreationEnabled && (
-
- {
- setOpen(false)
- router.push(`/new`)
- }}
- onClick={() => setOpen(false)}
- >
-
-
-
+ {
+ setOpen(false)
+ router.push(`/new`)
+ }}
+ onClick={() => setOpen(false)}
+ >
+
+
)}
diff --git a/studio/components/layouts/AppLayout/ProjectDropdown.tsx b/studio/components/layouts/AppLayout/ProjectDropdown.tsx
index b0a787a0c0..c72011468c 100644
--- a/studio/components/layouts/AppLayout/ProjectDropdown.tsx
+++ b/studio/components/layouts/AppLayout/ProjectDropdown.tsx
@@ -78,24 +78,21 @@ const ProjectLink = ({
}
return (
-
- {
- router.push(href)
- setOpen(false)
- }}
- onClick={() => setOpen(false)}
- >
-
- {project.name}
- {project.ref === ref &&
-
+ {
+ router.push(href)
+ setOpen(false)
+ }}
+ onClick={() => setOpen(false)}
+ >
+
+ {project.name}
+ {project.ref === ref &&
)
}
@@ -169,28 +166,25 @@ const ProjectDropdown = ({ isNewNav = false }: ProjectDropdownProps) => {
{projectCreationEnabled && (
- {
+ {
setOpen(false)
+ router.push(`/new/${selectedOrganization?.slug}`)
}}
+ onClick={() => setOpen(false)}
>
- {
+ {
setOpen(false)
- router.push(`/new/${selectedOrganization?.slug}`)
}}
- onClick={() => setOpen(false)}
+ className="w-full flex items-center gap-2"
>
-
-
-
+
)}
diff --git a/studio/components/layouts/AppLayout/SettingsButton.tsx b/studio/components/layouts/AppLayout/SettingsButton.tsx
index 035c564093..36a909d44a 100644
--- a/studio/components/layouts/AppLayout/SettingsButton.tsx
+++ b/studio/components/layouts/AppLayout/SettingsButton.tsx
@@ -9,13 +9,11 @@ const SettingsButton = () => {
return (
-
-
-
-
-
+
+
+
-
+
+
- {branch.name} -
- {isSelected &&+ {branch.name} +
+ {isSelected &&Manage branches
- -Manage branches
+ +
-
-
-
-
-
+
{/*
diff --git a/studio/components/layouts/AppLayout/EnableBranchingButton/EnableBranchingModal.tsx b/studio/components/layouts/AppLayout/EnableBranchingButton/EnableBranchingModal.tsx
index e0643334db..0585648dec 100644
--- a/studio/components/layouts/AppLayout/EnableBranchingButton/EnableBranchingModal.tsx
+++ b/studio/components/layouts/AppLayout/EnableBranchingButton/EnableBranchingModal.tsx
@@ -164,11 +164,9 @@ const EnableBranchingModal = () => {
>
Understood
-
-
-
+
diff --git a/studio/components/layouts/AppLayout/EnableBranchingButton/GithubRepositorySelection.tsx b/studio/components/layouts/AppLayout/EnableBranchingButton/GithubRepositorySelection.tsx
index 00294773c8..62f6e1d839 100644
--- a/studio/components/layouts/AppLayout/EnableBranchingButton/GithubRepositorySelection.tsx
+++ b/studio/components/layouts/AppLayout/EnableBranchingButton/GithubRepositorySelection.tsx
@@ -78,13 +78,9 @@ const GithubRepositorySelection = ({
: 'Your database preview branches will be based on the branches in the Git repository that your project is connected with.'}
{!hasGithubIntegrationInstalled && (
-
-
-
-
-
+
)}
{hasGithubIntegrationInstalled && !githubConnection && (
Connect project
}
{integration && vercelProjectIntegration && Select project
}
diff --git a/studio/components/layouts/AppLayout/IncidentBanner.tsx b/studio/components/layouts/AppLayout/IncidentBanner.tsx
index e2c4f5b16d..49aedbd572 100644
--- a/studio/components/layouts/AppLayout/IncidentBanner.tsx
+++ b/studio/components/layouts/AppLayout/IncidentBanner.tsx
@@ -3,15 +3,13 @@ import { IconExternalLink } from 'ui'
const IncidentBanner = () => {
return (
-
-
-
-
-
+
+ - We are currently investigating a technical issue, follow status.supabase.com for updates -
-
+
)
}
diff --git a/studio/components/layouts/AppLayout/OrganizationDropdown.tsx b/studio/components/layouts/AppLayout/OrganizationDropdown.tsx
index c008b6c7c7..cfb146006d 100644
--- a/studio/components/layouts/AppLayout/OrganizationDropdown.tsx
+++ b/studio/components/layouts/AppLayout/OrganizationDropdown.tsx
@@ -82,45 +82,40 @@ const OrganizationDropdown = ({ isNewNav = false }: OrganizationDropdownProps) =
? `/org/${org.slug}`
: `/org/${org.slug}/general`
return (
-
- + We are currently investigating a technical issue, follow status.supabase.com for updates +
+New organization
- -New organization
+ +New project
- -New project
+ +
{/* Header */}
{children}
{docsHref && (
-
-
-
diff --git a/studio/components/layouts/ProjectLayout/BuildingState.tsx b/studio/components/layouts/ProjectLayout/BuildingState.tsx
index 2000ecb22e..22f7d1d3a7 100644
--- a/studio/components/layouts/ProjectLayout/BuildingState.tsx
+++ b/studio/components/layouts/ProjectLayout/BuildingState.tsx
@@ -82,14 +82,13 @@ const BuildingState = () => {
description={
-
-
-
diff --git a/studio/components/layouts/IntegrationsLayout/IntegrationWindowLayout.tsx b/studio/components/layouts/IntegrationsLayout/IntegrationWindowLayout.tsx
index 7db53f8073..bffc38dd6b 100644
--- a/studio/components/layouts/IntegrationsLayout/IntegrationWindowLayout.tsx
+++ b/studio/components/layouts/IntegrationsLayout/IntegrationWindowLayout.tsx
@@ -30,24 +30,24 @@ const IntegrationWindowLayout = ({
Customize your plan
diff --git a/studio/components/layouts/DocsLayout/DocsLayout.tsx b/studio/components/layouts/DocsLayout/DocsLayout.tsx index 10ddcd7c04..7882550e18 100644 --- a/studio/components/layouts/DocsLayout/DocsLayout.tsx +++ b/studio/components/layouts/DocsLayout/DocsLayout.tsx @@ -14,7 +14,6 @@ function DocsLayout({ title, children }: { title: string; children: ReactElement const { ui, meta } = useStore() const { data, isLoading, error } = meta.openApi const selectedProject = useSelectedProject() - const isPaused = selectedProject?.status === PROJECT_STATUS.INACTIVE const getPage = () => { @@ -29,7 +28,7 @@ function DocsLayout({ title, children }: { title: string; children: ReactElement if (ui.selectedProjectRef && !isPaused) { meta.openApi.load() } - }, [ui.selectedProjectRef]) + }, [ui.selectedProjectRef, isPaused]) if (error) { return ( diff --git a/studio/components/layouts/FunctionsLayout.tsx b/studio/components/layouts/FunctionsLayout.tsx index 3cbe746ef0..605b6f2ecd 100644 --- a/studio/components/layouts/FunctionsLayout.tsx +++ b/studio/components/layouts/FunctionsLayout.tsx @@ -111,11 +111,9 @@ const FunctionsLayout = ({ title, children }: PropsWithChildren
-
-
-
-
-
+
{isNewAPIDocsEnabled && (
-
-
+ }
+ >
+
+ Documentation
+
+
Browse the Supabase{' '} - - - documentation - + + documentation .
@@ -113,11 +112,9 @@ const BuildingState = () => { If your dashboard hasn't connected within 2 minutes, you can open a support ticket. - - - - - + } /> diff --git a/studio/components/layouts/ProjectLayout/ConnectingState.tsx b/studio/components/layouts/ProjectLayout/ConnectingState.tsx index 36708f85ff..9743731dd0 100644 --- a/studio/components/layouts/ProjectLayout/ConnectingState.tsx +++ b/studio/components/layouts/ProjectLayout/ConnectingState.tsx @@ -77,22 +77,21 @@ const ConnectingState = ({ project }: ConnectingStateProps) => {
-
-
-
-
-
-
-
- }>
- Troubleshooting
-
-
-
+
+ }>
+
+ Troubleshooting
+
+
Have a technical issue? Contact{' '} - - - Supabase support - - + + Supabase support + {' '} or{' '} diff --git a/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx b/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx index 557f9d00f8..dbc51fba5d 100644 --- a/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx +++ b/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx @@ -1,5 +1,5 @@ import * as Tooltip from '@radix-ui/react-tooltip' -import Image from 'next/image' +import Image from 'next/legacy/image' import Link from 'next/link' import { useRouter } from 'next/router' import SVG from 'react-inlinesvg' @@ -73,38 +73,34 @@ const HelpPopover = ({ alt = false }: HelpPopoverProps) => { services.
-
- }>
-
- Troubleshooting
-
-
-
-
- }>
-
- Docs
-
-
-
-
- }>
-
- Supabase Status
-
-
-
+ }>
+
+ Troubleshooting
+
+
+ }>
+
+ Docs
+
+
+ }>
+
+ Supabase Status
+
+
Expected response time is based on your billing plan. Pro and Pay as You Go plans are prioritized.
-
- }>
- Contact Support
-
-
+ }>
+ Contact Support
+
{upgrade.version_to}
{upgrade.changelog_link && (
-
-
-
)}
diff --git a/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.tsx b/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.tsx
index b341b17f98..cbf55dc059 100644
--- a/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.tsx
+++ b/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.tsx
@@ -77,14 +77,12 @@ const NavigationBar = () => {
>
-
{(!navLayoutV2 || !IS_PLATFORM) && (
-
-
-
-
+
+
)}
Account preferences
-Unpaused projects count towards compute usage. For every hour your instance is active, we'll bill you based on the instance size of your project. See{' '} - - - Compute Instance Usage Billing - + + Compute Instance Usage Billing {' '} for more details.
@@ -145,23 +148,21 @@ const ProjectPausedState = ({ product }: ProjectPausedStateProps) => { )} {isFreePlan ? ( - - - - - + ) : ( - - - - - + )} diff --git a/studio/components/layouts/ProjectLayout/RestoringState.tsx b/studio/components/layouts/ProjectLayout/RestoringState.tsx index 3eb4e3c71d..982a871723 100644 --- a/studio/components/layouts/ProjectLayout/RestoringState.tsx +++ b/studio/components/layouts/ProjectLayout/RestoringState.tsx @@ -91,13 +91,13 @@ const RestoringState = () => { {isFailed && (
-
-
-
-
-
+
)}
diff --git a/studio/components/layouts/ProjectLayout/UpgradingState/UpgradingState.tsx b/studio/components/layouts/ProjectLayout/UpgradingState/UpgradingState.tsx
index 86ec8d78e2..3c96da075a 100644
--- a/studio/components/layouts/ProjectLayout/UpgradingState/UpgradingState.tsx
+++ b/studio/components/layouts/ProjectLayout/UpgradingState/UpgradingState.tsx
@@ -104,13 +104,15 @@ const UpgradingState = () => {
-
-
-
-
-
+
diff --git a/studio/components/layouts/SQLEditorLayout/QueryItem.tsx b/studio/components/layouts/SQLEditorLayout/QueryItem.tsx
index a78e83eb21..abdaf612dc 100644
--- a/studio/components/layouts/SQLEditorLayout/QueryItem.tsx
+++ b/studio/components/layouts/SQLEditorLayout/QueryItem.tsx
@@ -67,15 +67,13 @@ const QueryItem = ({ tabInfo }: QueryItemProps) => {
)}
ref={isActive ? (activeItemRef as React.RefObject) : null}
>
-
-
-
diff --git a/studio/components/layouts/SettingsLayout/SettingsMenuItem.tsx b/studio/components/layouts/SettingsLayout/SettingsMenuItem.tsx
index 819b7e28e3..c79f5b56f4 100644
--- a/studio/components/layouts/SettingsLayout/SettingsMenuItem.tsx
+++ b/studio/components/layouts/SettingsLayout/SettingsMenuItem.tsx
@@ -10,15 +10,14 @@ interface SettingsMenuItemProps {
const SettingsMenuItem = ({ href, label, isActive }: SettingsMenuItemProps) => {
return (
- {name} -
- + ++ {name} +
{
-
-
- {label}
-
+
+ {label}
)
diff --git a/studio/components/layouts/SignInLayout/ForgotPasswordLayout.tsx b/studio/components/layouts/SignInLayout/ForgotPasswordLayout.tsx
index 07b13f67f2..e943936d20 100644
--- a/studio/components/layouts/SignInLayout/ForgotPasswordLayout.tsx
+++ b/studio/components/layouts/SignInLayout/ForgotPasswordLayout.tsx
@@ -1,7 +1,7 @@
import { useTheme } from 'next-themes'
import { BASE_PATH } from 'lib/constants'
import { observer } from 'mobx-react-lite'
-import Image from 'next/image'
+import Image from 'next/legacy/image'
import Link from 'next/link'
import { PropsWithChildren } from 'react'
@@ -28,18 +28,16 @@ const ForgotPasswordLayout = ({
-
-
-
-
-
-
- }>
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
@@ -143,12 +139,18 @@ const SignInLayout = ({
By continuing, you agree to Supabase's{' '} - - Terms of Service + + Terms of Service {' '} and{' '} - - Privacy Policy + + Privacy Policy , and to receive periodic emails with updates.
diff --git a/studio/components/layouts/StorageLayout/BucketRow.tsx b/studio/components/layouts/StorageLayout/BucketRow.tsx index 2fc2f3c8df..9973f728da 100644 --- a/studio/components/layouts/StorageLayout/BucketRow.tsx +++ b/studio/components/layouts/StorageLayout/BucketRow.tsx @@ -45,18 +45,19 @@ const BucketRow = ({ )} > {/* Even though we trim whitespaces from bucket names, there may be some existing buckets with trailing whitespaces. */} - - -
- Public }
-
-
+
+ - {bucket.name} -
- {bucket.public &&
+ Public }
+
{/* [JOSHEN TODO] need to change this */}
{false ? (
diff --git a/studio/components/layouts/StorageLayout/StorageBucketsError.tsx b/studio/components/layouts/StorageLayout/StorageBucketsError.tsx
index 973abb0727..c5bddff3a9 100644
--- a/studio/components/layouts/StorageLayout/StorageBucketsError.tsx
+++ b/studio/components/layouts/StorageLayout/StorageBucketsError.tsx
@@ -11,23 +11,20 @@ const StorageBucketsError = ({ error }: StorageBucketsErrorProps) => {
const { ref } = useParams()
return (
- + {bucket.name} +
+ {bucket.public &&
+
-
-
-
- ,
+ ,
]}
>
diff --git a/studio/components/layouts/TableEditorLayout/EntityListItem.tsx b/studio/components/layouts/TableEditorLayout/EntityListItem.tsx
index 76f36ce19f..0f0a71ad21 100644
--- a/studio/components/layouts/TableEditorLayout/EntityListItem.tsx
+++ b/studio/components/layouts/TableEditorLayout/EntityListItem.tsx
@@ -117,87 +117,87 @@ const EntityListItem = ({ id, projectRef, item: entity, isLocked }: EntityListIt
isActive && 'text-foreground bg-scale-300'
)}
>
-
-
-
-
- {entity.type === ENTITY_TYPE.TABLE ? (
-
-
-
-
-
-
-
+
+
+
+
+ = ({ children }) => (
)
-const ExampleName: React.FC = ({ children }) => (
+const ExampleName: React.FC = ({ children }) => (
= useMemo(
() =>
({ children }) =>
(
diff --git a/studio/components/ui/Charts/Sparkline.stories.tsx b/studio/components/ui/Charts/Sparkline.stories.tsx
index 1808d40a2d..a305d48416 100644
--- a/studio/components/ui/Charts/Sparkline.stories.tsx
+++ b/studio/components/ui/Charts/Sparkline.stories.tsx
@@ -42,7 +42,7 @@ export const Sparkline = () => (
)
-const ExampleName: React.FC = ({ children }) => (
+const ExampleName: React.FC = ({ children }) => (
)
-const ExampleName: React.FC = ({ children }) => (
+const ExampleName: React.FC = ({ children }) => (
diff --git a/studio/components/layouts/StorageLayout/StorageMenu.tsx b/studio/components/layouts/StorageLayout/StorageMenu.tsx index b49ea1311c..b5c9b7d1aa 100644 --- a/studio/components/layouts/StorageLayout/StorageMenu.tsx +++ b/studio/components/layouts/StorageLayout/StorageMenu.tsx @@ -124,7 +124,7 @@ const StorageMenu = () => {
Policies
-
- {formatTooltipText(entity.type)}
-
-
-
- {/* only show tooltips if required, to reduce noise */}
- {entity.name.length > 20 ? (
-
- {entity.name}
-
-
+
+ {formatTooltipText(entity.type)}
+
+
+
+ {/* only show tooltips if required, to reduce noise */}
+ {entity.name.length > 20 ? (
+
+ {entity.name}
+
+
{entity.type === ENTITY_TYPE.TABLE && isActive && !isLocked && (
@@ -230,17 +230,15 @@ const EntityListItem = ({ id, projectRef, item: entity, isLocked }: EntityListIt
-
-
-
+
+
+
{
-
- )}
-
- )
-}
-
-function removeElement() {
- const target = document.getElementById('supabase-ui-confirm-alert')
- if (target) {
- unmountComponentAtNode(target)
- target.parentNode.removeChild(target)
- }
-}
-
-function createElement(properties) {
- let divTarget = document.getElementById('supabase-ui-confirm-alert')
- if (divTarget) {
- render( = ({
+const CSVButton = ({
onClick,
buttonType = 'default',
icon,
@@ -21,7 +21,7 @@ const CSVButton: React.FC = ({
disabled,
data,
title,
-}) => {
+}: PropsWithChildren) => {
const csvRef = useRef(null)
const handleDownload = () => {
;(csvRef.current as any)?.link.click()
diff --git a/studio/components/ui/CardButton.tsx b/studio/components/ui/CardButton.tsx
index 2fc3a80912..e3c5abc14c 100644
--- a/studio/components/ui/CardButton.tsx
+++ b/studio/components/ui/CardButton.tsx
@@ -31,9 +31,7 @@ const CardButton = ({
loading = false,
}: PropsWithChildren) => {
const LinkContainer = ({ children }: { children: React.ReactNode }) => (
-
- {children}
-
+ {children}
)
const UrlContainer = ({ children }: { children: React.ReactNode }) => {children}
const NonLinkContainer = ({ children }: { children: React.ReactNode }) =>
)
-const ExampleName: React.FC = ({ children }) => (
+const ExampleName: React.FCDuplicate Table
- - -View Policies
-View Policies
+ +
-
- 
-
+
- }
- >
- {description && (
-
-
+
diff --git a/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js b/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js
deleted file mode 100644
index 20fffb585e..0000000000
--- a/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js
+++ /dev/null
@@ -1,91 +0,0 @@
-import { useState } from 'react'
-import { render, unmountComponentAtNode } from 'react-dom'
-import { Button, Modal } from 'ui'
-
-function ConfirmModal({
- title,
- message: description,
- onConfirm,
- onAsyncConfirm,
- variant = 'danger',
- confirmText = 'Confirm',
-}) {
- const [loading, setLoading] = useState(false)
-
- function onCancelClick() {
- if (!loading) onClose()
- }
-
- async function onConfirmClick() {
- if (onAsyncConfirm) {
- setLoading(true)
- await onAsyncConfirm()
-
- onClose()
- } else if (onConfirm) {
- onConfirm()
- onClose()
- }
- }
-
- function onClose() {
- removeElement()
- }
-
- return (
-
{description}
-
-
-
-
+
diff --git a/studio/components/ui/CSVButton.tsx b/studio/components/ui/CSVButton.tsx
index 9ddcbf49ae..3289641afe 100644
--- a/studio/components/ui/CSVButton.tsx
+++ b/studio/components/ui/CSVButton.tsx
@@ -1,10 +1,10 @@
import { Button, IconDownloadCloud } from 'ui'
import { ButtonProps } from 'ui/src/components/Button/Button'
import { flattenDeep } from 'lodash'
-import React, { useMemo, useRef } from 'react'
+import React, { PropsWithChildren, useMemo, useRef } from 'react'
import { CSVLink } from 'react-csv'
-interface Props {
+interface CSVButtonProps {
buttonType?: ButtonProps['type']
onClick?: ButtonProps['onClick']
disabled?: ButtonProps['disabled']
@@ -13,7 +13,7 @@ interface Props {
title?: string
}
-const CSVButton: React.FC{children}
diff --git a/studio/components/ui/Charts/AreaChart.stories.tsx b/studio/components/ui/Charts/AreaChart.stories.tsx
index 77a3b92db6..ebcad3f384 100644
--- a/studio/components/ui/Charts/AreaChart.stories.tsx
+++ b/studio/components/ui/Charts/AreaChart.stories.tsx
@@ -50,6 +50,6 @@ export const AreaChart = () => (
{children}
) diff --git a/studio/components/ui/Charts/BarChart.stories.tsx b/studio/components/ui/Charts/BarChart.stories.tsx index 72894c415c..cb8489dafc 100644 --- a/studio/components/ui/Charts/BarChart.stories.tsx +++ b/studio/components/ui/Charts/BarChart.stories.tsx @@ -51,6 +51,6 @@ export const BarChart = () => ({children}
) diff --git a/studio/components/ui/Charts/Charts.utils.tsx b/studio/components/ui/Charts/Charts.utils.tsx index 913f9965b8..a824e1a881 100644 --- a/studio/components/ui/Charts/Charts.utils.tsx +++ b/studio/components/ui/Charts/Charts.utils.tsx @@ -82,7 +82,7 @@ export const useChartSize = ( } ) => { const minHeight = sizeMap[size] - const Container: React.FC = useMemo( + const Container: React.FC(
Error: [{error?.code}] {error?.message} diff --git a/studio/components/ui/Forms/FormHeader.tsx b/studio/components/ui/Forms/FormHeader.tsx index 88261b2619..1e85d6b386 100644 --- a/studio/components/ui/Forms/FormHeader.tsx +++ b/studio/components/ui/Forms/FormHeader.tsx @@ -26,13 +26,11 @@ const FormHeader = ({ )} {docsUrl !== undefined && ( - - }> - - Documentation - - - + }> + + Documentation + + )} ) diff --git a/studio/components/ui/InformationBox.tsx b/studio/components/ui/InformationBox.tsx index 7422ca0383..abcaf4ff5d 100644 --- a/studio/components/ui/InformationBox.tsx +++ b/studio/components/ui/InformationBox.tsx @@ -65,13 +65,11 @@ const InformationBox = ({
{description}
{url && (
-
-
- }>
- {urlLabel}
-
-
-
+ }>
+
+ {urlLabel}
+
+
)}
{button && {button}
}
diff --git a/studio/components/ui/Logs/LogsExplorerHeader.tsx b/studio/components/ui/Logs/LogsExplorerHeader.tsx
index d3eac01b17..59697b68dc 100644
--- a/studio/components/ui/Logs/LogsExplorerHeader.tsx
+++ b/studio/components/ui/Logs/LogsExplorerHeader.tsx
@@ -39,13 +39,9 @@ const LogsExplorerHeader = ({ subtitle }: LogsExplorerHeaderProps) => {
{subtitle && {subtitle}}
-
-
- }>
- Documentation
-
-
-
+ }>
+ Documentation
+
{
The following table shows all the available paths that can be queried from each
respective source. Do note that to access nested keys, you would need to perform the
necessary{' '}
-
-
- unnesting joins
-
diff --git a/studio/components/ui/OveragesBanner/OveragesBanner.tsx b/studio/components/ui/OveragesBanner/OveragesBanner.tsx
index d99fba0736..4e8ddd990d 100644
--- a/studio/components/ui/OveragesBanner/OveragesBanner.tsx
+++ b/studio/components/ui/OveragesBanner/OveragesBanner.tsx
@@ -84,11 +84,11 @@ const OveragesBanner = ({ tier, minimal }: OveragesBannerProps) => {
actions={
minimal ? (
-
-
-
-
-
+
) : (
<>
diff --git a/studio/components/ui/ProductMenu/ProductMenu.tsx b/studio/components/ui/ProductMenu/ProductMenu.tsx
index 3d12c17ac0..ded04b416f 100644
--- a/studio/components/ui/ProductMenu/ProductMenu.tsx
+++ b/studio/components/ui/ProductMenu/ProductMenu.tsx
@@ -1,6 +1,6 @@
import { Badge, Menu } from 'ui'
-import { ProductMenuGroup, ProductMenuGroupItem } from './ProductMenu.types'
+import { ProductMenuGroup } from './ProductMenu.types'
import ProductMenuItem from './ProductMenuItem'
interface ProductMenuProps {
@@ -12,7 +12,7 @@ const ProductMenu = ({ page, menu }: ProductMenuProps) => {
return (
-
-
- }>
- API Docs
-
-
-
-
-
- }>
- CLI docs
-
-
-
+ }>
+
+ API Docs
+
+
+ }>
+
+ CLI docs
+
+
Already have an account?{' '}
-
- Sign In
+
+ Sign In
diff --git a/studio/pages/integrations/vercel/[slug]/marketplace/choose-project.tsx b/studio/pages/integrations/vercel/[slug]/marketplace/choose-project.tsx
index 01cff8dc03..420a6610d3 100644
--- a/studio/pages/integrations/vercel/[slug]/marketplace/choose-project.tsx
+++ b/studio/pages/integrations/vercel/[slug]/marketplace/choose-project.tsx
@@ -127,7 +127,7 @@ const VercelIntegration: NextPageWithLayout = () => {
})
const onCreateConnections = useCallback(
- (vars) => {
+ (vars: any) => {
createConnections({
...vars,
connection: {
diff --git a/studio/pages/integrations/vercel/install.tsx b/studio/pages/integrations/vercel/install.tsx
index 6405a62f45..abcd2e657f 100644
--- a/studio/pages/integrations/vercel/install.tsx
+++ b/studio/pages/integrations/vercel/install.tsx
@@ -218,8 +218,8 @@ const VercelIntegration: NextPageWithLayout = () => {
-
+
+
-
- }
- >
-
- Announcement
-
-
-
- }
>
- }
+
-
- Documentation
-
-
-
+ Announcement
+
+
+ }
+ >
+
+ Documentation
+
+
}
@@ -606,40 +607,42 @@ const Wizard: NextPageWithLayout = () => {
This organization uses the legacy project-based billing. We’ve recently made
some big improvements to our billing system. To migrate to the new
organization-based billing, head over to your{' '}
-
-
- organization billing settings
-
+
+ organization billing settings
.
-
- }
- >
-
- Announcement
-
-
-
- }
>
- }
+
-
- Documentation
-
-
-
+ Announcement
+
+
+ }
+ >
+
+ Documentation
+
+
}
@@ -693,7 +696,7 @@ const Wizard: NextPageWithLayout = () => {
)
}
-const PageLayout = withAuth(({ children }) => {
+const PageLayout = withAuth(({ children }: PropsWithChildren) => {
const { slug } = useParams()
const { data: organizations } = useOrganizationsQuery()
diff --git a/studio/pages/new/index.tsx b/studio/pages/new/index.tsx
index c9e52366a7..dd6dfd6f8e 100644
--- a/studio/pages/new/index.tsx
+++ b/studio/pages/new/index.tsx
@@ -29,7 +29,7 @@ const Wizard: NextPageWithLayout = () => {
const { mutate: setupIntent } = useSetupIntent({ onSuccess: (res) => setIntent(res) })
- const captchaRefCallback = useCallback((node) => {
+ const captchaRefCallback = useCallback((node: any) => {
setCaptchaRef(node)
}, [])
diff --git a/studio/pages/org/[slug]/index.tsx b/studio/pages/org/[slug]/index.tsx
index b4cd02d27e..05c4f47b85 100644
--- a/studio/pages/org/[slug]/index.tsx
+++ b/studio/pages/org/[slug]/index.tsx
@@ -41,13 +41,9 @@ const ProjectsPage: NextPageWithLayout = () => {
-
-
- }>
- New project
-
-
-
+ }>
+ New project
+
Projects
@@ -71,11 +67,9 @@ const ProjectsPage: NextPageWithLayout = () => {
-
-
- }>New Project
-
-
+ }>
+ New Project
+
) : (
diff --git a/studio/pages/org/_/[[...routeSlug]].tsx b/studio/pages/org/_/[[...routeSlug]].tsx
index 272ea7fa40..88d13fdd57 100644
--- a/studio/pages/org/_/[[...routeSlug]].tsx
+++ b/studio/pages/org/_/[[...routeSlug]].tsx
@@ -14,14 +14,12 @@ const Header = () => {
-
-
-
+
-
+
-
-
- }>New organization
-
-
+ }>
+ New organization
+
) : (
diff --git a/studio/pages/project/[ref]/api/graphiql.tsx b/studio/pages/project/[ref]/api/graphiql.tsx
index 1263881bf3..d4a67a8883 100644
--- a/studio/pages/project/[ref]/api/graphiql.tsx
+++ b/studio/pages/project/[ref]/api/graphiql.tsx
@@ -2,7 +2,7 @@ import { createGraphiQLFetcher, Fetcher } from '@graphiql/toolkit'
import { observer } from 'mobx-react-lite'
import { useEffect, useMemo } from 'react'
-import { useTheme } from 'next-themes'
+import '@graphiql/react/dist/style.css'
import { useParams } from 'common/hooks'
import ExtensionCard from 'components/interfaces/Database/Extensions/ExtensionCard'
import GraphiQL from 'components/interfaces/GraphQL/GraphiQL'
@@ -12,6 +12,7 @@ import { useSessionAccessTokenQuery } from 'data/auth/session-access-token-query
import { useProjectApiQuery } from 'data/config/project-api-query'
import { useStore } from 'hooks'
import { API_URL, IS_PLATFORM } from 'lib/constants'
+import { useTheme } from 'next-themes'
import { NextPageWithLayout } from 'types'
const GraphiQLPage: NextPageWithLayout = () => {
diff --git a/studio/pages/project/[ref]/database/graphiql.tsx b/studio/pages/project/[ref]/database/graphiql.tsx
index c950b0f3ec..e01d54d1a2 100644
--- a/studio/pages/project/[ref]/database/graphiql.tsx
+++ b/studio/pages/project/[ref]/database/graphiql.tsx
@@ -2,6 +2,7 @@ import { createGraphiQLFetcher, Fetcher } from '@graphiql/toolkit'
import { observer } from 'mobx-react-lite'
import { useEffect, useMemo } from 'react'
+import '@graphiql/react/dist/style.css'
import { useParams } from 'common/hooks'
import ExtensionCard from 'components/interfaces/Database/Extensions/ExtensionCard'
import GraphiQL from 'components/interfaces/GraphQL/GraphiQL'
diff --git a/studio/pages/project/[ref]/database/schemas.tsx b/studio/pages/project/[ref]/database/schemas.tsx
index a7dbe56d6a..47d5fa2d71 100644
--- a/studio/pages/project/[ref]/database/schemas.tsx
+++ b/studio/pages/project/[ref]/database/schemas.tsx
@@ -5,11 +5,10 @@ import SchemaGraph from 'components/interfaces/Database/Schemas/SchemaGraph'
import { DatabaseLayout } from 'components/layouts'
import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
import AlertError from 'components/ui/AlertError'
+import SchemaSelector from 'components/ui/SchemaSelector'
import { useSchemasQuery } from 'data/database/schemas-query'
import { EXCLUDED_SCHEMAS } from 'lib/constants/schemas'
import { NextPageWithLayout } from 'types'
-import { IconLock, Listbox } from 'ui'
-import SchemaSelector from 'components/ui/SchemaSelector'
const SchemasPage: NextPageWithLayout = () => {
const { project } = useProjectContext()
diff --git a/studio/pages/project/[ref]/database/tables.tsx b/studio/pages/project/[ref]/database/tables.tsx
index 8a65e53fad..329b39895f 100644
--- a/studio/pages/project/[ref]/database/tables.tsx
+++ b/studio/pages/project/[ref]/database/tables.tsx
@@ -61,7 +61,7 @@ const DatabaseTables: NextPageWithLayout = () => {
-
- }>
-
- Documentation
-
-
-
+ }>
+
+ Documentation
+
+
diff --git a/studio/pages/project/[ref]/reports/database.tsx b/studio/pages/project/[ref]/reports/database.tsx
index 11960e908c..67080c3a1e 100644
--- a/studio/pages/project/[ref]/reports/database.tsx
+++ b/studio/pages/project/[ref]/reports/database.tsx
@@ -204,16 +204,15 @@ const DatabaseUsage = observer(() => {
are inactive.
-
- }>
-
- Read about database space
-
-
-
+ }>
+
+ Read about database space
+
+
diff --git a/studio/pages/project/[ref]/reports/query-performance.tsx b/studio/pages/project/[ref]/reports/query-performance.tsx
index 4e9f281a3c..6e942110ac 100644
--- a/studio/pages/project/[ref]/reports/query-performance.tsx
+++ b/studio/pages/project/[ref]/reports/query-performance.tsx
@@ -71,11 +71,10 @@ const QueryPerformanceReport: NextPageWithLayout = () => {
{'\n\n'}It relies on the pg_stat_statements table. Read more about{' '}
-
- examining query performance
-
+ examining query performance
.{'\n\n'}Consider resetting the analysis after optimizing any queries.
diff --git a/studio/pages/project/[ref]/settings/addons.tsx b/studio/pages/project/[ref]/settings/addons.tsx
index d8cd7e0fac..430e7d4ae7 100644
--- a/studio/pages/project/[ref]/settings/addons.tsx
+++ b/studio/pages/project/[ref]/settings/addons.tsx
@@ -20,8 +20,8 @@ const ProjectAddons: NextPageWithLayout = () => {
title="This page is only available for projects under an organization subscription"
>
You might be looking for the{' '}
-
- project's subscription
+
+ project's subscription
{' '}
page instead.
diff --git a/studio/pages/project/[ref]/settings/billing/invoices.tsx b/studio/pages/project/[ref]/settings/billing/invoices.tsx
index a07620a782..094e2bcd67 100644
--- a/studio/pages/project/[ref]/settings/billing/invoices.tsx
+++ b/studio/pages/project/[ref]/settings/billing/invoices.tsx
@@ -39,7 +39,7 @@ export default ProjectBilling
const Settings = () => {
const selectedOrganization = useSelectedOrganization()
- const orgSlug = selectedOrganization?.slug ?? ''
+ const orgSlug = selectedOrganization?.slug ?? '_'
return (
@@ -56,29 +56,34 @@ const Settings = () => {
This organization uses the legacy project-based billing. We’ve recently made some
big improvements to our billing system. To migrate to the new organization-based
billing, head over to your{' '}
-
-
- organization billing settings
-
+
+ organization billing settings
.
}
@@ -89,10 +94,11 @@ const Settings = () => {
-
- }>
-
- Announcement
-
-
-
-
- }>
-
- Documentation
-
-
-
+ }>
+
+ Announcement
+
+
+ }>
+
+ Documentation
+
+
To manage your billing address, emails or Tax ID, head to your{' '}
-
-
- organization settings
-
+
+ organization settings
.
diff --git a/studio/pages/project/[ref]/settings/infrastructure.tsx b/studio/pages/project/[ref]/settings/infrastructure.tsx
index ea2bdbcf75..3551c187d6 100644
--- a/studio/pages/project/[ref]/settings/infrastructure.tsx
+++ b/studio/pages/project/[ref]/settings/infrastructure.tsx
@@ -22,8 +22,8 @@ const ProjectInfrastructure: NextPageWithLayout = () => {
title="This page is only available for projects under an organization subscription"
>
You might be looking for the{' '}
-
- project's usage
+
+ project's usage
{' '}
page instead.
diff --git a/studio/pages/project/_/[[...routeSlug]].tsx b/studio/pages/project/_/[[...routeSlug]].tsx
index 3be69c1a8a..d16d5ed6b0 100644
--- a/studio/pages/project/_/[[...routeSlug]].tsx
+++ b/studio/pages/project/_/[[...routeSlug]].tsx
@@ -12,14 +12,12 @@ const Header = () => {
-
-
-
+
-
+
Already have an account?{' '}
-
- Sign In
+
+ Sign In
diff --git a/studio/pages/sign-in.tsx b/studio/pages/sign-in.tsx
index fd2a4f4628..1fc0fb40df 100644
--- a/studio/pages/sign-in.tsx
+++ b/studio/pages/sign-in.tsx
@@ -39,10 +39,11 @@ const SignInPage: NextPageWithLayout = () => {
Don't have an account?{' '}
-
-
- Sign Up Now
-
+
+ Sign Up Now
Have an account?{' '}
-
-
- Sign In Now
-
+
+ Sign In Now
diff --git a/studio/pages/support/new.tsx b/studio/pages/support/new.tsx
index fe14659372..55dd424239 100644
--- a/studio/pages/support/new.tsx
+++ b/studio/pages/support/new.tsx
@@ -33,37 +33,38 @@ const SupportPage = () => {
Supabase support
-
-
- }>
- Troubleshooting
-
-
-
+ }>
+
+ Troubleshooting
+
+
-
-
-
- ) : isHealthy ? (
-
- ) : (
-
- )
- }
- >
- {isLoading
- ? 'Checking status'
- : isHealthy
- ? 'All systems operational'
- : 'Active incident ongoing'}
-
-
-
+
+ ) : isHealthy ? (
+
+ ) : (
+
+ )
+ }
+ >
+
+ {isLoading
+ ? 'Checking status'
+ : isHealthy
+ ? 'All systems operational'
+ : 'Active incident ongoing'}
+
+
diff --git a/studio/pages/vercel/integrate.tsx b/studio/pages/vercel/integrate.tsx
index 3b9a466d8d..c10f97a1fb 100644
--- a/studio/pages/vercel/integrate.tsx
+++ b/studio/pages/vercel/integrate.tsx
@@ -216,10 +216,8 @@ const ProjectLinksEmptyState = () => (
You haven't created a Supabase project yet. Get started by creating a new Supabase project,
then close this window and retry adding integration.
-
-
- Start a new Supabase project
-
+
+ Start a new Supabase project
)
diff --git a/studio/sentry.client.config.js b/studio/sentry.client.config.ts
similarity index 84%
rename from studio/sentry.client.config.js
rename to studio/sentry.client.config.ts
index bc399f1ab6..536fe44fb8 100644
--- a/studio/sentry.client.config.js
+++ b/studio/sentry.client.config.ts
@@ -1,19 +1,16 @@
-// This file configures the initialization of Sentry on the browser.
-// The config you add here will be used whenever a page is visited.
-// https://docs.sentry.io/platforms/javascript/guides/nextjs/
-
import * as Sentry from '@sentry/nextjs'
import { match } from 'path-to-regexp'
-import { Integrations } from '@sentry/tracing'
Sentry.init({
dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
tracesSampleRate: 0.01,
- // Note: if you want to override the automatic release value, do not set a
- // `release` value here - use the environment variable `SENTRY_RELEASE`, so
- // that it will also get attached to your source maps
+ debug: false,
integrations: [
- new Integrations.BrowserTracing({
+ new Sentry.BrowserTracing({
+ // TODO: update gotrue + api to support Access-Control-Request-Headers: authorization,baggage,sentry-trace,x-client-info
+ // then remove these options
+ traceFetch: false,
+ traceXHR: false,
beforeNavigate: (context) => {
return {
...context,
@@ -51,25 +48,25 @@ Sentry.init({
// Replace dynamic query param with a template text
// Support grouping sentry transaction
-function standardiseRouterUrl(url) {
+function standardiseRouterUrl(url: string) {
let finalUrl = url
const orgMatch = match('/org/:slug/(.*)', { decode: decodeURIComponent })
const orgMatchResult = orgMatch(finalUrl)
if (orgMatchResult) {
- finalUrl = finalUrl.replace(orgMatchResult.params.slug, '[slug]')
+ finalUrl = finalUrl.replace((orgMatchResult.params as any).slug, '[slug]')
}
const newOrgMatch = match('/new/:slug', { decode: decodeURIComponent })
const newOrgMatchResult = newOrgMatch(finalUrl)
if (newOrgMatchResult) {
- finalUrl = finalUrl.replace(newOrgMatchResult.params.slug, '[slug]')
+ finalUrl = finalUrl.replace((newOrgMatchResult.params as any).slug, '[slug]')
}
const projectMatch = match('/project/:ref/(.*)', { decode: decodeURIComponent })
const projectMatchResult = projectMatch(finalUrl)
if (projectMatchResult) {
- finalUrl = finalUrl.replace(projectMatchResult.params.ref, '[ref]')
+ finalUrl = finalUrl.replace((projectMatchResult.params as any).ref, '[ref]')
}
return finalUrl
@@ -77,7 +74,7 @@ function standardiseRouterUrl(url) {
// Ignore dev console errors getting incorrectly thrown to sentry (Chrome specific)
// https://github.com/getsentry/sentry-javascript/issues/5179#issuecomment-1206343862
-function filterConsoleErrors(event) {
+function filterConsoleErrors(event: any) {
const originalException = event.exception?.values?.[0]
// Console errors appear to always bubble up to `window.onerror` and to be unhandled. So if,
@@ -117,11 +114,11 @@ function filterConsoleErrors(event) {
return event
}
-function isSuspiciousError(errorType) {
+function isSuspiciousError(errorType: string) {
return ['syntaxerror', 'referenceerror', 'typeerror'].includes(errorType)
}
-function hasSuspiciousFrames(stackFrames) {
+function hasSuspiciousFrames(stackFrames: any[]) {
const allSuspicious = stackFrames.every(isSuspiciousFrame)
// Certain type errors will include the thrown error message as the second stack frame,
@@ -131,7 +128,7 @@ function hasSuspiciousFrames(stackFrames) {
return allSuspicious || firstSuspicious
}
-function isSuspiciousFrame(frame) {
+function isSuspiciousFrame(frame: any) {
const url = window.location.href
return frame.function === '?' && (frame.filename === '