React - Unable to pass token to Content Explorer

Go to solution
Occasional Contributor

React - Unable to pass token to Content Explorer

I seem to be running into an issue implementing Content Explorer in React. I have the api call occurring in componentDidMount() and it is successfully generating a token. I am then able to render the token on screen as an h1 (for testing purposes). I am also able to console.log the token but when I attempt to pass the token into the 'token' parameter in ContentExplorer it does not seem to work. I have also tried making ContentExplorer as a component separate from my api call. I am able to successfully pass the token into this separate component and render it as an h1 but it still will not work correctly when passed into ContentExplorer as a parameter. Here is my code below. In this code I am doing my api call and ContentExplorer in the same component. Any help as to why the token will not function properly would be greatly appreciated. Thanks. 


class Box extends Component {    
constructor(props) {
this.state = {
accessToken: ''

async componentDidMount() {
const authenticationUrl = "";
let search =;
let params = new URLSearchParams(search);
let accessToken = await
grant_type: 'authorization_code',
code: params.get('code'),
.then(response =>;
this.setState({accessToken: accessToken});
} render() {
let token = this.state.accessToken;
<IntlProvider locale="en">
contentSidebarProps: {
detailsSidebarProps: {
hasProperties: true,
hasNotices: true,
hasAccessStats: true,
hasClassification: true,
hasRetentionPolicy: true,
// features: FEATURES,
hasActivityFeed: true,
hasMetadata: true,
hasSkills: true,
hasVersions: true,
// features={FEATURES}
export default Box;


Occasional Contributor

Re: React - Unable to pass token to Content Explorer

Checking to see if anyone has a solution for this issue as it is blocking our progress with getting Box implemented with our app. 

Box Employee

Re: React - Unable to pass token to Content Explorer

Hi @dhebert-dev ,


It seems like the root of the issue is that ContentExplorer does not handle a string access token being changed after mounting.


You probably have two options:

  1. Render ContentExplorer conditionally based on when your have resolved your token
  2. Use a token generator function instead -- I couldn't find a good example in box-ui-elements, but here is some documentation from box-content-preview:

Hope that helps,


Occasional Contributor

Re: React - Unable to pass token to Content Explorer

Thank you! So the solution here was to conditionally render Content Explorer. That helped me a lot. Thanks so much.