why i got an error in my handleClick async function?

i tried to add the display_1 and diplay_2 in my mutation variables and tried to console.log it but the output is (undefined, false, undefined) for the console.log(data,loading,error)

const CREATE_T09_SCREENSHOT = gql`
  mutation 
    createT09ScreenShot(  
      $screenshot_window_1: String!, 
      $screenshot_window_2: String!,  
    ) { 
    createT09ScreenShot(
       screenshot_window_1: $screenshot_window_1, 
       screenshot_window_2: $screenshot_window_2, 
    ) { 
       screenshot_window_1
       screenshot_window_2
      } 
    }
`;
const SaveLogsButton = () => {
  const [createT09ScreenShot, { loading, error, data }] = useMutation(CREATE_T09_SCREENSHOT);
  
  const handleClick = async () => {
    const screenshotData = await saveImage();
    if (screenshotData){
    const { display_1, display_2 } = screenshotData;
    createT09ScreenShot({
      variables: {
        screenshot_window_1: display_1,
        screenshot_window_2: display_2,
      },
    });
  }
    console.log(data)
    console.log(loading)
    console.log(error)
  };

i also tried to do this but it give me an error

  const handleClick = async () => {
    await saveImageFunction();
    const { display_1, display_2 } = saveImage;
    createT09ScreenShot({
      variables: {

and here is the error

Unhandled Promise Rejection: TypeError: Right side of assignment cannot be destructured

I think you have some error inside handleclick function of saveImage destructurable object.

You need to replace your handleClick function code with this code:

const handleClick = async () => {
    const screenshotData = await saveImageFunction();
    const { display_1, display_2 } = screenshotData;
    createT09ScreenShot({
      variables: {
        screenshot_window_1: display_1,
        screenshot_window_2: display_2,
      },
    });
};