React-native-track-player: Setting Up Event Handlers When The Store is Based on Redux

[thecodecafe]

Please can someone help me out here, I have a react app that uses this library but can't find a way to make it work with a redux store in a case where I want to handle events that occurred on the player.

Normally if you are using redux, your app is wrapped around a Provider component which grants all descendant components access to the store.

Example Of App Component

<Provider store={store}>
     <LoadingWrapper states={['auth', 'logout', 'signup']}>
          <ThemeProvider uiTheme={uiTheme}>
            <NativeRouter>
              <Switch> 
                <Route exact path="/" component={FirstScreen} />
                <Route path="/SignUp" component={SignUp} /> 
                <NavigationDrawer>  
                  <Route  path="/main" component={MainPage} />
                  <Route path="/browse" component={BrowsePage} />
                   ...
                </NavigationDrawer>
              </Switch>
            </NativeRouter>
          </ThemeProvider>
        </LoadingWrapper>
</Provider>

Registering App and Event Listener

AppRegistry.registerComponent('AwesomeApp', () => App);
TrackPlayer.registerEventHandler(require('./player-handler.js'));

The problem now is that registering events is done outside of your registered app, this makes it impossible to act on these events when they occur.

I'm at a crossroad here and supposed to have this app delivered in 6 hours and I don't even know what to do, please someone help.

[Guichaguri]

Take a look at this example app: https://github.com/react-native-kit/react-native-track-player-demo/blob/master/src/index.js#L12

[thecodecafe]

Thanks @Guichaguri it's now connected to my store.