Add comment explaining why init of prom client is needed

Author: JeanMarcMilletScality

ui/src/components/PlatformGlobalHealthBarFederated.tsx

@@ -1,6 +1,6 @@
 import { MetricsTimeSpanContext } from '@scality/core-ui/dist/components/charts/MetricsTimeSpanProvider';
 import { useShellHooks } from '@scality/module-federation';
-import { useLayoutEffect, useMemo } from 'react';
+import { useEffect, useLayoutEffect, useMemo } from 'react';
 import FederatedIntlProvider from '../containers/IntlProvider';
 import StartTimeProvider from '../containers/StartTimeProvider';
 import { initialize as initializePrometheus, setHeaders } from '../services/prometheus/api';
@@ -27,7 +27,13 @@ export default function PlatformGlobalHealthBarFederated({
   const { userData } = useAuth();
   const token = userData?.token;
 
-  useLayoutEffect(() => {
+
+  /**
+   * Initialize the Prometheus client and set the authorization header if the token is available
+   * The initialization of Prometheus client is neeeded here as it is shared with Module Federation to another ui
+   * The prometheus client could not be initialized in the parent component rendering it.
+   */
+  useEffect(() => {
     if (token) {
       initializePrometheus(prometheusUrl);
       setHeaders({ Authorization: `Bearer ${token}` });