From 9db87944f2507159dd6b01df59dffb3fe11f3e34 Mon Sep 17 00:00:00 2001 From: Morn Date: Wed, 19 Mar 2025 11:23:07 +0800 Subject: [PATCH] fix: toolbar tooltip message is incorrect on Windows (#7572) * fix: some toolbar text display error * chore: change string id to enum string id --- .../custom_format_toolbar_items.dart | 39 +++++++------------ .../custom_hightlight_color_toolbar_item.dart | 7 ++-- .../custom_link_toolbar_item.dart | 6 +-- .../custom_placeholder_toolbar_item.dart | 7 ++-- .../custom_text_align_toolbar_item.dart | 6 +-- .../custom_text_color_toolbar_item.dart | 8 ++-- .../more_option_toolbar_item.dart | 8 ++-- .../text_heading_toolbar_item.dart | 6 +-- .../text_suggestions_toolbar_item.dart | 7 ++-- .../toolbar_item/toolbar_id_enum.dart | 19 +++++++++ .../document/presentation/editor_style.dart | 2 +- frontend/resources/translations/en.json | 1 - 12 files changed, 61 insertions(+), 55 deletions(-) create mode 100644 frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/toolbar_id_enum.dart diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_format_toolbar_items.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_format_toolbar_items.dart index d020468b37..a171c8ca4d 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_format_toolbar_items.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_format_toolbar_items.dart @@ -10,29 +10,30 @@ import 'package:flowy_infra_ui/style_widget/icon_button.dart'; import 'package:flutter/material.dart'; import 'custom_placeholder_toolbar_item.dart'; +import 'toolbar_id_enum.dart'; final List customMarkdownFormatItems = [ _FormatToolbarItem( - id: 'bold', + id: ToolbarId.bold, name: 'bold', svg: FlowySvgs.toolbar_bold_m, ), group1PaddingItem, _FormatToolbarItem( - id: 'underline', + id: ToolbarId.underline, name: 'underline', svg: FlowySvgs.toolbar_underline_m, ), group1PaddingItem, _FormatToolbarItem( - id: 'italic', + id: ToolbarId.italic, name: 'italic', svg: FlowySvgs.toolbar_inline_italic_m, ), ]; final ToolbarItem customInlineCodeItem = _FormatToolbarItem( - id: 'code', + id: ToolbarId.code, name: 'code', svg: FlowySvgs.toolbar_inline_code_m, group: 2, @@ -40,12 +41,12 @@ final ToolbarItem customInlineCodeItem = _FormatToolbarItem( class _FormatToolbarItem extends ToolbarItem { _FormatToolbarItem({ - required String id, + required ToolbarId id, required String name, required FlowySvgData svg, super.group = 1, }) : super( - id: 'editor.$id', + id: id.id, isActive: showInAnyTextType, builder: ( context, @@ -89,8 +90,8 @@ class _FormatToolbarItem extends ToolbarItem { if (tooltipBuilder != null) { return tooltipBuilder( context, - id, - getTooltipText(id), + id.id, + _getTooltipText(id), child, ); } @@ -99,44 +100,32 @@ class _FormatToolbarItem extends ToolbarItem { ); } -String getTooltipText(String id) { +String _getTooltipText(ToolbarId id) { switch (id) { - case 'underline': + case ToolbarId.underline: return '${LocaleKeys.toolbar_underline.tr()}${shortcutTooltips( '⌘ + U', 'CTRL + U', 'CTRL + U', )}'; - case 'bold': + case ToolbarId.bold: return '${LocaleKeys.toolbar_bold.tr()}${shortcutTooltips( '⌘ + B', 'CTRL + B', 'CTRL + B', )}'; - case 'italic': + case ToolbarId.italic: return '${LocaleKeys.toolbar_italic.tr()}${shortcutTooltips( '⌘ + I', 'CTRL + I', 'CTRL + I', )}'; - case 'strikethrough': - return '${LocaleKeys.toolbar_strike.tr()}${shortcutTooltips( - '⌘ + SHIFT + S', - 'CTRL + SHIFT + S', - 'CTRL + SHIFT + S', - )}'; - case 'code': + case ToolbarId.code: return '${LocaleKeys.document_toolbar_inlineCode.tr()}${shortcutTooltips( '⌘ + E', 'CTRL + E', 'CTRL + E', )}'; - case 'align_left': - return LocaleKeys.document_toolbar_alignLeft.tr(); - case 'align_center': - return LocaleKeys.document_toolbar_alignCenter.tr(); - case 'align_right': - return LocaleKeys.document_toolbar_alignRight.tr(); default: return ''; } diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_hightlight_color_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_hightlight_color_toolbar_item.dart index 39d216ed9c..2f2f75f0f0 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_hightlight_color_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_hightlight_color_toolbar_item.dart @@ -6,11 +6,12 @@ import 'package:appflowy_editor/appflowy_editor.dart' hide ColorPicker; import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flutter/material.dart'; -const _kHighlightColorItemId = 'editor.highlightColor'; +import 'toolbar_id_enum.dart'; + String? _customHighlightColorHex; final customHighlightColorItem = ToolbarItem( - id: _kHighlightColorItemId, + id: ToolbarId.highlightColor.id, group: 1, isActive: showInAnyTextType, builder: (context, editorState, highlightColor, iconColor, tooltipBuilder) => @@ -107,7 +108,7 @@ class _HighlightColorPickerWidgetState return widget.tooltipBuilder?.call( context, - _kHighlightColorItemId, + ToolbarId.highlightColor.id, AppFlowyEditorL10n.current.highlightColor, child, ) ?? diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_link_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_link_toolbar_item.dart index f6dc8bce7b..c7fa1a34cc 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_link_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_link_toolbar_item.dart @@ -4,10 +4,10 @@ import 'package:appflowy_editor/appflowy_editor.dart'; import 'package:flowy_infra_ui/style_widget/icon_button.dart'; import 'package:flutter/material.dart'; -const _kLinkItemId = 'editor.link'; +import 'toolbar_id_enum.dart'; final customLinkItem = ToolbarItem( - id: _kLinkItemId, + id: ToolbarId.link.id, group: 4, isActive: onlyShowInSingleSelectionAndTextType, builder: (context, editorState, highlightColor, iconColor, tooltipBuilder) { @@ -39,7 +39,7 @@ final customLinkItem = ToolbarItem( if (tooltipBuilder != null) { return tooltipBuilder( context, - _kLinkItemId, + ToolbarId.highlightColor.id, AppFlowyEditorL10n.current.link, child, ); diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_placeholder_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_placeholder_toolbar_item.dart index 2253ac7f75..898f442891 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_placeholder_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_placeholder_toolbar_item.dart @@ -4,11 +4,10 @@ import 'package:appflowy_editor/appflowy_editor.dart'; import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flutter/material.dart'; -const placeholderItemId = 'editor.placeholder'; -const paddingPlaceholderItemId = 'editor.padding_placeholder'; +import 'toolbar_id_enum.dart'; final ToolbarItem customPlaceholderItem = ToolbarItem( - id: placeholderItemId, + id: ToolbarId.placeholder.id, group: -1, isActive: (editorState) => true, builder: (context, __, ___, ____, _____) { @@ -28,7 +27,7 @@ ToolbarItem buildPaddingPlaceholderItem( bool Function(EditorState editorState)? isActive, }) => ToolbarItem( - id: paddingPlaceholderItemId, + id: ToolbarId.paddingPlaceHolder.id, group: group, isActive: isActive, builder: (context, __, ___, ____, _____) => HSpace(4), diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_align_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_align_toolbar_item.dart index 659f637250..74198cb46b 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_align_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_align_toolbar_item.dart @@ -6,10 +6,10 @@ import 'package:easy_localization/easy_localization.dart'; import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flutter/material.dart'; -const _kTextAlignItemId = 'editor.text_align'; +import 'toolbar_id_enum.dart'; final ToolbarItem customTextAlignItem = ToolbarItem( - id: _kTextAlignItemId, + id: ToolbarId.textAlign.id, group: 4, isActive: onlyShowInSingleSelectionAndTextType, builder: ( @@ -114,7 +114,7 @@ class _TextAlignActionListState extends State { return widget.tooltipBuilder?.call( context, - _kTextAlignItemId, + ToolbarId.textAlign.id, LocaleKeys.document_toolbar_textAlign.tr(), child, ) ?? diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_color_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_color_toolbar_item.dart index 4b266eaa8e..189cf64bd4 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_color_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/custom_text_color_toolbar_item.dart @@ -7,12 +7,12 @@ import 'package:appflowy_editor/appflowy_editor.dart' hide ColorPicker; import 'package:easy_localization/easy_localization.dart'; import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flutter/material.dart'; +import 'toolbar_id_enum.dart'; -const _kTextColorItemId = 'editor.textColor'; String? _customColorHex; final customTextColorItem = ToolbarItem( - id: _kTextColorItemId, + id: ToolbarId.textColor.id, group: 1, isActive: showInAnyTextType, builder: (context, editorState, highlightColor, iconColor, tooltipBuilder) => @@ -106,8 +106,8 @@ class _TextColorPickerWidgetState extends State { return widget.tooltipBuilder?.call( context, - _kTextColorItemId, - AppFlowyEditorL10n.current.textColor, + ToolbarId.textColor.id, + LocaleKeys.document_toolbar_textColor.tr(), child, ) ?? child; diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/more_option_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/more_option_toolbar_item.dart index 6ac63254f9..f844080a98 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/more_option_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/more_option_toolbar_item.dart @@ -165,8 +165,8 @@ class _MoreOptionActionListState extends State { rightIcon: FlowyText( shortcutTooltips( '⌘⇧S', - 'CTRL+SHIFT+S', - 'CTRL+SHIFT+S', + 'Ctrl⇧S', + 'Ctrl⇧S', ).trim(), color: fontColor, fontSize: 12, @@ -180,8 +180,8 @@ class _MoreOptionActionListState extends State { rightIcon: FlowyText( shortcutTooltips( '⌘⇧E', - 'CTRL+SHIFT+E', - 'CTRL+SHIFT+E', + 'Ctrl⇧E', + 'Ctrl⇧E', ).trim(), color: fontColor, fontSize: 12, diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_heading_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_heading_toolbar_item.dart index d7be4b23fd..4367ddb489 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_heading_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_heading_toolbar_item.dart @@ -8,10 +8,10 @@ import 'package:easy_localization/easy_localization.dart'; import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flutter/material.dart'; -const _kTextHeadingItemId = 'editor.text_heading'; +import 'toolbar_id_enum.dart'; final ToolbarItem customTextHeadingItem = ToolbarItem( - id: _kTextHeadingItemId, + id: ToolbarId.textHeading.id, group: 1, isActive: onlyShowInSingleTextTypeSelectionAndExcludeTable, builder: ( @@ -109,7 +109,7 @@ class _TextHeadingActionListState extends State { return widget.tooltipBuilder?.call( context, - _kTextHeadingItemId, + ToolbarId.textHeading.id, LocaleKeys.document_toolbar_textSize.tr(), child, ) ?? diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_suggestions_toolbar_item.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_suggestions_toolbar_item.dart index ffeecdcbbe..97245297b5 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_suggestions_toolbar_item.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/text_suggestions_toolbar_item.dart @@ -14,8 +14,7 @@ import 'package:flowy_infra_ui/style_widget/hover.dart'; import 'package:flutter/material.dart'; import 'text_heading_toolbar_item.dart'; - -const _kSuggestionsItemId = 'editor.suggestions'; +import 'toolbar_id_enum.dart'; @visibleForTesting const kSuggestionsItemKey = ValueKey('SuggestionsItem'); @@ -24,7 +23,7 @@ const kSuggestionsItemKey = ValueKey('SuggestionsItem'); const kSuggestionsItemListKey = ValueKey('SuggestionsItemList'); final ToolbarItem suggestionsItem = ToolbarItem( - id: _kSuggestionsItemId, + id: ToolbarId.suggestions.id, group: 3, isActive: enableSuggestions, builder: ( @@ -159,7 +158,7 @@ class _SuggestionsActionListState extends State { return widget.tooltipBuilder?.call( context, - _kSuggestionsItemId, + ToolbarId.suggestions.id, currentSuggestionItem.title, child, ) ?? diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/toolbar_id_enum.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/toolbar_id_enum.dart new file mode 100644 index 0000000000..8a97bb6648 --- /dev/null +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/toolbar_item/toolbar_id_enum.dart @@ -0,0 +1,19 @@ +enum ToolbarId { + bold, + underline, + italic, + code, + highlightColor, + textColor, + link, + placeholder, + paddingPlaceHolder, + textAlign, + moreOption, + textHeading, + suggestions, +} + +extension ToolbarIdExtension on ToolbarId { + String get id => 'editor.$name'; +} diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart index 674b44e708..4b4b2d135a 100644 --- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart +++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart @@ -550,7 +550,7 @@ class EditorStyleCustomizer { style: context.tooltipTextStyle(), ), TextSpan( - text: (Platform.isMacOS ? '⌘+' : 'Ctrl+\\') + tooltip.$2, + text: (Platform.isMacOS ? '⌘+' : 'Ctrl+') + tooltip.$2, style: context.tooltipTextStyle()?.copyWith( color: Theme.of(context).hintColor, ), diff --git a/frontend/resources/translations/en.json b/frontend/resources/translations/en.json index 1e50ff07ab..55cc15d3ac 100644 --- a/frontend/resources/translations/en.json +++ b/frontend/resources/translations/en.json @@ -2118,7 +2118,6 @@ "moreOptions": "More options", "font": "Font", "inlineCode": "Inline code", - "suggestions": "Suggestions", "turnInto": "Turn into", "equation": "Equation"