mirror of
https://github.com/supabase/supabase.git
synced 2026-09-11 12:28:45 +08:00
43c2229f1e
## What kind of change does this PR introduce?
Bug fix / UI polish
## What is the current behavior?
Visiting `/authorize` without an `auth_id` renders a bare `Card` outside
the shared Connect interstitial — no centered layout, no Supabase logo,
inconsistent with every other `/authorize` state (loading, error, form,
approved).
Two edge cases also produce poor UX: a blank flash while
`router.isReady` is false, and a silent empty page when the
authorization query succeeds but returns no requester.
## What is the new behavior?
- **Missing `auth_id`**: `ApiAuthorizationInvalidScreen` now uses
`InterstitialLayout` with `SupabaseLogo`, a user-facing title ("Missing
authorization link"), warning admonition, and "Back to dashboard" —
matching the error screen and CLI missing-params pattern.
- **Router not ready**: `authorize.tsx` shows
`ApiAuthorizationLoadingScreen` instead of `null`.
- **Empty requester**: `ApiAuthorization.Valid.tsx` renders
`ApiAuthorizationErrorScreen` instead of returning `null`.
Tests updated in `ApiAuthorization.test.tsx`; added `authorize.test.tsx`
for router-not-ready loading.
| Before | After |
| --- | --- |
| <img width="524" height="455" alt="Authorize API Access
Supabase-DCB404EC-7D65-4DD1-A6E0-B720DC765DA7"
src="https://github.com/user-attachments/assets/8d2b68fc-e008-4145-aa74-3154a883083c"
/> | <img width="524" height="455" alt="Authorize API Access
Supabase-6B642066-D0BE-4EDC-A186-A0290B4B5634"
src="https://github.com/user-attachments/assets/b04bee93-6b23-411f-8e36-9a0fff8a975d"
/> |
## To test
Please do a visual check on `http://localhost:8082/authorize` (no
`auth_id` or other parameters).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Improved the UI and copy shown when the authorization link is missing.
* Updated behavior to show an explicit error screen when authorization
requester data is unavailable.
* **New Features**
* Added a loading state for the authorization page while router
parameters are initializing.
* **Tests**
* Updated component expectations for the missing authorization and
“unable to load” scenarios.
* Added a page test to verify the loading message when the router is not
ready.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Cursor <cursoragent@cursor.com>
51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import { screen } from '@testing-library/react'
|
|
import { describe, expect, test, vi } from 'vitest'
|
|
|
|
import type { ProfileContextType } from '@/lib/profile'
|
|
import APIAuthorizationPage from '@/pages/authorize'
|
|
import { customRender } from '@/tests/lib/custom-render'
|
|
|
|
vi.mock('@/hooks/misc/withAuth', () => ({
|
|
withAuth: (Component: React.ComponentType) => Component,
|
|
}))
|
|
|
|
const routerPushMock = vi.fn()
|
|
|
|
vi.mock('next/router', () => ({
|
|
useRouter: () => ({
|
|
isReady: false,
|
|
push: routerPushMock,
|
|
query: {},
|
|
}),
|
|
}))
|
|
|
|
const DEFAULT_PROFILE_CONTEXT: ProfileContextType = {
|
|
profile: {
|
|
id: 1,
|
|
auth0_id: 'auth0|test',
|
|
gotrue_id: 'gotrue-test',
|
|
username: 'testuser',
|
|
primary_email: 'test@example.com',
|
|
first_name: null,
|
|
last_name: null,
|
|
mobile: null,
|
|
is_alpha_user: false,
|
|
is_sso_user: false,
|
|
disabled_features: [],
|
|
free_project_limit: null,
|
|
},
|
|
error: null,
|
|
isLoading: false,
|
|
isError: false,
|
|
isSuccess: true,
|
|
}
|
|
|
|
describe('APIAuthorizationPage', () => {
|
|
test('renders loading interstitial while router is not ready', () => {
|
|
customRender(<APIAuthorizationPage dehydratedState={{}} />, {
|
|
profileContext: DEFAULT_PROFILE_CONTEXT,
|
|
})
|
|
expect(screen.getByText('Loading...')).toBeInTheDocument()
|
|
})
|
|
})
|