use effect to send initial segment message

src/components/feedback/feedback.js

@@ -54,6 +54,13 @@ const Feedback = (props) => {
     }
   }, [helpful]);
 
+  useEffect(() => {
+    if (isOpen) {
+      // Add row to Segment when the user first interacts with the component
+      sendToSegment({ state: gatherState(), props });
+    }
+  }, [isOpen]);
+
   function gatherState() {
     return {
       user,
@@ -81,9 +88,6 @@ const Feedback = (props) => {
     setAnonymousId(anAnonymousId);
     setSessionId(`${Date.now()}-${anAnonymousId}`);
     setIsOpen(true);
-
-    // Add row to Segment
-    sendToSegment({ state: gatherState(), props });
   }
 
   function handleCategoryTypeChange(value) {

src/components/feedback/segment.js

@@ -5,7 +5,6 @@ import env from '../analytics-shell/env';
 // Send the event to Segment with forward event
 export function sendToSegment({ state, props }) {
   const event = createSegmentEvent({ state, props });
-  console.log('segmentEvent', event)
   forwardEvent(event, props.webhook, (err) => {
     if (err) Sentry.captureException(err);
   });
@@ -26,6 +25,7 @@ function createSegmentEvent({ state, props }) {
   } = state;
   const { site, section, location } = props;
   // set user if available else set anonymousId (needed for forward-event request)
+  console.log('HERE', user, anonymousId);
   const identity = {
     ...(user && user.id ? { userId: user.id } : { anonymousId: anonymousId })
   };