Port to Redux and add settings

src/components/App.tsx

@@ -1,7 +1,10 @@
 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 { NavigationContainer } from '@react-navigation/native';
 import Routes from '../screens';
+import store, { persistedStore } from '../store';
 
 interface State {
     isReady: boolean;
@@ -34,9 +37,13 @@ export default class App extends Component<State> {
         }
 
         return (
-            <NavigationContainer>
-                <Routes />
-            </NavigationContainer>
+            <Provider store={store}>
+                <PersistGate loading={null} persistor={persistedStore}>    
+                    <NavigationContainer>
+                        <Routes />
+                    </NavigationContainer>
+                </PersistGate>
+            </Provider>
         );
     }
 }

src/components/Input.tsx

@@ -0,0 +1,10 @@
+import styled from 'styled-components/native';
+
+const Input = styled.TextInput`
+    margin: 10px 0;
+    background-color: #f6f6f6;
+    border-radius: 5px;
+    padding: 15px;
+`;
+
+export default Input;

src/components/Modal.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import styled from 'styled-components/native';
+import { SafeAreaView } from 'react-native';
+
+const Background = styled.View`
+    background-color: #eeeeeeee;
+    padding: 100px 25px;
+    flex: 1;
+`;
+
+const Container = styled.View`
+    background-color: white;
+    border-radius: 20px;
+    flex: 1;
+`;
+
+const Modal: React.FC = ({ children }) => {
+    return (
+        <Background>
+            <SafeAreaView style={{ flex: 1}}>
+                <Container>
+                    {children}
+                </Container>
+            </SafeAreaView>
+        </Background>
+    );
+};
+
+export default Modal;