Feature/1675 dark mode android integration #1717

marecar3 · 2019-12-21T21:47:13Z

Gutenberg PR: WordPress/gutenberg#19293
WordPress-Android PR: wordpress-mobile/WordPress-Android#11004

To test:

On devices with API <=28:

Open App Settings from Me screen.
Notice the App Theme preference.
The default value should be set to Set by Battery Saver.
From the preference, dialog select Dark and confirm that the app switches to Dark Theme.
Open the Gutenberg Editor and confirm that it has Dark Theme
Select Light and confirm that the app switches to Light Theme.
Open the Gutenberg Editor and confirm that it has Light Theme
Select Set by Battery Saver and enable Battery Saver on the device.
Confirm that Dark Theme is used when Battery Saver is ON.

On devices with API 29+:

Open App Settings from Me screen.
Notice the App Theme preference.
The default value should be set to System Default.
From the preference, dialog select Dark and confirm that the app switches to Dark Theme.
Open the Gutenberg Editor and confirm that it has Dark Theme
Select Light and confirm that the app switches to Light Theme.
Open the Gutenberg Editor and confirm that it has Light Theme
Select System Default and close the app.
Enable Dark Theme in Display settings of the device.
Launch the app again and confirm that the dark theme is applied.

Note for API 29+: At this moment we aren't able to get the app theme to switch automatically when the Dark Theme is toggled. For now, you need to restart the app for new theme to take effect. @khaykov has created a separate issue for this at wordpress-mobile/WordPress-Android#10748

PR submission checklist:

replace "future release" in release notes with some version
I have considered adding unit tests where possible.
I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

# Conflicts: # gutenberg

marecar3 · 2019-12-25T16:36:50Z

Early feedback from @iamthomasbishop :

Android-only: change primary surface background to #121212
Link color should be blue 30 (double-check iOS for proper value)
When editor is loading, background is white (haven’t seen this in iOS)
Bottom sheet icons don't always display as same/correct color (sometimes blueish gray, sometimes neutral. See gallery appender/image sources sheet for example)
Slider drag handle is using too dark of a blue (should be same as process fill)

# Conflicts: # gutenberg

maxme · 2019-12-31T14:46:41Z

Link color should be blue 30 (double-check iOS for proper value)

I noticed the iOS / Android color difference on links:

iOS	Android

# Conflicts: # gutenberg

etoledom

JS Side looks good to me! 👍

Let's check with @mchowning or @maxme for a final look on the Native side.

Let's not forget to change the Future release entry to the proper one we know this will land.
(Today is the last chance to merge to v1.23.0)

mchowning · 2020-03-09T21:19:45Z

...ava/org/wordpress/mobile/ReactNativeGutenbergBridge/RNReactNativeGutenbergBridgePackage.java

@@ -12,19 +12,23 @@
 public class RNReactNativeGutenbergBridgePackage implements ReactPackage {
    private GutenbergBridgeJS2Parent mGutenbergBridgeJS2Parent;
    private RNReactNativeGutenbergBridgeModule mRNReactNativeGutenbergBridgeModule;
+    private boolean mIsDarkMode;


Would be nice if we could mark mIsDarkMode and mGutenbergBridgeJS2Parent as final. Would make it clear that mRNReactNativeGutenbergBridgeModule is the only thing that can/should change, which also makes it obvious that this is not a dark mode variable that gets updated if the user's dark mode settings change (i.e., battery saver starts). I do not feel strongly about this change though, feel free to leave as-is if you prefer.

Thanks for the good advice.
Will update them!

mchowning · 2020-03-09T21:27:31Z

This is looking good @marecar3 !

Noticed that on API<29 devices switching battery mode on/off while within the editor would update the dark mode for the app (i.e. the toolbar on the top would update), but not for the editor. This seems like a bit of an edge case, and I wouldn't mind proceeding with this PR as is and opening a new issue for that (like what we did with the similar issue on API 29+ devices).

Starting editor with battery Saver OFF	Starting editor with battery saver ON
	.

I also left a comment about a couple of issues I saw on the WPAndroid PR, but those issues are almost certainly not related to your changes.

# Conflicts: # gutenberg # react-native-gutenberg-bridge/android/src/main/java/org/wordpress/mobile/WPAndroidGlue/WPAndroidGlueCode.java

# Conflicts: # gutenberg

marecar3 · 2020-03-12T21:16:26Z

Hey @mchowning!

Thanks for the good review! I have found where is the problem and now it should be fixed.

Please, can you do another iteration of testing? Thanks!

mchowning

Looks good! The issue with the editor not immediately switching themes when battery mode is changed is now fixed. Great work @marecar3 !

I did notice that the WPAndroid PR already got merged. Should we open a new WPAndroid PR once this gets merged so that we can update that to use the merged hash? (might not be necessary since the WPAndroid PR is only targetting a feature branch)

Update release notes

marecar3 · 2020-03-19T08:29:09Z

RELEASE-NOTES.txt

@@ -5,10 +5,10 @@
 1.24.0
 ------
 * New block: Latest Posts
-* [Android] Can now scroll post when in landscape orientation with the soft keyboard displayed


This shouldn't be part of release notes as it was removed: https://github.com/wordpress-mobile/gutenberg-mobile/pull/1989/files#diff-a3d054590c32de57d87be233927e755dL3
But for some reason, it was reverted from revert.

marecar3 · 2020-03-19T08:48:37Z

Looks good! The issue with the editor not immediately switching themes when battery mode is changed is now fixed. Great work @marecar3 !

I did notice that the WPAndroid PR already got merged. Should we open a new WPAndroid PR once this gets merged so that we can update that to use the merged hash? (might not be necessary since the WPAndroid PR is only targetting a feature branch)

Hey @mchowning, thanks for asking!
@khaykov has opened a new PR wordpress-mobile/WordPress-Android#11469 where we will use a merged hash.

This reverts commit e288c45.

marecar3 added 2 commits December 21, 2019 22:31

Update gb reference

bd548aa

create preferred color scheme bridge method to get android app theme

4a1a2b9

marecar3 mentioned this pull request Dec 21, 2019

[RNMobile] - Implements Dark Mode on Android platform WordPress/gutenberg#19293

Merged

6 tasks

marecar3 added 3 commits December 21, 2019 22:50

Update release notes

549cca0

Update gb reference

ff9c5fa

Fix failed tests

21272a3

marecar3 mentioned this pull request Dec 21, 2019

Gutenberg/dark mode integration wordpress-mobile/WordPress-Android#11004

Merged

2 tasks

marecar3 added 3 commits December 25, 2019 14:00

Merge branch 'develop' into feature/1675-dark_mode_android_integration

c946228

# Conflicts: # gutenberg

Update gb reference

f49003e

Update gb reference

f86d63e

marecar3 requested review from cameronvoell, mchowning, etoledom, hypest and maxme and removed request for cameronvoell and mchowning December 25, 2019 16:21

marecar3 added the Dark mode label Dec 25, 2019

marecar3 marked this pull request as ready for review December 25, 2019 16:22

marecar3 added 3 commits December 26, 2019 17:54

Merge branch 'develop' into feature/1675-dark_mode_android_integration

3a99499

# Conflicts: # gutenberg

Set preferred color scheme from system settings

83dcff1

Set background color to react root view

a25de0f

marecar3 added 4 commits January 8, 2020 11:27

Merge branch 'develop' into feature/1675-dark_mode_android_integration

5c85940

# Conflicts: # gutenberg

Update gb reference

8354f16

Merge branch 'develop' into feature/1675-dark_mode_android_integration

1b3d7f6

Update gb reference

980e594

marecar3 added 6 commits February 6, 2020 14:31

Update gb reference

f2a56dd

Merge branch 'develop' into feature/1675-dark_mode_android_integration

23ebe85

# Conflicts: # gutenberg

Merge branch 'develop' into feature/1675-dark_mode_android_integration

0e42546

# Conflicts: # gutenberg

Update gb reference

1942f88

Merge branch 'develop' into feature/1675-dark_mode_android_integration

40e30eb

# Conflicts: # gutenberg

Update gb reference

2943771

etoledom approved these changes Feb 17, 2020

View reviewed changes

mchowning reviewed Mar 9, 2020

View reviewed changes

marecar3 added 10 commits March 10, 2020 19:01

Merge branch 'develop' into feature/1675-dark_mode_android_integration

855baa6

# Conflicts: # gutenberg # react-native-gutenberg-bridge/android/src/main/java/org/wordpress/mobile/WPAndroidGlue/WPAndroidGlueCode.java

Update gb reference

d9f164c

Merge branch 'develop' into feature/1675-dark_mode_android_integration

89c1988

# Conflicts: # gutenberg

Update gb reference

8039d4d

Merge branch 'develop' into feature/1675-dark_mode_android_integration

eb2cf38

# Conflicts: # gutenberg

Update gb reference

064827b

Set fields final

4ff2cb4

Update dark mode state when battery saver settings are changed

06d5e59

Merge branch 'develop' into feature/1675-dark_mode_android_integration

e5fe193

# Conflicts: # gutenberg

Update gutenberg reference

ad09ab0

mchowning approved these changes Mar 15, 2020

View reviewed changes

marecar3 added 2 commits March 19, 2020 09:13

Point gb reference to master

7855ec1

Update release notes

Merge branch 'develop' into feature/1675-dark_mode_android_integration

047913f

marecar3 commented Mar 19, 2020

View reviewed changes

marecar3 merged commit e288c45 into develop Mar 19, 2020

marecar3 deleted the feature/1675-dark_mode_android_integration branch March 20, 2020 09:57

marecar3 mentioned this pull request Mar 20, 2020

1.24.0 Release -> Master #2025

Merged

7 tasks

jbinda added a commit that referenced this pull request Mar 24, 2020

Revert "Feature/1675 dark mode android integration (#1717)"

772a66f

This reverts commit e288c45.

marecar3 mentioned this pull request Mar 25, 2020

[RNMobile] - Implements Dark Mode on Android platform WordPress/gutenberg#21139

Closed

6 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feature/1675 dark mode android integration #1717

Feature/1675 dark mode android integration #1717

marecar3 commented Dec 21, 2019 •

edited

Loading

marecar3 commented Dec 25, 2019 •

edited

Loading

maxme commented Dec 31, 2019

etoledom left a comment

mchowning Mar 9, 2020 •

edited

Loading

marecar3 Mar 12, 2020

mchowning commented Mar 9, 2020

marecar3 commented Mar 12, 2020

mchowning left a comment

marecar3 Mar 19, 2020

marecar3 commented Mar 19, 2020

Feature/1675 dark mode android integration #1717

Feature/1675 dark mode android integration #1717

Conversation

marecar3 commented Dec 21, 2019 • edited Loading

marecar3 commented Dec 25, 2019 • edited Loading

maxme commented Dec 31, 2019

etoledom left a comment

Choose a reason for hiding this comment

mchowning Mar 9, 2020 • edited Loading

Choose a reason for hiding this comment

marecar3 Mar 12, 2020

Choose a reason for hiding this comment

mchowning commented Mar 9, 2020

marecar3 commented Mar 12, 2020

mchowning left a comment

Choose a reason for hiding this comment

marecar3 Mar 19, 2020

Choose a reason for hiding this comment

marecar3 commented Mar 19, 2020

marecar3 commented Dec 21, 2019 •

edited

Loading

marecar3 commented Dec 25, 2019 •

edited

Loading

mchowning Mar 9, 2020 •

edited

Loading