I have a function calling an api and I'm using that funciton inside of another component using useEffect and when I'm returning that data it's coming in Promise state. How do I get only the data after it's done fetching it from the api?

Code snippet - https://codesandbox.io/live/f895fd5c8f7