not able to get the types on errors and doRequest

import classes from "./auth-form.module.css";
import { useState } from "react";
import useRequest from "../../hooks/use-request";

const AuthForm = () => {
  const [email, setEmail] = useState<string>("");
  const [password, setPassword] = useState<string>("");
  const { doRequest, errors } = useRequest({
    url: "/api/users/signup",
    method: "post",
    body: {
      email,
      password,
    },
  });

here's use-request file

import axios from "axios";
import React, { ReactElement, useState } from "react";
import classes from "../components/errors/errors.module.css";

interface UseRequestProps {
  url: string;
  method: "post" | "get" | "put" | "delete";
  body?: any;
  onSuccess?: () => void;
}

const useRequest: React.FC<UseRequestProps> = ({ url, method, body }) => {
  const [errors, setErrors] = useState<null | ReactElement>(null);

  const doRequest = async () => {
    try {
      }
    }
  };

useRequest has this type error

"message": "Type '({ url, method, body }: UseRequestProps) => { doRequest: () => Promise; errors: ReactElement<any, string | JSXElementConstructor> | null; }' is not assignable to type 'FC'.\n Type '{ doRequest: () => Promise; errors: ReactElement<any, string | JSXElementConstructor> | null; }' is missing the following properties from type

CodePudding user response：

Need to return the variable and function from the custom hook and remove the React.FC type

const useRequest = ({ url, method, body } : UseRequestProps) => {
  const [errors, setErrors] = useState<null | ReactElement>(null);

  const doRequest = async () => {
    try {
      }
    }
  };
 
  return {error, doRequest}

 }