Feature/3604 enable dark mode

.eslintrc.js

@@ -119,7 +119,7 @@ module.exports = {
 		'eslint-comments/no-unused-disable': 0,
 		'react-native/no-color-literals': 2,
 		'react-native/no-inline-styles': 2,
-		'react-native/no-unused-styles': 2,
+		'react-native/no-unused-styles': 0,
 		'react-native/split-platform-components': 2,
 		'react/jsx-boolean-value': 2,
 		'react/jsx-key': 1,

android/app/build.gradle

@@ -160,8 +160,8 @@ android {
 		applicationId "io.metamask"
 		minSdkVersion rootProject.ext.minSdkVersion
 		targetSdkVersion rootProject.ext.targetSdkVersion
-		versionCode 834
-		versionName "4.2.2"
+		versionCode 846
+		versionName "4.3.3"
 		multiDexEnabled true
 		testBuildType System.getProperty('testBuildType', 'debug')
 		missingDimensionStrategy "minReactNative", "minReactNative46"

android/app/src/main/res/drawable/background_splash.xml

@@ -2,7 +2,7 @@
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
 
 	<item
-		android:drawable="@color/white"/>
+		android:drawable="@color/theme"/>
 
 	<item
 		android:width="200dp"

android/app/src/main/res/layout/launch_screen.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:orientation="vertical" android:layout_width="match_parent"
-    android:layout_height="match_parent" android:background="#ffffffff">
+    android:layout_height="match_parent" android:background="@color/theme">
     <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/diamond" android:scaleType="center" />
 </RelativeLayout>

android/app/src/main/res/values-night/booleans.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+	<bool name="useLightStatusBar">false</bool>
+</resources>

android/app/src/main/res/values-night/colors.xml

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+	<color name="theme">#151719</color>
+	<color name="themeInverse">#FFFFFF</color>
+	<color name="navBar">#000000</color>
+	<color name="lightgray">#EBEBED</color>
+</resources>

android/app/src/main/res/values/booleans.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+	<bool name="useLightStatusBar">true</bool>
+</resources>

android/app/src/main/res/values/colors.xml

@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-	<color name="white">#FFFFFF</color>
+	<color name="theme">#FFFFFF</color>
+	<color name="themeInverse">#000000</color>
+	<color name="navBar">#000000</color>
 	<color name="lightgray">#EBEBED</color>
 </resources>

android/app/src/main/res/values/styles.xml

@@ -1,22 +1,21 @@
 <resources>
 
 	<!-- Base application theme. -->
-	<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
+	<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
 		<!-- Customize your theme here. -->
-		<item name="android:statusBarColor">@color/lightgray</item>
-		<item name="android:windowLightStatusBar">true</item>
-		<item name="android:navigationBarColor">@color/lightgray</item>
-		<item name="android:windowLightNavigationBar">true</item>
+		<item name="android:windowBackground">@color/theme</item>
+		<item name="android:statusBarColor">@color/theme</item>
+		<item name="android:navigationBarColor">@color/navBar</item>
+		<item name="android:windowLightStatusBar">@bool/useLightStatusBar</item>
+		<item name="android:textColor">@color/themeInverse</item>
 	</style>
 
-	<style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
+	<style name="SplashTheme" parent="Theme.AppCompat.DayNight">
 		<item name="android:windowBackground">@drawable/background_splash</item>
-		<item name="android:statusBarColor">@color/white</item>
-		<item name="android:windowLightStatusBar">true</item>
-		<item name="android:navigationBarColor">@color/white</item>
-		<item name="android:windowLightStatusBar">true</item>
-		<item name="android:windowLightNavigationBar">true</item>
-		<item name="android:textColor">#000000</item>
+		<item name="android:statusBarColor">@color/theme</item>
+		<item name="android:navigationBarColor">@color/navBar</item>
+		<item name="android:windowLightStatusBar">@bool/useLightStatusBar</item>
+		<item name="android:textColor">@color/themeInverse</item>
 	</style>
 
 </resources>

app/__mocks__/react-native-view-shot.js

@@ -0,0 +1,6 @@
+export default {
+	captureScreen: jest.fn().mockImplementation(() => {
+		// eslint-disable-next-line no-console
+		console.log('capture screen');
+	}),
+};

app/actions/user/index.js

@@ -83,6 +83,13 @@ export function logOut() {
 	};
 }
 
+export function setAppTheme(theme) {
+	return {
+		type: 'SET_APP_THEME',
+		payload: { theme },
+	};
+}
+
 /**
  * Temporary action to control auth flow
  *