chore: increase react-query stale time (supabase#19465)

* chore: increase react-query stale time * keep staleTime: 0 for table rows * use staleTime: 0 for all user sql queries * use staleTime: 0 for all pg-meta queries * Some fixes * fix updating tables * fix bug while editing column names * Fix deleting column in database/tables column list not revalidating UI * Fix updating column in database/tables column list throwing ane rror --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

Author: alaister

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/SidePanelEditor.tsx

@@ -209,8 +209,8 @@ const SidePanelEditor = ({
  resolve: any
  ) => {
  const selectedColumnToEdit = snap.sidePanel?.type === 'column' && snap.sidePanel.column
-
  const { columnId } = configuration
+
  const response = isNewRecord
  ? await createColumn({
  projectRef: project?.ref!,

apps/studio/data/auth/auth-config-update-mutation.ts

@@ -45,9 +45,7 @@ export const useAuthConfigUpdateMutation = ({
  {
  async onSuccess(data, variables, context) {
  const { projectRef } = variables
-
- await Promise.all([queryClient.invalidateQueries(authKeys.authConfig(projectRef))])
-
+ await queryClient.invalidateQueries(authKeys.authConfig(projectRef))
  await onSuccess?.(data, variables, context)
  },
  async onError(data, variables, context) {

apps/studio/data/auth/user-create-mutation.ts

@@ -72,7 +72,7 @@ export const useUserCreateMutation = ({
  {
  async onSuccess(data, variables, context) {
  const { projectRef } = variables
- if (projectRef) await queryClient.invalidateQueries(authKeys.users(projectRef))
+ await queryClient.invalidateQueries(authKeys.users(projectRef))
  await onSuccess?.(data, variables, context)
  },
  async onError(data, variables, context) {

apps/studio/data/banned-ips/banned-ips-delete-mutations.ts

@@ -35,12 +35,9 @@ export const useBannedIPsDeleteMutation = ({
  (vars) => deleteBannedIPs(vars),
  {
  async onSuccess(data, variables, context) {
- const { projectRef, ips } = variables
+ const { projectRef } = variables
 
- await Promise.all([
- queryClient.invalidateQueries(BannedIPKeys.list(projectRef)),
- queryClient.invalidateQueries(BannedIPKeys.detail(ips)),
- ])
+ await queryClient.invalidateQueries(BannedIPKeys.list(projectRef))
 
  await onSuccess?.(data, variables, context)
  },

apps/studio/data/banned-ips/keys.ts

@@ -1,4 +1,3 @@
 export const BannedIPKeys = {
  list: (projectRef: string | undefined) => ['projects', projectRef, 'banned-ips'] as const,
- detail: (ips: string[] | undefined) => ['banned-ips', ips] as const,
 }

apps/studio/data/content/content-delete-mutation.ts

@@ -41,7 +41,7 @@ export const useContentDeleteMutation = ({
  {
  async onSuccess(data, variables, context) {
  const { projectRef } = variables
- await Promise.all([queryClient.invalidateQueries(contentKeys.list(projectRef))])
+ await queryClient.invalidateQueries(contentKeys.list(projectRef))
  await onSuccess?.(data, variables, context)
  },
  async onError(data, variables, context) {

apps/studio/data/content/content-insert-mutation.ts

@@ -1,7 +1,9 @@
 import { useMutation, UseMutationOptions, useQueryClient } from '@tanstack/react-query'
+import toast from 'react-hot-toast'
 
 import { components } from 'data/api'
 import { post } from 'data/fetchers'
+import { ResponseError } from 'types'
 import { Content } from './content-query'
 import { contentKeys } from './keys'
 
@@ -39,24 +41,30 @@ export async function insertContent(
 export type InsertContentData = Awaited<ReturnType<typeof insertContent>>
 
 export const useContentInsertMutation = ({
+ onError,
  onSuccess,
  ...options
 }: Omit<
- UseMutationOptions<InsertContentData, unknown, InsertContentVariables>,
+ UseMutationOptions<InsertContentData, ResponseError, InsertContentVariables>,
  'mutationFn'
 > = {}) => {
  const queryClient = useQueryClient()
 
- return useMutation<InsertContentData, unknown, InsertContentVariables>(
+ return useMutation<InsertContentData, ResponseError, InsertContentVariables>(
  (args) => insertContent(args),
  {
  async onSuccess(data, variables, context) {
  const { projectRef } = variables
-
- await Promise.all([queryClient.invalidateQueries(contentKeys.list(projectRef))])
-
+ await queryClient.invalidateQueries(contentKeys.list(projectRef))
  await onSuccess?.(data, variables, context)
  },
+ async onError(data, variables, context) {
+ if (onError === undefined) {
+ toast.error(`Failed to insert content: ${data.message}`)
+ } else {
+ onError(data, variables, context)
+ }
+ },
  ...options,
  }
  )

apps/studio/data/content/content-upsert-mutation.ts

@@ -1,9 +1,11 @@
 import { useMutation, UseMutationOptions, useQueryClient } from '@tanstack/react-query'
+import toast from 'react-hot-toast'
 
 import { components } from 'data/api'
 import { put } from 'data/fetchers'
-import { contentKeys } from './keys'
+import { ResponseError } from 'types'
 import { Content } from './content-query'
+import { contentKeys } from './keys'
 
 export type UpsertContentPayload = Omit<components['schemas']['UpsertContentParams'], 'content'> & {
  content: Content['content']
@@ -41,24 +43,30 @@ export async function upsertContent(
 export type UpsertContentData = Awaited<ReturnType<typeof upsertContent>>
 
 export const useContentUpsertMutation = ({
+ onError,
  onSuccess,
  ...options
 }: Omit<
- UseMutationOptions<UpsertContentData, unknown, UpsertContentVariables>,
+ UseMutationOptions<UpsertContentData, ResponseError, UpsertContentVariables>,
  'mutationFn'
 > = {}) => {
  const queryClient = useQueryClient()
 
- return useMutation<UpsertContentData, unknown, UpsertContentVariables>(
+ return useMutation<UpsertContentData, ResponseError, UpsertContentVariables>(
  (args) => upsertContent(args),
  {
  async onSuccess(data, variables, context) {
  const { projectRef } = variables
-
- await Promise.all([queryClient.invalidateQueries(contentKeys.list(projectRef))])
-
+ await queryClient.invalidateQueries(contentKeys.list(projectRef))
  await onSuccess?.(data, variables, context)
  },
+ async onError(data, variables, context) {
+ if (onError === undefined) {
+ toast.error(`Failed to insert content: ${data.message}`)
+ } else {
+ onError(data, variables, context)
+ }
+ },
  ...options,
  }
  )

apps/studio/data/database-triggers/database-triggers-query.ts

@@ -42,6 +42,7 @@ export const useDatabaseHooksQuery = <TData = DatabaseTriggersData>(
  databaseTriggerKeys.list(projectRef),
  ({ signal }) => getDatabaseTriggers({ projectRef, connectionString }, signal),
  {
+ staleTime: 0,
  // @ts-ignore
  select(data) {
  return (data as PostgresTrigger[]).filter(

apps/studio/data/database/hooks-enable-mutation.ts

@@ -1,8 +1,9 @@
-import { useMutation, UseMutationOptions } from '@tanstack/react-query'
+import { useMutation, UseMutationOptions, useQueryClient } from '@tanstack/react-query'
 import { toast } from 'react-hot-toast'
 
 import { post } from 'data/fetchers'
 import { ResponseError } from 'types'
+import { databaseKeys } from './keys'
 
 export type HooksEnableVariables = {
  ref: string
@@ -26,11 +27,14 @@ export const useHooksEnableMutation = ({
  UseMutationOptions<HooksEnableData, ResponseError, HooksEnableVariables>,
  'mutationFn'
 > = {}) => {
+ const queryClient = useQueryClient()
  return useMutation<HooksEnableData, ResponseError, HooksEnableVariables>(
  (vars) => enableDatabaseWebhooks(vars),
  {
  async onSuccess(data, variables, context) {
+ const { ref } = variables
  await onSuccess?.(data, variables, context)
+ await queryClient.invalidateQueries(databaseKeys.schemaList(ref))
  },
  async onError(data, variables, context) {
  if (onError === undefined) {