Support Question

Hello I have an issue with the React components in the Microsoft Teams application for a tab application.

The Person compoenent does not seems to fetch the Graph API when used with a userId property.

This is what I've done so far:

  const { data, loading, error } = useGraphWithCredential(
    async (graph, cred, scope) => {
      const response = await graph.api("/me").get();
      return response;
    }
  );

  useEffect(() => {
    console.log(data);
  }, [data]);

  return (

    <Person
      userId={data?.id}
      fetchImage={true}
      showPresence={true}
    />

The component is rendered as an empty component even though I can see in the console the graph api is called and I get a correct response with an id property.

I tried to hardcode the id directly and it's the same erorr with an empty component.

However if I put the personDetails={data} I get a component.

I would like to use only the id property to use the component, and be able to get the profilePicture and presence badge. But I don't have any of those currently. The graph API does not seems to be called when using the userId property. I don't see call in the network tab (It may have been cached?)

Why the component doesn't fetch the API by itself and I need to give the data myself? The same happen if I give a personQuery prop, for example "me" like described in the docs: https://learn.microsoft.com/en-us/graph/toolkit/get-started/mgt-react

microsoftgraph / microsoft-graph-toolkit

[QUESTION] Graph API not called in teams #2895

Support Question