@sanity/sdk-react 0.0.0-alpha.4 → 0.0.0-alpha.5

package/src/components/Login/LoginLinks.test.tsx

@@ -1,91 +0,0 @@
-import {AuthStateType, createSanityInstance} from '@sanity/sdk'
-import {SanityProvider} from '@sanity/sdk-react/context'
-import {useAuthState, useLoginUrls} from '@sanity/sdk-react/hooks'
-import {render, screen} from '@testing-library/react'
-import React from 'react'
-import {beforeEach, describe, expect, it, vi} from 'vitest'
-
-import {LoginLinks} from './LoginLinks'
-
-// Mock the hooks and SDK functions
-vi.mock('../../hooks/auth/useLoginUrls', () => ({
-  useLoginUrls: vi.fn(() => [
-    {
-      name: 'google',
-      title: 'Google',
-      url: 'https://google.com/auth',
-    },
-    {
-      name: 'github',
-      title: 'GitHub',
-      url: 'https://github.com/auth',
-    },
-  ]),
-}))
-vi.mock('@sanity/sdk', async () => {
-  const actual = await vi.importActual('@sanity/sdk')
-
-  return {
-    ...actual,
-    tradeTokenForSession: vi.fn(),
-    getSidUrlHash: vi.fn().mockReturnValue(null),
-    getSidUrlSearch: vi.fn(),
-  }
-})
-
-vi.mock('../../hooks/auth/useAuthState', () => ({
-  useAuthState: vi.fn(() => 'logged-out'),
-}))
-
-vi.mock('../../hooks/auth/useHandleCallback', () => ({
-  useHandleCallback: vi.fn(),
-}))
-
-describe('LoginLinks', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-  })
-
-  const sanityInstance = createSanityInstance({projectId: 'test-project-id', dataset: 'production'})
-  const renderWithWrappers = (ui: React.ReactElement) => {
-    return render(<SanityProvider sanityInstance={sanityInstance}>{ui}</SanityProvider>)
-  }
-
-  it('renders auth provider links correctly when not authenticated', () => {
-    vi.mocked(useAuthState).mockReturnValue({
-      type: AuthStateType.LOGGED_OUT,
-      isDestroyingSession: false,
-    })
-    renderWithWrappers(<LoginLinks />)
-
-    expect(screen.getByText('Choose login provider')).toBeInTheDocument()
-
-    const authProviders = useLoginUrls()
-    authProviders.forEach((provider) => {
-      const button = screen.getByRole('link', {name: provider.title})
-      expect(button).toBeInTheDocument()
-      expect(button).toHaveAttribute('href', provider.url)
-    })
-  })
-
-  it('shows loading state while logging in', () => {
-    vi.mocked(useAuthState).mockReturnValue({
-      type: AuthStateType.LOGGING_IN,
-      isExchangingToken: false,
-    })
-    renderWithWrappers(<LoginLinks />)
-
-    expect(screen.getByText('Logging in...')).toBeInTheDocument()
-  })
-
-  it('shows success message when logged in', () => {
-    vi.mocked(useAuthState).mockReturnValue({
-      type: AuthStateType.LOGGED_IN,
-      token: 'test-token',
-      currentUser: null,
-    })
-    renderWithWrappers(<LoginLinks />)
-
-    expect(screen.getByText('You are logged in')).toBeInTheDocument()
-  })
-})

package/src/components/Login/LoginLinks.tsx

@@ -1,58 +0,0 @@
-import {type ReactElement} from 'react'
-
-import {useAuthState} from '../../hooks/auth/useAuthState'
-import {useHandleCallback} from '../../hooks/auth/useHandleCallback'
-import {useLoginUrls} from '../../hooks/auth/useLoginUrls'
-
-/**
- * Component that handles Sanity authentication flow and renders login provider options
- *
- * @public
- *
- * @returns Rendered component
- *
- * @remarks
- * The component handles three states:
- * 1. Loading state during token exchange
- * 2. Success state after successful authentication
- * 3. Provider selection UI when not authenticated
- *
- * @example
- * ```tsx
- * const config = { projectId: 'your-project-id', dataset: 'production' }
- * return <LoginLinks sanityInstance={config} />
- * ```
- */
-export const LoginLinks = (): ReactElement => {
-  const loginUrls = useLoginUrls()
-  const authState = useAuthState()
-  useHandleCallback()
-
-  if (authState.type === 'logging-in') {
-    return <div className="sc-login-links__logging-in">Logging in...</div>
-  }
-
-  // Show success state after authentication
-  if (authState.type === 'logged-in') {
-    return <div className="sc-login-links__logged-in">You are logged in</div>
-  }
-
-  /**
-   * Render provider selection UI
-   */
-  return (
-    <div className="sc-login-links">
-      <h2 className="sc-login-links__title">Choose login provider</h2>
-
-      <ul className="sc-login-links__list">
-        {loginUrls.map((provider, index) => (
-          <li key={`${provider.url}_${index}`} className="sc-login-links__item">
-            <a href={provider.url} className="sc-login-links__link">
-              {provider.title}
-            </a>
-          </li>
-        ))}
-      </ul>
-    </div>
-  )
-}