mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 18:05:11 +03:00
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Chore / build (ESLint config upgrade + lint cleanup). ## What is the current behavior? `eslint-plugin-react-hooks` v5 (pulled in transitively by `eslint-config-next` v15) doesn't recognize stable `useEffectEvent`, so every effect that calls an effect-event handler needs an `eslint-disable react-hooks/exhaustive-deps` to silence a false positive. There are 30 such dead disables across Studio. ## What is the new behavior? Bumps `eslint-config-next` to v16, which pulls in `eslint-plugin-react-hooks` v7 whose `exhaustive-deps` understands `useEffectEvent`, and removes the 30 now-dead disable directives (and their orphaned explanatory comments). Supporting changes: - **Flat-config migration**: v16 is a native flat-config array (v15 was eslintrc), so `eslint-config-supabase` now spreads it directly instead of bridging through `FlatCompat`. - **React Compiler rules off**: v16 enables react-hooks v7's `recommended`, which layers the React Compiler lint rules on top of the two classic rules. These are switched off (derived dynamically from what next enables) to keep this change scoped to the `exhaustive-deps` improvement. - **Plugin-registration fallout** (v16 scopes plugin registration to a file glob rather than registering globally like FlatCompat did): stop re-registering `@typescript-eslint` (shared) and `jsx-a11y` (studio); scope our react / react-hooks / jsx-a11y rule overrides (studio, www) to v16's plugin glob so they don't error on files outside it (e.g. `.cjs`). - **Lint surface preserved**: v16's glob newly includes `.mts`/`.cts` (v15 didn't lint them), which surfaced pre-existing errors in tooling scripts. The shared config keeps the prior surface by leaving `.mts`/`.cts` unlinted; linting them is left as a separate change. - **Ratchet**: rebaselines `@tanstack/query/exhaustive-deps` 9 → 89. v15 forced next's `@babel/eslint-parser` onto `.ts` files, hiding these deps; v16 parses `.ts` with `@typescript-eslint/parser` and correctly surfaces the intentional `connectionString`-excluded-from-`queryKey` pattern. Worth a follow-up to review whether any are real cache-correctness bugs. - Drops three now-dead devDeps from `eslint-config-supabase`: `@eslint/eslintrc`, `@eslint/js`, `@typescript-eslint/eslint-plugin`. Verified locally: `turbo run lint` → 7/7 packages pass with 0 errors; Studio `lint:ratchet` passes; Prettier clean on changed files; typecheck unaffected. ## Additional context <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Chores** * Refined linting configuration and removed outdated lint suppressions across Studio. * Updated Next.js linting support and refreshed related development configuration. * Expanded lint baseline coverage for query-related code. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
229 lines
7.0 KiB
TypeScript
229 lines
7.0 KiB
TypeScript
import { QueryClient, useQuery, useQueryClient } from '@tanstack/react-query'
|
|
import { useCallback } from 'react'
|
|
|
|
import { replicaKeys } from '../read-replicas/keys'
|
|
import { ReadReplicasData } from '../read-replicas/replicas-query'
|
|
import { projectKeys } from './keys'
|
|
import { OrgProjectsResponse } from './org-projects-infinite-query'
|
|
import { getProjectStatusOverride } from './project-status-override'
|
|
import type { components } from '@/data/api'
|
|
import { get, handleError, isValidConnString, post } from '@/data/fetchers'
|
|
import type { ResponseError, UseCustomQueryOptions } from '@/types'
|
|
|
|
type ProjectDetailVariables = { ref?: string; skipWake?: boolean }
|
|
export type ProjectDetail = components['schemas']['ProjectDetailResponse']
|
|
export interface Project extends Omit<ProjectDetail, 'status'> {
|
|
/**
|
|
* postgrestStatus is available on client side only.
|
|
* We use this status to check if a project instance is HEALTHY or not
|
|
* If not we will show ConnectingState and run a polling until it's back online
|
|
*/
|
|
postgrestStatus?: 'ONLINE' | 'OFFLINE'
|
|
status: ProjectDetail['status']
|
|
}
|
|
|
|
export async function getProjectDetail(
|
|
{ ref, skipWake = false }: ProjectDetailVariables,
|
|
signal?: AbortSignal,
|
|
headers?: Record<string, string>,
|
|
queryClient?: QueryClient
|
|
) {
|
|
if (!ref) throw new Error('Project ref is required')
|
|
|
|
const { data, error } = await get('/platform/projects/{ref}', {
|
|
params: { path: { ref } },
|
|
signal,
|
|
headers,
|
|
})
|
|
|
|
let connectionString = data?.connectionString
|
|
|
|
/**
|
|
* A project is marked as active but potentially hibernated and needs to be woken up (typically few seconds only).
|
|
* To prevent odd side effects like pg-meta queries failing or the likes, we wake up the project proactively and wait for it
|
|
* to be back online before returning the project details.
|
|
*/
|
|
if (data?.is_hibernating && !skipWake) {
|
|
// In case project was scaled down, explicitly wake it up before continuing to return the project details
|
|
const { error: errorWaking, data: wakeResponse } = await post('/platform/projects/{ref}/wake', {
|
|
params: { path: { ref } },
|
|
signal,
|
|
headers,
|
|
})
|
|
|
|
// We will still let the user load the page in case of a wake error, but log it for debugging purposes
|
|
if (errorWaking) {
|
|
console.error('Error waking up the project', { ref, errorWaking })
|
|
}
|
|
|
|
// As the instance IP has changed, we need to use the latest encrypted connection string
|
|
if (wakeResponse) {
|
|
connectionString = wakeResponse.connection_string
|
|
|
|
// If replicas were previously fetched, they will hold the old connection string that we need to replace
|
|
queryClient?.setQueryData<ReadReplicasData>(replicaKeys.list(ref), (old) => {
|
|
if (!old) return old
|
|
|
|
return old.map((db) => {
|
|
if (db.identifier === ref) {
|
|
return {
|
|
...db,
|
|
connectionString: wakeResponse.connection_string,
|
|
connection_string_read_only: wakeResponse.connection_string_read_only,
|
|
}
|
|
}
|
|
return db
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
if (error) handleError(error)
|
|
|
|
const project = { ...data, connectionString: connectionString } as Project
|
|
|
|
const statusOverride = getProjectStatusOverride(ref)
|
|
if (statusOverride) project.status = statusOverride
|
|
|
|
return project
|
|
}
|
|
|
|
export type ProjectDetailData = Awaited<ReturnType<typeof getProjectDetail>>
|
|
export type ProjectDetailError = ResponseError
|
|
|
|
export const useProjectDetailQuery = <TData = ProjectDetailData>(
|
|
{ ref }: ProjectDetailVariables,
|
|
{
|
|
enabled = true,
|
|
...options
|
|
}: UseCustomQueryOptions<ProjectDetailData, ProjectDetailError, TData> = {}
|
|
) => {
|
|
const queryClient = useQueryClient()
|
|
|
|
return useQuery<ProjectDetailData, ProjectDetailError, TData>({
|
|
queryKey: projectKeys.detail(ref),
|
|
queryFn: ({ signal }) => getProjectDetail({ ref }, signal, undefined, queryClient),
|
|
enabled: enabled && typeof ref !== 'undefined',
|
|
staleTime: 30 * 1000,
|
|
refetchInterval: (query) => {
|
|
const data = query.state.data
|
|
const status = data && data.status
|
|
const connectionString = data && data.connectionString
|
|
|
|
if (status === 'COMING_UP' || status === 'UNKNOWN' || !isValidConnString(connectionString)) {
|
|
return 5 * 1000 // 5 seconds
|
|
}
|
|
|
|
return false
|
|
},
|
|
|
|
...options,
|
|
})
|
|
}
|
|
|
|
export function prefetchProjectDetail(client: QueryClient, { ref }: ProjectDetailVariables) {
|
|
return client.fetchQuery({
|
|
queryKey: projectKeys.detail(ref),
|
|
queryFn: ({ client, signal }) =>
|
|
getProjectDetail({ ref, skipWake: true }, signal, undefined, client),
|
|
})
|
|
}
|
|
|
|
export const useInvalidateProjectDetailsQuery = () => {
|
|
const queryClient = useQueryClient()
|
|
|
|
const invalidateProjectDetailsQuery = useCallback(
|
|
(ref: string) => {
|
|
return queryClient.invalidateQueries({ queryKey: projectKeys.detail(ref) })
|
|
},
|
|
[queryClient]
|
|
)
|
|
|
|
return { invalidateProjectDetailsQuery }
|
|
}
|
|
|
|
export const useSetProjectPostgrestStatus = () => {
|
|
const queryClient = useQueryClient()
|
|
|
|
const setProjectPostgrestStatus = (ref: Project['ref'], status: Project['postgrestStatus']) => {
|
|
return queryClient.setQueriesData<Project>(
|
|
{ queryKey: projectKeys.detail(ref) },
|
|
(old) => {
|
|
if (!old) return old
|
|
return { ...old, postgrestStatus: status }
|
|
},
|
|
{ updatedAt: Date.now() }
|
|
)
|
|
}
|
|
|
|
return { setProjectPostgrestStatus }
|
|
}
|
|
|
|
export const useSetProjectStatus = () => {
|
|
const queryClient = useQueryClient()
|
|
|
|
const setProjectStatus = ({
|
|
ref,
|
|
slug,
|
|
status,
|
|
}: {
|
|
ref: Project['ref']
|
|
slug?: string
|
|
status: Project['status']
|
|
}) => {
|
|
// Org projects infinite query
|
|
if (slug) {
|
|
queryClient.setQueriesData<{ pages: OrgProjectsResponse[] } | undefined>(
|
|
{ queryKey: projectKeys.infiniteListByOrg(slug) },
|
|
(old) => {
|
|
if (!old) return old
|
|
return {
|
|
...old,
|
|
pages: old.pages.map((page) => {
|
|
return {
|
|
...page,
|
|
projects: page.projects.map((project) =>
|
|
project.ref === ref ? { ...project, status } : project
|
|
),
|
|
}
|
|
}),
|
|
}
|
|
},
|
|
{ updatedAt: Date.now() }
|
|
)
|
|
}
|
|
|
|
// Projects infinite query
|
|
queryClient.setQueriesData<{ pages: OrgProjectsResponse[] } | undefined>(
|
|
{ queryKey: projectKeys.infiniteList() },
|
|
(old) => {
|
|
if (!old) return old
|
|
return {
|
|
...old,
|
|
pages: old.pages.map((page) => {
|
|
return {
|
|
...page,
|
|
projects: page.projects.map((project) =>
|
|
project.ref === ref ? { ...project, status } : project
|
|
),
|
|
}
|
|
}),
|
|
}
|
|
},
|
|
{ updatedAt: Date.now() }
|
|
)
|
|
|
|
// Project details query
|
|
queryClient.setQueriesData<Project>(
|
|
{ queryKey: projectKeys.detail(ref) },
|
|
(old) => {
|
|
if (!old) return old
|
|
return { ...old, status }
|
|
},
|
|
{ updatedAt: Date.now() }
|
|
)
|
|
}
|
|
|
|
return { setProjectStatus }
|
|
}
|