Throws an error when you click on the button. Uncaught (in promise) TypeError: Failed to fetch

24 Views Asked by At

I decided to try to create a button that should send a request to the HubSpot CRM and launch workflows, but I get an error message and can't figure out what the problem is... I'm new to reactjs and javascript in general, and I'm trying to figure out how to make reactjs work.

import React, { useState, useEffect } from 'react';
import {
  Button,
  Text,
  hubspot,
} from '@hubspot/ui-extensions';

hubspot.extend(({actions}) => (
  <Extension
  fetchProperties={actions.fetchCrmObjectProperties}
  />
));

const Extension = ({ fetchProperties }) => {
  const post = "https://api.hubapi.com/automation/v2/workflows/:workflowsID/enrollments/contacts/";
  const [email, setemail] = useState("");
  useEffect(() => {
      fetchProperties(["email"])
        .then(properties => {
          setemail(properties.email);
      });
  }, [fetchProperties]);

  function myOnClickFunction() {
    fetch(post + email, {
      method: 'POST',
      headers: {
          'Accept': 'application/json',
          'Authorization': 'Bearer TOKEN',
          'Content-Type': 'application/json',
          'Content-Length': '0',
      },
  });
}
   
    return (
      <><Text>Post:{email} </Text><Button onClick={myOnClickFunction}>Enroll</Button></>
    );

}

I have just started learning reactjs and if there are any tips or useful articles, I will be very grateful.

0

There are 0 best solutions below