fix: a serise of ui issues of new setting (#2920)

Co-authored-by: Alex Yang <himself65@outlook.com>

apps/web/src/components/affine/new-workspace-setting-detail/publish.tsx

@@ -137,9 +137,7 @@ const PublishPanelLocal: FC<PublishPanelLocalProps> = ({
           }}
           style={{ marginTop: '12px' }}
         >
-          {runtimeConfig.enableLegacyCloud
-            ? t['Enable AFFiNE Cloud']()
-            : 'Disable AFFiNE Cloud'}
+          {t['Enable AFFiNE Cloud']()}
         </Button>
       </SettingRow>
       <FakePublishPanelAffine workspace={workspace} />

apps/web/src/components/affine/setting-modal/config.ts

@@ -1,2 +0,0 @@
-// Some settings are not implemented yet, but need to show in the setting modal when boss is watching.
-export const IS_EXHIBITION = true;

apps/web/src/components/affine/setting-modal/general-setting/about/index.tsx

@@ -8,7 +8,6 @@ import { ArrowRightSmallIcon, OpenInNewIcon } from '@blocksuite/icons';
 import { useCallback } from 'react';
 
 import { type AppSetting, useAppSetting } from '../../../../../atoms/settings';
-import { IS_EXHIBITION } from '../../config';
 import { communityItem, communityWrapper, link } from './style.css';
 
 export const AboutAffine = () => {
@@ -23,7 +22,7 @@ export const AboutAffine = () => {
   return (
     <>
       <SettingHeader title={t['About AFFiNE']()} subtitle={t['None yet']()} />
-      {IS_EXHIBITION && environment.isDesktop ? (
+      {runtimeConfig.enableNewSettingUnstableApi && environment.isDesktop ? (
         <SettingWrapper title={t['Version']()}>
           <SettingRow
             name={t['Check for updates']()}

apps/web/src/components/affine/setting-modal/general-setting/appearance/index.tsx

@@ -12,7 +12,6 @@ import {
   windowFrameStyleOptions,
 } from '../../../../../atoms/settings';
 import { LanguageMenu } from '../../../language-menu';
-import { IS_EXHIBITION } from '../../config';
 import { DateFormatSetting } from './date-format-setting';
 import { settingWrapper } from './style.css';
 
@@ -70,7 +69,7 @@ export const AppearanceSettings = () => {
             <LanguageMenu />
           </div>
         </SettingRow>
-        {IS_EXHIBITION && environment.isDesktop ? (
+        {runtimeConfig.enableNewSettingUnstableApi && environment.isDesktop ? (
           <SettingRow
             name={t['Client Border Style']()}
             desc={t['Customize the appearance of the client.']()}
@@ -91,7 +90,7 @@ export const AppearanceSettings = () => {
             onChange={checked => changeSwitch('fullWidthLayout', checked)}
           />
         </SettingRow>
-        {IS_EXHIBITION && environment.isDesktop ? (
+        {runtimeConfig.enableNewSettingUnstableApi && environment.isDesktop ? (
           <SettingRow
             name={t['Window frame style']()}
             desc={t['Customize appearance of Windows Client.']()}
@@ -114,7 +113,7 @@ export const AppearanceSettings = () => {
           </SettingRow>
         ) : null}
       </SettingWrapper>
-      {IS_EXHIBITION ? (
+      {runtimeConfig.enableNewSettingUnstableApi ? (
         <SettingWrapper title={t['Date']()}>
           <SettingRow
             name={t['Date Format']()}
@@ -154,9 +153,9 @@ export const AppearanceSettings = () => {
             desc={t['None yet']()}
           >
             <Switch
-              checked={appSettings.disableBlurBackground}
+              checked={!appSettings.disableBlurBackground}
               onChange={checked =>
-                changeSwitch('disableBlurBackground', checked)
+                changeSwitch('disableBlurBackground', !checked)
               }
             />
           </SettingRow>

apps/web/src/components/affine/setting-modal/style.css.ts

@@ -3,7 +3,8 @@ import { globalStyle, style } from '@vanilla-extract/css';
 export const settingContent = style({
   flexGrow: '1',
   height: '100%',
-  padding: '40px 0',
+  padding: '40px 15px 20px',
+  overflowX: 'auto',
 });
 
 globalStyle(`${settingContent} .wrapper`, {

apps/web/src/components/workspace-header.tsx

@@ -39,7 +39,7 @@ export function WorkspaceHeader({
               }}
             />
           </div>
-          {runtimeConfig.enableAllPageFilter && (
+          {runtimeConfig.enableAllPageSaving && (
             <div>
               {setting.currentView.id !== NIL ||
               (setting.currentView.id === NIL &&