gatsby: window is not defined about filestack-react HOT 4 CLOSED

Ive partially figured this out. the 'window' object is not available on SSR react projects, so you need to dynamically import the module on componentDidMount or with a library. Next.js has dynamic imports-- im sure gatsby has something similar. This would be nice if it were mentioned in the docs

from filestack-react.

@bfine9618
Can you provide version of filestack-react which are you using?

from filestack-react.

getting the same thing. i am using Next.js and the newest version of filestack-react

from filestack-react.

I found a solution without dynamic imports:

use the Client import from filestack-js. You have to import the js script into the gatsby-ssr file. I do it in the onRenderBody

export const onRenderBody = ({ setHeadComponents }) => { return setHeadComponents([ <script key="filestack" src="//static.filestackapi.com/filestack-js/2.x.x/filestack.min.js"/> ]) }

Then in your file you can import the filestack client in the component like this:
const client = filestack.init('API_KEY')

then you can use a normal html file import with the onChange function that looks like:
onChange={ (e) => client.upload(e.target.files[0]).then(data => console.log(data.url))}

from filestack-react.