feat(core): add i18n to descriptions of experimental feature (#8788)

close AF-1554 AF-1556 OPE-185
This commit is contained in:
JimmFly
2024-11-12 06:53:46 +00:00
parent 51b00c476c
commit 2ee2cbfe36
5 changed files with 202 additions and 90 deletions

View File

@@ -8,8 +8,10 @@ const isMobile = BUILD_CONFIG.isMobileEdition;
export const AFFINE_FLAGS = {
enable_ai: {
category: 'affine',
displayName: 'Enable AI',
description: 'Enable or disable ALL AI features.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-ai.name',
description:
'com.affine.settings.workspace.experimental-features.enable-ai.description',
hide: true,
configurable: true,
defaultState: true,
@@ -17,77 +19,96 @@ export const AFFINE_FLAGS = {
enable_database_full_width: {
category: 'blocksuite',
bsFlag: 'enable_database_full_width',
displayName: 'Database Full Width',
description: 'The database will be displayed in full-width mode.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-database-full-width.name',
description:
'com.affine.settings.workspace.experimental-features.enable-database-full-width.description',
configurable: isCanaryBuild,
},
enable_database_attachment_note: {
category: 'blocksuite',
bsFlag: 'enable_database_attachment_note',
displayName: 'Database Attachment Note',
description: 'Allows adding notes to database attachments.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-database-attachment-note.name',
description:
'com.affine.settings.workspace.experimental-features.enable-database-attachment-note.description',
configurable: isNotStableBuild,
},
enable_block_query: {
category: 'blocksuite',
bsFlag: 'enable_block_query',
displayName: 'Todo Block Query',
description: 'Enables querying of todo blocks.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-block-query.name',
description:
'com.affine.settings.workspace.experimental-features.enable-block-query.description',
configurable: isCanaryBuild,
},
enable_synced_doc_block: {
category: 'blocksuite',
bsFlag: 'enable_synced_doc_block',
displayName: 'Synced Doc Block',
description: 'Enables syncing of doc blocks.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-synced-doc-block.name',
description:
'com.affine.settings.workspace.experimental-features.enable-synced-doc-block.description',
configurable: false,
defaultState: true,
},
enable_edgeless_text: {
category: 'blocksuite',
bsFlag: 'enable_edgeless_text',
displayName: 'Edgeless Text',
description: 'Enables edgeless text blocks.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-edgeless-text.name',
description:
'com.affine.settings.workspace.experimental-features.enable-edgeless-text.description',
configurable: false,
defaultState: true,
},
enable_color_picker: {
category: 'blocksuite',
bsFlag: 'enable_color_picker',
displayName: 'Color Picker',
description: 'Enables color picker blocks.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-color-picker.name',
description:
'com.affine.settings.workspace.experimental-features.enable-color-picker.description',
configurable: false,
defaultState: true,
},
enable_ai_chat_block: {
category: 'blocksuite',
bsFlag: 'enable_ai_chat_block',
displayName: 'AI Chat Block',
description: 'Enables AI chat blocks.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-ai-chat-block.name',
description:
'com.affine.settings.workspace.experimental-features.enable-ai-chat-block.description',
configurable: false,
defaultState: true,
},
enable_ai_onboarding: {
category: 'blocksuite',
bsFlag: 'enable_ai_onboarding',
displayName: 'AI Onboarding',
description: 'Enables AI onboarding.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-ai-onboarding.name',
description:
'com.affine.settings.workspace.experimental-features.enable-ai-onboarding.description',
configurable: false,
defaultState: true,
},
enable_mind_map_import: {
category: 'blocksuite',
bsFlag: 'enable_mind_map_import',
displayName: 'Mind Map Import',
description: 'Enables mind map import.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-mind-map-import.name',
description:
'com.affine.settings.workspace.experimental-features.enable-mind-map-import.description',
configurable: false,
defaultState: true,
},
enable_multi_view: {
category: 'affine',
displayName: 'Split View',
displayName:
'com.affine.settings.workspace.experimental-features.enable-multi-view.name',
description:
'The Split View feature enables you to divide your tab into multiple sections for simultaneous viewing and editing of different documents.',
'com.affine.settings.workspace.experimental-features.enable-multi-view.description',
feedbackType: 'discord',
feedbackLink:
'https://discord.com/channels/959027316334407691/1280009690004324405',
@@ -96,9 +117,11 @@ export const AFFINE_FLAGS = {
},
enable_emoji_folder_icon: {
category: 'affine',
displayName: 'Emoji Folder Icon',
displayName:
'com.affine.settings.workspace.experimental-features.enable-emoji-folder-icon.name',
description:
'Once enabled, you can use an emoji as the folder icon. When the first character of the folder name is an emoji, it will be extracted and used as its icon.',
'com.affine.settings.workspace.experimental-features.enable-emoji-folder-icon.description',
feedbackType: 'discord',
feedbackLink:
'https://discord.com/channels/959027316334407691/1280014319865696351/1280014319865696351',
@@ -107,9 +130,10 @@ export const AFFINE_FLAGS = {
},
enable_emoji_doc_icon: {
category: 'affine',
displayName: 'Emoji Doc Icon',
displayName:
'com.affine.settings.workspace.experimental-features.enable-emoji-doc-icon.name',
description:
'Once enabled, you can use an emoji as the page icon. When the first character of the folder name is an emoji, it will be extracted and used as its icon.',
'com.affine.settings.workspace.experimental-features.enable-emoji-doc-icon.description',
feedbackType: 'discord',
feedbackLink:
'https://discord.com/channels/959027316334407691/1280014319865696351',
@@ -118,63 +142,76 @@ export const AFFINE_FLAGS = {
},
enable_editor_settings: {
category: 'affine',
displayName: 'Editor Settings',
description: 'Enables editor settings.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-editor-settings.name',
description:
'com.affine.settings.workspace.experimental-features.enable-editor-settings.description',
configurable: false,
defaultState: true,
},
enable_offline_mode: {
category: 'affine',
displayName: 'Offline Mode',
displayName:
'com.affine.settings.workspace.experimental-features.enable-offline-mode.name',
description:
'Stop Connecting to the Internet. Even with AFFiNE Cloud, enabling this toggle stops internet connection and keeps everything local, but syncing will be disabled.',
'com.affine.settings.workspace.experimental-features.enable-offline-mode.description',
configurable: isDesktopEnvironment,
defaultState: false,
},
enable_theme_editor: {
category: 'affine',
displayName: 'Theme Editor',
description: 'Enables theme editor.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-theme-editor.name',
description:
'com.affine.settings.workspace.experimental-features.enable-theme-editor.description',
configurable: isCanaryBuild,
defaultState: isCanaryBuild,
},
enable_local_workspace: {
category: 'affine',
displayName: 'Allow create local workspace',
description: 'Allow create local workspace.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-local-workspace.name',
description:
'com.affine.settings.workspace.experimental-features.enable-local-workspace.description',
configurable: isCanaryBuild,
defaultState: isDesktopEnvironment || isCanaryBuild,
},
enable_advanced_block_visibility: {
category: 'blocksuite',
bsFlag: 'enable_advanced_block_visibility',
displayName: 'Advanced block visibility control',
displayName:
'com.affine.settings.workspace.experimental-features.enable-advanced-block-visibility.name',
description:
'To provide detailed control over which edgeless blocks are visible in page mode.',
'com.affine.settings.workspace.experimental-features.enable-advanced-block-visibility.description',
configurable: true,
defaultState: false,
},
enable_mobile_keyboard_toolbar: {
category: 'blocksuite',
bsFlag: 'enable_mobile_keyboard_toolbar',
displayName: 'Mobile Keyboard Toolbar',
description: 'Enables the mobile keyboard toolbar.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-mobile-keyboard-toolbar.name',
description:
'com.affine.settings.workspace.experimental-features.enable-mobile-keyboard-toolbar.description',
configurable: false,
defaultState: isMobile,
},
enable_mobile_linked_doc_menu: {
category: 'blocksuite',
bsFlag: 'enable_mobile_linked_doc_menu',
displayName: 'Mobile Linked Doc Widget',
description: 'Enables the mobile linked doc menu.',
displayName:
'com.affine.settings.workspace.experimental-features.enable-mobile-linked-doc-menu.name',
description:
'com.affine.settings.workspace.experimental-features.enable-mobile-linked-doc-menu.description',
configurable: false,
defaultState: isMobile,
},
enable_snapshot_import_export: {
category: 'affine',
displayName: 'Enable Snapshot Import Export',
displayName:
'com.affine.settings.workspace.experimental-features.enable-snapshot-import-export.name',
description:
'Once enabled, users can import and export blocksuite snapshots',
'com.affine.settings.workspace.experimental-features.enable-snapshot-import-export.description',
hide: true,
configurable: true,
defaultState: false,

View File

@@ -3,6 +3,7 @@ import { SettingRow } from '@affine/component/setting-components';
import { DesktopApiService } from '@affine/core/modules/desktop-api';
import { ThemeEditorService } from '@affine/core/modules/theme-editor';
import { UrlService } from '@affine/core/modules/url';
import { useI18n } from '@affine/i18n';
import { DeleteIcon } from '@blocksuite/icons/rc';
import {
useLiveData,
@@ -26,10 +27,12 @@ export const ThemeEditorSetting = () => {
}
}, [desktopApi, urlService]);
const t = useI18n();
return (
<SettingRow
name="Customize Theme"
desc="Edit all AFFiNE theme variables here"
name={t['com.affine.appearanceSettings.customize-theme.title']()}
desc={t['com.affine.appearanceSettings.customize-theme.description']()}
>
<div style={{ display: 'flex', gap: 16 }}>
{modified ? (
@@ -45,10 +48,12 @@ export const ThemeEditorSetting = () => {
variant="secondary"
prefix={<DeleteIcon />}
>
Reset all
{t['com.affine.appearanceSettings.customize-theme.reset']()}
</Button>
) : null}
<Button onClick={open}>Open Theme Editor</Button>
<Button onClick={open}>
{t['com.affine.appearanceSettings.customize-theme.open']()}
</Button>
</div>
</SettingRow>
);

View File

@@ -108,6 +108,7 @@ const feedbackLink: Record<NonNullable<Flag['feedbackType']>, string> = {
const ExperimentalFeaturesItem = ({ flag }: { flag: Flag }) => {
const value = useLiveData(flag.$);
const t = useI18n();
const onChange = useCallback(
(checked: boolean) => {
flag.set(checked);
@@ -127,12 +128,12 @@ const ExperimentalFeaturesItem = ({ flag }: { flag: Flag }) => {
return (
<div className={styles.rowContainer}>
<div className={styles.switchRow}>
{flag.displayName}
{t[flag.displayName]()}
<Switch checked={value} onChange={onChange} />
</div>
{!!flag.description && (
<Tooltip content={flag.description}>
<div className={styles.description}>{flag.description}</div>
<Tooltip content={t[flag.description]()}>
<div className={styles.description}>{t[flag.description]()}</div>
</Tooltip>
)}
{!!flag.feedbackType && (

View File

@@ -1,4 +1,6 @@
import { WorkspacePermissionService } from '@affine/core/modules/permissions';
import { useI18n } from '@affine/i18n';
import type { Workspace } from '@toeverything/infra';
import { useLiveData, useService, WorkspaceService } from '@toeverything/infra';
import { useEffect, useMemo } from 'react';
@@ -34,47 +36,12 @@ const Label = ({ value, background }: LabelProps) => {
</div>
);
};
export const LabelsPanel = () => {
const workspace = useService(WorkspaceService).workspace;
const permissionService = useService(WorkspacePermissionService);
const isOwner = useLiveData(permissionService.permission.isOwner$);
useEffect(() => {
permissionService.permission.revalidate();
}, [permissionService]);
const labelMap: LabelMap = useMemo(
() => ({
local: {
value: 'Local',
background: 'var(--affine-tag-orange)',
},
syncCloud: {
value: 'Sync with AFFiNE Cloud',
background: 'var(--affine-tag-blue)',
},
syncDocker: {
value: 'Sync with AFFiNE Docker',
background: 'var(--affine-tag-green)',
},
selfHosted: {
value: 'Self-Hosted Server',
background: 'var(--affine-tag-purple)',
},
joinedWorkspace: {
value: 'Joined Workspace',
background: 'var(--affine-tag-yellow)',
},
availableOffline: {
value: 'Available Offline',
background: 'var(--affine-tag-green)',
},
publishedToWeb: {
value: 'Published to Web',
background: 'var(--affine-tag-blue)',
},
}),
[]
);
const labelConditions: labelConditionsProps[] = [
const getConditions = (
isOwner: boolean | null,
workspace: Workspace
): labelConditionsProps[] => {
return [
{ condition: !isOwner, label: 'joinedWorkspace' },
{ condition: workspace.flavour === 'local', label: 'local' },
{
@@ -82,6 +49,55 @@ export const LabelsPanel = () => {
label: 'syncCloud',
},
];
};
const getLabelMap = (t: ReturnType<typeof useI18n>): LabelMap => ({
local: {
value: t['com.affine.settings.workspace.state.local'](),
background: 'var(--affine-tag-orange)',
},
syncCloud: {
value: t['com.affine.settings.workspace.state.sync-affine-cloud'](),
background: 'var(--affine-tag-blue)',
},
syncDocker: {
value: t['com.affine.settings.workspace.state.sync-affine-docker'](),
background: 'var(--affine-tag-green)',
},
selfHosted: {
value: t['com.affine.settings.workspace.state.self-hosted'](),
background: 'var(--affine-tag-purple)',
},
joinedWorkspace: {
value: t['com.affine.settings.workspace.state.joined'](),
background: 'var(--affine-tag-yellow)',
},
availableOffline: {
value: t['com.affine.settings.workspace.state.available-offline'](),
background: 'var(--affine-tag-green)',
},
publishedToWeb: {
value: t['com.affine.settings.workspace.state.published'](),
background: 'var(--affine-tag-blue)',
},
});
export const LabelsPanel = () => {
const workspace = useService(WorkspaceService).workspace;
const permissionService = useService(WorkspacePermissionService);
const isOwner = useLiveData(permissionService.permission.isOwner$);
const t = useI18n();
useEffect(() => {
permissionService.permission.revalidate();
}, [permissionService]);
const labelMap = useMemo(() => getLabelMap(t), [t]);
const labelConditions = useMemo(
() => getConditions(isOwner, workspace),
[isOwner, workspace]
);
return (
<div className={style.labelWrapper}>

View File

@@ -202,6 +202,10 @@
"com.affine.appearanceSettings.clientBorder.title": "Client border style",
"com.affine.appearanceSettings.color.description": "Choose your colour mode",
"com.affine.appearanceSettings.color.title": "Colour mode",
"com.affine.appearanceSettings.customize-theme.description": "Edit all AFFiNE theme variables here",
"com.affine.appearanceSettings.customize-theme.title": "Customize Theme",
"com.affine.appearanceSettings.customize-theme.reset": "Reset all",
"com.affine.appearanceSettings.customize-theme.open": "Open Theme Editor",
"com.affine.appearanceSettings.font.description": "Choose your font style",
"com.affine.appearanceSettings.font.title": "Font style",
"com.affine.appearanceSettings.fontStyle.mono": "Mono",
@@ -1185,8 +1189,57 @@
"com.affine.settings.workspace.experimental-features.prompt-header": "Do you want to use the plugin system that is in an experimental stage?",
"com.affine.settings.workspace.experimental-features.prompt-warning": "You are about to enable an experimental feature. This feature is still in development and may contain errors or behave unpredictably. Please proceed with caution and at your own risk.",
"com.affine.settings.workspace.experimental-features.prompt-warning-title": "WARNING MESSAGE",
"com.affine.settings.workspace.experimental-features.enable-ai.name": "Enable AI",
"com.affine.settings.workspace.experimental-features.enable-ai.description": "Enable or disable ALL AI features.",
"com.affine.settings.workspace.experimental-features.enable-database-full-width.name": "Database Full Width",
"com.affine.settings.workspace.experimental-features.enable-database-full-width.description": "The database will be displayed in full-width mode.",
"com.affine.settings.workspace.experimental-features.enable-database-attachment-note.name": "Database Attachment Note",
"com.affine.settings.workspace.experimental-features.enable-database-attachment-note.description": "Allows adding notes to database attachments.",
"com.affine.settings.workspace.experimental-features.enable-block-query.name": "Todo Block Query",
"com.affine.settings.workspace.experimental-features.enable-block-query.description": "Enables querying of todo blocks.",
"com.affine.settings.workspace.experimental-features.enable-synced-doc-block.name": "Synced Doc Block",
"com.affine.settings.workspace.experimental-features.enable-synced-doc-block.description": "Enables syncing of doc blocks.",
"com.affine.settings.workspace.experimental-features.enable-edgeless-text.name": "Edgeless Text",
"com.affine.settings.workspace.experimental-features.enable-edgeless-text.description": "Enables edgeless text blocks.",
"com.affine.settings.workspace.experimental-features.enable-color-picker.name": "Color Picker",
"com.affine.settings.workspace.experimental-features.enable-color-picker.description": "Enables color picker blocks.",
"com.affine.settings.workspace.experimental-features.enable-ai-chat-block.name": "AI Chat Block",
"com.affine.settings.workspace.experimental-features.enable-ai-chat-block.description": "Enables AI chat blocks.",
"com.affine.settings.workspace.experimental-features.enable-ai-onboarding.name": "AI Onboarding",
"com.affine.settings.workspace.experimental-features.enable-ai-onboarding.description": "Enables AI onboarding.",
"com.affine.settings.workspace.experimental-features.enable-mind-map-import.name": "Mind Map Import",
"com.affine.settings.workspace.experimental-features.enable-mind-map-import.description": "Enables mind map import.",
"com.affine.settings.workspace.experimental-features.enable-multi-view.name": "Split View",
"com.affine.settings.workspace.experimental-features.enable-multi-view.description": "The Split View feature enables you to divide your tab into multiple sections for simultaneous viewing and editing of different documents.",
"com.affine.settings.workspace.experimental-features.enable-emoji-folder-icon.name": "Emoji Folder Icon",
"com.affine.settings.workspace.experimental-features.enable-emoji-folder-icon.description": "Once enabled, you can use an emoji as the folder icon. When the first character of the folder name is an emoji, it will be extracted and used as its icon.",
"com.affine.settings.workspace.experimental-features.enable-emoji-doc-icon.name": "Emoji Doc Icon",
"com.affine.settings.workspace.experimental-features.enable-emoji-doc-icon.description": "Once enabled, you can use an emoji as the page icon. When the first character of the folder name is an emoji, it will be extracted and used as its icon.",
"com.affine.settings.workspace.experimental-features.enable-editor-settings.name": "Editor Settings",
"com.affine.settings.workspace.experimental-features.enable-editor-settings.description": "Enables editor settings.",
"com.affine.settings.workspace.experimental-features.enable-offline-mode.name": "Offline Mode",
"com.affine.settings.workspace.experimental-features.enable-offline-mode.description": "Stop Connecting to the Internet. Even with AFFiNE Cloud, enabling this toggle stops internet connection and keeps everything local, but syncing will be disabled.",
"com.affine.settings.workspace.experimental-features.enable-theme-editor.name": "Theme Editor",
"com.affine.settings.workspace.experimental-features.enable-theme-editor.description": "Enables theme editor.",
"com.affine.settings.workspace.experimental-features.enable-local-workspace.name": "Allow create local workspace",
"com.affine.settings.workspace.experimental-features.enable-local-workspace.description": "Allow create local workspace",
"com.affine.settings.workspace.experimental-features.enable-advanced-block-visibility.name": "Advanced block visibility control",
"com.affine.settings.workspace.experimental-features.enable-advanced-block-visibility.description": "To provide detailed control over which edgeless blocks are visible in page mode.",
"com.affine.settings.workspace.experimental-features.enable-mobile-keyboard-toolbar.name": "Mobile Keyboard Toolbar",
"com.affine.settings.workspace.experimental-features.enable-mobile-keyboard-toolbar.description": "Enables the mobile keyboard toolbar.",
"com.affine.settings.workspace.experimental-features.enable-mobile-linked-doc-menu.name": "Mobile Linked Doc Widget",
"com.affine.settings.workspace.experimental-features.enable-mobile-linked-doc-menu.description": "Enables the mobile linked doc menu.",
"com.affine.settings.workspace.experimental-features.enable-snapshot-import-export.name": "Enable Snapshot Import Export",
"com.affine.settings.workspace.experimental-features.enable-snapshot-import-export.description": "Once enabled, users can import and export blocksuite snapshots.",
"com.affine.settings.workspace.not-owner": "Only an owner can edit the workspace avatar and name. Changes will be shown for everyone.",
"com.affine.settings.workspace.preferences": "Preference",
"com.affine.settings.workspace.state.local": "Local",
"com.affine.settings.workspace.state.sync-affine-cloud": "Sync with AFFiNE Cloud",
"com.affine.settings.workspace.state.sync-affine-docker": "Sync with AFFiNE Docker",
"com.affine.settings.workspace.state.self-hosted": "Self-Hosted Server",
"com.affine.settings.workspace.state.joined": "Joined Workspace",
"com.affine.settings.workspace.state.available-offline": "Available Offline",
"com.affine.settings.workspace.state.published": "Published to Web",
"com.affine.settings.workspace.properties": "Properties",
"com.affine.settings.workspace.properties.add_property": "Add property",
"com.affine.settings.workspace.properties.all": "All",