[BUG] HeaderControl with setAppRightControls mount point not updated if not mounted during initial render

[wanglam]

Describe the bug

The HeaderControl component, which is used to render controls in the header's right side, does not update its content when the controls prop changes if the component was not mounted during the initial render. This issue occurs when the HeaderControl component is conditionally rendered based on a state or prop that changes over time, and the condition is not met during the initial render.

To Reproduce

1. Create a component that conditionally renders the HeaderControl component based on a state or prop that changes over time.
2. Ensure that the condition for rendering the HeaderControl component is not met during the initial render.
3. After the state or prop changes, and the condition is met, the HeaderControl component should be rendered, but its content (the controls prop) is not updated.

Sample Code

const [currentTime, setCurrentTime] = useState<number>();
useEffect(() => {
  let intervalId = -1;
  intervalId = window.setInterval(() => {
    setCurrentTime(new Date().getTime());
  });
  return () => {
    clearInterval(intervalId);
  };
}, []);

return (
  <>
    {!!currentTime && (
      <navigationUI.HeaderControl
        controls={[
          {
            description: `current time: ${currentTime}`,
          },
        ]}
        setMountPoint={application!.setAppRightControls}
      />
    )}
  </>
);

In the above code, the HeaderControl component should not be rendered at the first time (when currentTime is undefined) and should be rendered after 1 second with the current time. However, the current time is not updated after the initial render.

Expected behavior
The HeaderControl component should update its content (the controls prop) whenever the state or prop changes, even if the component was not mounted during the initial render.

OpenSearch Version
N/A

Dashboards Version
Latest main

Plugins
N/A

Screenshots
N/A

Host/Environment (please complete the following information):

• OS: N/A
• Browser and version: N/A

Additional context
The root cause might be related to the headerRightControl not being rendered due to a conditional return statement in the Header component: https://github.com/opensearch-project/OpenSearch-Dashboards/blob/main/src/core/public/chrome/ui/header/header.tsx#L398