Access Redux state inside of <Scroll html/>

[viktorstopka]

Hey.
I am using Nextjs+@react-three/fiber and drei. I am using drei's ScrollControls. I now have an HTML scroll container (), and inside I want to access my Redux state. But that is not possible. Even tho I have my _app.tsx wrapped in a Provider, it says:
Error: could not find react-redux context value; please ensure the component is wrapped in a <Provider>

_app.tsx

function MyApp({ Component, pageProps }: AppProps) {
  return (
    <Provider store={store}>
      <Component {...pageProps} />
    </Provider>
  );
}

Canvas

<Canvas>
     <ScrollControls
      pages={4}
      distance={0.6}
      damping={8}
      horizontal={false}
      infinite={false}
      >
            <Scroll html>
              <PageHTML></PageHTML>
            </Scroll>
            <Scroll>
              <D3Scroll />
            </Scroll>
     </ScrollControls>
</Canvas>

The code that produces an error

const PageHTML: React.FC = () => {
  const a = useSelector((state) => (state as State).windows);
  const b = bindActionCreators(actionCreators, useDispatch());

Thank you very much for your help!

[viktorstopka]

The way I solved this, for anyone having the same issue is (idk if it is the best possible solution), I wrapped the HTML is a Provider as well. Like this:

<Scroll html>
       <Provider store={store}>
              <PageHTML></PageHTML>
        </Provider>
</Scroll>