From 9cc9a7a96b60b8b654b6d2c7424c68d93ad5825a Mon Sep 17 00:00:00 2001
From: m4rc0z <m.zirkenbach@gmx.de>
Date: Tue, 15 May 2018 20:27:30 +0200
Subject: [PATCH] change navigation color and refactor code

---
 .../ratingComponent/ratingComponent.js        |  3 +-
 .../searchComponent/searchComponent.js        | 10 ++---
 app/index.js                                  | 40 ++++++++++++-------
 app/pages/header/header.js                    |  2 +-
 app/services/api/countryService.js            | 14 -------
 5 files changed, 31 insertions(+), 38 deletions(-)
 delete mode 100644 app/services/api/countryService.js

diff --git a/app/components/ratingComponent/ratingComponent.js b/app/components/ratingComponent/ratingComponent.js
index 6295e3e..50f5cde 100644
--- a/app/components/ratingComponent/ratingComponent.js
+++ b/app/components/ratingComponent/ratingComponent.js
@@ -6,7 +6,7 @@ class RatingComponent extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-            rating: this.props.ratingvalue
+            rating: this.props.ratingvalue,
         };
     }
 
@@ -23,7 +23,6 @@ class RatingComponent extends React.Component {
         this.ratingElement.setCurrentRating(nextState.rating);
     }
 
-
     render() {
         return (
             <View>
diff --git a/app/components/searchComponent/searchComponent.js b/app/components/searchComponent/searchComponent.js
index 1d265cc..47b2d39 100644
--- a/app/components/searchComponent/searchComponent.js
+++ b/app/components/searchComponent/searchComponent.js
@@ -44,10 +44,6 @@ class SearchComponent extends React.Component {
         this.props.setSelectedCountry(this.state.countries.find(country => country.regions.find(regionPar => regionPar == region)));
         this.props.setSelectedRegion(region);
         NavigationService.goBack();
-        // NavigationService.navigate('Home', {
-        //     country: this.state.countries.find(country => country.regions.find(regionPar => regionPar == region)),
-        //     region: region,
-        // });
     }
 
     render() {
@@ -92,13 +88,13 @@ const DismissKeyboard = ({children}) => (
 
 const styles = StyleSheet.create({
     searchBar: {
-        backgroundColor: 'blue',
+        backgroundColor: '#733626',
         borderTopWidth: 0,
         borderBottomWidth: 0,
         height: 40,
     },
     searchInput: {
-        backgroundColor: 'blue',
+        backgroundColor: '#733626',
         borderWidth: 0,
     }
 });
@@ -109,7 +105,7 @@ const SearchBarContainer = styled.View`
 const SearchResultContainer = styled.View`
   height: 100%;
   width: 100%;
-  background-color: white;
+  background-color: ${props => props.theme.colors.backgroundColor};
 `;
 const DummyRightElement = styled.View`
   height: 0;
diff --git a/app/index.js b/app/index.js
index f3b9b93..9f8e699 100644
--- a/app/index.js
+++ b/app/index.js
@@ -8,34 +8,46 @@ import SearchComponent from "./components/searchComponent/searchComponent";
 import NavigationService from "./services/navigation/NavigationService";
 import store from "./store";
 import {Provider} from "react-redux";
+import {ThemeProvider} from "styled-components";
 
 const TopLevelNavigator = createStackNavigator({
-    SplashScreen: { screen: Loader },
-    MainNavigator: { screen: MainPartComponent },
-    Search: { screen: createBottomTabNavigator({
-            SearchBar: { screen: SearchComponent },
-            Home: { screen: MainPartComponent },
-})},
+    SplashScreen: {screen: Loader},
+    MainNavigator: {screen: MainPartComponent},
+    Search: {
+        screen: createBottomTabNavigator({
+            SearchBar: {screen: SearchComponent},
+            Home: {screen: MainPartComponent},
+        })
+    },
 }, {
     headerMode: 'screen',
-    cardStyle: { backgroundColor: 'white'},
+    cardStyle: {backgroundColor: 'white'},
     navigationOptions: {
-        header: <HeaderComponent />
+        header: <HeaderComponent/>
     }
 });
 
 class App extends React.Component {
     render() {
         return (
-            <Provider store={store}>
-                <TopLevelNavigator
-                    ref={navigatorRef => {
-                        NavigationService.setTopLevelNavigator(navigatorRef)
-                    }}/>
-            </Provider>
+            <ThemeProvider theme={theme}>
+                <Provider store={store}>
+                    <TopLevelNavigator
+                        ref={navigatorRef => {
+                            NavigationService.setTopLevelNavigator(navigatorRef)
+                        }}/>
+                </Provider>
+            </ThemeProvider>
         )
     };
 }
 
+const theme = {
+    colors: {
+        navigationColor: '#733626',
+        backgroundColor: '#FFFFFF',
+        textColor: '#2B2C28',
+    }
+};
 
 export default App;
\ No newline at end of file
diff --git a/app/pages/header/header.js b/app/pages/header/header.js
index 8df6011..ca96cec 100644
--- a/app/pages/header/header.js
+++ b/app/pages/header/header.js
@@ -19,7 +19,7 @@ class HeaderComponent extends React.Component {
 }
 
 const HeaderContainer = styled.View`
-  background: blue;
+  background: ${props => props.theme.colors.navigationColor};
   padding-top: 25px;
   height: 60px;
 `;
diff --git a/app/services/api/countryService.js b/app/services/api/countryService.js
deleted file mode 100644
index 6932bc7..0000000
--- a/app/services/api/countryService.js
+++ /dev/null
@@ -1,14 +0,0 @@
-const CountryService  = {
-    getCountries: async function() {
-        try {
-            let response = await fetch(
-                'https://winevintageapp.firebaseio.com/country.json?auth=0S0M8K7etZ6pu0khQYNEtGxtWf1OB3OuYdgW87ck'
-            );
-            return await response.json();
-        } catch (error) {
-            console.error(error);
-        }
-    }
-};
-
-export default CountryService;
\ No newline at end of file