chore: port more const textstyles to theme provider styles (#1477)

richardshiue · appflowy · web-flow · commit aa85970b0fb4 · 2022-11-30T15:11:32.000+08:00
* chore: port more const textstyles to theme provider styles

* style: unnecessary or use shared text fontSizes

* fix: build error from merging main

Co-authored-by: Nathan.fooo &lt;86001920+appflowy@users.noreply.github.com&gt;
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/grid_page.dart b/frontend/app_flowy/lib/plugins/grid/presentation/grid_page.dart
@@ -338,12 +338,11 @@ class RowCountBadge extends StatelessWidget {
           child: Row(
             mainAxisAlignment: MainAxisAlignment.start,
             children: [
-              FlowyText.regular(
+              FlowyText.medium(
                 '${LocaleKeys.grid_row_count.tr()} : ',
-                fontSize: 13,
                 color: Theme.of(context).hintColor,
               ),
-              FlowyText.regular(rowCount.toString(), fontSize: 13),
+              FlowyText.medium(rowCount.toString()),
             ],
           ),
         );
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/cell_accessory.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/cell_accessory.dart
@@ -1,6 +1,5 @@
 import 'package:flowy_infra/color_extension.dart';
 import 'package:flowy_infra/image.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flowy_infra_ui/style_widget/hover.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
@@ -73,7 +72,7 @@ class _PrimaryCellAccessoryState extends State<PrimaryCellAccessory>
     } else {
       return Tooltip(
         message: LocaleKeys.tooltip_openAsPage.tr(),
-        textStyle: TextStyles.caption.textColor(Colors.white),
+        textStyle: AFThemeExtension.of(context).caption.textColor(Colors.white),
         child: svgWidget(
           "grid/expander",
           color: Theme.of(context).colorScheme.primary,
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/number_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/number_cell.dart
@@ -1,11 +1,8 @@
 import 'dart:async';
 import 'package:app_flowy/startup/startup.dart';
 import 'package:app_flowy/plugins/grid/application/prelude.dart';
-import 'package:flowy_infra/size.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:textstyle_extensions/textstyle_extensions.dart';
 
 import '../../layout/sizes.dart';
 import 'cell_builder.dart';
@@ -57,7 +54,7 @@ class _NumberCellState extends GridFocusNodeCellState<GridNumberCell> {
             onEditingComplete: () => focusNode.unfocus(),
             onSubmitted: (_) => focusNode.unfocus(),
             maxLines: 1,
-            style: TextStyles.body1.size(FontSizes.s14),
+            style: Theme.of(context).textTheme.bodyMedium,
             textInputAction: TextInputAction.done,
             decoration: const InputDecoration(
               contentPadding: EdgeInsets.zero,
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart
@@ -206,7 +206,6 @@ class _SelectOptionWrapState extends State<SelectOptionWrap> {
     if (widget.selectOptions.isEmpty && widget.cellStyle != null) {
       child = FlowyText.medium(
         widget.cellStyle!.placeholder,
-        fontSize: 14,
         color: Theme.of(context).hintColor,
       );
     } else {
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/text_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/text_cell.dart
@@ -1,13 +1,10 @@
 import 'dart:async';
 import 'package:app_flowy/plugins/grid/presentation/widgets/cell/prelude.dart';
-import 'package:flowy_infra/size.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:app_flowy/startup/startup.dart';
 import 'package:app_flowy/plugins/grid/application/prelude.dart';
 import '../../layout/sizes.dart';
-import 'package:textstyle_extensions/textstyle_extensions.dart';
 import 'cell_builder.dart';
 
 class GridTextCellStyle extends GridCellStyle {
@@ -72,7 +69,7 @@ class _GridTextCellState extends GridFocusNodeCellState<GridTextCell> {
             onChanged: (value) => focusChanged(),
             onEditingComplete: () => focusNode.unfocus(),
             maxLines: null,
-            style: TextStyles.body1.size(FontSizes.s14),
+            style: Theme.of(context).textTheme.bodyMedium,
             decoration: InputDecoration(
               contentPadding: EdgeInsets.only(
                 top: GridSize.cellContentInsets.top,
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/cell_editor.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/cell_editor.dart
@@ -1,12 +1,9 @@
 import 'package:app_flowy/plugins/grid/application/cell/cell_service/cell_service.dart';
 import 'package:app_flowy/plugins/grid/application/cell/url_cell_editor_bloc.dart';
-import 'package:flowy_infra/size.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flutter/material.dart';
 import 'dart:async';
 
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:textstyle_extensions/textstyle_extensions.dart';
 
 class URLCellEditor extends StatefulWidget {
   final GridURLCellController cellController;
@@ -45,7 +42,7 @@ class _URLCellEditorState extends State<URLCellEditor> {
           controller: _controller,
           onChanged: (value) => focusChanged(),
           maxLines: null,
-          style: TextStyles.body1.size(FontSizes.s14),
+          style: Theme.of(context).textTheme.bodyMedium,
           decoration: const InputDecoration(
             contentPadding: EdgeInsets.zero,
             border: InputBorder.none,
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart
@@ -5,14 +5,12 @@ import 'package:app_flowy/workspace/presentation/home/toast.dart';
 import 'package:appflowy_popover/appflowy_popover.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/image.dart';
-import 'package:flowy_infra/size.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:app_flowy/plugins/grid/application/prelude.dart';
-import 'package:textstyle_extensions/textstyle_extensions.dart';
 import 'package:url_launcher/url_launcher.dart';
 import '../../../layout/sizes.dart';
 import '../cell_accessory.dart';
@@ -119,15 +117,10 @@ class _GridURLCellState extends GridCellState<GridURLCell> {
         builder: (context, state) {
           final richText = Padding(
             padding: GridSize.cellContentInsets,
-            child: RichText(
-              textAlign: TextAlign.left,
-              text: TextSpan(
-                text: state.content,
-                style: TextStyles.general(
-                  fontSize: FontSizes.s14,
-                  color: Theme.of(context).colorScheme.primaryContainer,
-                ).underline,
-              ),
+            child: FlowyText.medium(
+              state.content,
+              color: Theme.of(context).colorScheme.primary,
+              decoration: TextDecoration.underline,
             ),
           );
 
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/choicechip/choicechip.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/choicechip/choicechip.dart
@@ -37,7 +37,7 @@ class ChoiceChipButton extends StatelessWidget {
       child: FlowyButton(
         decoration: decoration,
         useIntrinsicWidth: true,
-        text: FlowyText(filterInfo.fieldInfo.name, fontSize: 12),
+        text: FlowyText(filterInfo.fieldInfo.name),
         margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
         radius: const BorderRadius.all(Radius.circular(14)),
         leftIcon: svgWidget(
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/create_filter_list.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/create_filter_list.dart
@@ -157,7 +157,7 @@ class _FilterPropertyCell extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return FlowyButton(
-      text: FlowyText.medium(fieldInfo.name, fontSize: 12),
+      text: FlowyText.medium(fieldInfo.name),
       onTap: () => onTap(fieldInfo),
       leftIcon: svgWidget(
         fieldInfo.fieldType.iconName(),
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/menu.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/menu.dart
@@ -99,10 +99,7 @@ class _AddFilterButtonState extends State<AddFilterButton> {
       SizedBox(
         height: 28,
         child: FlowyButton(
-          text: FlowyText(
-            LocaleKeys.grid_settings_addFilter.tr(),
-            fontSize: 12,
-          ),
+          text: FlowyText(LocaleKeys.grid_settings_addFilter.tr()),
           useIntrinsicWidth: true,
           hoverColor: AFThemeExtension.of(context).lightGreyHover,
           leftIcon: svgWidget(
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/text_field.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/filter/text_field.dart
@@ -1,7 +1,5 @@
 import 'package:flowy_infra/size.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flutter/material.dart';
-import 'package:textstyle_extensions/textstyle_extensions.dart';
 
 class FilterTextField extends StatefulWidget {
   final String hintText;
@@ -51,7 +49,7 @@ class FilterTextFieldState extends State<FilterTextField> {
         widget.onSubmitted?.call(text);
       },
       maxLines: 1,
-      style: TextStyles.body1.size(FontSizes.s12),
+      style: Theme.of(context).textTheme.bodyMedium,
       decoration: InputDecoration(
         contentPadding: const EdgeInsets.all(10),
         enabledBorder: OutlineInputBorder(
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/footer/grid_footer.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/footer/grid_footer.dart
@@ -14,7 +14,7 @@ class GridAddRowButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return FlowyButton(
-      text: FlowyText.medium(LocaleKeys.grid_row_newRow.tr(), fontSize: 12),
+      text: FlowyText.medium(LocaleKeys.grid_row_newRow.tr()),
       hoverColor: AFThemeExtension.of(context).lightGreyHover,
       onTap: () => context.read<GridBloc>().add(const GridEvent.createRow()),
       leftIcon: svgWidget(
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_editor.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_editor.dart
@@ -4,7 +4,6 @@ import 'package:app_flowy/plugins/grid/presentation/layout/sizes.dart';
 import 'package:appflowy_popover/appflowy_popover.dart';
 import 'package:dartz/dartz.dart' show none;
 import 'package:easy_localization/easy_localization.dart';
-import 'package:flowy_infra/text_style.dart';
 import 'package:flowy_infra_ui/style_widget/button.dart';
 import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flowy_infra_ui/widget/rounded_input_field.dart';
@@ -186,9 +185,7 @@ class _FieldNameTextFieldState extends State<_FieldNameTextField> {
           return RoundedInputField(
             height: 36,
             focusNode: focusNode,
-            style: TextStyles.general(
-              fontSize: 13,
-            ),
+            style: Theme.of(context).textTheme.bodyMedium,
             controller: controller,
             errorText: context.read<FieldEditorBloc>().state.errorText,
             onChanged: (newName) {
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/toolbar/filter_button.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/toolbar/filter_button.dart
@@ -3,6 +3,7 @@ import 'package:app_flowy/plugins/grid/application/filter/filter_menu_bloc.dart'
 import 'package:appflowy_popover/appflowy_popover.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/color_extension.dart';
+import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flowy_infra_ui/style_widget/button.dart';
 import 'package:flutter/material.dart';
@@ -34,7 +35,7 @@ class _FilterButtonState extends State<FilterButton> {
             height: 26,
             child: FlowyTextButton(
               LocaleKeys.grid_settings_filter.tr(),
-              fontSize: 14,
+              fontSize: FontSizes.s14,
               fontColor: textColor,
               fillColor: Colors.transparent,
               hoverColor: AFThemeExtension.of(context).lightGreyHover,
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/toolbar/setting_button.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/toolbar/setting_button.dart
@@ -4,6 +4,7 @@ import 'package:app_flowy/plugins/grid/application/setting/setting_bloc.dart';
 import 'package:appflowy_popover/appflowy_popover.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/color_extension.dart';
+import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flowy_infra_ui/style_widget/button.dart';
 import 'package:flutter/material.dart';
@@ -49,7 +50,7 @@ class _SettingButtonState extends State<SettingButton> {
           triggerActions: PopoverTriggerFlags.none,
           child: FlowyTextButton(
             LocaleKeys.settings_title.tr(),
-            fontSize: 14,
+            fontSize: FontSizes.s14,
             fillColor: Colors.transparent,
             hoverColor: AFThemeExtension.of(context).lightGreyHover,
             padding: const EdgeInsets.symmetric(vertical: 2, horizontal: 6),
