diff --git a/apps/design-system/app/SonnerToast.tsx b/apps/design-system/app/SonnerToast.tsx deleted file mode 100644 index 28a013f1dbc..00000000000 --- a/apps/design-system/app/SonnerToast.tsx +++ /dev/null @@ -1,10 +0,0 @@ -'use client' - -import { SonnerToaster as Toaster } from 'ui' - -import { useConfig } from '@/hooks/use-config' - -export function SonnerToaster() { - const [config] = useConfig() - return -} diff --git a/apps/design-system/app/layout.tsx b/apps/design-system/app/layout.tsx index 55f6ec8893f..e6c4f02ef17 100644 --- a/apps/design-system/app/layout.tsx +++ b/apps/design-system/app/layout.tsx @@ -5,7 +5,7 @@ import type { Metadata, Viewport } from 'next' import { customFont, sourceCodePro } from './fonts' import { ThemeProvider } from './Providers' -import { SonnerToaster } from './SonnerToast' +import { Toaster } from './toaster' const className = `${customFont.variable} ${sourceCodePro.variable}` @@ -139,7 +139,7 @@ export default async function Layout({ children }: RootLayoutProps) {
{children}
- + diff --git a/apps/design-system/app/toaster.tsx b/apps/design-system/app/toaster.tsx new file mode 100644 index 00000000000..0fac1f8cd34 --- /dev/null +++ b/apps/design-system/app/toaster.tsx @@ -0,0 +1,18 @@ +'use client' + +import { useTheme } from 'next-themes' +import { SonnerToaster } from 'ui' + +import { useConfig } from '@/hooks/use-config' + +export function Toaster() { + const [config] = useConfig() + const { theme } = useTheme() + return ( + + ) +} diff --git a/apps/design-system/registry/default/example/mermaid-basic.tsx b/apps/design-system/registry/default/example/mermaid-basic.tsx index 4fb5c6f2d6f..ac2f27a28d5 100644 --- a/apps/design-system/registry/default/example/mermaid-basic.tsx +++ b/apps/design-system/registry/default/example/mermaid-basic.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidBasic() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-demo.tsx b/apps/design-system/registry/default/example/mermaid-demo.tsx index a282b9d2df9..a36fd5df6c4 100644 --- a/apps/design-system/registry/default/example/mermaid-demo.tsx +++ b/apps/design-system/registry/default/example/mermaid-demo.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidDemo() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-er-diagram.tsx b/apps/design-system/registry/default/example/mermaid-er-diagram.tsx index aaa7882106f..016f4130c7a 100644 --- a/apps/design-system/registry/default/example/mermaid-er-diagram.tsx +++ b/apps/design-system/registry/default/example/mermaid-er-diagram.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidERDiagram() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-er-simple.tsx b/apps/design-system/registry/default/example/mermaid-er-simple.tsx index b49f8e366cf..ef81ce7eea6 100644 --- a/apps/design-system/registry/default/example/mermaid-er-simple.tsx +++ b/apps/design-system/registry/default/example/mermaid-er-simple.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidErSimple() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-flowchart-subgraph.tsx b/apps/design-system/registry/default/example/mermaid-flowchart-subgraph.tsx index 5ba8f754fec..25825797df8 100644 --- a/apps/design-system/registry/default/example/mermaid-flowchart-subgraph.tsx +++ b/apps/design-system/registry/default/example/mermaid-flowchart-subgraph.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidFlowchartSubgraph() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-flowchart.tsx b/apps/design-system/registry/default/example/mermaid-flowchart.tsx index 87bc64e813b..035a3758b98 100644 --- a/apps/design-system/registry/default/example/mermaid-flowchart.tsx +++ b/apps/design-system/registry/default/example/mermaid-flowchart.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidFlowchart() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-oauth-flow.tsx b/apps/design-system/registry/default/example/mermaid-oauth-flow.tsx index bd76de36874..548c2fcd521 100644 --- a/apps/design-system/registry/default/example/mermaid-oauth-flow.tsx +++ b/apps/design-system/registry/default/example/mermaid-oauth-flow.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidOAuthFlow() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-sequence-api.tsx b/apps/design-system/registry/default/example/mermaid-sequence-api.tsx index 69050f824dc..10581d2c8e8 100644 --- a/apps/design-system/registry/default/example/mermaid-sequence-api.tsx +++ b/apps/design-system/registry/default/example/mermaid-sequence-api.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidSequenceApi() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-sequence-async.tsx b/apps/design-system/registry/default/example/mermaid-sequence-async.tsx index 87769866ff1..13cfc7fd0f8 100644 --- a/apps/design-system/registry/default/example/mermaid-sequence-async.tsx +++ b/apps/design-system/registry/default/example/mermaid-sequence-async.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidSequenceAsync() { return ( diff --git a/apps/design-system/registry/default/example/mermaid-sequence-sync.tsx b/apps/design-system/registry/default/example/mermaid-sequence-sync.tsx index e22c4153899..ce979391d52 100644 --- a/apps/design-system/registry/default/example/mermaid-sequence-sync.tsx +++ b/apps/design-system/registry/default/example/mermaid-sequence-sync.tsx @@ -1,4 +1,4 @@ -import { Mermaid } from 'ui' +import { Mermaid } from 'ui-patterns/Mermaid' export default function MermaidSequenceSync() { return ( diff --git a/apps/design-system/types/assets.d.ts b/apps/design-system/types/assets.d.ts index 70be4aae409..269bb0cc593 100644 --- a/apps/design-system/types/assets.d.ts +++ b/apps/design-system/types/assets.d.ts @@ -1,3 +1,8 @@ +declare module '*.css' { + export const styles: Record + export default styles +} + declare module '*.scss' { export const styles: Record export default styles diff --git a/apps/docs/app/guides/deployment/terraform/reference/page.tsx b/apps/docs/app/guides/deployment/terraform/reference/page.tsx index b8877c2e92a..7c8606c2888 100644 --- a/apps/docs/app/guides/deployment/terraform/reference/page.tsx +++ b/apps/docs/app/guides/deployment/terraform/reference/page.tsx @@ -2,25 +2,19 @@ import { codeBlock } from 'common-tags' import { Check, PlusCircle } from 'lucide-react' import Link from 'next/link' import ReactMarkdown from 'react-markdown' +import { Heading, Popover_Shadcn_, PopoverContent_Shadcn_, PopoverTrigger_Shadcn_ } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' -import { - CodeBlock, - Heading, - PopoverContent_Shadcn_, - PopoverTrigger_Shadcn_, - Popover_Shadcn_, -} from 'ui' - -import { genGuideMeta } from '~/features/docs/GuidesMdx.utils' -import { GuideTemplate, newEditLink } from '~/features/docs/GuidesMdx.template' -import { getGitHubFileContents } from '~/lib/octokit' -import { TabPanel, Tabs } from '~/features/ui/Tabs' import { terraformDocsBranch, terraformDocsDocsDir, terraformDocsOrg, terraformDocsRepo, } from '../terraformConstants' +import { GuideTemplate, newEditLink } from '@/features/docs/GuidesMdx.template' +import { genGuideMeta } from '@/features/docs/GuidesMdx.utils' +import { TabPanel, Tabs } from '@/features/ui/Tabs' +import { getGitHubFileContents } from '@/lib/octokit' const meta = { title: 'Terraform Provider reference', diff --git a/apps/docs/app/guides/local-development/cli/config/page.tsx b/apps/docs/app/guides/local-development/cli/config/page.tsx index 341d800b6f8..75a28a947e0 100644 --- a/apps/docs/app/guides/local-development/cli/config/page.tsx +++ b/apps/docs/app/guides/local-development/cli/config/page.tsx @@ -1,11 +1,11 @@ -import ReactMarkdown from 'react-markdown' -import { CodeBlock } from 'ui' -import { Heading } from 'ui/src/components/CustomHTMLElements' import { type TOCHeader } from '~/components/GuidesSidebar' -import { genGuideMeta } from '~/features/docs/GuidesMdx.utils' import { GuideTemplate, newEditLink } from '~/features/docs/GuidesMdx.template' +import { genGuideMeta } from '~/features/docs/GuidesMdx.utils' import type { Parameter } from '~/lib/refGenerator/refTypes' import specFile from '~/spec/cli_v1_config.yaml' with { type: 'yml' } +import ReactMarkdown from 'react-markdown' +import { CodeBlock } from 'ui-patterns/CodeBlock' +import { Heading } from 'ui/src/components/CustomHTMLElements' const meta = { title: 'Supabase CLI config', diff --git a/apps/docs/app/page.tsx b/apps/docs/app/page.tsx index 0c4b88aa9f6..1a4ef194b3c 100644 --- a/apps/docs/app/page.tsx +++ b/apps/docs/app/page.tsx @@ -1,15 +1,16 @@ +import { isFeatureEnabled } from 'common' import { type Metadata, type ResolvingMetadata } from 'next' import Link from 'next/link' -import { cn, IconBackground, TextLink } from 'ui' +import { cn, IconBackground } from 'ui' import { IconPanel } from 'ui-patterns/IconPanel' +import { TextLink } from 'ui-patterns/TextLink' -import { isFeatureEnabled } from 'common' -import MenuIconPicker from '~/components/Navigation/NavigationMenu/MenuIconPicker' -import { MIGRATION_PAGES } from '~/components/Navigation/NavigationMenu/NavigationMenu.constants' -import { GlassPanelWithIconPicker } from '~/features/ui/GlassPanelWithIconPicker' -import { IconPanelWithIconPicker } from '~/features/ui/IconPanelWithIconPicker' -import HomeLayout from '~/layouts/HomeLayout' -import { BASE_PATH } from '~/lib/constants' +import MenuIconPicker from '@/components/Navigation/NavigationMenu/MenuIconPicker' +import { MIGRATION_PAGES } from '@/components/Navigation/NavigationMenu/NavigationMenu.constants' +import { GlassPanelWithIconPicker } from '@/features/ui/GlassPanelWithIconPicker' +import { IconPanelWithIconPicker } from '@/features/ui/IconPanelWithIconPicker' +import HomeLayout from '@/layouts/HomeLayout' +import { BASE_PATH } from '@/lib/constants' const { sdkCsharp, sdkDart, sdkKotlin, sdkPython, sdkSwift } = isFeatureEnabled([ 'sdk:csharp', diff --git a/apps/docs/components/JwtGenerator/JwtGenerator.tsx b/apps/docs/components/JwtGenerator/JwtGenerator.tsx index e004b3c20ec..314c1663f54 100644 --- a/apps/docs/components/JwtGenerator/JwtGenerator.tsx +++ b/apps/docs/components/JwtGenerator/JwtGenerator.tsx @@ -1,6 +1,7 @@ import { KJUR } from 'jsrsasign' import { ChangeEvent, useState } from 'react' -import { Button, CodeBlock, Input, Select } from 'ui' +import { Button, Input, Select } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' const JWT_HEADER = { alg: 'HS256', typ: 'JWT' } const now = new Date() diff --git a/apps/docs/components/JwtGenerator/JwtGeneratorSimple.tsx b/apps/docs/components/JwtGenerator/JwtGeneratorSimple.tsx index 0f6bb64014f..4ba0ae99e56 100644 --- a/apps/docs/components/JwtGenerator/JwtGeneratorSimple.tsx +++ b/apps/docs/components/JwtGenerator/JwtGeneratorSimple.tsx @@ -1,6 +1,7 @@ import { KJUR } from 'jsrsasign' import { useState } from 'react' -import { Button, CodeBlock } from 'ui' +import { Button } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' const JWT_HEADER = { alg: 'HS256', typ: 'JWT' } diff --git a/apps/docs/features/app.providers.tsx b/apps/docs/features/app.providers.tsx index 6d6caf07877..8469b004cbc 100644 --- a/apps/docs/features/app.providers.tsx +++ b/apps/docs/features/app.providers.tsx @@ -1,14 +1,15 @@ -import type { PropsWithChildren } from 'react' - -import { FeatureFlagProvider, IS_PLATFORM, ThemeProvider } from 'common' -import { DevToolbar, DevToolbarProvider } from 'dev-tools' -import { SonnerToaster, TooltipProvider } from 'ui' import SiteLayout from '~/layouts/SiteLayout' import { API_URL } from '~/lib/constants' +import { FeatureFlagProvider, IS_PLATFORM, ThemeProvider } from 'common' +import { DevToolbar, DevToolbarProvider } from 'dev-tools' +import type { PropsWithChildren } from 'react' +import { TooltipProvider } from 'ui' + import { AuthContainer } from './auth/auth.client' import { DocsCommandMenu, DocsCommandProvider } from './command' import { QueryClientProvider } from './data/queryClient.client' import { PageTelemetry } from './telemetry/telemetry.client' +import { Toaster } from './toaster' import { ScrollRestoration } from './ui/helpers.scroll.client' import { ThemeSandbox } from './ui/theme.client' @@ -34,7 +35,7 @@ function GlobalProviders({ children }: PropsWithChildren) { - + diff --git a/apps/docs/features/toaster.tsx b/apps/docs/features/toaster.tsx new file mode 100644 index 00000000000..4339a122692 --- /dev/null +++ b/apps/docs/features/toaster.tsx @@ -0,0 +1,9 @@ +'use client' + +import { useTheme } from 'next-themes' +import { SonnerToaster } from 'ui' + +export function Toaster() { + const { theme } = useTheme() + return +} diff --git a/apps/learn/app/SonnerToast.tsx b/apps/learn/app/SonnerToast.tsx deleted file mode 100644 index 819a8890e9d..00000000000 --- a/apps/learn/app/SonnerToast.tsx +++ /dev/null @@ -1,9 +0,0 @@ -'use client' - -import { useConfig } from '@/hooks/use-config' -import { SonnerToaster as Toaster } from 'ui' - -export function SonnerToaster() { - const [config] = useConfig() - return -} diff --git a/apps/learn/app/layout.tsx b/apps/learn/app/layout.tsx index 8903f15159d..d4dd63ee7d1 100644 --- a/apps/learn/app/layout.tsx +++ b/apps/learn/app/layout.tsx @@ -1,12 +1,14 @@ import type { Metadata } from 'next' import '@/styles/globals.css' -import { API_URL } from '@/lib/constants' + import { FeatureFlagProvider, TelemetryTagManager } from 'common' import { genFaviconData } from 'common/MetaFavicons/app-router' import { Inter } from 'next/font/google' + import { ThemeProvider } from './Providers' -import { SonnerToaster } from './SonnerToast' +import { Toaster } from './toaster' +import { API_URL } from '@/lib/constants' const inter = Inter({ subsets: ['latin'] }) @@ -51,7 +53,7 @@ export default async function Layout({ children }: RootLayoutProps) { enableSystem > {children} - + diff --git a/apps/learn/app/toaster.tsx b/apps/learn/app/toaster.tsx new file mode 100644 index 00000000000..0fac1f8cd34 --- /dev/null +++ b/apps/learn/app/toaster.tsx @@ -0,0 +1,18 @@ +'use client' + +import { useTheme } from 'next-themes' +import { SonnerToaster } from 'ui' + +import { useConfig } from '@/hooks/use-config' + +export function Toaster() { + const [config] = useConfig() + const { theme } = useTheme() + return ( + + ) +} diff --git a/apps/learn/types/assets.d.ts b/apps/learn/types/assets.d.ts new file mode 100644 index 00000000000..a4a9b8157f7 --- /dev/null +++ b/apps/learn/types/assets.d.ts @@ -0,0 +1,4 @@ +declare module '*.css' { + export const styles: Record + export default styles +} diff --git a/apps/studio/components/grid/components/header/ExportDialog.tsx b/apps/studio/components/grid/components/header/ExportDialog.tsx index 0432b0213ec..e397b669edb 100644 --- a/apps/studio/components/grid/components/header/ExportDialog.tsx +++ b/apps/studio/components/grid/components/header/ExportDialog.tsx @@ -1,5 +1,3 @@ -import { useState } from 'react' - import { useParams } from 'common' import { Filter, Sort, SupaTable } from 'components/grid/types' import { getConnectionStrings } from 'components/interfaces/Connect/DatabaseSettings.utils' @@ -7,11 +5,11 @@ import { useReadReplicasQuery } from 'data/read-replicas/replicas-query' import { getAllTableRowsSql } from 'data/table-rows/table-rows-query' import { pluckObjectFields } from 'lib/helpers' import { RoleImpersonationState, wrapWithRoleImpersonation } from 'lib/role-impersonation' +import { useState } from 'react' import { useRoleImpersonationStateSnapshot } from 'state/role-impersonation-state' import { Button, cn, - CodeBlock, Dialog, DialogContent, DialogFooter, @@ -25,6 +23,7 @@ import { TabsTrigger_Shadcn_, } from 'ui' import { Admonition } from 'ui-patterns' +import { CodeBlock } from 'ui-patterns/CodeBlock' interface ExportDialogProps { table?: SupaTable diff --git a/apps/studio/components/interfaces/Auth/Overview/OverviewLearnMore.tsx b/apps/studio/components/interfaces/Auth/Overview/OverviewLearnMore.tsx index c16b449d212..10c28ecf210 100644 --- a/apps/studio/components/interfaces/Auth/Overview/OverviewLearnMore.tsx +++ b/apps/studio/components/interfaces/Auth/Overview/OverviewLearnMore.tsx @@ -1,14 +1,11 @@ import { useParams } from 'common' -import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider' import { Logs } from 'icons' -import { BASE_PATH, DOCS_URL } from 'lib/constants' import { BookOpen } from 'lucide-react' import { useTheme } from 'next-themes' import Link from 'next/link' import { useEffect, useState } from 'react' -import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state' -import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state' -import { AiIconAnimation, Button, Card, CardContent, CardHeader, CardTitle, Image } from 'ui' +import { AiIconAnimation, Button, Card, CardContent, CardHeader, CardTitle } from 'ui' +import { Image } from 'ui-patterns/Image' import { PageSection, PageSectionContent, @@ -17,6 +14,11 @@ import { PageSectionTitle, } from 'ui-patterns/PageSection' +import { SIDEBAR_KEYS } from '@/components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider' +import { BASE_PATH, DOCS_URL } from '@/lib/constants' +import { useAiAssistantStateSnapshot } from '@/state/ai-assistant-state' +import { useSidebarManagerSnapshot } from '@/state/sidebar-manager-state' + export const OverviewLearnMore = () => { const [isMounted, setIsMounted] = useState(false) const { ref } = useParams() diff --git a/apps/studio/components/interfaces/Auth/Policies/PolicyEditorPanel/PolicyTemplates.tsx b/apps/studio/components/interfaces/Auth/Policies/PolicyEditorPanel/PolicyTemplates.tsx index 52507d2c6a6..ec4547f7523 100644 --- a/apps/studio/components/interfaces/Auth/Policies/PolicyEditorPanel/PolicyTemplates.tsx +++ b/apps/studio/components/interfaces/Auth/Policies/PolicyEditorPanel/PolicyTemplates.tsx @@ -1,18 +1,18 @@ import { PostgresPolicy } from '@supabase/postgres-meta' import { Search } from 'lucide-react' import { useState } from 'react' -import { Badge, HoverCard, HoverCardContent, HoverCardTrigger, Input, cn } from 'ui' +import { Badge, cn, HoverCard, HoverCardContent, HoverCardTrigger, Input } from 'ui' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' -import { Markdown } from 'components/interfaces/Markdown' -import CardButton from 'components/ui/CardButton' -import CopyButton from 'components/ui/CopyButton' -import { NoSearchResults } from 'components/ui/NoSearchResults' -import { SimpleCodeBlock } from 'ui' import { getGeneralPolicyTemplates, getQueuePolicyTemplates, getRealtimePolicyTemplates, } from '../PolicyEditorModal/PolicyEditorModal.constants' +import { Markdown } from '@/components/interfaces/Markdown' +import CardButton from '@/components/ui/CardButton' +import CopyButton from '@/components/ui/CopyButton' +import { NoSearchResults } from '@/components/ui/NoSearchResults' interface PolicyTemplatesProps { schema: string diff --git a/apps/studio/components/interfaces/Auth/Users/UserPanel.tsx b/apps/studio/components/interfaces/Auth/Users/UserPanel.tsx index e618c63953f..1d873e03f7a 100644 --- a/apps/studio/components/interfaces/Auth/Users/UserPanel.tsx +++ b/apps/studio/components/interfaces/Auth/Users/UserPanel.tsx @@ -1,6 +1,3 @@ -import { useUserQuery } from 'data/auth/user-query' -import { User } from 'data/auth/users-infinite-query' -import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' import { X } from 'lucide-react' import { parseAsString, useQueryState } from 'nuqs' import { useState } from 'react' @@ -10,17 +7,20 @@ import { Input_Shadcn_, ResizableHandle, ResizablePanel, - SimpleCodeBlock, Tabs_Shadcn_, TabsContent_Shadcn_, TabsList_Shadcn_, TabsTrigger_Shadcn_, } from 'ui' -import { GenericSkeletonLoader } from 'ui-patterns' +import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' import { UserLogs } from './UserLogs' import { UserOverview } from './UserOverview' import { PANEL_PADDING } from './Users.constants' +import { useUserQuery } from '@/data/auth/user-query' +import { User } from '@/data/auth/users-infinite-query' +import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject' export const UserPanel = () => { const { data: project } = useSelectedProjectQuery() diff --git a/apps/studio/components/interfaces/Connect/Connect.constants.ts b/apps/studio/components/interfaces/Connect/Connect.constants.ts index 054aa4280be..805a1576999 100644 --- a/apps/studio/components/interfaces/Connect/Connect.constants.ts +++ b/apps/studio/components/interfaces/Connect/Connect.constants.ts @@ -1,5 +1,5 @@ import { DOCS_URL } from 'lib/constants' -import { CodeBlockLang } from 'ui' +import { type CodeBlockLang } from 'ui-patterns/CodeBlock' export type DatabaseConnectionType = | 'uri' diff --git a/apps/studio/components/interfaces/Connect/ConnectTabContent.tsx b/apps/studio/components/interfaces/Connect/ConnectTabContent.tsx index b760a5d613f..e3ba0beda3f 100644 --- a/apps/studio/components/interfaces/Connect/ConnectTabContent.tsx +++ b/apps/studio/components/interfaces/Connect/ConnectTabContent.tsx @@ -1,19 +1,20 @@ +import { useParams } from 'common' import dynamic from 'next/dynamic' import { forwardRef, HTMLAttributes, useMemo } from 'react' - -import { useParams } from 'common' -import { useProjectSettingsV2Query } from 'data/config/project-settings-v2-query' -import { usePgbouncerConfigQuery } from 'data/database/pgbouncer-config-query' -import { useSupavisorConfigurationQuery } from 'data/database/supavisor-configuration-query' -import { useProjectAddonsQuery } from 'data/subscriptions/project-addons-query' -import { useCheckEntitlements } from 'hooks/misc/useCheckEntitlements' -import { pluckObjectFields } from 'lib/helpers' -import { useTrack } from 'lib/telemetry/track' -import { cn, CopyCallbackContext } from 'ui' +import { cn } from 'ui' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' +import { CopyCallbackContext } from 'ui-patterns/SimpleCodeBlock' + import { getAddons } from '../Billing/Subscription/Subscription.utils' import type { projectKeys } from './Connect.types' import { getConnectionStrings } from './DatabaseSettings.utils' +import { useProjectSettingsV2Query } from '@/data/config/project-settings-v2-query' +import { usePgbouncerConfigQuery } from '@/data/database/pgbouncer-config-query' +import { useSupavisorConfigurationQuery } from '@/data/database/supavisor-configuration-query' +import { useProjectAddonsQuery } from '@/data/subscriptions/project-addons-query' +import { useCheckEntitlements } from '@/hooks/misc/useCheckEntitlements' +import { pluckObjectFields } from '@/lib/helpers' +import { useTrack } from '@/lib/telemetry/track' interface ConnectContentTabProps extends HTMLAttributes { projectKeys: projectKeys diff --git a/apps/studio/components/interfaces/Connect/ConnectionPanel.tsx b/apps/studio/components/interfaces/Connect/ConnectionPanel.tsx index e168603b7b0..b5b8876227b 100644 --- a/apps/studio/components/interfaces/Connect/ConnectionPanel.tsx +++ b/apps/studio/components/interfaces/Connect/ConnectionPanel.tsx @@ -1,23 +1,22 @@ -import { ChevronRight, FileCode, X } from 'lucide-react' -import Link from 'next/link' -import { PropsWithChildren, ReactNode } from 'react' - import { useParams } from 'common' import { useSupavisorConfigurationQuery } from 'data/database/supavisor-configuration-query' import { IS_PLATFORM } from 'lib/constants' +import { ChevronRight, FileCode, X } from 'lucide-react' +import Link from 'next/link' +import { PropsWithChildren, ReactNode } from 'react' import { useDatabaseSelectorStateSnapshot } from 'state/database-selector' import { Badge, Button, cn, - CodeBlock, - CodeBlockLang, Collapsible_Shadcn_, CollapsibleContent_Shadcn_, CollapsibleTrigger_Shadcn_, WarningIcon, } from 'ui' -import { Admonition } from 'ui-patterns' +import { Admonition } from 'ui-patterns/admonition' +import { CodeBlock, type CodeBlockLang } from 'ui-patterns/CodeBlock' + import { ConnectionParameters } from './ConnectionParameters' interface ConnectionPanelProps { diff --git a/apps/studio/components/interfaces/Connect/DatabaseConnectionString.tsx b/apps/studio/components/interfaces/Connect/DatabaseConnectionString.tsx index df5da8a97f4..6826787a0cc 100644 --- a/apps/studio/components/interfaces/Connect/DatabaseConnectionString.tsx +++ b/apps/studio/components/interfaces/Connect/DatabaseConnectionString.tsx @@ -20,7 +20,6 @@ import { Badge, Button, cn, - CodeBlock, Collapsible_Shadcn_, CollapsibleContent_Shadcn_, CollapsibleTrigger_Shadcn_, @@ -32,6 +31,7 @@ import { SelectValue_Shadcn_, Separator, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { ShimmeringLoader } from 'ui-patterns/ShimmeringLoader' import { diff --git a/apps/studio/components/interfaces/Connect/content/androidkotlin/supabasekt/content.tsx b/apps/studio/components/interfaces/Connect/content/androidkotlin/supabasekt/content.tsx index 11d5ab7443a..66caa833bff 100644 --- a/apps/studio/components/interfaces/Connect/content/androidkotlin/supabasekt/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/androidkotlin/supabasekt/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/astro/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/astro/supabasejs/content.tsx index 46d9a2ac22f..cf8c7c9dcc6 100644 --- a/apps/studio/components/interfaces/Connect/content/astro/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/astro/supabasejs/content.tsx @@ -1,11 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' + +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { ConnectTabContent, + ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabs, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/drizzle/content.tsx b/apps/studio/components/interfaces/Connect/content/drizzle/content.tsx index 20e25329494..2ef670083a6 100644 --- a/apps/studio/components/interfaces/Connect/content/drizzle/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/drizzle/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ connectionStringPooler }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/exporeactnative/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/exporeactnative/supabasejs/content.tsx index fd1815f163b..04a5806333d 100644 --- a/apps/studio/components/interfaces/Connect/content/exporeactnative/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/exporeactnative/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/flask/supabasepy/content.tsx b/apps/studio/components/interfaces/Connect/content/flask/supabasepy/content.tsx index 09cc0aa8a23..08ff15511e1 100644 --- a/apps/studio/components/interfaces/Connect/content/flask/supabasepy/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/flask/supabasepy/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/flutter/supabaseflutter/content.tsx b/apps/studio/components/interfaces/Connect/content/flutter/supabaseflutter/content.tsx index d0cb4c475df..26356a92a19 100644 --- a/apps/studio/components/interfaces/Connect/content/flutter/supabaseflutter/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/flutter/supabaseflutter/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/ionicangular/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/ionicangular/supabasejs/content.tsx index 89e7f39f251..5470df4a99b 100644 --- a/apps/studio/components/interfaces/Connect/content/ionicangular/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/ionicangular/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/ionicreact/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/ionicreact/supabasejs/content.tsx index ac86c1a17cc..2121f100ac6 100644 --- a/apps/studio/components/interfaces/Connect/content/ionicreact/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/ionicreact/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/nextjs/app/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/nextjs/app/supabasejs/content.tsx index 8c56900d9e4..0efa2826d83 100644 --- a/apps/studio/components/interfaces/Connect/content/nextjs/app/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/nextjs/app/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/nextjs/pages/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/nextjs/pages/supabasejs/content.tsx index 29d4bea895b..76ab71a8987 100644 --- a/apps/studio/components/interfaces/Connect/content/nextjs/pages/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/nextjs/pages/supabasejs/content.tsx @@ -1,11 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' + +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/nuxt/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/nuxt/supabasejs/content.tsx index be56beed13b..1c9cfe2633a 100644 --- a/apps/studio/components/interfaces/Connect/content/nuxt/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/nuxt/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/prisma/content.tsx b/apps/studio/components/interfaces/Connect/content/prisma/content.tsx index 3c097cf8968..89b1552a607 100644 --- a/apps/studio/components/interfaces/Connect/content/prisma/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/prisma/content.tsx @@ -1,13 +1,13 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' -import { SimpleCodeBlock } from 'ui' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, -} from 'components/interfaces/Connect/ConnectTabs' -import { IS_PLATFORM } from 'lib/constants' +} from '@/components/interfaces/Connect/ConnectTabs' +import { IS_PLATFORM } from '@/lib/constants' const ContentFile = ({ connectionStringPooler }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/react/create-react-app/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/react/create-react-app/supabasejs/content.tsx index 3a70ecfd3d9..13f869bbf15 100644 --- a/apps/studio/components/interfaces/Connect/content/react/create-react-app/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/react/create-react-app/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/react/vite/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/react/vite/supabasejs/content.tsx index a28865fb223..94efe8a3a54 100644 --- a/apps/studio/components/interfaces/Connect/content/react/vite/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/react/vite/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/refine/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/refine/supabasejs/content.tsx index 1c2cbb08447..36493112614 100644 --- a/apps/studio/components/interfaces/Connect/content/refine/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/refine/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/remix/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/remix/supabasejs/content.tsx index ac40753c886..b33c0556fe6 100644 --- a/apps/studio/components/interfaces/Connect/content/remix/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/remix/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/solidjs/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/solidjs/supabasejs/content.tsx index 08bfbc7b8a1..a79b934c727 100644 --- a/apps/studio/components/interfaces/Connect/content/solidjs/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/solidjs/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/sveltekit/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/sveltekit/supabasejs/content.tsx index d7dd5da02de..0bafc854490 100644 --- a/apps/studio/components/interfaces/Connect/content/sveltekit/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/sveltekit/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/swift/supabaseswift/content.tsx b/apps/studio/components/interfaces/Connect/content/swift/supabaseswift/content.tsx index a0f637e2e4a..9b0746d409c 100644 --- a/apps/studio/components/interfaces/Connect/content/swift/supabaseswift/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/swift/supabaseswift/content.tsx @@ -1,12 +1,12 @@ import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/tanstack/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/tanstack/supabasejs/content.tsx index 0f5ef253f45..2c36da5d106 100644 --- a/apps/studio/components/interfaces/Connect/content/tanstack/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/tanstack/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { - ConnectTabs, - ConnectTabTriggers, - ConnectTabTrigger, ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' + ConnectTabs, + ConnectTabTrigger, + ConnectTabTriggers, +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/Connect/content/vuejs/supabasejs/content.tsx b/apps/studio/components/interfaces/Connect/content/vuejs/supabasejs/content.tsx index 3d5b6d91cce..70e70bc39a5 100644 --- a/apps/studio/components/interfaces/Connect/content/vuejs/supabasejs/content.tsx +++ b/apps/studio/components/interfaces/Connect/content/vuejs/supabasejs/content.tsx @@ -1,12 +1,12 @@ -import type { ContentFileProps } from 'components/interfaces/Connect/Connect.types' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' +import type { ContentFileProps } from '@/components/interfaces/Connect/Connect.types' import { + ConnectTabContent, ConnectTabs, ConnectTabTrigger, ConnectTabTriggers, - ConnectTabContent, -} from 'components/interfaces/Connect/ConnectTabs' -import { SimpleCodeBlock } from 'ui' +} from '@/components/interfaces/Connect/ConnectTabs' const ContentFile = ({ projectKeys }: ContentFileProps) => { return ( diff --git a/apps/studio/components/interfaces/ConnectSheet/Connect.constants.ts b/apps/studio/components/interfaces/ConnectSheet/Connect.constants.ts index 9a66178eec6..3ba4d4c7233 100644 --- a/apps/studio/components/interfaces/ConnectSheet/Connect.constants.ts +++ b/apps/studio/components/interfaces/ConnectSheet/Connect.constants.ts @@ -1,5 +1,5 @@ import { DOCS_URL } from 'lib/constants' -import { CodeBlockLang } from 'ui' +import { type CodeBlockLang } from 'ui-patterns/CodeBlock' export type DatabaseConnectionType = | 'uri' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-connection/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-connection/content.tsx index e0b38e9fd95..62c9fa7c425 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-connection/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-connection/content.tsx @@ -1,6 +1,6 @@ import { useParams } from 'common' import { useMemo } from 'react' -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' import { getConnectionStrings } from '../../../DatabaseSettings.utils' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-files/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-files/content.tsx index e77eea6f6af..f15252b3970 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-files/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-files/content.tsx @@ -1,5 +1,5 @@ import { useEffect, useMemo, useState } from 'react' -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { MultipleCodeBlock } from 'ui-patterns/MultipleCodeBlock' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-install/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-install/content.tsx index 67244a56703..ffb2040cc66 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-install/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/direct-install/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' import examples from '@/components/interfaces/ConnectSheet/DirectConnectionExamples' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/add-server/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/add-server/content.tsx index 9a392c17cbd..134fa854d4b 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/add-server/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/add-server/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' import { useMcpUrl } from '@/components/interfaces/ConnectSheet/useMcpUrl' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/authenticate/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/authenticate/content.tsx index c8f91c803a5..724c23fceb3 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/authenticate/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/claude-code/authenticate/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/add-server/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/add-server/content.tsx index c6e40aba273..0cf2f6c175a 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/add-server/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/add-server/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' import { useMcpUrl } from '@/components/interfaces/ConnectSheet/useMcpUrl' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/authenticate/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/authenticate/content.tsx index ad41be2d3fc..f026d1e824a 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/authenticate/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/authenticate/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/enable-remote/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/enable-remote/content.tsx index 072c056f941..5f57b5de8a4 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/enable-remote/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/mcp/codex/enable-remote/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' diff --git a/apps/studio/components/interfaces/ConnectSheet/content/steps/orm-install/content.tsx b/apps/studio/components/interfaces/ConnectSheet/content/steps/orm-install/content.tsx index 09610bde428..0ade1ba6401 100644 --- a/apps/studio/components/interfaces/ConnectSheet/content/steps/orm-install/content.tsx +++ b/apps/studio/components/interfaces/ConnectSheet/content/steps/orm-install/content.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' diff --git a/apps/studio/components/interfaces/Database/Replication/ErrorDetailsDialog.tsx b/apps/studio/components/interfaces/Database/Replication/ErrorDetailsDialog.tsx index 799f225e258..2281e5d5340 100644 --- a/apps/studio/components/interfaces/Database/Replication/ErrorDetailsDialog.tsx +++ b/apps/studio/components/interfaces/Database/Replication/ErrorDetailsDialog.tsx @@ -1,7 +1,6 @@ import { Button, cn, - CodeBlock, Dialog, DialogClose, DialogContent, @@ -11,6 +10,7 @@ import { DialogSectionSeparator, DialogTitle, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' interface ErrorDetailsDialogProps { open: boolean diff --git a/apps/studio/components/interfaces/Docs/CodeSnippet.tsx b/apps/studio/components/interfaces/Docs/CodeSnippet.tsx index daa780fc026..cef13723182 100644 --- a/apps/studio/components/interfaces/Docs/CodeSnippet.tsx +++ b/apps/studio/components/interfaces/Docs/CodeSnippet.tsx @@ -1,5 +1,5 @@ import { useParams } from 'common' -import { SimpleCodeBlock } from 'ui' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' import { useSendEventMutation } from '@/data/telemetry/send-event-mutation' import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization' diff --git a/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx b/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx index 1fcf9c254d8..9d473f27b9b 100644 --- a/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx +++ b/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionDetails.tsx @@ -13,9 +13,7 @@ import { Card, CardContent, CardFooter, - CardHeader, cn, - CodeBlock, copyToClipboard, CriticalIcon, Form_Shadcn_, @@ -27,6 +25,7 @@ import { TabsList_Shadcn_ as TabsList, TabsTrigger_Shadcn_ as TabsTrigger, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { Input } from 'ui-patterns/DataInputs/Input' import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal' import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout' diff --git a/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionTesterSheet.tsx b/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionTesterSheet.tsx index b88c4e5ab85..963937919e2 100644 --- a/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionTesterSheet.tsx +++ b/apps/studio/components/interfaces/Functions/EdgeFunctionDetails/EdgeFunctionTesterSheet.tsx @@ -23,7 +23,6 @@ import { import { Badge, Button, - CodeBlock, Form_Shadcn_, FormControl_Shadcn_, FormField_Shadcn_, @@ -48,6 +47,7 @@ import { TabsTrigger_Shadcn_ as TabsTrigger, TextArea_Shadcn_ as Textarea, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout' import * as z from 'zod' diff --git a/apps/studio/components/interfaces/Functions/FunctionsEmptyState.tsx b/apps/studio/components/interfaces/Functions/FunctionsEmptyState.tsx index eee908ca926..1219c257647 100644 --- a/apps/studio/components/interfaces/Functions/FunctionsEmptyState.tsx +++ b/apps/studio/components/interfaces/Functions/FunctionsEmptyState.tsx @@ -23,7 +23,6 @@ import { CardHeader, CardTitle, cn, - CodeBlock, Dialog, DialogContent, DialogDescription, @@ -33,6 +32,7 @@ import { DialogTrigger, Separator, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { EDGE_FUNCTION_TEMPLATES } from './Functions.templates' diff --git a/apps/studio/components/interfaces/Integrations/CronJobs/CronJobPage.tsx b/apps/studio/components/interfaces/Integrations/CronJobs/CronJobPage.tsx index f763f5d4b0b..6e8cc1d0d06 100644 --- a/apps/studio/components/interfaces/Integrations/CronJobs/CronJobPage.tsx +++ b/apps/studio/components/interfaces/Integrations/CronJobs/CronJobPage.tsx @@ -15,11 +15,11 @@ import { BreadcrumbSeparator_Shadcn_ as BreadcrumbSeparator, Button, cn, - CodeBlock, Tooltip, TooltipContent, TooltipTrigger, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { PageHeader, PageHeaderAside, diff --git a/apps/studio/components/interfaces/Integrations/CronJobs/CronJobTableCell.tsx b/apps/studio/components/interfaces/Integrations/CronJobs/CronJobTableCell.tsx index 7151241b9db..82e0d02d711 100644 --- a/apps/studio/components/interfaces/Integrations/CronJobs/CronJobTableCell.tsx +++ b/apps/studio/components/interfaces/Integrations/CronJobs/CronJobTableCell.tsx @@ -12,7 +12,6 @@ import { Badge, Button, cn, - CodeBlock, ContextMenu_Shadcn_, ContextMenuContent_Shadcn_, ContextMenuItem_Shadcn_, @@ -41,6 +40,7 @@ import { TooltipTrigger, } from 'ui' import { TimestampInfo } from 'ui-patterns' +import { CodeBlock } from 'ui-patterns/CodeBlock' const getNextRun = (schedule: string, lastRun?: string) => { // cron-parser can only deal with the traditional cron syntax but technically users can also diff --git a/apps/studio/components/interfaces/Integrations/CronJobs/CronJobsTab.CleanupNotice.tsx b/apps/studio/components/interfaces/Integrations/CronJobs/CronJobsTab.CleanupNotice.tsx index a507198e00a..bd5720e4ac9 100644 --- a/apps/studio/components/interfaces/Integrations/CronJobs/CronJobsTab.CleanupNotice.tsx +++ b/apps/studio/components/interfaces/Integrations/CronJobs/CronJobsTab.CleanupNotice.tsx @@ -2,7 +2,6 @@ import { getScheduleDeleteCronJobRunDetailsSql } from '@supabase/pg-meta' import { CheckCircle2, XCircle } from 'lucide-react' import { Button, - CodeBlock, Dialog, DialogContent, DialogHeader, @@ -21,6 +20,7 @@ import { TooltipTrigger, } from 'ui' import { Admonition } from 'ui-patterns/admonition' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { CLEANUP_INTERVALS } from './CronJobsTab.constants' import { diff --git a/apps/studio/components/interfaces/Integrations/CronJobs/PreviousRunsTab.tsx b/apps/studio/components/interfaces/Integrations/CronJobs/PreviousRunsTab.tsx index b8a4a7aec7a..a319025031d 100644 --- a/apps/studio/components/interfaces/Integrations/CronJobs/PreviousRunsTab.tsx +++ b/apps/studio/components/interfaces/Integrations/CronJobs/PreviousRunsTab.tsx @@ -9,8 +9,9 @@ import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' import { CircleCheck, CircleX, Loader } from 'lucide-react' import { useMemo } from 'react' import DataGrid, { Column, Row } from 'react-data-grid' -import { cn, CodeBlock, LoadingLine, Tooltip, TooltipContent, TooltipTrigger } from 'ui' +import { cn, LoadingLine, Tooltip, TooltipContent, TooltipTrigger } from 'ui' import { TimestampInfo } from 'ui-patterns' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' import { calculateDuration, formatDate } from './CronJobs.utils' diff --git a/apps/studio/components/interfaces/Integrations/Integration/IntegrationOverviewTabV2/InstallIntegrationSheet.tsx b/apps/studio/components/interfaces/Integrations/Integration/IntegrationOverviewTabV2/InstallIntegrationSheet.tsx index 390f2e0745f..2e404d7963f 100644 --- a/apps/studio/components/interfaces/Integrations/Integration/IntegrationOverviewTabV2/InstallIntegrationSheet.tsx +++ b/apps/studio/components/interfaces/Integrations/Integration/IntegrationOverviewTabV2/InstallIntegrationSheet.tsx @@ -10,7 +10,6 @@ import { Card, CardContent, cn, - CodeBlock, DialogSectionSeparator, Select_Shadcn_, SelectContent_Shadcn_, @@ -33,6 +32,7 @@ import { TabsList_Shadcn_, TabsTrigger_Shadcn_, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { Input } from 'ui-patterns/DataInputs/Input' import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout' diff --git a/apps/studio/components/interfaces/ProjectAPIDocs/ContentSnippet.tsx b/apps/studio/components/interfaces/ProjectAPIDocs/ContentSnippet.tsx index 01804b8d584..423e769e424 100644 --- a/apps/studio/components/interfaces/ProjectAPIDocs/ContentSnippet.tsx +++ b/apps/studio/components/interfaces/ProjectAPIDocs/ContentSnippet.tsx @@ -1,10 +1,10 @@ import { useParams } from 'common' - -import { useSendEventMutation } from 'data/telemetry/send-event-mutation' -import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization' import { PropsWithChildren } from 'react' -import { SimpleCodeBlock } from 'ui' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' + import { Markdown } from '../Markdown' +import { useSendEventMutation } from '@/data/telemetry/send-event-mutation' +import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization' interface ContentSnippetProps { apikey?: string diff --git a/apps/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx b/apps/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx index 35f375305d1..a0bb6d9abf1 100644 --- a/apps/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx +++ b/apps/studio/components/interfaces/ProjectAPIDocs/ResourceContent.tsx @@ -1,9 +1,10 @@ -import { SimpleCodeBlock } from 'ui' import { useParams } from 'common' -import { DocsButton } from 'components/ui/DocsButton' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' + import { Markdown } from '../Markdown' -import { useSendEventMutation } from 'data/telemetry/send-event-mutation' -import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization' +import { DocsButton } from '@/components/ui/DocsButton' +import { useSendEventMutation } from '@/data/telemetry/send-event-mutation' +import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization' interface ResourceContentProps { selectedLanguage: 'js' | 'bash' diff --git a/apps/studio/components/interfaces/ProjectHome/GettingStarted/GettingStarted.utils.tsx b/apps/studio/components/interfaces/ProjectHome/GettingStarted/GettingStarted.utils.tsx index 113d1d54630..5632a2c4f29 100644 --- a/apps/studio/components/interfaces/ProjectHome/GettingStarted/GettingStarted.utils.tsx +++ b/apps/studio/components/interfaces/ProjectHome/GettingStarted/GettingStarted.utils.tsx @@ -1,6 +1,7 @@ import { DOCS_URL } from 'lib/constants' import { BarChart3, Code, Database, GitBranch, Shield, Table, Upload, UserPlus } from 'lucide-react' -import { AiIconAnimation, CodeBlock } from 'ui' +import { AiIconAnimation } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { GettingStartedAction, GettingStartedStep } from './GettingStarted.types' import type { GettingStartedStatuses } from './useGettingStartedProgress' diff --git a/apps/studio/components/interfaces/QueryInsights/hooks/useQueryInsightsTableColumns.tsx b/apps/studio/components/interfaces/QueryInsights/hooks/useQueryInsightsTableColumns.tsx index 77ee666ff8d..32ef75d40e4 100644 --- a/apps/studio/components/interfaces/QueryInsights/hooks/useQueryInsightsTableColumns.tsx +++ b/apps/studio/components/interfaces/QueryInsights/hooks/useQueryInsightsTableColumns.tsx @@ -1,13 +1,10 @@ -import { AiAssistantDropdown } from 'components/ui/AiAssistantDropdown' -import { ButtonTooltip } from 'components/ui/ButtonTooltip' import { ArrowDown, ArrowRight, ArrowUp, ChevronDown, ExternalLink, ScanSearch } from 'lucide-react' -import { type RefObject, useMemo } from 'react' +import { useMemo, type RefObject } from 'react' // eslint-disable-next-line no-restricted-imports import { type Column, type DataGridHandle } from 'react-data-grid' import { Button, cn, - CodeBlock, DropdownMenu, DropdownMenuContent, DropdownMenuItem, @@ -17,6 +14,7 @@ import { TooltipContent, TooltipTrigger, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { InfoTooltip } from 'ui-patterns/info-tooltip' import { buildQueryInsightFixPrompt } from '../../QueryPerformance/QueryPerformance.ai' @@ -33,6 +31,8 @@ import { getColumnName, getTableName, } from '../QueryInsightsTable/QueryInsightsTable.utils' +import { AiAssistantDropdown } from '@/components/ui/AiAssistantDropdown' +import { ButtonTooltip } from '@/components/ui/ButtonTooltip' interface UseQueryInsightsTableColumnsParams { sort: { column: string; order: 'asc' | 'desc' } diff --git a/apps/studio/components/interfaces/QueryPerformance/IndexAdvisor/IndexSuggestionIcon.tsx b/apps/studio/components/interfaces/QueryPerformance/IndexAdvisor/IndexSuggestionIcon.tsx index 5aed88b1479..944ae227b9b 100644 --- a/apps/studio/components/interfaces/QueryPerformance/IndexAdvisor/IndexSuggestionIcon.tsx +++ b/apps/studio/components/interfaces/QueryPerformance/IndexAdvisor/IndexSuggestionIcon.tsx @@ -1,22 +1,22 @@ -import { Loader2 } from 'lucide-react' -import { MouseEvent, useState } from 'react' - import { GetIndexAdvisorResultResponse } from 'data/database/retrieve-index-advisor-result-query' import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' +import { Loader2 } from 'lucide-react' +import { MouseEvent, useState } from 'react' import { Button, cn, - CodeBlock, HoverCard, HoverCardContent, HoverCardTrigger, Separator, WarningIcon, } from 'ui' -import { IndexImprovementText } from './IndexImprovementText' -import { QueryPanelScoreSection } from '../QueryPanel' +import { CodeBlock } from 'ui-patterns/CodeBlock' + import { useIndexInvalidation } from '../hooks/useIndexInvalidation' +import { QueryPanelScoreSection } from '../QueryPanel' import { createIndexes } from './index-advisor.utils' +import { IndexImprovementText } from './IndexImprovementText' interface IndexSuggestionIconProps { indexAdvisorResult: GetIndexAdvisorResultResponse diff --git a/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx b/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx index 071535f74ea..42fbc269f05 100644 --- a/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx +++ b/apps/studio/components/interfaces/QueryPerformance/QueryIndexes.tsx @@ -22,12 +22,12 @@ import { AlertTitle_Shadcn_, Button, cn, - CodeBlock, Collapsible_Shadcn_, CollapsibleContent_Shadcn_, CollapsibleTrigger_Shadcn_, } from 'ui' import { Admonition } from 'ui-patterns' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' import { useIndexInvalidation } from './hooks/useIndexInvalidation' diff --git a/apps/studio/components/interfaces/QueryPerformance/QueryPerformanceGrid.tsx b/apps/studio/components/interfaces/QueryPerformance/QueryPerformanceGrid.tsx index 70afdd20335..2ccf2d6beef 100644 --- a/apps/studio/components/interfaces/QueryPerformance/QueryPerformanceGrid.tsx +++ b/apps/studio/components/interfaces/QueryPerformance/QueryPerformanceGrid.tsx @@ -8,7 +8,6 @@ import DataGrid, { Column, DataGridHandle, Row } from 'react-data-grid' import { Button, cn, - CodeBlock, DropdownMenu, DropdownMenuContent, DropdownMenuItem, @@ -23,6 +22,7 @@ import { TabsTrigger_Shadcn_, } from 'ui' import { Admonition } from 'ui-patterns' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { InfoTooltip } from 'ui-patterns/info-tooltip' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' diff --git a/apps/studio/components/interfaces/SQLEditor/DownloadSnippetModal.tsx b/apps/studio/components/interfaces/SQLEditor/DownloadSnippetModal.tsx index c531a7df6e6..40bffbafe0c 100644 --- a/apps/studio/components/interfaces/SQLEditor/DownloadSnippetModal.tsx +++ b/apps/studio/components/interfaces/SQLEditor/DownloadSnippetModal.tsx @@ -1,13 +1,14 @@ +import type { ModalProps } from '@ui/components/Modal/Modal' +import TwoOptionToggle from 'components/ui/TwoOptionToggle' +import { DOCS_URL } from 'lib/constants' import { snakeCase } from 'lodash' import { ExternalLink } from 'lucide-react' import Link from 'next/link' import { useState } from 'react' - -import type { ModalProps } from '@ui/components/Modal/Modal' -import TwoOptionToggle from 'components/ui/TwoOptionToggle' -import { DOCS_URL } from 'lib/constants' import { useSqlEditorV2StateSnapshot } from 'state/sql-editor-v2' -import { Button, CodeBlock, Modal, Tabs } from 'ui' +import { Button, Modal, Tabs } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' + import { Markdown } from '../Markdown' import { generateFileCliCommand, diff --git a/apps/studio/components/interfaces/SQLEditor/OngoingQueriesPanel.tsx b/apps/studio/components/interfaces/SQLEditor/OngoingQueriesPanel.tsx index 1cb968d19be..cc499899d72 100644 --- a/apps/studio/components/interfaces/SQLEditor/OngoingQueriesPanel.tsx +++ b/apps/studio/components/interfaces/SQLEditor/OngoingQueriesPanel.tsx @@ -1,22 +1,21 @@ -import dayjs from 'dayjs' -import { RefreshCw, StopCircle } from 'lucide-react' -import { useEffect, useState } from 'react' -import { toast } from 'sonner' - import { useParams } from 'common' import AlertError from 'components/ui/AlertError' import { useReadReplicasQuery } from 'data/read-replicas/replicas-query' import { useQueryAbortMutation } from 'data/sql/abort-query-mutation' import { useOngoingQueriesQuery } from 'data/sql/ongoing-queries-query' +import dayjs from 'dayjs' import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' import { useUrlState } from 'hooks/ui/useUrlState' import { IS_PLATFORM } from 'lib/constants' +import { RefreshCw, StopCircle } from 'lucide-react' +import { useEffect, useState } from 'react' +import { toast } from 'sonner' import { useAppStateSnapshot } from 'state/app-state' import { useDatabaseSelectorStateSnapshot } from 'state/database-selector' import type { ResponseError } from 'types' import { Button, - CodeBlock, + cn, Sheet, SheetContent, SheetDescription, @@ -26,8 +25,8 @@ import { Tooltip, TooltipContent, TooltipTrigger, - cn, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal' export const OngoingQueriesPanel = () => { diff --git a/apps/studio/components/interfaces/Settings/API/HardenAPIModal.tsx b/apps/studio/components/interfaces/Settings/API/HardenAPIModal.tsx index 9d4af853bf9..bb34cbb4f9e 100644 --- a/apps/studio/components/interfaces/Settings/API/HardenAPIModal.tsx +++ b/apps/studio/components/interfaces/Settings/API/HardenAPIModal.tsx @@ -1,6 +1,3 @@ -import { Check, ChevronDown } from 'lucide-react' -import { toast } from 'sonner' - import { ButtonTooltip } from 'components/ui/ButtonTooltip' import { DocsButton } from 'components/ui/DocsButton' import InformationBox from 'components/ui/InformationBox' @@ -10,14 +7,15 @@ import { useProjectPostgrestConfigUpdateMutation } from 'data/config/project-pos import { useSchemasQuery } from 'data/database/schemas-query' import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' import { DOCS_URL } from 'lib/constants' +import { Check, ChevronDown } from 'lucide-react' +import { toast } from 'sonner' import { + Alert_Shadcn_, AlertDescription_Shadcn_, AlertTitle_Shadcn_, - Alert_Shadcn_, - CodeBlock, + Collapsible_Shadcn_, CollapsibleContent_Shadcn_, CollapsibleTrigger_Shadcn_, - Collapsible_Shadcn_, Dialog, DialogContent, DialogDescription, @@ -27,6 +25,7 @@ import { DialogTitle, WarningIcon, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' interface HardenAPIModalProps { visible: boolean diff --git a/apps/studio/components/interfaces/Settings/Logs/LogSelection.tsx b/apps/studio/components/interfaces/Settings/Logs/LogSelection.tsx index 2dcb41b37c7..2aaa77717cc 100644 --- a/apps/studio/components/interfaces/Settings/Logs/LogSelection.tsx +++ b/apps/studio/components/interfaces/Settings/Logs/LogSelection.tsx @@ -1,21 +1,21 @@ +import { ButtonTooltip } from 'components/ui/ButtonTooltip' import { Check, Copy, MousePointerClick, X } from 'lucide-react' import { useEffect, useState } from 'react' - -import { ButtonTooltip } from 'components/ui/ButtonTooltip' import { Button, - CodeBlock, + cn, + copyToClipboard, + Tabs_Shadcn_, TabsContent_Shadcn_, TabsList_Shadcn_, TabsTrigger_Shadcn_, - Tabs_Shadcn_, - cn, - copyToClipboard, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' -import DefaultPreviewSelectionRenderer from './LogSelectionRenderers/DefaultPreviewSelectionRenderer' + import type { LogData, QueryType } from './Logs.types' import { apiKey, role as extractRole, jwtAPIKey } from './Logs.utils' +import DefaultPreviewSelectionRenderer from './LogSelectionRenderers/DefaultPreviewSelectionRenderer' export interface LogSelectionProps { log?: LogData diff --git a/apps/studio/components/interfaces/Settings/Logs/LogsErrorRenderers/DefaultErrorRenderer.tsx b/apps/studio/components/interfaces/Settings/Logs/LogsErrorRenderers/DefaultErrorRenderer.tsx index 0b88871f0fe..444cddf7969 100644 --- a/apps/studio/components/interfaces/Settings/Logs/LogsErrorRenderers/DefaultErrorRenderer.tsx +++ b/apps/studio/components/interfaces/Settings/Logs/LogsErrorRenderers/DefaultErrorRenderer.tsx @@ -1,4 +1,5 @@ -import { CodeBlock } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' + import type { LogQueryError } from '../Logs.types' export interface ErrorRendererProps { diff --git a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/CreateTable/CreateTableInstructions.tsx b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/CreateTable/CreateTableInstructions.tsx index 89e9af57518..e3d6bb379f1 100644 --- a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/CreateTable/CreateTableInstructions.tsx +++ b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/CreateTable/CreateTableInstructions.tsx @@ -1,6 +1,3 @@ -import { Eye, EyeOff } from 'lucide-react' -import { useMemo, useState } from 'react' - import { useParams } from 'common' import CommandRender from 'components/interfaces/Functions/CommandRender' import { convertKVStringArrayToJson } from 'components/interfaces/Integrations/Wrappers/Wrappers.utils' @@ -14,6 +11,8 @@ import { } from 'data/vault/vault-secret-decrypted-value-query' import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' import { DOCS_URL } from 'lib/constants' +import { Eye, EyeOff } from 'lucide-react' +import { useMemo, useState } from 'react' import { Accordion_Shadcn_, AccordionContent_Shadcn_, @@ -23,8 +22,9 @@ import { CardFooter, CardHeader, CardTitle, - CodeBlock, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' + import { useAnalyticsBucketWrapperInstance } from '../useAnalyticsBucketWrapperInstance' import { getPyicebergSnippet } from './CreateTableInstructions.constants' diff --git a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/InsertDataDialog.tsx b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/InsertDataDialog.tsx index 451d30b25d9..89c10bcdcfa 100644 --- a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/InsertDataDialog.tsx +++ b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/InsertDataDialog.tsx @@ -7,7 +7,6 @@ import Link from 'next/link' import { Button, cn, - CodeBlock, Dialog, DialogContent, DialogFooter, @@ -17,6 +16,7 @@ import { DialogTitle, DialogTrigger, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' interface InsertDataDialogProps { table: string diff --git a/apps/studio/components/interfaces/Storage/VectorBuckets/VectorBucketDetails/VectorBucketTableExamplesSheet.tsx b/apps/studio/components/interfaces/Storage/VectorBuckets/VectorBucketDetails/VectorBucketTableExamplesSheet.tsx index 1b57d52ebc1..4d9e12f45d4 100644 --- a/apps/studio/components/interfaces/Storage/VectorBuckets/VectorBucketDetails/VectorBucketTableExamplesSheet.tsx +++ b/apps/studio/components/interfaces/Storage/VectorBuckets/VectorBucketDetails/VectorBucketTableExamplesSheet.tsx @@ -12,23 +12,23 @@ import { parseAsBoolean, useQueryState } from 'nuqs' import { useState } from 'react' import { Button, - CodeBlock, + cn, + Command_Shadcn_, CommandGroup_Shadcn_, CommandItem_Shadcn_, CommandList_Shadcn_, - Command_Shadcn_, + Popover_Shadcn_, PopoverContent_Shadcn_, PopoverTrigger_Shadcn_, - Popover_Shadcn_, Sheet, SheetContent, SheetHeader, SheetSection, SheetTitle, SheetTrigger, - cn, } from 'ui' import { Admonition } from 'ui-patterns' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { useS3VectorsWrapperExtension } from '../useS3VectorsWrapper' import { useS3VectorsWrapperInstance } from '../useS3VectorsWrapperInstance' diff --git a/apps/studio/components/interfaces/TableGridEditor/ViewEntityAutofixSecurityModal.tsx b/apps/studio/components/interfaces/TableGridEditor/ViewEntityAutofixSecurityModal.tsx index ba0cf1617fa..408f8e1545d 100644 --- a/apps/studio/components/interfaces/TableGridEditor/ViewEntityAutofixSecurityModal.tsx +++ b/apps/studio/components/interfaces/TableGridEditor/ViewEntityAutofixSecurityModal.tsx @@ -1,14 +1,15 @@ import { useQueryClient } from '@tanstack/react-query' import { toast } from 'sonner' - -import { useViewDefinitionQuery } from 'data/database/view-definition-query' -import { lintKeys } from 'data/lint/keys' -import { useExecuteSqlMutation } from 'data/sql/execute-sql-mutation' -import { Entity, isViewLike } from 'data/table-editor/table-editor-types' -import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' -import { ScrollArea, SimpleCodeBlock } from 'ui' -import { GenericSkeletonLoader } from 'ui-patterns' +import { ScrollArea } from 'ui' import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal' +import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' + +import { useViewDefinitionQuery } from '@/data/database/view-definition-query' +import { lintKeys } from '@/data/lint/keys' +import { useExecuteSqlMutation } from '@/data/sql/execute-sql-mutation' +import { Entity, isViewLike } from '@/data/table-editor/table-editor-types' +import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject' interface ViewEntityAutofixSecurityModalProps { table: Entity diff --git a/apps/studio/components/interfaces/UnifiedLogs/ServiceFlowPanel.tsx b/apps/studio/components/interfaces/UnifiedLogs/ServiceFlowPanel.tsx index b9958697eac..f1632f6e0cb 100644 --- a/apps/studio/components/interfaces/UnifiedLogs/ServiceFlowPanel.tsx +++ b/apps/studio/components/interfaces/UnifiedLogs/ServiceFlowPanel.tsx @@ -8,7 +8,6 @@ import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled' import { useState } from 'react' import { cn, - CodeBlock, ResizableHandle, ResizablePanel, Skeleton, @@ -17,6 +16,7 @@ import { TabsList_Shadcn_ as TabsList, TabsTrigger_Shadcn_ as TabsTrigger, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { MemoizedRequestStartedBlock } from './ServiceFlow/components/blocks/RequestStartedBlock' import { MemoizedResponseCompletedBlock } from './ServiceFlow/components/blocks/ResponseCompletedBlock' diff --git a/apps/studio/components/layouts/Navigation/LayoutHeader/LocalVersionPopover.tsx b/apps/studio/components/layouts/Navigation/LayoutHeader/LocalVersionPopover.tsx index b96637c23aa..8d2c243f958 100644 --- a/apps/studio/components/layouts/Navigation/LayoutHeader/LocalVersionPopover.tsx +++ b/apps/studio/components/layouts/Navigation/LayoutHeader/LocalVersionPopover.tsx @@ -1,9 +1,4 @@ import dayjs from 'dayjs' - -import { DocsButton } from 'components/ui/DocsButton' -import { InlineLink } from 'components/ui/InlineLink' -import { useCLIReleaseVersionQuery } from 'data/misc/cli-release-version-query' -import { DOCS_URL } from 'lib/constants' import { Badge, Button, @@ -17,14 +12,19 @@ import { PopoverContent_Shadcn_, PopoverSeparator_Shadcn_, PopoverTrigger_Shadcn_, - SimpleCodeBlock, Tabs_Shadcn_, TabsContent_Shadcn_, TabsList_Shadcn_, TabsTrigger_Shadcn_, } from 'ui' -import { Admonition } from 'ui-patterns' +import { Admonition } from 'ui-patterns/admonition' +import { SimpleCodeBlock } from 'ui-patterns/SimpleCodeBlock' + import { getSemver, semverGte, semverLte } from './LocalVersionPopover.utils' +import { DocsButton } from '@/components/ui/DocsButton' +import { InlineLink } from '@/components/ui/InlineLink' +import { useCLIReleaseVersionQuery } from '@/data/misc/cli-release-version-query' +import { DOCS_URL } from '@/lib/constants' export const LocalVersionPopover = () => { const { data, isSuccess } = useCLIReleaseVersionQuery() diff --git a/apps/studio/components/layouts/SQLEditorLayout/SqlEditor.Commands.tsx b/apps/studio/components/layouts/SQLEditorLayout/SqlEditor.Commands.tsx index 6f624fe17c5..9ad7541753b 100644 --- a/apps/studio/components/layouts/SQLEditorLayout/SqlEditor.Commands.tsx +++ b/apps/studio/components/layouts/SQLEditorLayout/SqlEditor.Commands.tsx @@ -14,12 +14,12 @@ import { useRouter } from 'next/navigation' import { useEffect, useMemo, useRef } from 'react' import { cn, - CodeBlock, CommandEmpty_Shadcn_, CommandGroup_Shadcn_, CommandItem_Shadcn_, CommandList_Shadcn_, } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { CommandOptions } from 'ui-patterns/CommandMenu' import { Breadcrumb, diff --git a/apps/studio/components/ui/AIAssistantPanel/CollapsibleCodeBlock.tsx b/apps/studio/components/ui/AIAssistantPanel/CollapsibleCodeBlock.tsx index 4386f5aa57f..3d324d88323 100644 --- a/apps/studio/components/ui/AIAssistantPanel/CollapsibleCodeBlock.tsx +++ b/apps/studio/components/ui/AIAssistantPanel/CollapsibleCodeBlock.tsx @@ -1,14 +1,12 @@ import { Code, X } from 'lucide-react' - import { Button, - CodeBlock, - CodeBlockProps, cn, HoverCard_Shadcn_, HoverCardContent_Shadcn_, HoverCardTrigger_Shadcn_, } from 'ui' +import { CodeBlock, type CodeBlockProps } from 'ui-patterns/CodeBlock' interface CollapsibleCodeBlockProps extends CodeBlockProps { onRemove?: () => void diff --git a/apps/studio/components/ui/AIAssistantPanel/MessageMarkdown.tsx b/apps/studio/components/ui/AIAssistantPanel/MessageMarkdown.tsx index 8b01132a234..af11471c7a9 100644 --- a/apps/studio/components/ui/AIAssistantPanel/MessageMarkdown.tsx +++ b/apps/studio/components/ui/AIAssistantPanel/MessageMarkdown.tsx @@ -14,8 +14,6 @@ import type { StreamdownProps } from 'streamdown' import { Button, cn, - CodeBlock, - CodeBlockLang, Dialog, DialogClose, DialogContent, @@ -24,8 +22,9 @@ import { DialogSection, DialogTitle, DialogTrigger, - markdownComponents, } from 'ui' +import { CodeBlock, type CodeBlockLang } from 'ui-patterns/CodeBlock' +import { markdownComponents } from 'ui-patterns/Markdown' import { EdgeFunctionBlock } from '../EdgeFunctionBlock/EdgeFunctionBlock' import { AssistantSnippetProps } from './AIAssistant.types' diff --git a/apps/studio/components/ui/AIAssistantPanel/SnippetRow.tsx b/apps/studio/components/ui/AIAssistantPanel/SnippetRow.tsx index 76e1eebef4e..149124b350d 100644 --- a/apps/studio/components/ui/AIAssistantPanel/SnippetRow.tsx +++ b/apps/studio/components/ui/AIAssistantPanel/SnippetRow.tsx @@ -1,7 +1,8 @@ -import React from 'react' -import { Button, CodeBlock } from 'ui' -import { HoverCard_Shadcn_, HoverCardTrigger_Shadcn_, HoverCardContent_Shadcn_ } from 'ui' import { X } from 'lucide-react' +import React from 'react' +import { Button, HoverCard_Shadcn_, HoverCardContent_Shadcn_, HoverCardTrigger_Shadcn_ } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' + import { type SqlSnippet } from './AIAssistant.types' export const getSnippetLabel = (snippet: SqlSnippet, index: number): string => { diff --git a/apps/studio/components/ui/EdgeFunctionBlock/EdgeFunctionBlock.tsx b/apps/studio/components/ui/EdgeFunctionBlock/EdgeFunctionBlock.tsx index 30af2a93c72..1f1a056914e 100644 --- a/apps/studio/components/ui/EdgeFunctionBlock/EdgeFunctionBlock.tsx +++ b/apps/studio/components/ui/EdgeFunctionBlock/EdgeFunctionBlock.tsx @@ -1,10 +1,10 @@ +import { ReportBlockContainer } from 'components/interfaces/Reports/ReportBlock/ReportBlockContainer' import { Code } from 'lucide-react' import Link from 'next/link' import type { DragEvent, ReactNode } from 'react' - -import { ReportBlockContainer } from 'components/interfaces/Reports/ReportBlock/ReportBlockContainer' -import { Button, CodeBlock, type CodeBlockLang, cn } from 'ui' -import { Admonition } from 'ui-patterns' +import { Button, cn } from 'ui' +import { Admonition } from 'ui-patterns/admonition' +import { CodeBlock, type CodeBlockLang } from 'ui-patterns/CodeBlock' interface EdgeFunctionBlockProps { /** Title of the EdgeFunctionBlock */ diff --git a/apps/studio/components/ui/EditorPanel/EditorPanel.tsx b/apps/studio/components/ui/EditorPanel/EditorPanel.tsx index 28b6651c45e..f1001fee50a 100644 --- a/apps/studio/components/ui/EditorPanel/EditorPanel.tsx +++ b/apps/studio/components/ui/EditorPanel/EditorPanel.tsx @@ -41,7 +41,6 @@ import { useSqlEditorV2StateSnapshot } from 'state/sql-editor-v2' import { Button, cn, - CodeBlock, Command_Shadcn_, CommandEmpty_Shadcn_, CommandGroup_Shadcn_, @@ -57,7 +56,8 @@ import { PopoverTrigger_Shadcn_, SQL_ICON, } from 'ui' -import { Admonition } from 'ui-patterns' +import { Admonition } from 'ui-patterns/admonition' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { containsUnknownFunction, isReadOnlySelect } from '../AIAssistantPanel/AIAssistant.utils' import { AIEditor } from '../AIEditor' diff --git a/apps/studio/components/ui/QueryBlock/QueryBlock.tsx b/apps/studio/components/ui/QueryBlock/QueryBlock.tsx index d6d530ebbe3..a2508829e8b 100644 --- a/apps/studio/components/ui/QueryBlock/QueryBlock.tsx +++ b/apps/studio/components/ui/QueryBlock/QueryBlock.tsx @@ -5,7 +5,8 @@ import dayjs from 'dayjs' import { Code, Play } from 'lucide-react' import { DragEvent, ReactNode, useEffect, useMemo, useRef, useState } from 'react' import { Bar, BarChart, CartesianGrid, Cell, Tooltip, XAxis, YAxis } from 'recharts' -import { Badge, Button, ChartContainer, ChartTooltipContent, cn, CodeBlock } from 'ui' +import { Badge, Button, ChartContainer, ChartTooltipContent, cn } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { ShimmeringLoader } from 'ui-patterns/ShimmeringLoader' import { ButtonTooltip } from '../ButtonTooltip' diff --git a/apps/studio/lib/toaster.tsx b/apps/studio/lib/toaster.tsx new file mode 100644 index 00000000000..4339a122692 --- /dev/null +++ b/apps/studio/lib/toaster.tsx @@ -0,0 +1,9 @@ +'use client' + +import { useTheme } from 'next-themes' +import { SonnerToaster } from 'ui' + +export function Toaster() { + const { theme } = useTheme() + return +} diff --git a/apps/studio/pages/_app.tsx b/apps/studio/pages/_app.tsx index a6f6f4aaf6f..27cb705ad4b 100644 --- a/apps/studio/pages/_app.tsx +++ b/apps/studio/pages/_app.tsx @@ -31,16 +31,6 @@ import { useThemeSandbox, } from 'common' import MetaFaviconsPagesRouter from 'common/MetaFavicons/pages-router' -import { StudioCommandMenu } from 'components/interfaces/App/CommandMenu' -import { StudioCommandProvider as CommandProvider } from 'components/interfaces/App/CommandMenu/StudioCommandProvider' -import { FeaturePreviewContextProvider } from 'components/interfaces/App/FeaturePreview/FeaturePreviewContext' -import { FeaturePreviewModal } from 'components/interfaces/App/FeaturePreview/FeaturePreviewModal' -import { UpdateBillingAddressModal } from 'components/interfaces/App/UpdateBillingAddressModal' -import { MonacoThemeProvider } from 'components/interfaces/App/MonacoThemeProvider' -import { RouteValidationWrapper } from 'components/interfaces/App/RouteValidationWrapper' -import { MainScrollContainerProvider } from 'components/layouts/MainScrollContainerContext' -import { GlobalErrorBoundaryState } from 'components/ui/ErrorBoundary/GlobalErrorBoundaryState' -import { useRootQueryClient } from 'data/query-client' import dayjs from 'dayjs' import customParseFormat from 'dayjs/plugin/customParseFormat' import duration from 'dayjs/plugin/duration' @@ -48,20 +38,32 @@ import relativeTime from 'dayjs/plugin/relativeTime' import timezone from 'dayjs/plugin/timezone' import utc from 'dayjs/plugin/utc' import { DevToolbar, DevToolbarProvider } from 'dev-tools' -import { customFont, sourceCodePro } from 'fonts' -import { useCustomContent } from 'hooks/custom-content/useCustomContent' -import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization' -import { AuthProvider } from 'lib/auth' -import { API_URL, BASE_PATH, IS_PLATFORM, useDefaultProvider } from 'lib/constants' -import { ProfileProvider } from 'lib/profile' -import { Telemetry } from 'lib/telemetry' import Head from 'next/head' import { NuqsAdapter } from 'nuqs/adapters/next/pages' import { ErrorInfo, useCallback, type ComponentProps } from 'react' import { ErrorBoundary } from 'react-error-boundary' -import { AiAssistantStateContextProvider } from 'state/ai-assistant-state' -import type { AppPropsWithLayout } from 'types' -import { SonnerToaster, TooltipProvider } from 'ui' +import { TooltipProvider } from 'ui' + +import { StudioCommandMenu } from '@/components/interfaces/App/CommandMenu' +import { StudioCommandProvider as CommandProvider } from '@/components/interfaces/App/CommandMenu/StudioCommandProvider' +import { FeaturePreviewContextProvider } from '@/components/interfaces/App/FeaturePreview/FeaturePreviewContext' +import { FeaturePreviewModal } from '@/components/interfaces/App/FeaturePreview/FeaturePreviewModal' +import { MonacoThemeProvider } from '@/components/interfaces/App/MonacoThemeProvider' +import { RouteValidationWrapper } from '@/components/interfaces/App/RouteValidationWrapper' +import { UpdateBillingAddressModal } from '@/components/interfaces/App/UpdateBillingAddressModal' +import { MainScrollContainerProvider } from '@/components/layouts/MainScrollContainerContext' +import { GlobalErrorBoundaryState } from '@/components/ui/ErrorBoundary/GlobalErrorBoundaryState' +import { useRootQueryClient } from '@/data/query-client' +import { customFont, sourceCodePro } from '@/fonts' +import { useCustomContent } from '@/hooks/custom-content/useCustomContent' +import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization' +import { AuthProvider } from '@/lib/auth' +import { API_URL, BASE_PATH, IS_PLATFORM, useDefaultProvider } from '@/lib/constants' +import { ProfileProvider } from '@/lib/profile' +import { Telemetry } from '@/lib/telemetry' +import { Toaster } from '@/lib/toaster' +import { AiAssistantStateContextProvider } from '@/state/ai-assistant-state' +import type { AppPropsWithLayout } from '@/types' dayjs.extend(customParseFormat) dayjs.extend(utc) @@ -185,7 +187,7 @@ function CustomApp({ Component, pageProps }: AppPropsWithLayout) { - + diff --git a/apps/ui-library/app/SonnerToast.tsx b/apps/ui-library/app/SonnerToast.tsx deleted file mode 100644 index 28a013f1dbc..00000000000 --- a/apps/ui-library/app/SonnerToast.tsx +++ /dev/null @@ -1,10 +0,0 @@ -'use client' - -import { SonnerToaster as Toaster } from 'ui' - -import { useConfig } from '@/hooks/use-config' - -export function SonnerToaster() { - const [config] = useConfig() - return -} diff --git a/apps/ui-library/app/layout.tsx b/apps/ui-library/app/layout.tsx index f82bfc3d378..e251215d895 100644 --- a/apps/ui-library/app/layout.tsx +++ b/apps/ui-library/app/layout.tsx @@ -7,7 +7,7 @@ import { genFaviconData } from 'common/MetaFavicons/app-router' import { Inter } from 'next/font/google' import { ThemeProvider } from './Providers' -import { SonnerToaster } from './SonnerToast' +import { Toaster } from './toaster' import { API_URL } from '@/lib/constants' const inter = Inter({ subsets: ['latin'] }) @@ -53,7 +53,7 @@ export default async function Layout({ children }: RootLayoutProps) { enableSystem > {children} - + diff --git a/apps/ui-library/app/toaster.tsx b/apps/ui-library/app/toaster.tsx new file mode 100644 index 00000000000..0fac1f8cd34 --- /dev/null +++ b/apps/ui-library/app/toaster.tsx @@ -0,0 +1,18 @@ +'use client' + +import { useTheme } from 'next-themes' +import { SonnerToaster } from 'ui' + +import { useConfig } from '@/hooks/use-config' + +export function Toaster() { + const [config] = useConfig() + const { theme } = useTheme() + return ( + + ) +} diff --git a/apps/ui-library/components/block-item-code.tsx b/apps/ui-library/components/block-item-code.tsx index 3ace544f82e..d6d45d509a6 100644 --- a/apps/ui-library/components/block-item-code.tsx +++ b/apps/ui-library/components/block-item-code.tsx @@ -2,7 +2,8 @@ import { File } from 'lucide-react' import { useState } from 'react' -import { CodeBlock, flattenTree, TreeView, TreeViewItem } from 'ui' +import { flattenTree, TreeView, TreeViewItem } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { RegistryNode } from '@/lib/process-registry' diff --git a/apps/www/app/providers.tsx b/apps/www/app/providers.tsx index 663b4d9c206..3d397df4228 100644 --- a/apps/www/app/providers.tsx +++ b/apps/www/app/providers.tsx @@ -1,6 +1,5 @@ 'use client' -import { Suspense } from 'react' import { AuthProvider, FeatureFlagProvider, @@ -13,10 +12,13 @@ import { import { WwwCommandMenu } from 'components/CommandMenu' import { DevToolbar, DevToolbarProvider } from 'dev-tools' import { API_URL } from 'lib/constants' -import { themes, TooltipProvider, SonnerToaster } from 'ui' +import { NuqsAdapter } from 'nuqs/adapters/next/app' +import { Suspense } from 'react' +import { SonnerToaster, themes, TooltipProvider } from 'ui' import { CommandProvider } from 'ui-patterns/CommandMenu' import { useConsentToast } from 'ui-patterns/consent' -import { NuqsAdapter } from 'nuqs/adapters/next/app' + +import { Toaster } from './toaster' function Providers({ children }: { children: React.ReactNode }) { useThemeSandbox() @@ -35,7 +37,7 @@ function Providers({ children }: { children: React.ReactNode }) { - + {children} +} diff --git a/apps/www/components/Enterprise/Security.tsx b/apps/www/components/Enterprise/Security.tsx index 825ee023d5b..e9153edbb9f 100644 --- a/apps/www/components/Enterprise/Security.tsx +++ b/apps/www/components/Enterprise/Security.tsx @@ -1,8 +1,8 @@ -import React, { FC } from 'react' -import { TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' - import type { LucideIcon } from 'lucide-react' +import React, { FC } from 'react' +import { TextLink } from 'ui-patterns/TextLink' + +import SectionContainer from '@/components/Layouts/SectionContainer' export interface SecuritySectionProps { id: string diff --git a/apps/www/components/Enterprise/UseCases.tsx b/apps/www/components/Enterprise/UseCases.tsx index d37b7819b37..c7ed09e69bb 100644 --- a/apps/www/components/Enterprise/UseCases.tsx +++ b/apps/www/components/Enterprise/UseCases.tsx @@ -1,15 +1,14 @@ import 'swiper/css' -import React, { FC } from 'react' -import { Swiper, SwiperSlide } from 'swiper/react' -import Link from 'next/link' - -import { TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' -import Panel from '~/components/Panel' - import type { LucideIcon } from 'lucide-react' import Image from 'next/image' +import Link from 'next/link' +import React, { FC } from 'react' +import { Swiper, SwiperSlide } from 'swiper/react' +import { TextLink } from 'ui-patterns/TextLink' + +import SectionContainer from '@/components/Layouts/SectionContainer' +import Panel from '@/components/Panel' interface Props { id: string diff --git a/apps/www/components/EventCallout.tsx b/apps/www/components/EventCallout.tsx index 8599d596982..7478baf5455 100644 --- a/apps/www/components/EventCallout.tsx +++ b/apps/www/components/EventCallout.tsx @@ -1,8 +1,10 @@ -import React, { PropsWithChildren } from 'react' -import Link from 'next/link' -import { cn, TextLink } from 'ui' -import Panel from './Panel' import { ChevronRightIcon, VideoCameraIcon } from '@heroicons/react/solid' +import Link from 'next/link' +import React, { PropsWithChildren } from 'react' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' + +import Panel from './Panel' interface Props { className?: string diff --git a/apps/www/components/LaunchWeek/11/HackathonCallout.tsx b/apps/www/components/LaunchWeek/11/HackathonCallout.tsx index 9eede3f04cb..22707e76aad 100644 --- a/apps/www/components/LaunchWeek/11/HackathonCallout.tsx +++ b/apps/www/components/LaunchWeek/11/HackathonCallout.tsx @@ -1,5 +1,6 @@ import React from 'react' -import { TextLink, cn } from 'ui' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' const HackathonCallout = ({ className }: { className?: string }) => { return ( diff --git a/apps/www/components/LaunchWeek/12/HackathonCallout.tsx b/apps/www/components/LaunchWeek/12/HackathonCallout.tsx index 9eede3f04cb..22707e76aad 100644 --- a/apps/www/components/LaunchWeek/12/HackathonCallout.tsx +++ b/apps/www/components/LaunchWeek/12/HackathonCallout.tsx @@ -1,5 +1,6 @@ import React from 'react' -import { TextLink, cn } from 'ui' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' const HackathonCallout = ({ className }: { className?: string }) => { return ( diff --git a/apps/www/components/LaunchWeek/X/LWXMeetups.tsx b/apps/www/components/LaunchWeek/X/LWXMeetups.tsx index 3eb92fb246a..055f036197d 100644 --- a/apps/www/components/LaunchWeek/X/LWXMeetups.tsx +++ b/apps/www/components/LaunchWeek/X/LWXMeetups.tsx @@ -1,8 +1,10 @@ +import { SupabaseClient } from '@supabase/supabase-js' import Link from 'next/link' import React, { useEffect, useState } from 'react' -import { TextLink, cn } from 'ui' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' + import useConfData from '../hooks/use-conf-data' -import { SupabaseClient } from '@supabase/supabase-js' export interface Meetup { id?: any diff --git a/apps/www/components/LaunchWeek/X/Releases/MainStage.tsx b/apps/www/components/LaunchWeek/X/Releases/MainStage.tsx index 55a393fd604..5cff3da1d06 100644 --- a/apps/www/components/LaunchWeek/X/Releases/MainStage.tsx +++ b/apps/www/components/LaunchWeek/X/Releases/MainStage.tsx @@ -1,9 +1,9 @@ import React, { FC } from 'react' -import { mainDays as days } from './data' +import { TextLink } from 'ui-patterns/TextLink' -import SectionContainer from '~/components/Layouts/SectionContainer' import DaySection from './components/DaySection' -import { TextLink } from 'ui' +import { mainDays as days } from './data' +import SectionContainer from '@/components/Layouts/SectionContainer' const MainStage: FC = () => ( diff --git a/apps/www/components/Modules/Cron/CronSQLSection.tsx b/apps/www/components/Modules/Cron/CronSQLSection.tsx index d7023d0d793..981fa6a6518 100644 --- a/apps/www/components/Modules/Cron/CronSQLSection.tsx +++ b/apps/www/components/Modules/Cron/CronSQLSection.tsx @@ -1,9 +1,9 @@ import React, { FC } from 'react' -import type { LucideIcon } from 'lucide-react' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' -import { cn, TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' -import CodeWindow from '~/components/CodeWindow' +import CodeWindow from '@/components/CodeWindow' +import SectionContainer from '@/components/Layouts/SectionContainer' const codeSnippet = ` select diff --git a/apps/www/components/Modules/Queues/QueuesAPISection.tsx b/apps/www/components/Modules/Queues/QueuesAPISection.tsx index aa6d3761d2e..53941912920 100644 --- a/apps/www/components/Modules/Queues/QueuesAPISection.tsx +++ b/apps/www/components/Modules/Queues/QueuesAPISection.tsx @@ -1,8 +1,9 @@ import React, { FC } from 'react' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' -import { cn, TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' -import CodeWindow from '~/components/CodeWindow' +import CodeWindow from '@/components/CodeWindow' +import SectionContainer from '@/components/Layouts/SectionContainer' const codeSnippet = `const queues = createClient(supabaseUrl, supabaseKey, { db: { schema: "pgmq_public" }, diff --git a/apps/www/components/Modules/Queues/QueuesSQLSection.tsx b/apps/www/components/Modules/Queues/QueuesSQLSection.tsx index e99680ca5e5..f18985bcc82 100644 --- a/apps/www/components/Modules/Queues/QueuesSQLSection.tsx +++ b/apps/www/components/Modules/Queues/QueuesSQLSection.tsx @@ -1,8 +1,9 @@ import React, { FC } from 'react' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' -import { cn, TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' -import CodeWindow from '~/components/CodeWindow' +import CodeWindow from '@/components/CodeWindow' +import SectionContainer from '@/components/Layouts/SectionContainer' const codeSnippet = ` select pgmq.create('my_special_queue'); diff --git a/apps/www/components/Nav/MobileMenu.tsx b/apps/www/components/Nav/MobileMenu.tsx index c42206eca7a..3f368d868d6 100644 --- a/apps/www/components/Nav/MobileMenu.tsx +++ b/apps/www/components/Nav/MobileMenu.tsx @@ -1,9 +1,5 @@ 'use client' -import staticContent from '.generated/staticContent/_index.json' -import ProductModulesData from '~/data/ProductModules' -import { DEFAULT_EASE } from '~/lib/animations' -import { useSendTelemetryEvent } from '~/lib/telemetry' import { useIsLoggedIn, useIsUserLoading } from 'common' import * as supabaseLogoWordmarkDark from 'common/assets/images/supabase-logo-wordmark--dark.png' import * as supabaseLogoWordmarkLight from 'common/assets/images/supabase-logo-wordmark--light.png' @@ -13,9 +9,14 @@ import Image from 'next/image' import Link from 'next/link' import { useEffect } from 'react' import type { Dispatch, SetStateAction } from 'react' -import { Accordion, Button, TextLink } from 'ui' +import { Accordion, Button } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' import MenuItem from './MenuItem' +import staticContent from '@/.generated/staticContent/_index.json' +import ProductModulesData from '@/data/ProductModules' +import { DEFAULT_EASE } from '@/lib/animations' +import { useSendTelemetryEvent } from '@/lib/telemetry' interface Props { open: boolean diff --git a/apps/www/components/Nav/ProductDropdown.tsx b/apps/www/components/Nav/ProductDropdown.tsx index 83e0e586a76..e3b82c7e4a3 100644 --- a/apps/www/components/Nav/ProductDropdown.tsx +++ b/apps/www/components/Nav/ProductDropdown.tsx @@ -1,19 +1,18 @@ 'use client' -import React from 'react' +import { useBreakpoint } from 'common' +import { ChevronRight, Sparkles } from 'lucide-react' import Image from 'next/image' import Link from 'next/link' -import { ChevronRight, Sparkles } from 'lucide-react' +import React from 'react' +import { NavigationMenuLink } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' -import { useBreakpoint } from 'common' -import { TextLink } from 'ui' -import { NavigationMenuLink } from 'ui/src/components/shadcn/ui/navigation-menu' import MenuItem from './MenuItem' - -import ComparisonsData from 'data/Comparisons' -import CustomersData from 'data/CustomerStories' -import MainProductsData from 'data/MainProducts' -import ProductModulesData from 'data/ProductModules' +import ComparisonsData from '@/data/Comparisons' +import CustomersData from '@/data/CustomerStories' +import MainProductsData from '@/data/MainProducts' +import ProductModulesData from '@/data/ProductModules' export const ProductDropdown = () => { const isTablet = useBreakpoint(1279) diff --git a/apps/www/components/NewFeatureCard.tsx b/apps/www/components/NewFeatureCard.tsx index 767939cc4f4..ea7de84d346 100644 --- a/apps/www/components/NewFeatureCard.tsx +++ b/apps/www/components/NewFeatureCard.tsx @@ -1,7 +1,9 @@ import { Check } from 'lucide-react' import Link from 'next/link' -import { Badge, Button, ButtonProps, Image } from 'ui' -import Panel from '~/components/Panel' +import { Badge, Button, ButtonProps } from 'ui' +import { Image } from 'ui-patterns/Image' + +import Panel from '@/components/Panel' export interface CardProps { title: string diff --git a/apps/www/components/Realtime/example-layout.tsx b/apps/www/components/Realtime/example-layout.tsx index 1994796698b..1f82fedb021 100644 --- a/apps/www/components/Realtime/example-layout.tsx +++ b/apps/www/components/Realtime/example-layout.tsx @@ -1,8 +1,11 @@ 'use client' -import SandpackWrapper from './sandpack' -import { Button, CodeBlock } from 'ui' -import { useState } from 'react' + import { ChevronLeft, ChevronRight, Code, Eye } from 'lucide-react' +import { useState } from 'react' +import { Button } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' + +import SandpackWrapper from './sandpack' export type ExampleLayoutProps = { appJsCode: string diff --git a/apps/www/components/Sections/ImageParagraphSection.tsx b/apps/www/components/Sections/ImageParagraphSection.tsx index 1c856a84c04..d4dc082b4a9 100644 --- a/apps/www/components/Sections/ImageParagraphSection.tsx +++ b/apps/www/components/Sections/ImageParagraphSection.tsx @@ -1,7 +1,8 @@ import React, { FC } from 'react' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' -import { cn, TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' +import SectionContainer from '@/components/Layouts/SectionContainer' interface Props { id: string diff --git a/apps/www/components/Solutions/CTAForm.tsx b/apps/www/components/Solutions/CTAForm.tsx index 736b48f6cf8..4c24c880d7e 100644 --- a/apps/www/components/Solutions/CTAForm.tsx +++ b/apps/www/components/Solutions/CTAForm.tsx @@ -1,7 +1,9 @@ import React, { FC } from 'react' -import { cn, TextLink } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' -import TalkToPartnershipTeamForm from '~/components/Forms/TalkToPartnershipTeamForm' +import { cn } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' + +import TalkToPartnershipTeamForm from '@/components/Forms/TalkToPartnershipTeamForm' +import SectionContainer from '@/components/Layouts/SectionContainer' interface Props {} diff --git a/apps/www/components/Solutions/CtaSection.tsx b/apps/www/components/Solutions/CtaSection.tsx index a73aa95a006..a773333ec60 100644 --- a/apps/www/components/Solutions/CtaSection.tsx +++ b/apps/www/components/Solutions/CtaSection.tsx @@ -1,7 +1,8 @@ import Link from 'next/link' import React from 'react' -import { Button, cn, Image } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' +import { Button, cn } from 'ui' + +import SectionContainer from '@/components/Layouts/SectionContainer' interface Props { id: string diff --git a/apps/www/components/Solutions/DeveloperExperienceSection.tsx b/apps/www/components/Solutions/DeveloperExperienceSection.tsx index 1c5a4a3fff1..ae68be05e48 100644 --- a/apps/www/components/Solutions/DeveloperExperienceSection.tsx +++ b/apps/www/components/Solutions/DeveloperExperienceSection.tsx @@ -1,8 +1,7 @@ import React from 'react' -import { cn, Image } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' -import { Badge } from 'ui' -import { Check, X } from 'lucide-react' +import { cn } from 'ui' + +import SectionContainer from '@/components/Layouts/SectionContainer' interface Feature { id?: string diff --git a/apps/www/components/Solutions/TwoColumnsSection.tsx b/apps/www/components/Solutions/TwoColumnsSection.tsx index 5054d4f8691..b70ba7dcd86 100644 --- a/apps/www/components/Solutions/TwoColumnsSection.tsx +++ b/apps/www/components/Solutions/TwoColumnsSection.tsx @@ -1,8 +1,10 @@ -import React, { useState } from 'react' -import Link from 'next/link' import { ArrowUpRight, Check, Copy } from 'lucide-react' -import { Button, cn, TextLink, Tooltip, TooltipContent, TooltipTrigger } from 'ui' -import SectionContainer from 'components/Layouts/SectionContainer' +import Link from 'next/link' +import React, { useState } from 'react' +import { Button, cn, Tooltip, TooltipContent, TooltipTrigger } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' + +import SectionContainer from '@/components/Layouts/SectionContainer' interface AIPrompt { id: string diff --git a/apps/www/components/Supasquad/CtaSection.tsx b/apps/www/components/Supasquad/CtaSection.tsx index a73aa95a006..a773333ec60 100644 --- a/apps/www/components/Supasquad/CtaSection.tsx +++ b/apps/www/components/Supasquad/CtaSection.tsx @@ -1,7 +1,8 @@ import Link from 'next/link' import React from 'react' -import { Button, cn, Image } from 'ui' -import SectionContainer from '~/components/Layouts/SectionContainer' +import { Button, cn } from 'ui' + +import SectionContainer from '@/components/Layouts/SectionContainer' interface Props { id: string diff --git a/apps/www/data/aws-reinvent-2025.tsx b/apps/www/data/aws-reinvent-2025.tsx index 63b3cfe9764..6df8332fd7a 100644 --- a/apps/www/data/aws-reinvent-2025.tsx +++ b/apps/www/data/aws-reinvent-2025.tsx @@ -1,10 +1,10 @@ -import { Calendar, MapPin, Users, Sparkles, Gift, MessageSquare, Timer, Check } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' -import { Image } from 'ui' +import { Check } from 'lucide-react' import dynamic from 'next/dynamic' -import MainProducts from './MainProducts' import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { SITE_ORIGIN } from '~/lib/constants' +import { Image } from 'ui-patterns/Image' + +import MainProducts from './MainProducts' +import { SITE_ORIGIN } from '@/lib/constants' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/open-source/contributing/supasquad.tsx b/apps/www/data/open-source/contributing/supasquad.tsx index 700b81e40d9..6b5b7dbd536 100644 --- a/apps/www/data/open-source/contributing/supasquad.tsx +++ b/apps/www/data/open-source/contributing/supasquad.tsx @@ -1,4 +1,4 @@ -import { Image } from 'ui' +import { Image } from 'ui-patterns/Image' export const data = { metadata: { diff --git a/apps/www/data/products/modules/cron.tsx b/apps/www/data/products/modules/cron.tsx index 17bcd2453f9..9eba10103f6 100644 --- a/apps/www/data/products/modules/cron.tsx +++ b/apps/www/data/products/modules/cron.tsx @@ -1,7 +1,8 @@ // import Image from 'next/image' import { PRODUCT_MODULES } from 'shared-data/products' -import BrowserFrame from '~/components/BrowserFrame' -import { Image } from 'ui' +import { Image } from 'ui-patterns/Image' + +import BrowserFrame from '@/components/BrowserFrame' export default () => ({ metaTitle: 'Supabase Cron | Schedule Recurring Jobs in Postgres', diff --git a/apps/www/data/products/modules/queues.tsx b/apps/www/data/products/modules/queues.tsx index ae5253b07b6..24d0645b2d4 100644 --- a/apps/www/data/products/modules/queues.tsx +++ b/apps/www/data/products/modules/queues.tsx @@ -1,6 +1,7 @@ import { PRODUCT_MODULES } from 'shared-data/products' -import BrowserFrame from '~/components/BrowserFrame' -import { Image } from 'ui' +import { Image } from 'ui-patterns/Image' + +import BrowserFrame from '@/components/BrowserFrame' export default () => ({ metaTitle: 'Supabase Queues | Durable Message Queues with Guaranteed Delivery', diff --git a/apps/www/data/solutions/agencies.tsx b/apps/www/data/solutions/agencies.tsx index d07347f33fd..157b1cd7e6f 100644 --- a/apps/www/data/solutions/agencies.tsx +++ b/apps/www/data/solutions/agencies.tsx @@ -1,10 +1,9 @@ -import dynamic from 'next/dynamic' +import { CubeIcon } from '@heroicons/react/outline' import { ArrowLeftRight, Check, ClipboardCheck, FolderLock, - Globe2, HeartPulse, InfoIcon, Lightbulb, @@ -17,30 +16,29 @@ import { Users, UserX, } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' -import { Image } from 'ui' +import dynamic from 'next/dynamic' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Image } from 'ui-patterns/Image' +import { companyStats } from '../company-stats' import MainProducts from '../MainProducts' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { DXSectionProps } from 'components/Solutions/DeveloperExperienceSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import type { TwoColumnsSectionProps } from 'components/Solutions/TwoColumnsSection' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' import { FrameworkLink, + getEditors, type FeaturesSection, type FrameworkLinkProps, type HeroSection, type Metadata, type Quotes, - getEditors, } from './solutions.utils' -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { companyStats } from '../company-stats' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import RealtimeLogs from '@/components/Products/Functions/RealtimeLogs' +import type { DXSectionProps } from '@/components/Solutions/DeveloperExperienceSection' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import type { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/agents.tsx b/apps/www/data/solutions/agents.tsx index 3154dd3c4c6..8b4dcd2651e 100644 --- a/apps/www/data/solutions/agents.tsx +++ b/apps/www/data/solutions/agents.tsx @@ -1,3 +1,4 @@ +import { CubeIcon } from '@heroicons/react/outline' import { Check, ClipboardCheck, @@ -11,25 +12,22 @@ import { Users, UserX, } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' +import { Image } from 'ui-patterns/Image' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { SecuritySectionProps } from 'components/Enterprise/Security' +import { getSharedSections } from './shared-sections' import { FrameworkLink, type FeaturesSection, type HeroSection, type Metadata, } from './solutions.utils' -import { getSharedSections } from './shared-sections' -import { Image } from 'ui' - -import { useSendTelemetryEvent } from 'lib/telemetry' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const data: () => { metadata: Metadata diff --git a/apps/www/data/solutions/ai-builders.tsx b/apps/www/data/solutions/ai-builders.tsx index cd0247c1529..76bd484e1cb 100644 --- a/apps/www/data/solutions/ai-builders.tsx +++ b/apps/www/data/solutions/ai-builders.tsx @@ -1,6 +1,6 @@ -import { Timer } from 'lucide-react' import { CubeIcon } from '@heroicons/react/outline' -import { Image } from 'ui' +import { Timer } from 'lucide-react' + import type { CTASection, FeaturesSection, diff --git a/apps/www/data/solutions/b2b-saas.tsx b/apps/www/data/solutions/b2b-saas.tsx index 02c1abec0f5..e3e785aa464 100644 --- a/apps/www/data/solutions/b2b-saas.tsx +++ b/apps/www/data/solutions/b2b-saas.tsx @@ -1,4 +1,5 @@ -import dynamic from 'next/dynamic' +import { CubeIcon } from '@heroicons/react/outline' +import { useBreakpoint } from 'common' import { Check, ClipboardCheck, @@ -12,26 +13,22 @@ import { Users, UserX, } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' -import { Image } from 'ui' +import { Image } from 'ui-patterns/Image' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { SecuritySectionProps } from 'components/Enterprise/Security' +import { getSharedSections } from './shared-sections' import { FrameworkLink, type FeaturesSection, type HeroSection, type Metadata, } from './solutions.utils' -import { getSharedSections } from './shared-sections' - -import { useBreakpoint } from 'common' -import { useSendTelemetryEvent } from 'lib/telemetry' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const data: () => { metadata: Metadata diff --git a/apps/www/data/solutions/beginners.tsx b/apps/www/data/solutions/beginners.tsx index cd9b89ee030..ae065ca9a71 100644 --- a/apps/www/data/solutions/beginners.tsx +++ b/apps/www/data/solutions/beginners.tsx @@ -1,16 +1,14 @@ import { CubeIcon } from '@heroicons/react/outline' +import { useBreakpoint } from 'common' import { Check, Sparkles, Timer } from 'lucide-react' import dynamic from 'next/dynamic' import Link from 'next/link' -import { Button, cn, IconDiscord, Image } from 'ui' +import { topTweets } from 'shared-data' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Button, cn, IconDiscord } from 'ui' +import { Image } from 'ui-patterns/Image' -import { frameworks } from 'components/Hero/HeroFrameworks' import MainProducts from '../MainProducts' - -import type { MPCSectionProps } from 'components/Solutions/MPCSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { TwitterSocialSectionProps } from 'components/TwitterSocialSection' -import type { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' import { FrameworkLink, getEditors, @@ -18,11 +16,12 @@ import { type HeroSection, type Metadata, } from './solutions.utils' - -import { useBreakpoint } from 'common' -import { useSendTelemetryEvent } from 'lib/telemetry' -import { topTweets } from 'shared-data' -import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import type { TwitterSocialSectionProps } from '@/components/TwitterSocialSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const ComputePricingCalculator = dynamic( diff --git a/apps/www/data/solutions/developers.tsx b/apps/www/data/solutions/developers.tsx index 87cea843905..e560f21a0ad 100644 --- a/apps/www/data/solutions/developers.tsx +++ b/apps/www/data/solutions/developers.tsx @@ -1,4 +1,5 @@ -import dynamic from 'next/dynamic' +import { CubeIcon } from '@heroicons/react/outline' +import { useBreakpoint } from 'common' import { Check, ClipboardCheck, @@ -15,33 +16,29 @@ import { Users, UserX, } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' -import { Image } from 'ui' +import dynamic from 'next/dynamic' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Image } from 'ui-patterns/Image' import MainProducts from '../MainProducts' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { DXSectionProps } from 'components/Solutions/DeveloperExperienceSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' import { FrameworkLink, - type FrameworkLinkProps, + getEditors, type FeaturesSection, type HeroSection, type Metadata, - getEditors, } from './solutions.utils' -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' - -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { useBreakpoint } from 'common' -import { useSendTelemetryEvent } from 'lib/telemetry' -import { companyStats } from 'data/company-stats' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import RealtimeLogs from '@/components/Products/Functions/RealtimeLogs' +import type { DXSectionProps } from '@/components/Solutions/DeveloperExperienceSection' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { companyStats } from '@/data/company-stats' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/finserv.tsx b/apps/www/data/solutions/finserv.tsx index 7f2814aa49d..82252d8946c 100644 --- a/apps/www/data/solutions/finserv.tsx +++ b/apps/www/data/solutions/finserv.tsx @@ -11,26 +11,24 @@ import { Users, UserX, } from 'lucide-react' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Image } from 'ui-patterns/Image' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { SecuritySectionProps } from 'components/Enterprise/Security' +import MainProducts from '../MainProducts' +import { getSharedSections } from './shared-sections' import { FrameworkLink, type FeaturesSection, type HeroSection, type Metadata, } from './solutions.utils' -import { getSharedSections } from './shared-sections' -import MainProducts from '../MainProducts' -import { Image } from 'ui' -import { PRODUCT_SHORTNAMES } from 'shared-data/products' - -import { useSendTelemetryEvent } from 'lib/telemetry' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const data: () => { metadata: Metadata diff --git a/apps/www/data/solutions/firebase.tsx b/apps/www/data/solutions/firebase.tsx index dd05519e2bc..1e63896fa28 100644 --- a/apps/www/data/solutions/firebase.tsx +++ b/apps/www/data/solutions/firebase.tsx @@ -1,29 +1,30 @@ -import { cn, Image } from 'ui' -import dynamic from 'next/dynamic' import { CubeIcon } from '@heroicons/react/outline' import { ArrowRight, ArrowUpRight, - Timer, - Lock, - ShieldCheck, - Users, - UserX, + Check, + ClipboardCheck, FolderLock, + HeartPulse, + InfoIcon, Lightbulb, List, - ClipboardCheck, + Lock, ShieldAlert, - HeartPulse, - Check, - InfoIcon, + ShieldCheck, + Timer, + Users, + UserX, } from 'lucide-react' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' - -import MainProducts from 'data/MainProducts' +import dynamic from 'next/dynamic' import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { companyStats } from 'data/company-stats' -import { MobbinLogo } from '~/components/BrandLogo' +import { cn } from 'ui' +import { Image } from 'ui-patterns/Image' + +import { MobbinLogo } from '@/components/BrandLogo' +import RealtimeLogs from '@/components/Products/Functions/RealtimeLogs' +import { companyStats } from '@/data/company-stats' +import MainProducts from '@/data/MainProducts' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/hackathon.tsx b/apps/www/data/solutions/hackathon.tsx index 17a34e4469f..bd757355be9 100644 --- a/apps/www/data/solutions/hackathon.tsx +++ b/apps/www/data/solutions/hackathon.tsx @@ -1,50 +1,26 @@ -import dynamic from 'next/dynamic' -import { - ArrowLeftRight, - Check, - ClipboardCheck, - FolderLock, - Globe2, - HeartPulse, - InfoIcon, - Lightbulb, - List, - Lock, - ShieldAlert, - ShieldCheck, - Sparkles, - Timer, - Users, - UserX, -} from 'lucide-react' import { CubeIcon } from '@heroicons/react/outline' -import { Image } from 'ui' +import { useBreakpoint } from 'common' +import { Check, InfoIcon, Sparkles, Timer } from 'lucide-react' +import dynamic from 'next/dynamic' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Image } from 'ui-patterns/Image' import MainProducts from '../MainProducts' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { DXSectionProps } from 'components/Solutions/DeveloperExperienceSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' import { FrameworkLink, - type FrameworkLinkProps, + getEditors, type FeaturesSection, type HeroSection, type Metadata, - getEditors, } from './solutions.utils' -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' - -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { useBreakpoint } from 'common' -import { useSendTelemetryEvent } from 'lib/telemetry' -import { companyStats } from 'data/company-stats' -import { DerivLogo, SoshiLogo } from '~/components/BrandLogo' +import { SoshiLogo } from '@/components/BrandLogo' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import RealtimeLogs from '@/components/Products/Functions/RealtimeLogs' +import type { DXSectionProps } from '@/components/Solutions/DeveloperExperienceSection' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/healthcare.tsx b/apps/www/data/solutions/healthcare.tsx index 1ad9be32e7c..d0a21a58f72 100644 --- a/apps/www/data/solutions/healthcare.tsx +++ b/apps/www/data/solutions/healthcare.tsx @@ -10,25 +10,23 @@ import { Users, UserX, } from 'lucide-react' +import { Image } from 'ui-patterns/Image' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import type { WhatItTakesSectionProps } from 'components/Solutions/WhatItTakesSection' +import { getSharedSections } from './shared-sections' import { FrameworkLink, type FeaturesSection, type HeroSection, type Metadata, } from './solutions.utils' -import { getSharedSections } from './shared-sections' -import { Image } from 'ui' - -import { useSendTelemetryEvent } from 'lib/telemetry' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import type { WhatItTakesSectionProps } from '@/components/Solutions/WhatItTakesSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const data: () => { metadata: Metadata diff --git a/apps/www/data/solutions/innovation-teams.tsx b/apps/www/data/solutions/innovation-teams.tsx index 5d1b6e707ae..79dd69b5128 100644 --- a/apps/www/data/solutions/innovation-teams.tsx +++ b/apps/www/data/solutions/innovation-teams.tsx @@ -1,15 +1,5 @@ import { CubeIcon } from '@heroicons/react/outline' import { useBreakpoint } from 'common' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import { frameworks } from 'components/Hero/HeroFrameworks' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' -import type { DXSectionProps } from 'components/Solutions/DeveloperExperienceSection' -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import { companyStats } from 'data/company-stats' -import { useSendTelemetryEvent } from 'lib/telemetry' import { ArrowLeftRight, Check, @@ -17,7 +7,6 @@ import { FolderLock, Globe2, HeartPulse, - InfoIcon, Lightbulb, List, Lock, @@ -25,23 +14,28 @@ import { ShieldCheck, Sparkles, Timer, - UserX, Users, + UserX, } from 'lucide-react' import dynamic from 'next/dynamic' import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { Image } from 'ui' +import { Image } from 'ui-patterns/Image' import MainProducts from '../MainProducts' import { - type FeaturesSection, FrameworkLink, - type FrameworkLinkProps, + getEditors, + type FeaturesSection, type HeroSection, type Metadata, - getEditors, } from './solutions.utils' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { DXSectionProps } from '@/components/Solutions/DeveloperExperienceSection' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { companyStats } from '@/data/company-stats' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/neon.tsx b/apps/www/data/solutions/neon.tsx index 7c9c791b1cb..8bc75d2d414 100644 --- a/apps/www/data/solutions/neon.tsx +++ b/apps/www/data/solutions/neon.tsx @@ -1,29 +1,30 @@ -import { cn, Image } from 'ui' -import dynamic from 'next/dynamic' import { CubeIcon } from '@heroicons/react/outline' import { ArrowRight, ArrowUpRight, - Timer, - Lock, - ShieldCheck, - Users, - UserX, + Check, + ClipboardCheck, FolderLock, + HeartPulse, + InfoIcon, Lightbulb, List, - ClipboardCheck, + Lock, ShieldAlert, - HeartPulse, - Check, - InfoIcon, + ShieldCheck, + Timer, + Users, + UserX, } from 'lucide-react' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' - -import MainProducts from 'data/MainProducts' +import dynamic from 'next/dynamic' import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { companyStats } from 'data/company-stats' -import { DerivLogo } from '~/components/BrandLogo' +import { cn } from 'ui' +import { Image } from 'ui-patterns/Image' + +import { DerivLogo } from '@/components/BrandLogo' +import RealtimeLogs from '@/components/Products/Functions/RealtimeLogs' +import { companyStats } from '@/data/company-stats' +import MainProducts from '@/data/MainProducts' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/no-code.tsx b/apps/www/data/solutions/no-code.tsx index 0e30f4f07a5..b4b4f33444d 100644 --- a/apps/www/data/solutions/no-code.tsx +++ b/apps/www/data/solutions/no-code.tsx @@ -1,16 +1,14 @@ -import dynamic from 'next/dynamic' import { Check, PointerIcon, TrendingUp, ZapIcon } from 'lucide-react' -import { cn, Image } from 'ui' +import dynamic from 'next/dynamic' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { cn } from 'ui' +import { Image } from 'ui-patterns/Image' import MainProducts from '../MainProducts' - -import type { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' -import type { FeaturesSection, HeroSection, Metadata } from './solutions.utils' -import type { Quotes } from './solutions.utils' - -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { useSendTelemetryEvent } from 'lib/telemetry' +import type { FeaturesSection, HeroSection, Metadata, Quotes } from './solutions.utils' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const ComputePricingCalculator = dynamic( diff --git a/apps/www/data/solutions/postgres-developers.tsx b/apps/www/data/solutions/postgres-developers.tsx index a924451a079..aecdb3b329e 100644 --- a/apps/www/data/solutions/postgres-developers.tsx +++ b/apps/www/data/solutions/postgres-developers.tsx @@ -1,5 +1,5 @@ -import { useState } from 'react' -import dynamic from 'next/dynamic' +import { CubeIcon } from '@heroicons/react/outline' +import { useBreakpoint } from 'common' import { Check, ClipboardCheck, @@ -16,36 +16,33 @@ import { Users, UserX, } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' -import { cn, Image, Input_Shadcn_, Switch } from 'ui' +import dynamic from 'next/dynamic' +import { useState } from 'react' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { cn, Input_Shadcn_, Switch } from 'ui' +import { Image } from 'ui-patterns/Image' import MainProducts from '../MainProducts' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import { frameworks } from 'components/Hero/HeroFrameworks' -import Logos from 'components/logos' - -import type { DXSectionProps } from 'components/Solutions/DeveloperExperienceSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' import { FrameworkLink, getEditors, type FeaturesSection, - type FrameworkLinkProps, type HeroSection, type Metadata, } from './solutions.utils' -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' - -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { useBreakpoint } from 'common' -import { useSendTelemetryEvent } from 'lib/telemetry' -import { companyStats } from 'data/company-stats' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import Logos from '@/components/logos' +import type { DXSectionProps } from '@/components/Solutions/DeveloperExperienceSection' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { companyStats } from '@/data/company-stats' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) -const DatabaseVisual = dynamic(() => import('components/Products/DatabaseVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) const RealtimeVisual = dynamic(() => import('components/Products/RealtimeVisual')) const RealtimeLogs = dynamic(() => import('components/Products/Functions/RealtimeLogs')) diff --git a/apps/www/data/solutions/startups.tsx b/apps/www/data/solutions/startups.tsx index 61493118c50..72969028287 100644 --- a/apps/www/data/solutions/startups.tsx +++ b/apps/www/data/solutions/startups.tsx @@ -1,4 +1,5 @@ -import dynamic from 'next/dynamic' +import { CubeIcon } from '@heroicons/react/outline' +import { useBreakpoint } from 'common' import { Check, ClipboardCheck, @@ -15,33 +16,29 @@ import { Users, UserX, } from 'lucide-react' -import { CubeIcon } from '@heroicons/react/outline' -import { cn, IconPartners, Image } from 'ui' +import dynamic from 'next/dynamic' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Image } from 'ui-patterns/Image' +import { companyStats } from '../company-stats' import MainProducts from '../MainProducts' -import { TwoColumnsSectionProps } from '~/components/Solutions/TwoColumnsSection' -import RealtimeLogs from 'components/Products/Functions/RealtimeLogs' -import { frameworks } from 'components/Hero/HeroFrameworks' - -import type { DXSectionProps } from 'components/Solutions/DeveloperExperienceSection' -import type { ResultsSectionProps } from 'components/Solutions/ResultsSection' -import type { PlatformSectionProps } from 'components/Solutions/PlatformSection' import { FrameworkLink, - type FrameworkLinkProps, + getEditors, type FeaturesSection, type HeroSection, type Metadata, - getEditors, } from './solutions.utils' -import type { FeatureGridProps } from 'components/Solutions/FeatureGrid' -import type { SecuritySectionProps } from 'components/Enterprise/Security' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' - -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { useBreakpoint } from 'common' -import { useSendTelemetryEvent } from 'lib/telemetry' -import { companyStats } from '../company-stats' +import type { SecuritySectionProps } from '@/components/Enterprise/Security' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import RealtimeLogs from '@/components/Products/Functions/RealtimeLogs' +import type { DXSectionProps } from '@/components/Solutions/DeveloperExperienceSection' +import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' +import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection' +import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection' +import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection' +import { useSendTelemetryEvent } from '@/lib/telemetry' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const FunctionsVisual = dynamic(() => import('components/Products/FunctionsVisual')) diff --git a/apps/www/data/solutions/vibe-coders.tsx b/apps/www/data/solutions/vibe-coders.tsx index e201423c59c..2b597fdb871 100644 --- a/apps/www/data/solutions/vibe-coders.tsx +++ b/apps/www/data/solutions/vibe-coders.tsx @@ -1,5 +1,10 @@ -import { Timer, Zap, CheckCircle, Check, Sparkles } from 'lucide-react' -import { Button, Image } from 'ui' +import { useBreakpoint } from 'common' +import { Check, CheckCircle, Sparkles, Timer, Zap } from 'lucide-react' +import dynamic from 'next/dynamic' +import { PRODUCT_SHORTNAMES } from 'shared-data/products' +import { Image } from 'ui-patterns/Image' + +import MainProducts from '../MainProducts' import type { FeaturesSection, HeroSection, @@ -7,14 +12,9 @@ import type { PostGridProps, Quotes, } from './solutions.utils' -import dynamic from 'next/dynamic' - -import MainProducts from '../MainProducts' -import { PRODUCT_SHORTNAMES } from 'shared-data/products' -import { frameworks } from 'components/Hero/HeroFrameworks' import { FrameworkLink, getEditors } from './solutions.utils' -import type { MPCSectionProps } from 'components/Solutions/MPCSection' -import { useBreakpoint } from 'common' +import { frameworks } from '@/components/Hero/HeroFrameworks' +import type { MPCSectionProps } from '@/components/Solutions/MPCSection' const AuthVisual = dynamic(() => import('components/Products/AuthVisual')) const ComputePricingCalculator = dynamic( diff --git a/apps/www/lib/mdx/mdxComponents.tsx b/apps/www/lib/mdx/mdxComponents.tsx index 7abff78971b..584117c9839 100644 --- a/apps/www/lib/mdx/mdxComponents.tsx +++ b/apps/www/lib/mdx/mdxComponents.tsx @@ -1,8 +1,9 @@ 'use client' import { CH } from '@code-hike/mdx/components' -import dynamic from 'next/dynamic' import { ArrowUpRight, Triangle } from 'lucide-react' +import dynamic from 'next/dynamic' +import type { PropsWithChildren } from 'react' import { Badge, cn, @@ -10,12 +11,10 @@ import { CollapsibleContent_Shadcn_, CollapsibleTrigger_Shadcn_, Heading, - Image, - Mermaid, } from 'ui' import { Admonition } from 'ui-patterns/admonition' -import type { PropsWithChildren } from 'react' -import type { ImageProps } from 'ui/src/components/Image/Image' +import { Image, type ImageProps } from 'ui-patterns/Image' +import { Mermaid } from 'ui-patterns/Mermaid' const Avatar = dynamic(() => import('~/components/Avatar')) const Chart = dynamic(() => import('~/components/Charts/PGCharts')) diff --git a/apps/www/pages/_app.tsx b/apps/www/pages/_app.tsx index 0d8b054ee6c..8125ced851e 100644 --- a/apps/www/pages/_app.tsx +++ b/apps/www/pages/_app.tsx @@ -2,8 +2,6 @@ import '@code-hike/mdx/styles.css' import 'config/code-hike.scss' import '../styles/index.css' -import { WwwCommandMenu } from '~/components/CommandMenu' -import { API_URL, APP_NAME, DEFAULT_META_DESCRIPTION } from '~/lib/constants' import { AuthProvider, FeatureFlagProvider, @@ -22,12 +20,15 @@ import { DefaultSeo } from 'next-seo' import type { AppProps } from 'next/app' import Head from 'next/head' import { useRouter } from 'next/router' -import { SonnerToaster, themes, TooltipProvider } from 'ui' +import { themes, TooltipProvider } from 'ui' import { CommandProvider } from 'ui-patterns/CommandMenu' import { useConsentToast } from 'ui-patterns/consent' import useDarkLaunchWeeks from '../hooks/useDarkLaunchWeeks' import { useWwwCommandMenuTelemetry } from '../hooks/useWwwCommandMenuTelemetry' +import { Toaster } from '@/app/toaster' +import { WwwCommandMenu } from '@/components/CommandMenu' +import { API_URL, APP_NAME, DEFAULT_META_DESCRIPTION } from '@/lib/constants' export default function App({ Component, pageProps }: AppProps) { const router = useRouter() @@ -100,7 +101,7 @@ export default function App({ Component, pageProps }: AppProps) { > - + import('~/components/Carousels/SplitCodeBlockCarousel') diff --git a/apps/www/pages/database.tsx b/apps/www/pages/database.tsx index 5668940a248..78ea6d561f1 100644 --- a/apps/www/pages/database.tsx +++ b/apps/www/pages/database.tsx @@ -1,29 +1,28 @@ // Import Swiper styles import 'swiper/css' +import { ArrowUpRight, X } from 'lucide-react' import { NextSeo } from 'next-seo' import dynamic from 'next/dynamic' import NextImage from 'next/image' import Link from 'next/link' import { useRouter } from 'next/router' import { useState } from 'react' -import { Swiper, SwiperSlide } from 'swiper/react' -import { Badge, Button, Image, Tabs } from 'ui' - -// data -import ApiExamplesData from 'data/products/database/api-examples' -import ExtensionsExamplesData from 'data/products/database/extensions-examples' -import SqlViewCarouselData from 'data/products/database/sql-view-carousel.json' -import TableViewCarouselData from 'data/products/database/table-view-carousel.json' -import MainProducts from '~/data/MainProducts' -import HighlightsCards from '~/data/products/database/highlight-cards' - -import { ArrowUpRight, X } from 'lucide-react' import { PRODUCT_NAMES } from 'shared-data/products' +import { Swiper, SwiperSlide } from 'swiper/react' +import { Badge, Button, Tabs } from 'ui' +import { Image } from 'ui-patterns/Image' import { TweetCard } from 'ui-patterns/TweetCard' -import ProductsNav from '~/components/Products/ProductsNav' -import ProductHeader from '~/components/Sections/ProductHeader' -import { ETLVisual } from '~/data/products/database/etl-visual' + +import ProductsNav from '@/components/Products/ProductsNav' +import ProductHeader from '@/components/Sections/ProductHeader' +import MainProducts from '@/data/MainProducts' +import ApiExamplesData from '@/data/products/database/api-examples' +import { ETLVisual } from '@/data/products/database/etl-visual' +import ExtensionsExamplesData from '@/data/products/database/extensions-examples' +import HighlightsCards from '@/data/products/database/highlight-cards' +import SqlViewCarouselData from '@/data/products/database/sql-view-carousel.json' +import TableViewCarouselData from '@/data/products/database/table-view-carousel.json' const NewFeatureCard = dynamic(() => import('~/components/NewFeatureCard')) const ImageCarousel = dynamic(() => import('~/components/Carousels/ImageCarousel')) diff --git a/apps/www/pages/events/[slug].tsx b/apps/www/pages/events/[slug].tsx index 15482eafbcb..1c69fe6e4a4 100644 --- a/apps/www/pages/events/[slug].tsx +++ b/apps/www/pages/events/[slug].tsx @@ -4,35 +4,32 @@ import { MicrophoneIcon, VideoCameraIcon, } from '@heroicons/react/solid' +import * as supabaseLogoWordmarkDark from 'common/assets/images/supabase-logo-wordmark--dark.png' +import * as supabaseLogoWordmarkLight from 'common/assets/images/supabase-logo-wordmark--light.png' import dayjs from 'dayjs' +import advancedFormat from 'dayjs/plugin/advancedFormat' +import timezone from 'dayjs/plugin/timezone' +import utc from 'dayjs/plugin/utc' import matter from 'gray-matter' import { ChevronLeft, X as XIcon } from 'lucide-react' +import type { GetStaticProps, InferGetStaticPropsType } from 'next' import { MDXRemote } from 'next-mdx-remote' import { NextSeo } from 'next-seo' import NextImage from 'next/image' import Link from 'next/link' +import { Button } from 'ui' +import { Image } from 'ui-patterns/Image' -import authors from 'lib/authors.json' -import { capitalize, isNotNullOrUndefined } from '~/lib/helpers' -import mdxComponents from '~/lib/mdx/mdxComponents' -import { mdxSerialize } from '~/lib/mdx/mdxSerialize' -import { getAllPostSlugs, getPostdata } from '~/lib/posts' -import { useSendTelemetryEvent } from '~/lib/telemetry' - -import advancedFormat from 'dayjs/plugin/advancedFormat' -import timezone from 'dayjs/plugin/timezone' -import utc from 'dayjs/plugin/utc' - -import { Button, Image } from 'ui' -import ShareArticleActions from '~/components/Blog/ShareArticleActions' -import DefaultLayout from '~/components/Layouts/Default' -import SectionContainer from '~/components/Layouts/SectionContainer' - -import * as supabaseLogoWordmarkDark from 'common/assets/images/supabase-logo-wordmark--dark.png' -import * as supabaseLogoWordmarkLight from 'common/assets/images/supabase-logo-wordmark--light.png' - -import type { GetStaticProps, InferGetStaticPropsType } from 'next' -import type Author from '~/types/author' +import ShareArticleActions from '@/components/Blog/ShareArticleActions' +import DefaultLayout from '@/components/Layouts/Default' +import SectionContainer from '@/components/Layouts/SectionContainer' +import authors from '@/lib/authors.json' +import { capitalize, isNotNullOrUndefined } from '@/lib/helpers' +import mdxComponents from '@/lib/mdx/mdxComponents' +import { mdxSerialize } from '@/lib/mdx/mdxSerialize' +import { getAllPostSlugs, getPostdata } from '@/lib/posts' +import { useSendTelemetryEvent } from '@/lib/telemetry' +import type Author from '@/types/author' dayjs.extend(utc) dayjs.extend(timezone) diff --git a/apps/www/pages/features/[slug].tsx b/apps/www/pages/features/[slug].tsx index 9113cdcd10b..4399be9b95b 100644 --- a/apps/www/pages/features/[slug].tsx +++ b/apps/www/pages/features/[slug].tsx @@ -3,16 +3,16 @@ import { GetStaticPaths, GetStaticProps } from 'next' import { NextSeo } from 'next-seo' import Link from 'next/link' import ReactMarkdown from 'react-markdown' +import { Badge, Button, cn } from 'ui' +import { Image } from 'ui-patterns/Image' -import { Badge, Button, cn, Image } from 'ui' -import ShareArticleActions from '~/components/Blog/ShareArticleActions' -import CTABanner from '~/components/CTABanner' -import DefaultLayout from '~/components/Layouts/Default' -import SectionContainer from '~/components/Layouts/SectionContainer' -import PrevNextFeatureNav from '~/components/PrevNextFeatureNav' - -import type { FeatureType } from '~/data/features' -import { features } from '~/data/features' +import ShareArticleActions from '@/components/Blog/ShareArticleActions' +import CTABanner from '@/components/CTABanner' +import DefaultLayout from '@/components/Layouts/Default' +import SectionContainer from '@/components/Layouts/SectionContainer' +import PrevNextFeatureNav from '@/components/PrevNextFeatureNav' +import { features } from '@/data/features' +import type { FeatureType } from '@/data/features' interface FeaturePageProps { feature: FeatureType diff --git a/apps/www/pages/partners/index.tsx b/apps/www/pages/partners/index.tsx index 10e928bf3e3..268405b7f86 100644 --- a/apps/www/pages/partners/index.tsx +++ b/apps/www/pages/partners/index.tsx @@ -1,18 +1,18 @@ -import { range } from 'lib/helpers' +import { useBreakpoint } from 'common' +import { Code } from 'lucide-react' import { NextSeo } from 'next-seo' import Image from 'next/image' import Link from 'next/link' import { useRouter } from 'next/router' +import { Badge, Button } from 'ui' +import { TextLink } from 'ui-patterns/TextLink' -import { useBreakpoint } from 'common' -import { Badge, Button, TextLink } from 'ui' -import DefaultLayout from '~/components/Layouts/Default' -import SectionContainer from '~/components/Layouts/SectionContainer' -import Panel from '~/components/Panel' -import ProductHeaderCentered from '~/components/Sections/ProductHeaderCentered' - -import pageData from '~/data/partners' -import { Code } from 'lucide-react' +import DefaultLayout from '@/components/Layouts/Default' +import SectionContainer from '@/components/Layouts/SectionContainer' +import Panel from '@/components/Panel' +import ProductHeaderCentered from '@/components/Sections/ProductHeaderCentered' +import pageData from '@/data/partners' +import { range } from '@/lib/helpers' const Partners = () => { const router = useRouter() diff --git a/apps/www/pages/storage.tsx b/apps/www/pages/storage.tsx index 03c3993ab39..80a231a1293 100644 --- a/apps/www/pages/storage.tsx +++ b/apps/www/pages/storage.tsx @@ -1,21 +1,23 @@ -import ApiExamples from 'data/products/storage/api-examples' -import DashboardViewData from 'data/products/storage/dashboard-carousel.json' -import StoragePermissionsData from 'data/products/storage/permissions-examples' -import Solutions from '~/data/MainProducts' import { ArrowUpRight, Shuffle, Wifi, X } from 'lucide-react' import { NextSeo } from 'next-seo' +import dynamic from 'next/dynamic' import Link from 'next/link' import { useRouter } from 'next/router' import { PRODUCT_NAMES } from 'shared-data/products' -import { Button, Image } from 'ui' -import ImageCarousel from '~/components/Carousels/ImageCarousel' -import FeatureColumn from '~/components/FeatureColumn' -import DefaultLayout from '~/components/Layouts/Default' -import SectionContainer from '~/components/Layouts/SectionContainer' -import ProductIcon from '~/components/ProductIcon' -import ProductsNav from '~/components/Products/ProductsNav' -import ProductHeader from '~/components/Sections/ProductHeader' -import dynamic from 'next/dynamic' +import { Button } from 'ui' +import { Image } from 'ui-patterns/Image' + +import ImageCarousel from '@/components/Carousels/ImageCarousel' +import FeatureColumn from '@/components/FeatureColumn' +import DefaultLayout from '@/components/Layouts/Default' +import SectionContainer from '@/components/Layouts/SectionContainer' +import ProductIcon from '@/components/ProductIcon' +import ProductsNav from '@/components/Products/ProductsNav' +import ProductHeader from '@/components/Sections/ProductHeader' +import Solutions from '@/data/MainProducts' +import ApiExamples from '@/data/products/storage/api-examples' +import DashboardViewData from '@/data/products/storage/dashboard-carousel.json' +import StoragePermissionsData from '@/data/products/storage/permissions-examples' const APISection = dynamic(() => import('~/components/Sections/APISection')) const SingleQuote = dynamic(() => import('~/components/Sections/SingleQuote')) diff --git a/packages/ui-patterns/index.tsx b/packages/ui-patterns/index.tsx index f0bcf7d138e..8a2eb48ea6b 100644 --- a/packages/ui-patterns/index.tsx +++ b/packages/ui-patterns/index.tsx @@ -5,9 +5,7 @@ * DO NOT add new components to this file. */ export * from './src/admonition' -export * from './src/AssistantChat/AssistantChatForm' export * from './src/AuthenticatedDropdownMenu' -export * from './src/Banners' export * from './src/Chart' export * from './src/CommandMenu' export * from './src/ComputeBadge' @@ -15,13 +13,10 @@ export * from './src/EmptyStatePresentational' export * from './src/FilterBar' export * from './src/GlassPanel' export * from './src/InnerSideMenu' -export * from './src/McpUrlBuilder' export * from './src/MobileSheetNav' export * from './src/PageContainer' export * from './src/PageHeader' export * from './src/PageSection' -export * from './src/PopupFrame' -export * from './src/PromoToast' export * from './src/Row' export * from './src/ShimmeringLoader' export * from './src/StatusCode' diff --git a/packages/ui-patterns/package.json b/packages/ui-patterns/package.json index 3fc471fb16c..69f5049aae3 100644 --- a/packages/ui-patterns/package.json +++ b/packages/ui-patterns/package.json @@ -34,6 +34,10 @@ "import": "./src/AuthenticatedDropdownMenu/index.tsx", "types": "./src/AuthenticatedDropdownMenu/index.tsx" }, + "./Banners/Announcement": { + "import": "./src/Banners/Announcement.tsx", + "types": "./src/Banners/Announcement.tsx" + }, "./Banners/AnnouncementBanner": { "import": "./src/Banners/AnnouncementBanner.tsx", "types": "./src/Banners/AnnouncementBanner.tsx" @@ -62,6 +66,18 @@ "import": "./src/Chart/index.tsx", "types": "./src/Chart/index.tsx" }, + "./CodeBlock/CodeBlock": { + "import": "./src/CodeBlock/CodeBlock.tsx", + "types": "./src/CodeBlock/CodeBlock.tsx" + }, + "./CodeBlock/CodeBlock.utils": { + "import": "./src/CodeBlock/CodeBlock.utils.ts", + "types": "./src/CodeBlock/CodeBlock.utils.ts" + }, + "./CodeBlock": { + "import": "./src/CodeBlock/index.tsx", + "types": "./src/CodeBlock/index.tsx" + }, "./CommandMenu/api/Badges": { "import": "./src/CommandMenu/api/Badges.tsx", "types": "./src/CommandMenu/api/Badges.tsx" @@ -410,6 +426,18 @@ "import": "./src/IconPanel/index.tsx", "types": "./src/IconPanel/index.tsx" }, + "./Image/Image": { + "import": "./src/Image/Image.tsx", + "types": "./src/Image/Image.tsx" + }, + "./Image/ZoomContent": { + "import": "./src/Image/ZoomContent.tsx", + "types": "./src/Image/ZoomContent.tsx" + }, + "./Image": { + "import": "./src/Image/index.tsx", + "types": "./src/Image/index.tsx" + }, "./InnerSideMenu": { "import": "./src/InnerSideMenu/index.tsx", "types": "./src/InnerSideMenu/index.tsx" @@ -418,6 +446,10 @@ "import": "./src/LogsBarChart/index.tsx", "types": "./src/LogsBarChart/index.tsx" }, + "./Markdown": { + "import": "./src/Markdown/index.tsx", + "types": "./src/Markdown/index.tsx" + }, "./McpUrlBuilder/McpConfigPanel": { "import": "./src/McpUrlBuilder/McpConfigPanel.tsx", "types": "./src/McpUrlBuilder/McpConfigPanel.tsx" @@ -474,6 +506,14 @@ "import": "./src/McpUrlBuilder/utils/mcpIconAssets.ts", "types": "./src/McpUrlBuilder/utils/mcpIconAssets.ts" }, + "./Mermaid/Mermaid": { + "import": "./src/Mermaid/Mermaid.tsx", + "types": "./src/Mermaid/Mermaid.tsx" + }, + "./Mermaid": { + "import": "./src/Mermaid/index.tsx", + "types": "./src/Mermaid/index.tsx" + }, "./MetricCard": { "import": "./src/MetricCard/index.tsx", "types": "./src/MetricCard/index.tsx" @@ -566,6 +606,18 @@ "import": "./src/ShimmeringLoader/index.tsx", "types": "./src/ShimmeringLoader/index.tsx" }, + "./SimpleCodeBlock/SimpleCodeBlock": { + "import": "./src/SimpleCodeBlock/SimpleCodeBlock.tsx", + "types": "./src/SimpleCodeBlock/SimpleCodeBlock.tsx" + }, + "./SimpleCodeBlock": { + "import": "./src/SimpleCodeBlock/index.tsx", + "types": "./src/SimpleCodeBlock/index.tsx" + }, + "./SimpleCodeBlock/prism": { + "import": "./src/SimpleCodeBlock/prism.ts", + "types": "./src/SimpleCodeBlock/prism.ts" + }, "./SqlToRest/assumptions": { "import": "./src/SqlToRest/assumptions.ts", "types": "./src/SqlToRest/assumptions.ts" @@ -602,6 +654,10 @@ "import": "./src/StatusCode/index.tsx", "types": "./src/StatusCode/index.tsx" }, + "./TextLink": { + "import": "./src/TextLink/index.tsx", + "types": "./src/TextLink/index.tsx" + }, "./ThemeToggle": { "import": "./src/ThemeToggle.tsx", "types": "./src/ThemeToggle.tsx" @@ -725,13 +781,16 @@ "framer-motion": "^11.1.9", "github-slugger": "^2.0.0", "icons": "workspace:*", + "highlightjs-curl": "^1.3.0", "js-yaml": "^3.14.1", "lodash": "catalog:", "lucide-react": "*", + "mermaid": "^11.12.1", "mdast": "^3.0.0", "monaco-editor": "*", "next-themes": "*", "openai": "^4.75.1", + "prism-react-renderer": "^2.3.1", "react": "catalog:", "react-countdown": "^2.3.5", "react-dom": "catalog:", @@ -739,6 +798,7 @@ "react-hook-form": "^7.45.0", "react-intersection-observer": "^9.8.2", "react-markdown": "^9.0.1", + "react-medium-image-zoom": "^5.2.4", "react-syntax-highlighter": "^15.6.6", "react-use": "^17.5.0", "recharts": "catalog:", @@ -766,6 +826,7 @@ "@types/node": "catalog:", "@types/react": "catalog:", "@types/react-dom": "catalog:", + "@types/react-syntax-highlighter": "^15.5.13", "api-types": "workspace:*", "next-router-mock": "^0.9.13", "tsx": "catalog:", diff --git a/packages/ui/src/layout/banners/Announcement.tsx b/packages/ui-patterns/src/Banners/Announcement.tsx similarity index 95% rename from packages/ui/src/layout/banners/Announcement.tsx rename to packages/ui-patterns/src/Banners/Announcement.tsx index 97df6391683..95142b4f5cb 100644 --- a/packages/ui/src/layout/banners/Announcement.tsx +++ b/packages/ui-patterns/src/Banners/Announcement.tsx @@ -3,8 +3,7 @@ import { X } from 'lucide-react' import { usePathname } from 'next/navigation' import { PropsWithChildren, useEffect, useState } from 'react' - -import { cn } from '../../lib/utils/cn' +import { cn } from 'ui' export interface AnnouncementProps { show: boolean @@ -21,7 +20,7 @@ interface AnnouncementComponentProps { announcementKey: `announcement_${string}` } -const Announcement = ({ +export const Announcement = ({ show = true, dismissable = true, className, @@ -76,5 +75,3 @@ const Announcement = ({ ) } } - -export default Announcement diff --git a/packages/ui-patterns/src/Banners/AnnouncementBanner.tsx b/packages/ui-patterns/src/Banners/AnnouncementBanner.tsx index 120742c7632..e2386daad1a 100644 --- a/packages/ui-patterns/src/Banners/AnnouncementBanner.tsx +++ b/packages/ui-patterns/src/Banners/AnnouncementBanner.tsx @@ -1,5 +1,4 @@ -import { Announcement } from 'ui/src/layout/banners' - +import { Announcement } from './Announcement' import announcementJSON from './data.json' import LW15Banner from './LW15Banner' diff --git a/packages/ui/src/components/CodeBlock/CodeBlock.tsx b/packages/ui-patterns/src/CodeBlock/CodeBlock.tsx similarity index 98% rename from packages/ui/src/components/CodeBlock/CodeBlock.tsx rename to packages/ui-patterns/src/CodeBlock/CodeBlock.tsx index 9fd2068f014..84dba94b860 100644 --- a/packages/ui/src/components/CodeBlock/CodeBlock.tsx +++ b/packages/ui-patterns/src/CodeBlock/CodeBlock.tsx @@ -27,10 +27,8 @@ import swift from 'react-syntax-highlighter/dist/cjs/languages/hljs/swift' import ts from 'react-syntax-highlighter/dist/cjs/languages/hljs/typescript' import xml from 'react-syntax-highlighter/dist/cjs/languages/hljs/xml' import yaml from 'react-syntax-highlighter/dist/cjs/languages/hljs/yaml' +import { Button, cn, copyToClipboard } from 'ui' -import { copyToClipboard } from '../../lib/utils' -import { cn } from '../../lib/utils/cn' -import { Button } from '../Button/Button' import { monokaiCustomTheme } from './CodeBlock.utils' export type CodeBlockLang = diff --git a/packages/ui/src/components/CodeBlock/CodeBlock.utils.ts b/packages/ui-patterns/src/CodeBlock/CodeBlock.utils.ts similarity index 100% rename from packages/ui/src/components/CodeBlock/CodeBlock.utils.ts rename to packages/ui-patterns/src/CodeBlock/CodeBlock.utils.ts diff --git a/packages/ui/src/components/CodeBlock/index.tsx b/packages/ui-patterns/src/CodeBlock/index.tsx similarity index 100% rename from packages/ui/src/components/CodeBlock/index.tsx rename to packages/ui-patterns/src/CodeBlock/index.tsx diff --git a/packages/ui-patterns/src/CommandMenu/prepackaged/DocsAi/DocsAiPage.tsx b/packages/ui-patterns/src/CommandMenu/prepackaged/DocsAi/DocsAiPage.tsx index 876db8191e3..4c897f57463 100644 --- a/packages/ui-patterns/src/CommandMenu/prepackaged/DocsAi/DocsAiPage.tsx +++ b/packages/ui-patterns/src/CommandMenu/prepackaged/DocsAi/DocsAiPage.tsx @@ -12,8 +12,8 @@ import { CommandGroup_Shadcn_, CommandItem_Shadcn_, CommandList_Shadcn_, - markdownComponents, } from 'ui' +import { markdownComponents } from 'ui-patterns/Markdown' import { StatusIcon } from 'ui/src/components/StatusIcon' import { diff --git a/packages/ui/src/components/Image/Image.tsx b/packages/ui-patterns/src/Image/Image.tsx similarity index 95% rename from packages/ui/src/components/Image/Image.tsx rename to packages/ui-patterns/src/Image/Image.tsx index 0cf76b99f4e..44c9ef045aa 100644 --- a/packages/ui/src/components/Image/Image.tsx +++ b/packages/ui-patterns/src/Image/Image.tsx @@ -7,8 +7,8 @@ import { useTheme } from 'next-themes' import NextImage, { type ImageProps as NextImageProps } from 'next/image' import { useEffect, useState } from 'react' import Zoom from 'react-medium-image-zoom' +import { cn } from 'ui' -import { cn } from '../../lib/utils' import ZoomContent from './ZoomContent' export type CaptionAlign = 'left' | 'center' | 'right' @@ -49,7 +49,7 @@ export interface ImageProps extends Omit { * - captionAlign: {'left' | 'center' | 'right'} (optional) to align the caption * - containerClassName: {string} (optional) to style the parent
container */ -const Image = ({ src, alt = '', zoomable, ...props }: ImageProps) => { +export const Image = ({ src, alt = '', zoomable, ...props }: ImageProps) => { const [mounted, setMounted] = useState(false) const { resolvedTheme } = useTheme() const isLessThanLgBreakpoint = useBreakpoint() @@ -102,5 +102,3 @@ const getCaptionAlign = (align?: CaptionAlign) => { return 'text-center' } } - -export default Image diff --git a/packages/ui/src/components/Image/ZoomContent.tsx b/packages/ui-patterns/src/Image/ZoomContent.tsx similarity index 100% rename from packages/ui/src/components/Image/ZoomContent.tsx rename to packages/ui-patterns/src/Image/ZoomContent.tsx diff --git a/packages/ui-patterns/src/Image/index.tsx b/packages/ui-patterns/src/Image/index.tsx new file mode 100644 index 00000000000..d28c8bd778c --- /dev/null +++ b/packages/ui-patterns/src/Image/index.tsx @@ -0,0 +1 @@ +export { Image, type ImageProps } from './Image' diff --git a/packages/ui/src/lib/Markdown/index.tsx b/packages/ui-patterns/src/Markdown/index.tsx similarity index 84% rename from packages/ui/src/lib/Markdown/index.tsx rename to packages/ui-patterns/src/Markdown/index.tsx index 1ae80188bb3..3994fabf275 100644 --- a/packages/ui/src/lib/Markdown/index.tsx +++ b/packages/ui-patterns/src/Markdown/index.tsx @@ -1,9 +1,8 @@ 'use client' import Image from 'next/image' - -import { CodeBlock } from '../../components/CodeBlock/CodeBlock' -import { cn } from '../utils' +import { cn } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' const NextImageHandler = (props: any) => { return ( diff --git a/packages/ui-patterns/src/McpUrlBuilder/McpConfigPanel.tsx b/packages/ui-patterns/src/McpUrlBuilder/McpConfigPanel.tsx index ed0c2193ba9..0617e7ebff2 100644 --- a/packages/ui-patterns/src/McpUrlBuilder/McpConfigPanel.tsx +++ b/packages/ui-patterns/src/McpUrlBuilder/McpConfigPanel.tsx @@ -1,7 +1,8 @@ 'use client' import React, { useMemo, useState } from 'react' -import { cn, CodeBlock, Separator } from 'ui' +import { cn, Separator } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { InfoTooltip } from '../info-tooltip' import { ClientSelectDropdown } from './components/ClientSelectDropdown' diff --git a/packages/ui-patterns/src/McpUrlBuilder/components/McpConfigurationDisplay.tsx b/packages/ui-patterns/src/McpUrlBuilder/components/McpConfigurationDisplay.tsx index 7ef4e4bc0c5..c3b1fa1781e 100644 --- a/packages/ui-patterns/src/McpUrlBuilder/components/McpConfigurationDisplay.tsx +++ b/packages/ui-patterns/src/McpUrlBuilder/components/McpConfigurationDisplay.tsx @@ -5,7 +5,7 @@ import yaml from 'js-yaml' import { ExternalLink } from 'lucide-react' import Image from 'next/image' import { Button, cn } from 'ui' -import { CodeBlock, type CodeBlockLang } from 'ui/src/components/CodeBlock' +import { CodeBlock, type CodeBlockLang } from 'ui-patterns/CodeBlock' import type { McpClient, McpClientConfig, McpOnCopyCallback } from '../types' import { getMcpButtonData } from '../utils/getMcpButtonData' diff --git a/packages/ui-patterns/src/McpUrlBuilder/constants.tsx b/packages/ui-patterns/src/McpUrlBuilder/constants.tsx index f6b494652a9..ec98861fc94 100644 --- a/packages/ui-patterns/src/McpUrlBuilder/constants.tsx +++ b/packages/ui-patterns/src/McpUrlBuilder/constants.tsx @@ -1,4 +1,4 @@ -import { CodeBlock } from 'ui/src/components/CodeBlock' +import { CodeBlock } from 'ui-patterns/CodeBlock' import type { AntigravityMcpConfig, diff --git a/packages/ui/src/components/Mermaid/Mermaid.tsx b/packages/ui-patterns/src/Mermaid/Mermaid.tsx similarity index 99% rename from packages/ui/src/components/Mermaid/Mermaid.tsx rename to packages/ui-patterns/src/Mermaid/Mermaid.tsx index 7d63da7c1e7..4b55be44615 100644 --- a/packages/ui/src/components/Mermaid/Mermaid.tsx +++ b/packages/ui-patterns/src/Mermaid/Mermaid.tsx @@ -3,8 +3,7 @@ import mermaid from 'mermaid' import { useTheme } from 'next-themes' import { useEffect, useState } from 'react' - -import { cn } from '../../lib/utils/cn' +import { cn } from 'ui' // @mildtomato - 28/11/2025 // Colors are hardcoded because Mermaid's parser doesn't support CSS variables diff --git a/packages/ui/src/components/Mermaid/index.tsx b/packages/ui-patterns/src/Mermaid/index.tsx similarity index 100% rename from packages/ui/src/components/Mermaid/index.tsx rename to packages/ui-patterns/src/Mermaid/index.tsx diff --git a/packages/ui-patterns/src/MultipleCodeBlock/index.tsx b/packages/ui-patterns/src/MultipleCodeBlock/index.tsx index 19a75e25542..9e0223d7098 100644 --- a/packages/ui-patterns/src/MultipleCodeBlock/index.tsx +++ b/packages/ui-patterns/src/MultipleCodeBlock/index.tsx @@ -1,13 +1,6 @@ import { useEffect, useState } from 'react' - -import { - CodeBlock, - CodeBlockLang, - TabsContent_Shadcn_, - TabsList_Shadcn_, - TabsTrigger_Shadcn_, - Tabs_Shadcn_, -} from 'ui' +import { Tabs_Shadcn_, TabsContent_Shadcn_, TabsList_Shadcn_, TabsTrigger_Shadcn_ } from 'ui' +import { CodeBlock, type CodeBlockLang } from 'ui-patterns/CodeBlock' interface MultipleCodeBlockFile { name: string diff --git a/packages/ui/src/components/SimpleCodeBlock/SimpleCodeBlock.tsx b/packages/ui-patterns/src/SimpleCodeBlock/SimpleCodeBlock.tsx similarity index 96% rename from packages/ui/src/components/SimpleCodeBlock/SimpleCodeBlock.tsx rename to packages/ui-patterns/src/SimpleCodeBlock/SimpleCodeBlock.tsx index 3dfcc9bad24..8dcb1b1e3d5 100644 --- a/packages/ui/src/components/SimpleCodeBlock/SimpleCodeBlock.tsx +++ b/packages/ui-patterns/src/SimpleCodeBlock/SimpleCodeBlock.tsx @@ -9,10 +9,8 @@ import { useTheme } from 'next-themes' import { Highlight, Language, Prism, themes } from 'prism-react-renderer' import { createContext, PropsWithChildren, useContext, useEffect, useRef, useState } from 'react' +import { Button, cn, copyToClipboard } from 'ui' -import { copyToClipboard } from '../../lib/utils' -import { cn } from './../../lib/utils/cn' -import { Button } from './../Button' import { dart } from './prism' // Context for copy callback - can be provided by parent components diff --git a/packages/ui/src/components/SimpleCodeBlock/index.tsx b/packages/ui-patterns/src/SimpleCodeBlock/index.tsx similarity index 100% rename from packages/ui/src/components/SimpleCodeBlock/index.tsx rename to packages/ui-patterns/src/SimpleCodeBlock/index.tsx diff --git a/packages/ui/src/components/SimpleCodeBlock/prism.ts b/packages/ui-patterns/src/SimpleCodeBlock/prism.ts similarity index 100% rename from packages/ui/src/components/SimpleCodeBlock/prism.ts rename to packages/ui-patterns/src/SimpleCodeBlock/prism.ts diff --git a/packages/ui-patterns/src/SqlToRest/sql-to-rest.tsx b/packages/ui-patterns/src/SqlToRest/sql-to-rest.tsx index 6cea26d5f5e..e648130f397 100644 --- a/packages/ui-patterns/src/SqlToRest/sql-to-rest.tsx +++ b/packages/ui-patterns/src/SqlToRest/sql-to-rest.tsx @@ -28,8 +28,8 @@ import { } from 'react' import Markdown from 'react-markdown' import { format } from 'sql-formatter' -import { cn, CodeBlock, Collapsible, Tabs } from 'ui' -import { Alert } from 'ui/src/components/shadcn/ui/alert' +import { Alert_Shadcn_ as Alert, cn, Collapsible, Tabs } from 'ui' +import { CodeBlock } from 'ui-patterns/CodeBlock' import { assumptions } from './assumptions' import { BaseUrlDialog } from './base-url-dialog' diff --git a/packages/ui/src/components/TextLink/TextLink.tsx b/packages/ui-patterns/src/TextLink/index.tsx similarity index 94% rename from packages/ui/src/components/TextLink/TextLink.tsx rename to packages/ui-patterns/src/TextLink/index.tsx index 005d5d6a2ac..94be861b754 100644 --- a/packages/ui/src/components/TextLink/TextLink.tsx +++ b/packages/ui-patterns/src/TextLink/index.tsx @@ -2,8 +2,7 @@ import { ChevronRight } from 'lucide-react' import Link from 'next/link' - -import { cn } from '../../lib/utils/cn' +import { cn } from 'ui' interface Props { label: string @@ -15,7 +14,7 @@ interface Props { target?: '_blank' | '_self' } -function TextLink({ +export function TextLink({ url = '', label, className, @@ -57,5 +56,3 @@ function TextLink({ ) } - -export default TextLink diff --git a/packages/ui/index.tsx b/packages/ui/index.tsx index 850a633ea39..c746f000789 100644 --- a/packages/ui/index.tsx +++ b/packages/ui/index.tsx @@ -1,12 +1,7 @@ -// Markdown components - -export * from './src/lib/Markdown' - // GENERAL export * from './src/components/Button' export * from './src/components/Icon/IconBackground' -export * from './src/components/Image' // DISPLAYS @@ -15,9 +10,6 @@ export * from './src/components/Tabs' export * from './src/components/Alert' export * from './src/components/Accordion' export * from './src/components/Collapsible' -export * from './src/components/CodeBlock' -export * from './src/components/SimpleCodeBlock' -export * from './src/components/Mermaid' // NAV @@ -268,16 +260,9 @@ export * from './src/components/TreeView' export * from './src/components/shadcn/ui/chart' export * from './src/components/shadcn/ui/sidebar' -// links - -export * from './src/components/TextLink' - -// used for LW -export * from './src/layout/banners' - +// ICONS export * from './src/components/StatusIcon' -// ICONS // export icons export * from './src/components/Icon/icons/IconBriefcase2' export * from './src/components/Icon/icons/IconBroadcast' diff --git a/packages/ui/package.json b/packages/ui/package.json index a9c72b79dea..16c1fb1287d 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -56,13 +56,9 @@ "date-fns": "^2.30.0", "formik": "^2.2.9", "framer-motion": "^11.0.3", - "highlightjs-curl": "^1.3.0", "input-otp": "^1.2.3", "lodash": "catalog:", "lucide-react": "^0.436.0", - "mermaid": "^11.12.1", - "next-themes": "^0.3.0", - "prism-react-renderer": "^2.3.1", "prop-types": "^15.7.2", "react": "catalog:", "react-accessible-treeview": "^2.11.2", @@ -71,9 +67,7 @@ "react-dom": "catalog:", "react-hook-form": "^7.45.0", "react-intersection-observer": "^9.8.2", - "react-medium-image-zoom": "^5.2.4", "react-resizable-panels": "^4.6.5", - "react-syntax-highlighter": "^15.6.6", "recharts": "catalog:", "sonner": "^1.5.0", "tailwind-merge": "^1.13.2", @@ -89,9 +83,7 @@ "@types/react": "catalog:", "@types/react-copy-to-clipboard": "^5.0.4", "@types/react-dom": "catalog:", - "@types/react-syntax-highlighter": "^15.5.13", "@vitest/coverage-v8": "^3.2.0", - "common": "workspace:*", "config": "workspace:*", "glob": "^8.1.0", "style-dictionary": "^3.7.1", @@ -99,8 +91,5 @@ "typescript": "catalog:", "vite": "catalog:", "vitest": "catalog:" - }, - "peerDependencies": { - "next": "catalog:" } } diff --git a/packages/ui/src/components/Button/Button.test.tsx b/packages/ui/src/components/Button/Button.test.tsx index 0defd7a47ec..2e6f8d709f3 100644 --- a/packages/ui/src/components/Button/Button.test.tsx +++ b/packages/ui/src/components/Button/Button.test.tsx @@ -1,5 +1,4 @@ import { fireEvent, render, screen } from '@testing-library/react' -import Link from 'next/link' import React from 'react' import { describe, expect, it } from 'vitest' @@ -75,16 +74,6 @@ describe('#Button', () => { expect(screen.queryByRole('button')).toHaveClass('w-full') }) - it("shouldn't crash when wrapped with next/link", () => { - expect(() => - render( - - ) - ).not.toThrow() - }) - it('should forward ref', () => { const ref: React.MutableRefObject = { current: null, diff --git a/packages/ui/src/components/Image/index.tsx b/packages/ui/src/components/Image/index.tsx deleted file mode 100644 index 225e542fa1e..00000000000 --- a/packages/ui/src/components/Image/index.tsx +++ /dev/null @@ -1 +0,0 @@ -export { default as Image } from './Image' diff --git a/packages/ui/src/components/NavMenu/nav-menu.test.tsx b/packages/ui/src/components/NavMenu/nav-menu.test.tsx index 6c45ae91595..10bd5b04ebc 100644 --- a/packages/ui/src/components/NavMenu/nav-menu.test.tsx +++ b/packages/ui/src/components/NavMenu/nav-menu.test.tsx @@ -1,5 +1,4 @@ import { render, screen } from '@testing-library/react' -import Link from 'next/link' import React from 'react' import { describe, expect, it } from 'vitest' @@ -28,7 +27,7 @@ describe('NavMenu Component', () => { render( - Home + Home ) diff --git a/packages/ui/src/components/TextLink/index.ts b/packages/ui/src/components/TextLink/index.ts deleted file mode 100644 index 077167d986d..00000000000 --- a/packages/ui/src/components/TextLink/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default as TextLink } from './TextLink' diff --git a/packages/ui/src/components/shadcn/ui/sonner.tsx b/packages/ui/src/components/shadcn/ui/sonner.tsx index 72e45a8ff1b..e9fcb9e957c 100644 --- a/packages/ui/src/components/shadcn/ui/sonner.tsx +++ b/packages/ui/src/components/shadcn/ui/sonner.tsx @@ -1,6 +1,5 @@ 'use client' -import { useTheme } from 'next-themes' import { Toaster as Sonner } from 'sonner' import { cn } from '../../../lib/utils' @@ -9,11 +8,9 @@ import { StatusIcon } from './../../StatusIcon' export const SONNER_DEFAULT_DURATION = 4000 -type ToasterProps = React.ComponentProps +type ToasterProps = React.ComponentProps & { theme: 'light' | 'dark' | 'system' } const SonnerToaster = ({ toastOptions, ...props }: ToasterProps) => { - const { theme = 'system' } = useTheme() - return ( { error: , info: , }} - theme={theme as ToasterProps['theme']} // pointer-events-auto is needed to fix the toast when above radix modals. Set the width to 420px to fix the toast // progress component (bottom row rendered in two lines). className="toaster group pointer-events-auto" diff --git a/packages/ui/src/layout/banners/index.tsx b/packages/ui/src/layout/banners/index.tsx deleted file mode 100644 index 7785bf95411..00000000000 --- a/packages/ui/src/layout/banners/index.tsx +++ /dev/null @@ -1 +0,0 @@ -export { default as Announcement } from './Announcement' diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ddd710aa4be..99d5c74e2ee 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2483,9 +2483,6 @@ importers: framer-motion: specifier: ^11.0.3 version: 11.11.17(@emotion/is-prop-valid@1.2.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - highlightjs-curl: - specifier: ^1.3.0 - version: 1.3.0 input-otp: specifier: ^1.2.3 version: 1.2.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -2495,18 +2492,6 @@ importers: lucide-react: specifier: ^0.436.0 version: 0.436.0(react@18.3.1) - mermaid: - specifier: ^11.12.1 - version: 11.12.1(supports-color@8.1.1) - next: - specifier: 'catalog:' - version: 15.5.14(@babel/core@7.29.0(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.56.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4) - next-themes: - specifier: ^0.3.0 - version: 0.3.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - prism-react-renderer: - specifier: ^2.3.1 - version: 2.3.1(react@18.3.1) prop-types: specifier: ^15.7.2 version: 15.8.1 @@ -2531,15 +2516,9 @@ importers: react-intersection-observer: specifier: ^9.8.2 version: 9.8.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - react-medium-image-zoom: - specifier: ^5.2.4 - version: 5.2.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-resizable-panels: specifier: ^4.6.5 version: 4.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - react-syntax-highlighter: - specifier: ^15.6.6 - version: 15.6.6(react@18.3.1) recharts: specifier: 'catalog:' version: 2.15.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -2580,15 +2559,9 @@ importers: '@types/react-dom': specifier: 'catalog:' version: 18.3.0 - '@types/react-syntax-highlighter': - specifier: ^15.5.13 - version: 15.5.13 '@vitest/coverage-v8': specifier: ^3.2.0 version: 3.2.4(supports-color@8.1.1)(vitest@3.2.4) - common: - specifier: workspace:* - version: link:../common config: specifier: workspace:* version: link:../config @@ -2661,6 +2634,9 @@ importers: github-slugger: specifier: ^2.0.0 version: 2.0.0 + highlightjs-curl: + specifier: ^1.3.0 + version: 1.3.0 icons: specifier: workspace:* version: link:../icons @@ -2676,6 +2652,9 @@ importers: mdast: specifier: ^3.0.0 version: 3.0.0 + mermaid: + specifier: ^11.12.1 + version: 11.12.1(supports-color@8.1.1) monaco-editor: specifier: '*' version: 0.52.2 @@ -2688,6 +2667,9 @@ importers: openai: specifier: ^4.75.1 version: 4.104.0(encoding@0.1.13)(ws@8.19.0)(zod@3.25.76) + prism-react-renderer: + specifier: ^2.3.1 + version: 2.3.1(react@18.3.1) react: specifier: 'catalog:' version: 18.3.1 @@ -2709,6 +2691,9 @@ importers: react-markdown: specifier: ^9.0.1 version: 9.0.1(@types/react@18.3.3)(react@18.3.1)(supports-color@8.1.1) + react-medium-image-zoom: + specifier: ^5.2.4 + version: 5.2.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-syntax-highlighter: specifier: ^15.6.6 version: 15.6.6(react@18.3.1) @@ -2785,6 +2770,9 @@ importers: '@types/react-dom': specifier: 'catalog:' version: 18.3.0 + '@types/react-syntax-highlighter': + specifier: ^15.5.13 + version: 15.5.13 api-types: specifier: workspace:* version: link:../api-types @@ -9084,9 +9072,6 @@ packages: '@types/d3-interpolate@2.0.5': resolution: {integrity: sha512-UINE41RDaUMbulp+bxQMDnhOi51rh5lA2dG+dWZU0UY/IwQiG/u2x8TfnWYU9+xwGdXsJoAvrBYUEQl0r91atg==} - '@types/d3-interpolate@3.0.2': - resolution: {integrity: sha512-zAbCj9lTqW9J9PlF4FwnvEjXZUy75NQqPm7DMHZXuxCFTpuTrdK2NMYGQekf4hlasL78fCYOLu4EE3/tXElwow==} - '@types/d3-interpolate@3.0.4': resolution: {integrity: sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==} @@ -14669,9 +14654,6 @@ packages: ml-xsadd@3.0.1: resolution: {integrity: sha512-Fz2q6dwgzGM8wYKGArTUTZDGa4lQFA2Vi6orjGeTVRy22ZnQFKlJuwS9n8NRviqz1KHAHAzdKJwbnYhdo38uYg==} - mlly@1.8.0: - resolution: {integrity: sha512-l8D9ODSRWLe2KHJSifWGwBqpTZXIXTeo8mlKjY+E2HAakaTeNpqAyBZ8GSqLzHgw4XmHmC8whvpjJNMbFZN7/g==} - mlly@1.8.1: resolution: {integrity: sha512-SnL6sNutTwRWWR/vcmCYHSADjiEesp5TGQQ0pXyLhW5IoeibRlF/CbSLailbB3CNqJUk9cVJ9dUDnbD7GrcHBQ==} @@ -21456,7 +21438,7 @@ snapshots: globals: 15.15.0 kolorist: 1.8.0 local-pkg: 1.1.2 - mlly: 1.8.0 + mlly: 1.8.1 transitivePeerDependencies: - supports-color @@ -26769,10 +26751,6 @@ snapshots: dependencies: '@types/d3-color': 2.0.6 - '@types/d3-interpolate@3.0.2': - dependencies: - '@types/d3-color': 3.1.1 - '@types/d3-interpolate@3.0.4': dependencies: '@types/d3-color': 3.1.1 @@ -26841,7 +26819,7 @@ snapshots: '@types/d3-format': 3.0.4 '@types/d3-geo': 3.1.0 '@types/d3-hierarchy': 3.1.6 - '@types/d3-interpolate': 3.0.2 + '@types/d3-interpolate': 3.0.4 '@types/d3-path': 1.0.9 '@types/d3-polygon': 3.0.2 '@types/d3-quadtree': 3.0.6 @@ -33565,13 +33543,6 @@ snapshots: ml-xsadd@3.0.1: {} - mlly@1.8.0: - dependencies: - acorn: 8.16.0 - pathe: 2.0.3 - pkg-types: 1.3.1 - ufo: 1.6.3 - mlly@1.8.1: dependencies: acorn: 8.16.0 @@ -33825,7 +33796,7 @@ snapshots: chokidar: 5.0.0 citty: 0.1.6 compatx: 0.2.0 - confbox: 0.2.2 + confbox: 0.2.4 consola: 3.4.2 cookie-es: 2.0.0 croner: 9.1.0 @@ -34877,7 +34848,7 @@ snapshots: pkg-types@2.3.0: dependencies: - confbox: 0.2.2 + confbox: 0.2.4 exsolve: 1.0.8 pathe: 2.0.3