I want to display the message count on my custom intercom launcher but I find the count is not being accurately reported by the onUnreadCountChange function until the Intercom widget is opened. When the page is loaded and the handler is initially registered it always returns 0 unread messages until the widget is opened and then it will return the correct number (in this case 2).

Here’s an example of what is being logged to the handler before (on load) and after the intercom launcher is clicked. Once clicked the handler receives the wrong number of messages (1) before finally returning the correct number of unread messages (2).

import Intercom, { shutdown, onUnreadCountChange, update, showNewMessage, hide } from "@intercom/messenger-js-sdk";
// rest of react setup ....
useEffect(() => {
    const initialize = () => {
        Intercom({
          app_id: INTERCOM_APP_ID,
          name:<redacted>
          created_at: <redacted>,
          custom_launcher_selector: '#support',
          hide_default_launcher: true,
          user_hash: <redacted>,
          user_id: <redacted>
          company: {
            company_id: <redacted>,
            name: <redacted>,
          },
        });

        const handleUnreadCountChange = (count) => {
          console.log("whats the count: ", count); // returns 0 until the intercom widget is opened
          setUnreadCount(count);
        };

        onUnreadCountChange(handleUnreadCountChange);
        // showNewMessage(); if run the widget will open and the correct count of unread messages will be displayed

        return () => {
          shutdown();
        };
      }
    };
    initialize();
  },  ])