# What is the correct way to get current uppy state in React 18? **URL:** \ **Category:** Uppy\ **Created:** [October 27, 2022, 10:10pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298 "2022-10-27T22:10:31Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![odili](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/odili/32/681_2.png) [@odili](https://community.transloadit.com/u/odili)\ **Post date:** [October 27, 2022, 10:10pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/1 "2022-10-27T22:10:32Z")
I’m using React 18 (remix) and `"@uppy/core": "^2.3.4",`. I wanted a simpler custom Uploader UI for my use case, so I wanted to access current files in the state(meaning with their upload progress data when changes occur) but both `uppy.getState()` and `uppy.getFiles()` returned nothing. I have used `"@uppy/store-default": "^3.0.2"` by initializing uppy store with `new DefaultStore()`, yet not changes. Must I use Redux? I wanted to use the `defaultStore` to test before finalizing implementation. I must be missing something. Pointing me to docs or any clue will be much appreciated. Thank you. ---
**Author:** ![Merlijn](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/merlijn/32/1382_2.png) [@Merlijn](https://community.transloadit.com/u/Merlijn)\ **Post date:** [October 28, 2022, 12:44pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/2 "2022-10-28T12:44:15Z")
Hi, I haven’t seen this before. Uppy needs to be client-side rendered so something might be wrong if you’re using Remix and render server-side. A reproducible example would help. We have a [template](https://codesandbox.io/s/uppy-dashboard-xpxuhd) on codesandbox, although not in Remix. ---
**Author:** ![Paul](https://avatars.discourse-cdn.com/v4/letter/p/bbe5ce/32.png) [@Paul](https://community.transloadit.com/u/Paul)\ **Post date:** [August 31, 2023, 10:47am UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/3 "2023-08-31T10:47:50Z")
I know this is a bit old. But I’m porting a NextJS 12 app to 13. With the exact same code. Both getFiles and getState report an empty array. However, if I listen to the event “files-added” and query getFiles, I see data. But outside of this, if I execute getFiles say from a button. It’s empty! So something is going on here. I’m going to attempt to debug. Oh and what’s worse, there’s no documentation about using an external store. [https://uppy.io/docs/guides/custom-stores/](https://uppy.io/docs/guides/custom-stores/) goes to a 404. ---
**Author:** ![Merlijn](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/merlijn/32/1382_2.png) [@Merlijn](https://community.transloadit.com/u/Merlijn)\ **Post date:** [August 31, 2023, 11:30am UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/4 "2023-08-31T11:30:17Z")
Make sure Uppy UI components are rendered on the client if you are using the new app router. Also check that you are initialising uppy outside of the component. If you still have issues, create an issue with a reproducible example. ---
**Author:** ![Paul](https://avatars.discourse-cdn.com/v4/letter/p/bbe5ce/32.png) [@Paul](https://community.transloadit.com/u/Paul)\ **Post date:** [September 1, 2023, 10:31am UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/5 "2023-09-01T10:31:59Z")
Thanks for the follow up, appreciate it! > [@Merlijn](#): > > Make sure Uppy UI components are rendered on the client if you are using the new app router. To confirm, the uppy code is within a “use client” tree. So they are definitely clientside. > [@Merlijn](#): > > Also check that you are initialising uppy outside of the component. What I found worked. Is that I initialised uppy in a component and passed that to a sub component which was responsible for the events. The upper component has state, which on mount would then load the sub component. Now getFiles and getState are populated. ---
**Author:** ![Merlijn](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/merlijn/32/1382_2.png) [@Merlijn](https://community.transloadit.com/u/Merlijn)\ **Post date:** [September 1, 2023, 1:10pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/6 "2023-09-01T13:10:30Z")
Unless you are rendering an [arbitrary amount](https://uppy.io/docs/react/#how-do-i-render-x-amount-of-uppy-ui-components) of uppy instances, I strongly recommend not initialising uppy inside a component. You will run into unexpected issues when during rerenders. ---
**Author:** ![Paul](https://avatars.discourse-cdn.com/v4/letter/p/bbe5ce/32.png) [@Paul](https://community.transloadit.com/u/Paul)\ **Post date:** [September 1, 2023, 1:36pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/7 "2023-09-01T13:36:44Z")
Can you please clarify what you mean by outside of a component. Perhaps our definitions are different? When I mean component, I meant a react component. Also I’m not using Uppy UI components. All I’m using is: ```auto import useUppy from "@uppy/react/lib/useUppy.js"; ``` Nothing else. ---
**Author:** ![Merlijn](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/merlijn/32/1382_2.png) [@Merlijn](https://community.transloadit.com/u/Merlijn)\ **Post date:** [September 1, 2023, 1:39pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/8 "2023-09-01T13:39:12Z")
Please read the [docs](https://uppy.io/docs/react/) which will clarify things. `useUppy` has been deprecated for a long time. The hook will not work as expected as of React 18. Better to upgrade to latest Uppy packages and follow the docs. ---
**Author:** ![vihar](https://avatars.discourse-cdn.com/v4/letter/v/ecc23a/32.png) [@vihar](https://community.transloadit.com/u/vihar)\ **Post date:** [September 7, 2023, 5:52pm UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/9 "2023-09-07T17:52:22Z")
Hi Merlijn, Given that `useUppy` is deprecated, what would be the correct way to access Uppy state in a reactive way? As far as I looked I don’t see any good documentation on this. For more context, I am also using React 18 and trying to build a custom UI to go with Uppy. More specifically, I want to delegate all the uploading logic to Uppy but render my own custom UI instead of using Dashboard. So far the only way that I have found to work is to manage my own local state and update it based on events fired by Uppy. It works but it is tedious and essentially duplicating Uppy’s state so I was wondering if there is a way I could access Uppy state in reactive fashion. ---
**Author:** ![Merlijn](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/merlijn/32/1382_2.png) [@Merlijn](https://community.transloadit.com/u/Merlijn)\ **Post date:** [September 8, 2023, 7:36am UTC](https://community.transloadit.com/t/what-is-the-correct-way-to-get-current-uppy-state-in-react-18/16298/10 "2023-09-08T07:36:21Z")
Hi, this is a bit tricky indeed. Uppy was originally made many years ago when vanilla JS components were still the main thing. We then made framework wrappers to not rebuild the entire UI in each framework, which works fine in all frameworks except for React. Long-term, we’re thinking of a way to improve this specifically for React. For now, some complexity may be involved on your side. > [@vihar](#): > > So far the only way that I have found to work is to manage my own local state and update it based on events fired by Uppy. It works but it is tedious and essentially duplicating Uppy’s state so I was wondering if there is a way I could access Uppy state in reactive fashion. This is indeed what we ended up doing for the Transloadit website, which uses React. I know it’s not ideal, but it does the job for now.