69 lines
2.0 KiB
TypeScript
69 lines
2.0 KiB
TypeScript
import React, { Component } from 'react';
|
|
import { Provider } from 'react-redux';
|
|
import TrackPlayer from 'react-native-track-player';
|
|
import { PersistGate } from 'redux-persist/integration/react';
|
|
import { AppearanceProvider, Appearance, AppearanceListener } from 'react-native-appearance';
|
|
import Routes from '../screens';
|
|
import store, { persistedStore } from 'store';
|
|
import {
|
|
NavigationContainer,
|
|
DefaultTheme,
|
|
DarkTheme,
|
|
} from '@react-navigation/native';
|
|
|
|
interface State {
|
|
isReady: boolean;
|
|
colorScheme?: string;
|
|
}
|
|
|
|
export default class App extends Component<{}, State> {
|
|
state: State = {
|
|
isReady: false,
|
|
};
|
|
|
|
subscription = null;
|
|
|
|
async componentDidMount() {
|
|
await TrackPlayer.setupPlayer();
|
|
await TrackPlayer.updateOptions({
|
|
capabilities: [
|
|
TrackPlayer.CAPABILITY_PLAY,
|
|
TrackPlayer.CAPABILITY_PAUSE,
|
|
TrackPlayer.CAPABILITY_SKIP_TO_NEXT,
|
|
TrackPlayer.CAPABILITY_SKIP_TO_PREVIOUS,
|
|
TrackPlayer.CAPABILITY_STOP,
|
|
TrackPlayer.CAPABILITY_SEEK_TO,
|
|
]
|
|
});
|
|
this.subscription = Appearance.addChangeListener(this.setScheme);
|
|
this.setState({ isReady: true, colorScheme: Appearance.getColorScheme() });
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
this.subscription?.remove();
|
|
}
|
|
|
|
setScheme: AppearanceListener = ({ colorScheme }) => {
|
|
this.setState({ colorScheme });
|
|
}
|
|
|
|
render() {
|
|
const { isReady, colorScheme } = this.state;
|
|
|
|
if (!isReady) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Provider store={store}>
|
|
<PersistGate loading={null} persistor={persistedStore}>
|
|
<AppearanceProvider>
|
|
<NavigationContainer theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
|
|
<Routes />
|
|
</NavigationContainer>
|
|
</AppearanceProvider>
|
|
</PersistGate>
|
|
</Provider>
|
|
);
|
|
}
|
|
} |