[RNMobile] Dark mode on Android put on the v1.25.0 native release (#2…

…1352) * 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 <[email protected]> Co-authored-by: Sérgio Estêvão <[email protected]>
WordPress · Apr 3, 2020 · 0768103 · 0768103
1 parent c7a3c2c
commit 0768103
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 0 deletions.
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
@@ -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/...se-preferred-color-scheme/index.native.js → ...s/use-preferred-color-scheme/index.ios.js b/...se-preferred-color-scheme/index.native.js → ...s/use-preferred-color-scheme/index.ios.js
diff --git 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(),