Проблемы с react & tanstack query

Нужно проверить в Базе Данных, что пользователя нет с таким telegram_id. Если нет создать и показать ему его места. Если есть сразу показать его места. У меня идет бесконечное создание пользователя

import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"
import axios from "axios"
import { useState } from "react"

export function App() {
  const [IdTelegramApp, setIdTelegramApp] = useState<number | undefined>(
    undefined
  )
  const [telegram_username, setTelegram_username] = useState<
    string | undefined
  >(undefined)

  interface TelegramUser {
    id?: number
    telegram_user_id: number
    username: string
  }

  interface Place {
    id?: number
    name: string
    web_app_user_id: number
  }

  const queryClient = useQueryClient()

  const TelegramUserData = useQuery({
    queryKey: ["telegram", IdTelegramApp],
    queryFn: async () => {
      if (IdTelegramApp === undefined) return []

      const response = await axios.get<TelegramUser[]>(
        `webAppUsers/?telegram_user_id=${IdTelegramApp}`
      )
      return response.data
    },
  })

  const PlaceData = useQuery({
    queryKey: ["places", IdTelegramApp],
    queryFn: async () => {
      if (IdTelegramApp === undefined) {
        return []
      }

      const response = await axios.get<Place[]>(
        `places/?web_app_user_id=${IdTelegramApp}`
      )
      return response.data
    },
  })

  const mutationTelegram = useMutation({
    mutationFn: (data: TelegramUser) => axios.post(`webAppUsers/`, data),
    onSuccess: () => {
      queryClient.invalidateQueries({ queryKey: ["telegram", "places"] })
    },
  })

  return (
    <>
      <button onClick={() => setIdTelegramApp(123)}>telegram user add</button>
      <button onClick={() => setTelegram_username("temp")}>
        telegram_username
      </button>

      {!TelegramUserData && IdTelegramApp ? (
        <div>
          Пользователь найден показываем список его мест:
          {PlaceData?.data?.map((place) => (
            <p>{place.name}</p>
          ))}
        </div>
      ) : (
        mutationTelegram.mutate({
          telegram_user_id: IdTelegramApp!,
          username: telegram_username ?? "",
        })
      )}
    </>
  )
}

export default App

Ответы (0 шт):