From 076810386856e527ecc572b8805640de7d85e642 Mon Sep 17 00:00:00 2001
From: Stefanos Togoulidis <stefanostogoulidis@gmail.com>
Date: Fri, 3 Apr 2020 16:23:21 +0300
Subject: [PATCH] [RNMobile] Dark mode on Android put on the v1.25.0 native
 release (#21352)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Revert revert of dark mode impl

* Add pre to list of block wrappers (#21255)

* Add pre to list of block wrappers

* Share the elements definition between web and native.

* Make constant name all uppercase.

* Rename constant name to be all uppercase

* Rename elements constant to all uppercase

Co-authored-by: Marko Savic <savicmarko1985@gmail.com>
Co-authored-by: Sérgio Estêvão <sergioestevao@gmail.com>
---
 .../index.android.js                          | 33 +++++++++++++++++++
 .../{index.native.js => index.ios.js}         |  0
 test/native/setup.js                          |  1 +
 3 files changed, 34 insertions(+)
 create mode 100644 packages/compose/src/hooks/use-preferred-color-scheme/index.android.js
 rename packages/compose/src/hooks/use-preferred-color-scheme/{index.native.js => index.ios.js} (100%)

diff --git a/packages/compose/src/hooks/use-preferred-color-scheme/index.android.js b/packages/compose/src/hooks/use-preferred-color-scheme/index.android.js
new file mode 100644
index 00000000000000..6d81eeca5a0852
--- /dev/null
+++ b/packages/compose/src/hooks/use-preferred-color-scheme/index.android.js
@@ -0,0 +1,33 @@
+/**
+ * External dependencies
+ */
+import {
+	subscribePreferredColorScheme,
+	isInitialColorSchemeDark,
+} from 'react-native-gutenberg-bridge';
+/**
+ * WordPress dependencies
+ */
+import { useState, useEffect } from '@wordpress/element';
+
+/**
+ * Returns the color scheme value when it changes. Possible values: [ 'light', 'dark' ]
+ *
+ * @return {string} return current color scheme.
+ */
+const usePreferredColorScheme = function() {
+	const [ currentColorScheme, setCurrentColorScheme ] = useState(
+		isInitialColorSchemeDark ? 'dark' : 'light'
+	);
+	useEffect( () => {
+		subscribePreferredColorScheme( ( { isPreferredColorSchemeDark } ) => {
+			const colorScheme = isPreferredColorSchemeDark ? 'dark' : 'light';
+			if ( colorScheme !== currentColorScheme ) {
+				setCurrentColorScheme( colorScheme );
+			}
+		} );
+	} );
+	return currentColorScheme;
+};
+
+export default usePreferredColorScheme;
diff --git a/packages/compose/src/hooks/use-preferred-color-scheme/index.native.js b/packages/compose/src/hooks/use-preferred-color-scheme/index.ios.js
similarity index 100%
rename from packages/compose/src/hooks/use-preferred-color-scheme/index.native.js
rename to packages/compose/src/hooks/use-preferred-color-scheme/index.ios.js
diff --git a/test/native/setup.js b/test/native/setup.js
index fe55851be4827a..7d656b41eafb42 100644
--- a/test/native/setup.js
+++ b/test/native/setup.js
@@ -14,6 +14,7 @@ jest.mock( 'react-native-gutenberg-bridge', () => {
 		subscribeUpdateHtml: jest.fn(),
 		subscribeMediaAppend: jest.fn(),
 		subscribeAndroidModalClosed: jest.fn(),
+		subscribePreferredColorScheme: () => 'light',
 		editorDidMount: jest.fn(),
 		editorDidAutosave: jest.fn(),
 		subscribeMediaUpload: jest.fn(),