feat: Editor styles preferences align with web defaults

WordPress/src/main/java/org/wordpress/android/WordPressDB.java

@@ -22,7 +22,7 @@
 import java.io.OutputStream;
 
 public class WordPressDB {
-    private static final int DATABASE_VERSION = 69;
+    private static final int DATABASE_VERSION = 70;
 
 
     // Warning renaming DATABASE_NAME could break previous App backups (see: xml/backup_scheme.xml)
@@ -184,6 +184,9 @@ public WordPressDB(Context ctx) {
                 // so the table creation depended on that screen being opened. Now that we need this table in other
                 // places, we have to be sure the table exists even if PublicizeListActivity was never opened.
                 PublicizeTable.createTables(mDb);
+            case 69:
+                // add editor theme styles site setting
+                mDb.execSQL(SiteSettingsModel.ADD_USE_THEME_STYLES);
         }
         mDb.setVersion(DATABASE_VERSION);
     }

WordPress/src/main/java/org/wordpress/android/models/SiteSettingsModel.java

@@ -69,6 +69,7 @@ public class SiteSettingsModel {
     private static final String AMP_ENABLED_COLUMN_NAME = "ampEnabled";
     private static final String JETPACK_SEARCH_SUPPORTED_COLUMN_NAME = "jetpackSearchSupported";
     private static final String JETPACK_SEARCH_ENABLED_COLUMN_NAME = "jetpackSearchEnabled";
+    private static final String USE_THEME_STYLES_COLUMN_NAME = "useThemeStyles";
 
     public static final String SETTINGS_TABLE_NAME = "site_settings";
 
@@ -104,6 +105,8 @@ public class SiteSettingsModel {
                                                    + " add " + JETPACK_SEARCH_SUPPORTED_COLUMN_NAME + " BOOLEAN;";
     public static final String ADD_SITE_ICON = "alter table " + SETTINGS_TABLE_NAME
                                                + " add " + SITE_ICON_COLUMN_NAME + " INTEGER;";
+    public static final String ADD_USE_THEME_STYLES = "alter table " + SETTINGS_TABLE_NAME
+                                                      + " add " + USE_THEME_STYLES_COLUMN_NAME + " BOOLEAN DEFAULT 1;";
 
     public static final String CREATE_SETTINGS_TABLE_SQL =
             "CREATE TABLE IF NOT EXISTS "
@@ -194,6 +197,7 @@ public class SiteSettingsModel {
     public boolean ampEnabled;
     public boolean jetpackSearchSupported;
     public boolean jetpackSearchEnabled;
+    public boolean useThemeStyles = true;
     public String quotaDiskSpace;
 
     @Override
@@ -238,6 +242,7 @@ && equals(timezone, otherModel.timezone)
                && ampSupported == otherModel.ampSupported
                && jetpackSearchEnabled == otherModel.jetpackSearchEnabled
                && jetpackSearchSupported == otherModel.jetpackSearchSupported
+               && useThemeStyles == otherModel.useThemeStyles
                && maxLinks == otherModel.maxLinks
                && equals(defaultPostFormat, otherModel.defaultPostFormat)
                && holdForModeration != null
@@ -303,6 +308,7 @@ public void copyFrom(SiteSettingsModel other) {
         ampEnabled = other.ampEnabled;
         jetpackSearchSupported = other.jetpackSearchSupported;
         jetpackSearchEnabled = other.jetpackSearchEnabled;
+        useThemeStyles = other.useThemeStyles;
         if (other.holdForModeration != null) {
             holdForModeration = new ArrayList<>(other.holdForModeration);
         }
@@ -367,6 +373,7 @@ public void deserializeOptionsDatabaseCursor(Cursor cursor, SparseArrayCompat<Ca
         ampEnabled = getBooleanFromCursor(cursor, AMP_ENABLED_COLUMN_NAME);
         jetpackSearchSupported = getBooleanFromCursor(cursor, JETPACK_SEARCH_SUPPORTED_COLUMN_NAME);
         jetpackSearchEnabled = getBooleanFromCursor(cursor, JETPACK_SEARCH_ENABLED_COLUMN_NAME);
+        useThemeStyles = getBooleanFromCursor(cursor, USE_THEME_STYLES_COLUMN_NAME);
 
         String moderationKeys = getStringFromCursor(cursor, MODERATION_KEYS_COLUMN_NAME);
         String denylistKeys = getStringFromCursor(cursor, DENYLIST_KEYS_COLUMN_NAME);
@@ -459,6 +466,7 @@ public ContentValues serializeToDatabase() {
         values.put(AMP_ENABLED_COLUMN_NAME, ampEnabled);
         values.put(JETPACK_SEARCH_SUPPORTED_COLUMN_NAME, jetpackSearchSupported);
         values.put(JETPACK_SEARCH_ENABLED_COLUMN_NAME, jetpackSearchEnabled);
+        values.put(USE_THEME_STYLES_COLUMN_NAME, useThemeStyles);
 
         StringBuilder moderationKeys = new StringBuilder();
         if (holdForModeration != null) {

WordPress/src/main/java/org/wordpress/android/ui/posts/GutenbergKitActivity.kt

@@ -169,10 +169,8 @@ import org.wordpress.android.ui.posts.reactnative.ReactNativeRequestHandler
 import org.wordpress.android.ui.posts.sharemessage.EditJetpackSocialShareMessageActivity
 import org.wordpress.android.ui.posts.sharemessage.EditJetpackSocialShareMessageActivity.Companion.createIntent
 import org.wordpress.android.ui.prefs.AppPrefs
-import org.wordpress.android.ui.prefs.experimentalfeatures.ExperimentalFeatures.Feature
 import org.wordpress.android.ui.prefs.SiteSettingsInterface
 import org.wordpress.android.ui.prefs.SiteSettingsInterface.SiteSettingsListener
-import org.wordpress.android.ui.prefs.experimentalfeatures.ExperimentalFeatures
 import org.wordpress.android.ui.reader.utils.ReaderUtilsWrapper
 import org.wordpress.android.ui.suggestion.SuggestionActivity
 import org.wordpress.android.ui.suggestion.SuggestionType
@@ -208,7 +206,6 @@ import org.wordpress.android.util.analytics.AnalyticsTrackerWrapper
 import org.wordpress.android.util.analytics.AnalyticsUtils
 import org.wordpress.android.util.analytics.AnalyticsUtils.BlockEditorEnabledSource
 import org.wordpress.android.util.config.ContactSupportFeatureConfig
-import org.wordpress.android.util.config.GutenbergKitFeature
 import org.wordpress.android.util.config.GutenbergKitPluginsFeature
 import org.wordpress.android.util.config.PostConflictResolutionFeatureConfig
 import org.wordpress.android.util.extensions.setLiftOnScrollTargetViewIdAndRequestLayout
@@ -378,9 +375,7 @@ class GutenbergKitActivity : BaseAppCompatActivity(), EditorImageSettingsListene
 
     @Inject lateinit var postConflictResolutionFeatureConfig: PostConflictResolutionFeatureConfig
 
-    @Inject lateinit var gutenbergKitFeature: GutenbergKitFeature
     @Inject lateinit var gutenbergKitPluginsFeature: GutenbergKitPluginsFeature
-    @Inject lateinit var experimentalFeatures: ExperimentalFeatures
 
     @Inject lateinit var activityNavigator: ActivityNavigator
 
@@ -2279,9 +2274,7 @@ class GutenbergKitActivity : BaseAppCompatActivity(), EditorImageSettingsListene
 
             val featureConfig = GutenbergKitSettingsBuilder.FeatureConfig(
                 isPluginsFeatureEnabled = gutenbergKitPluginsFeature.isEnabled(),
-                isThemeStylesFeatureEnabled = experimentalFeatures.isEnabled(
-                    Feature.EXPERIMENTAL_BLOCK_EDITOR_THEME_STYLES
-                )
+                isThemeStylesFeatureEnabled = siteSettings?.useThemeStyles ?: true
             )
 
             val appConfig = GutenbergKitSettingsBuilder.AppConfig(

WordPress/src/main/java/org/wordpress/android/ui/posts/GutenbergKitWarmupHelper.kt

@@ -8,8 +8,6 @@ import org.wordpress.android.fluxc.model.SiteModel
 import org.wordpress.android.fluxc.network.UserAgent
 import org.wordpress.android.fluxc.store.AccountStore
 import org.wordpress.android.modules.BG_THREAD
-import org.wordpress.android.ui.prefs.experimentalfeatures.ExperimentalFeatures
-import org.wordpress.android.ui.prefs.experimentalfeatures.ExperimentalFeatures.Feature
 import org.wordpress.android.util.AppLog
 import org.wordpress.android.util.AppLog.T
 import org.wordpress.android.util.PerAppLocaleManager
@@ -33,7 +31,6 @@ class GutenbergKitWarmupHelper @Inject constructor(
     private val perAppLocaleManager: PerAppLocaleManager,
     private val gutenbergKitFeatureChecker: GutenbergKitFeatureChecker,
     private val gutenbergKitPluginsFeature: GutenbergKitPluginsFeature,
-    private val experimentalFeatures: ExperimentalFeatures,
     @Named(BG_THREAD) private val bgDispatcher: CoroutineDispatcher
 ) {
     private var lastWarmedUpSiteId: Long? = null
@@ -141,9 +138,8 @@ class GutenbergKitWarmupHelper @Inject constructor(
 
         val featureConfig = GutenbergKitSettingsBuilder.FeatureConfig(
             isPluginsFeatureEnabled = gutenbergKitPluginsFeature.isEnabled(),
-            isThemeStylesFeatureEnabled = experimentalFeatures.isEnabled(
-                Feature.EXPERIMENTAL_BLOCK_EDITOR_THEME_STYLES
-            )
+            // Default to true during warmup; actual value will be used when editor launches
+            isThemeStylesFeatureEnabled = true
         )
 
         val settings = GutenbergKitSettingsBuilder.buildSettings(

WordPress/src/main/java/org/wordpress/android/ui/prefs/SiteSettingsFragment.java

@@ -81,6 +81,7 @@
 import org.wordpress.android.ui.bloggingreminders.BloggingRemindersViewModel;
 import org.wordpress.android.ui.jetpackoverlay.JetpackFeatureRemovalPhaseHelper;
 import org.wordpress.android.ui.plans.PlansConstants;
+import org.wordpress.android.ui.posts.GutenbergKitFeatureChecker;
 import org.wordpress.android.ui.prefs.EditTextPreferenceWithValidation.ValidationType;
 import org.wordpress.android.ui.prefs.SiteSettingsFormatDialog.FormatType;
 import org.wordpress.android.ui.prefs.homepage.HomepageSettingsDialog;
@@ -193,6 +194,7 @@
     @Inject UiHelpers mUiHelpers;
     @Inject JetpackFeatureRemovalPhaseHelper mJetpackFeatureRemovalPhaseHelper;
     @Inject BloggingPromptsSettingsHelper mPromptsSettingsHelper;
+    @Inject GutenbergKitFeatureChecker mGutenbergKitFeatureChecker;
 
     private BloggingRemindersViewModel mBloggingRemindersViewModel;
 
@@ -226,6 +228,7 @@
 
     // Writing settings
     private WPSwitchPreference mGutenbergDefaultForNewPosts;
+    private WPSwitchPreference mUseThemeStylesPref;
     private DetailListPreference mCategoryPref;
     private DetailListPreference mFormatPref;
     private WPPreference mDateFormatPref;
@@ -236,8 +239,8 @@
     private Preference mTimezonePref;
     private Preference mBloggingRemindersPref;
     private Preference mPostsPerPagePref;
     private WPSwitchPreference mAmpPref;
     private Preference mCategoriesPref;
 
     // Media settings
     private EditTextPreference mSiteQuotaSpacePref;
@@ -844,6 +847,8 @@
                     mSite, BlockEditorEnabledSource.VIA_SITE_SETTINGS.asPropertyMap());
             // we need to refresh metadata as gutenberg_enabled is now part of the user data
             AnalyticsUtils.refreshMetadata(mAccountStore, mSiteStore);
+        } else if (preference == mUseThemeStylesPref) {
+            mSiteSettings.setUseThemeStyles((Boolean) newValue);
         } else if (preference == mBloggingPromptsPref) {
             final boolean isEnabled = (boolean) newValue;
             mPromptsSettingsHelper.updatePromptsCardEnabledBlocking(mSite.getId(), isEnabled);
@@ -1029,6 +1034,10 @@
                 (WPSwitchPreference) getChangePref(R.string.pref_key_gutenberg_default_for_new_posts);
         mGutenbergDefaultForNewPosts.setChecked(SiteUtils.isBlockEditorDefaultForNewPost(mSite));
 
+        mUseThemeStylesPref =
+                (WPSwitchPreference) getChangePref(R.string.pref_key_use_theme_styles);
+        mUseThemeStylesPref.setChecked(mSiteSettings.getUseThemeStyles());
+
         mSiteAcceleratorSettings = (PreferenceScreen) getClickPref(R.string.pref_key_site_accelerator_settings);
         mSiteAcceleratorSettingsNested =
                 (PreferenceScreen) getClickPref(R.string.pref_key_site_accelerator_settings_nested);
@@ -1070,6 +1079,11 @@
             WPPrefUtils.removePreference(this, R.string.pref_key_homepage, R.string.pref_key_homepage_settings);
         }
 
+        // hide theme styles preference if GutenbergKit is not enabled
+        if (!mGutenbergKitFeatureChecker.isGutenbergKitEnabled()) {
+            WPPrefUtils.removePreference(this, R.string.pref_key_site_editor, R.string.pref_key_use_theme_styles);
+        }
+
         // hide Admin options depending of capabilities on this site
         if ((!isAccessedViaWPComRest && !mSite.isSelfHostedAdmin())
             || (isAccessedViaWPComRest && !mSite.getHasCapabilityManageOptions())) {
@@ -1190,7 +1204,7 @@
                 mDateFormatPref, mTimeFormatPref, mTimezonePref, mBloggingRemindersPref, mPostsPerPagePref, mAmpPref,
                 mDeleteSitePref, mJpMonitorActivePref, mJpMonitorEmailNotesPref, mJpSsoPref,
                 mJpMonitorWpNotesPref, mJpBruteForcePref, mJpAllowlistPref, mJpMatchEmailPref, mJpUseTwoFactorPref,
-                mGutenbergDefaultForNewPosts, mHomepagePref, mBloggingPromptsPref
+                mGutenbergDefaultForNewPosts, mUseThemeStylesPref, mHomepagePref, mBloggingPromptsPref
         };
 
         for (Preference preference : editablePreference) {
@@ -1534,6 +1548,7 @@
         mWeekStartPref.setValue(mSiteSettings.getStartOfWeek());
         mWeekStartPref.setSummary(mWeekStartPref.getEntry());
         mGutenbergDefaultForNewPosts.setChecked(SiteUtils.isBlockEditorDefaultForNewPost(mSite));
+        mUseThemeStylesPref.setChecked(mSiteSettings.getUseThemeStyles());
         setAdFreeHostingChecked(mSiteSettings.isAdFreeHostingEnabled());
         boolean checked = mSiteSettings.isImprovedSearchEnabled() || mSiteSettings.getJetpackSearchEnabled();
         mImprovedSearch.setChecked(checked);
@@ -2153,8 +2168,6 @@
     private void removeEditorPreferences() {
         WPPrefUtils.removePreference(this, R.string.pref_key_site_editor,
                 R.string.pref_key_gutenberg_default_for_new_posts);
-        WPPrefUtils.removePreference(this, R.string.pref_key_site_screen,
-                R.string.pref_key_site_editor);
     }
 
     private void removeCategoriesPreference() {

WordPress/src/main/java/org/wordpress/android/ui/prefs/SiteSettingsInterface.java

@@ -620,6 +620,14 @@ public void setJetpackSearchEnabled(boolean enabled) {
         mSettings.jetpackSearchEnabled = enabled;
     }
 
+    public boolean getUseThemeStyles() {
+        return mSettings.useThemeStyles;
+    }
+
+    public void setUseThemeStyles(boolean enabled) {
+        mSettings.useThemeStyles = enabled;
+    }
+
     public boolean isJetpackMonitorEnabled() {
         return mJpSettings.monitorActive;
     }

WordPress/src/main/java/org/wordpress/android/ui/prefs/WPComSiteSettings.java

@@ -181,9 +181,11 @@ public void onResponse(JSONObject response) {
 
                             // Local settings
                             boolean location = mSettings.location;
+                            boolean useThemeStyles = mSettings.useThemeStyles;
                             mSettings.copyFrom(mRemoteSettings);
                             mSettings.postFormats = currentPostFormats;
                             mSettings.location = location;
+                            mSettings.useThemeStyles = useThemeStyles;
 
                             SiteSettingsTable.saveSettings(mSettings);
                         }

WordPress/src/main/java/org/wordpress/android/ui/prefs/experimentalfeatures/ExperimentalFeatures.kt

@@ -30,11 +30,6 @@ class ExperimentalFeatures @Inject constructor(
             R.string.experimental_block_editor,
             R.string.experimental_block_editor_description
         ),
-        EXPERIMENTAL_BLOCK_EDITOR_THEME_STYLES(
-            "experimental_block_editor_theme_styles",
-            R.string.experimental_block_editor_theme_styles,
-            R.string.experimental_block_editor_theme_styles_description
-        ),
         EXPERIMENTAL_APPLICATION_PASSWORD_FEATURE(
             "experimental_application_password_feature",
             R.string.experimental_application_password_feature,

WordPress/src/main/res/values/key_strings.xml

@@ -56,6 +56,7 @@
     <string name="pref_key_site_image_quality" translatable="false">wp_pref_site_default_image_quality</string>
     <string name="pref_key_optimize_video" translatable="false">wp_pref_key_optimize_video</string>
     <string name="pref_key_gutenberg_default_for_new_posts" translatable="false">wp_pref_key_gutenberg_default_for_new_posts</string>
+    <string name="pref_key_use_theme_styles" translatable="false">wp_pref_key_use_theme_styles</string>
     <string name="pref_key_site_video_width" translatable="false">wp_pref_site_default_video_width</string>
     <string name="pref_key_site_video_encoder_bitrate" translatable="false">wp_pref_site_default_encoder_bitrate</string>
     <string name="pref_key_site_discussion" translatable="false">wp_pref_site_discussion</string>

WordPress/src/main/res/values/strings.xml

@@ -702,6 +702,8 @@
     <string name="site_settings_amp_summary">Your WordPress.com site supports the use of Accelerated Mobile Pages, a Google-led initiative that dramatically speeds up loading times on mobile devices</string>
     <string name="site_settings_gutenberg_default_for_new_posts">Use Block Editor</string>
     <string name="site_settings_gutenberg_default_for_new_posts_summary">Edit new posts and pages with the block editor</string>
+    <string name="site_settings_use_theme_styles">Use Theme Styles</string>
+    <string name="site_settings_use_theme_styles_summary">Make the block editor look like your theme</string>
     <string name="site_settings_password_updated">Password updated</string>
     <string name="site_settings_update_password_message">To reconnect the app to your self-hosted site, enter the site\'s new password here.</string>
     <string name="site_settings_homepage_settings">Homepage Settings</string>
@@ -971,8 +973,6 @@
     <string name="experimental_block_editor_note">Experimental block editor will become the default in a future release and the ability to disable it will be removed.</string>
     <string name="experimental_block_editor">Experimental block editor</string>
     <string name="experimental_block_editor_description">Access additional block types and settings</string>
-    <string name="experimental_block_editor_theme_styles">Experimental block editor styles</string>
-    <string name="experimental_block_editor_theme_styles_description">Apply theme styles to the editor</string>
     <string name="experimental_block_editor_plugins">Experimental block editor plugins</string>
     <string name="experimental_features_feedback_dialog_title">Share feedback</string>
     <string name="experimental_features_feedback_dialog_message">Are you willing to share feedback on the experimental editor?</string>

WordPress/src/main/res/xml/site_settings.xml

@@ -132,6 +132,12 @@
             android:summary="@string/site_settings_gutenberg_default_for_new_posts_summary"
             android:title="@string/site_settings_gutenberg_default_for_new_posts" />
 
+        <org.wordpress.android.ui.prefs.WPSwitchPreference
+            android:id="@+id/pref_use_theme_styles"
+            android:key="@string/pref_key_use_theme_styles"
+            android:summary="@string/site_settings_use_theme_styles_summary"
+            android:title="@string/site_settings_use_theme_styles" />
+
     </PreferenceCategory>
 
     <!-- Writing Settings -->

WordPress/src/test/java/org/wordpress/android/ui/prefs/experimentalfeatures/ExperimentalFeaturesViewModelTest.kt

@@ -69,14 +69,12 @@ class ExperimentalFeaturesViewModelTest : BaseUnitTest() {
     @Test
     fun `init loads enabled state from experimental features`() = test {
         whenever(experimentalFeatures.isEnabled(Feature.EXPERIMENTAL_BLOCK_EDITOR)).thenReturn(true)
-        whenever(experimentalFeatures.isEnabled(Feature.EXPERIMENTAL_BLOCK_EDITOR_THEME_STYLES)).thenReturn(false)
 
         createViewModel()
 
         val states = viewModel.switchStates.value
 
         assertThat(states[Feature.EXPERIMENTAL_BLOCK_EDITOR]).isTrue()
-        assertThat(states[Feature.EXPERIMENTAL_BLOCK_EDITOR_THEME_STYLES]).isFalse()
     }
 
     @Test
@@ -145,7 +143,6 @@ class ExperimentalFeaturesViewModelTest : BaseUnitTest() {
     @Test
     fun `state flow emits correct initial state`() = test {
         whenever(experimentalFeatures.isEnabled(Feature.EXPERIMENTAL_BLOCK_EDITOR)).thenReturn(true)
-        whenever(experimentalFeatures.isEnabled(Feature.EXPERIMENTAL_BLOCK_EDITOR_THEME_STYLES)).thenReturn(false)
 
         createViewModel()