diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_choice_button.dart b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_choice_button.dart index 40afc7019f..de8a5309f4 100644 --- a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_choice_button.dart +++ b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_choice_button.dart @@ -23,19 +23,17 @@ class SortChoiceButton extends StatelessWidget { @override Widget build(BuildContext context) { - final borderSide = BorderSide( - color: AFThemeExtension.of(context).toggleOffFill, - width: 1.0, - ); - - final decoration = BoxDecoration( - color: Colors.transparent, - border: Border.fromBorderSide(borderSide), - borderRadius: const BorderRadius.all(Radius.circular(14)), - ); - return FlowyButton( - decoration: decoration, + decoration: BoxDecoration( + color: Colors.transparent, + border: Border.fromBorderSide( + BorderSide( + color: AFThemeExtension.of(context).toggleOffFill, + width: 1.0, + ), + ), + borderRadius: const BorderRadius.all(Radius.circular(14)), + ), useIntrinsicWidth: true, text: FlowyText( text, diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_editor.dart b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_editor.dart index d1e95346e2..c2f8f2a204 100644 --- a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_editor.dart +++ b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_editor.dart @@ -23,12 +23,13 @@ class SortEditor extends StatefulWidget { final String viewId; final List sortInfos; final FieldController fieldController; + const SortEditor({ + super.key, required this.viewId, required this.fieldController, required this.sortInfos, - Key? key, - }) : super(key: key); + }); @override State createState() => _SortEditorState(); @@ -47,20 +48,33 @@ class _SortEditorState extends State { )..add(const SortEditorEvent.initial()), child: BlocBuilder( builder: (context, state) { - return IntrinsicWidth( - child: IntrinsicHeight( - child: Column( - children: [ - _SortList(popoverMutex: popoverMutex), - DatabaseAddSortButton( - viewId: widget.viewId, - fieldController: widget.fieldController, + return Column( + children: [ + ...state.sortInfos.map( + (info) => Padding( + padding: const EdgeInsets.symmetric(vertical: 6), + child: DatabaseSortItem( + sortInfo: info, popoverMutex: popoverMutex, ), - DatabaseDeleteSortButton(popoverMutex: popoverMutex), + ), + ), + Row( + children: [ + Flexible( + child: DatabaseAddSortButton( + viewId: widget.viewId, + fieldController: widget.fieldController, + popoverMutex: popoverMutex, + ), + ), + const HSpace(6), + Flexible( + child: DatabaseDeleteSortButton(popoverMutex: popoverMutex), + ), ], ), - ), + ], ); }, ), @@ -68,77 +82,48 @@ class _SortEditorState extends State { } } -class _SortList extends StatelessWidget { - final PopoverMutex popoverMutex; - const _SortList({required this.popoverMutex, Key? key}) : super(key: key); - - @override - Widget build(BuildContext context) { - return BlocBuilder( - builder: (context, state) { - final List children = state.sortInfos - .map( - (info) => Padding( - padding: const EdgeInsets.symmetric(vertical: 6), - child: DatabaseSortItem( - sortInfo: info, - popoverMutex: popoverMutex, - ), - ), - ) - .toList(); - - return Column( - children: children, - ); - }, - ); - } -} - class DatabaseSortItem extends StatelessWidget { final SortInfo sortInfo; final PopoverMutex popoverMutex; + const DatabaseSortItem({ + super.key, required this.popoverMutex, required this.sortInfo, - Key? key, - }) : super(key: key); + }); @override Widget build(BuildContext context) { - final nameButton = SortChoiceButton( - text: sortInfo.fieldInfo.name, - editable: false, - onTap: () {}, - ); - final orderButton = DatabaseSortItemOrderButton( - sortInfo: sortInfo, - popoverMutex: popoverMutex, - ); - final deleteButton = FlowyIconButton( width: 26, - onPressed: () { - context - .read() - .add(SortEditorEvent.deleteSort(sortInfo)); - }, + onPressed: () => context + .read() + .add(SortEditorEvent.deleteSort(sortInfo)), iconPadding: const EdgeInsets.all(5), hoverColor: AFThemeExtension.of(context).lightGreyHover, - icon: FlowySvg( - FlowySvgs.close_s, - color: Theme.of(context).iconTheme.color, - ), + icon: svgWidget("home/close", color: Theme.of(context).iconTheme.color), ); return Row( children: [ - SizedBox(height: 26, child: nameButton), + SizedBox( + height: 26, + child: SortChoiceButton( + text: sortInfo.fieldInfo.name, + editable: false, + ), + ), const HSpace(6), - SizedBox(height: 26, child: orderButton), - const HSpace(16), - deleteButton + SizedBox( + height: 26, + child: DatabaseSortItemOrderButton( + sortInfo: sortInfo, + popoverMutex: popoverMutex, + ), + ), + const HSpace(6), + const Spacer(), + deleteButton, ], ); } @@ -147,12 +132,11 @@ class DatabaseSortItem extends StatelessWidget { extension SortConditionExtension on SortConditionPB { String get title { switch (this) { - case SortConditionPB.Ascending: - return LocaleKeys.grid_sort_ascending.tr(); case SortConditionPB.Descending: return LocaleKeys.grid_sort_descending.tr(); + default: + return LocaleKeys.grid_sort_ascending.tr(); } - return ""; } } @@ -160,12 +144,13 @@ class DatabaseAddSortButton extends StatefulWidget { final String viewId; final FieldController fieldController; final PopoverMutex popoverMutex; + const DatabaseAddSortButton({ + super.key, required this.viewId, required this.fieldController, required this.popoverMutex, - Key? key, - }) : super(key: key); + }); @override State createState() => _DatabaseAddSortButtonState(); @@ -207,8 +192,10 @@ class _DatabaseAddSortButtonState extends State { class DatabaseDeleteSortButton extends StatelessWidget { final PopoverMutex popoverMutex; - const DatabaseDeleteSortButton({required this.popoverMutex, Key? key}) - : super(key: key); + const DatabaseDeleteSortButton({ + super.key, + required this.popoverMutex, + }); @override Widget build(BuildContext context) { @@ -217,7 +204,7 @@ class DatabaseDeleteSortButton extends StatelessWidget { return SizedBox( height: GridSize.popoverItemHeight, child: FlowyButton( - text: FlowyText.medium(LocaleKeys.grid_sort_deleteSort.tr()), + text: FlowyText.medium(LocaleKeys.grid_sort_deleteAllSorts.tr()), onTap: () { context .read() @@ -235,10 +222,10 @@ class DatabaseSortItemOrderButton extends StatefulWidget { final SortInfo sortInfo; final PopoverMutex popoverMutex; const DatabaseSortItemOrderButton({ + super.key, required this.popoverMutex, required this.sortInfo, - Key? key, - }) : super(key: key); + }); @override State createState() => diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_menu.dart b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_menu.dart index 2d1accdc86..2a5872206b 100644 --- a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_menu.dart +++ b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/sort/sort_menu.dart @@ -16,10 +16,11 @@ import 'sort_info.dart'; class SortMenu extends StatelessWidget { final FieldController fieldController; + const SortMenu({ + super.key, required this.fieldController, - Key? key, - }) : super(key: key); + }); @override Widget build(BuildContext context) { @@ -33,20 +34,24 @@ class SortMenu extends StatelessWidget { if (state.sortInfos.isNotEmpty) { return AppFlowyPopover( controller: PopoverController(), - constraints: BoxConstraints.loose(const Size(340, 200)), + constraints: BoxConstraints.loose(const Size(320, 200)), direction: PopoverDirection.bottomWithLeftAligned, + offset: const Offset(0, 5), popupBuilder: (BuildContext popoverContext) { - return SortEditor( - viewId: state.viewId, - fieldController: context.read().fieldController, - sortInfos: state.sortInfos, + return SingleChildScrollView( + child: SortEditor( + viewId: state.viewId, + fieldController: + context.read().fieldController, + sortInfos: state.sortInfos, + ), ); }, child: SortChoiceChip(sortInfos: state.sortInfos), ); - } else { - return const SizedBox(); } + + return const SizedBox.shrink(); }, ), ); @@ -58,10 +63,10 @@ class SortChoiceChip extends StatelessWidget { final VoidCallback? onTap; const SortChoiceChip({ - Key? key, + super.key, required this.sortInfos, this.onTap, - }) : super(key: key); + }); @override Widget build(BuildContext context) { diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/tar_bar/setting_menu.dart b/frontend/appflowy_flutter/lib/plugins/database_view/tar_bar/setting_menu.dart index c884f91467..e7888cd542 100644 --- a/frontend/appflowy_flutter/lib/plugins/database_view/tar_bar/setting_menu.dart +++ b/frontend/appflowy_flutter/lib/plugins/database_view/tar_bar/setting_menu.dart @@ -60,13 +60,9 @@ class _DatabaseViewSettingContent extends StatelessWidget { return _wrapPadding( Row( children: [ - SortMenu( - fieldController: fieldController, - ), + SortMenu(fieldController: fieldController), const HSpace(6), - FilterMenu( - fieldController: fieldController, - ), + FilterMenu(fieldController: fieldController), ], ), ); diff --git a/frontend/resources/translations/en.json b/frontend/resources/translations/en.json index d718fef6e1..92c451a460 100644 --- a/frontend/resources/translations/en.json +++ b/frontend/resources/translations/en.json @@ -409,7 +409,7 @@ "sort": { "ascending": "Ascending", "descending": "Descending", - "deleteSort": "Delete sort", + "deleteAllSorts": "Delete all sorts", "addSort": "Add sort" }, "row": {