mirror of
https://github.com/supabase/supabase.git
synced 2026-10-09 03:15:06 +03:00
<img width="2892" height="2342" alt="image" src="https://github.com/user-attachments/assets/7e08929d-abc3-4397-b89d-99cc52d8190e" /> This is the third and final PR to complete the new connect sheet. First: https://github.com/supabase/supabase/pull/42367 Second: https://github.com/supabase/supabase/pull/42373 This re-adds the Direct, ORM, MCP tabs and their content, including via connect.schema. To test: - Flag will be enabled on all staging projects - Click connect and notice new Sheet - Click all tabs and ensure content is correct <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Multi-mode connection flow with mode selector and icons (framework, direct DB, ORM, MCP) * New framework/variant/library selector, richer connection guides and install steps (Prisma, Drizzle, direct) * MCP onboarding flows (Cursor, Codex, Claude Code) with server/auth commands and configuration UIs * **Refactor** * Connect schema and state rebuilt to be mode-driven with improved step resolution and cascading state updates * **Tests** * Expanded unit tests covering framework resolution, connect flows, and mode behaviors * **Chores** * ESLint ignores updated for content files <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
224 lines
6.1 KiB
TypeScript
224 lines
6.1 KiB
TypeScript
import { describe, test, expect } from 'vitest'
|
|
import { resolveFrameworkLibraryKey } from './Connect.utils'
|
|
|
|
describe('Connect.utils:resolveFrameworkLibraryKey', () => {
|
|
test('should return null if no framework provided', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: undefined,
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBeNull()
|
|
})
|
|
|
|
test('should return null for empty framework string', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: '',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBeNull()
|
|
})
|
|
|
|
test('should return explicit library if provided', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'nextjs',
|
|
frameworkVariant: 'app',
|
|
library: 'custom-library',
|
|
})
|
|
expect(result).toBe('custom-library')
|
|
})
|
|
|
|
test('should resolve library for Next.js App Router', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'nextjs',
|
|
frameworkVariant: 'app',
|
|
library: undefined,
|
|
})
|
|
// Next.js App Router has supabasejs as its library
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should resolve library for Next.js Pages Router', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'nextjs',
|
|
frameworkVariant: 'pages',
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should resolve library for React with Vite variant', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'react',
|
|
frameworkVariant: 'vite',
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should resolve library for React with Create React App variant', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'react',
|
|
frameworkVariant: 'create-react-app',
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should resolve library for framework without variants (Remix)', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'remix',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
// Remix has single child which is supabasejs
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should resolve library for Flutter', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'flutter',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabaseflutter')
|
|
})
|
|
|
|
test('should resolve library for Swift', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'swift',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabaseswift')
|
|
})
|
|
|
|
test('should resolve library for Android Kotlin', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'androidkotlin',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasekt')
|
|
})
|
|
|
|
test('should resolve library for Flask (Python)', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'flask',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasepy')
|
|
})
|
|
|
|
test('should fallback to first variant library when variant not specified for multi-variant framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'nextjs',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
// Should get library from first variant (app router)
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should return null for unknown framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'unknown-framework',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBeNull()
|
|
})
|
|
|
|
test('should handle SvelteKit framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'sveltekit',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Nuxt framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'nuxt',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Vue.js framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'vuejs',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Solid.js framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'solidjs',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Astro framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'astro',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Expo React Native', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'exporeactnative',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Ionic React', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'ionicreact',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Ionic Angular', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'ionicangular',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle Refine framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'refine',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
|
|
test('should handle TanStack Start framework', () => {
|
|
const result = resolveFrameworkLibraryKey({
|
|
framework: 'tanstack',
|
|
frameworkVariant: undefined,
|
|
library: undefined,
|
|
})
|
|
expect(result).toBe('supabasejs')
|
|
})
|
|
})
|