Unable to access data passed into <ReactRetool /> by Parent Window

[aman_godara_ria]

I am passing data from Parent Window (react app) to retool using react-retool library.

I want to pass accessToken into headers of queries/Rest APIs written on retool, but this accessToken is available on Parent Window (my react app), hence I am passing it in data to <Retool />.

import Retool from 'react-retool';
<Retool height="100%" width="100%" url={process.env.RETOOL_AUTH_DASHBOARD_URL} data={{ accessToken: data.accessToken, userName: data.user.name }} onData={() => {}} />

url here is the public embedded url of our retool app. We are NOT using self-hosted retool.

I have written a ParentWindow resource on retool as such:

I can see retool screen (that I created) in my react app successfully, which means that whatever code I have written is properly configured. I did console.log() in my react app and everything was getting logged as expected which means <Retool /> is receiving a valid data prop, but for some reason, accessToken is not available on retool when this query runs.

Also, on my actual need i.e. to pass accessToken into headers of queries/Rest APIs, I tried using this Bearer {{ parent.data.accessToken }}, I wasn't sure what I was doing here but I hope you can understand the intention of using the accessToken passed in data prop. This didn't work but it would a great help if you can suggest me a similar straight forward solution to pass accessToken into headers (if any).

[aman_godara_ria]

Solved!

Probably the reason was that I was accessing the data passed in wrong way previously.

Here is how you should do it the right way:

for each key that is passed in data create a parent window query.
For example: I created one query for accessing user name and another for accessing access token. I named them userName and accessToken respectively. Now to access the data passed by parent window I have done userName.data and accessToken.data respectively.