typeFormHook.js

// frontend typeform-react
import { PopupButton } from '@typeform/embed-react'

export const MyComponent = () => {
  return (
    <PopupButton 
        id="eqn2wy8H"
        hidden={{
            uid: `eyJhbGciOiJSUzI1NiIsImtpZCI6IjFhYWMyNzEwOTkwNDljMGRmYzA1OGUwNjEyZjA4ZDA2YzMwYTA0MTUiLCJ0`
          }}
        style={{ fontSize: 20 }} 
        className="my-button">
      click to open form in popup
    </PopupButton>
  )
}

// Backend typeform webhook

exports.typeFormHook = functions.https.onRequest(async (req, res) => {
  const rawBody = req.rawBody ? req.rawBody.toString() : JSON.stringify(req.body);

  const signature = req.headers['typeform-signature'];
  if (!signature) {
    console.error('No Typeform signature found in headers');
    return res.status(400).send('No signature provided');
  }

  const isValid = verifySignature(signature, rawBody);

  if (isValid) {
    console.log('Webhook signature verified');

    // For example, you might want to store it in Firestore:
    admin.firestore().collection('webhooks').add(JSON.parse(rawBody));

    res.status(200).send('Webhook received and verified');
  } else {
    console.error('Invalid webhook signature');
    res.status(403).send('Invalid signature');
  }
});