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.