feat: enable group condition

frontend/appflowy_flutter/lib/plugins/database/application/field/field_controller.dart

@@ -137,6 +137,8 @@ class FieldController {
   List<FieldInfo> get fieldInfos => [..._fieldNotifier.fieldInfos];
   List<FilterInfo> get filterInfos => [..._filterNotifier?.filters ?? []];
   List<SortInfo> get sortInfos => [..._sortNotifier?.sorts ?? []];
+  List<GroupSettingPB> get groupSettings =>
+      _groupConfigurationByFieldId.entries.map((e) => e.value).toList();
 
   FieldInfo? getField(String fieldId) {
     return _fieldNotifier.fieldInfos

frontend/appflowy_flutter/lib/plugins/database/application/field/field_info.dart

@@ -1,5 +1,6 @@
 import 'package:appflowy_backend/protobuf/flowy-database2/protobuf.dart';
 import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:protobuf/protobuf.dart';
 
 part 'field_info.freezed.dart';
 
@@ -89,4 +90,13 @@ class FieldInfo with _$FieldInfo {
         return false;
     }
   }
+
+  List<ProtobufEnum> get groupConditions {
+    switch (field.fieldType) {
+      case FieldType.DateTime:
+        return DateConditionPB.values;
+      default:
+        return [];
+    }
+  }
 }

frontend/appflowy_flutter/lib/plugins/database/application/setting/group_bloc.dart

@@ -6,6 +6,7 @@ import 'package:appflowy/plugins/database/domain/group_service.dart';
 import 'package:appflowy_backend/log.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/board_entities.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/group.pb.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:freezed_annotation/freezed_annotation.dart';
 
@@ -22,6 +23,7 @@ class DatabaseGroupBloc extends Bloc<DatabaseGroupEvent, DatabaseGroupState> {
             viewId,
             databaseController.fieldController.fieldInfos,
             databaseController.databaseLayoutSetting!.board,
+            databaseController.fieldController.groupSettings,
           ),
         ) {
     _dispatch();
@@ -51,11 +53,22 @@ class DatabaseGroupBloc extends Bloc<DatabaseGroupEvent, DatabaseGroupState> {
             _startListening();
           },
           didReceiveFieldUpdate: (fieldInfos) {
-            emit(state.copyWith(fieldInfos: fieldInfos));
+            emit(
+              state.copyWith(
+                fieldInfos: fieldInfos,
+                groupSettings:
+                    _databaseController.fieldController.groupSettings,
+              ),
+            );
           },
-          setGroupByField: (String fieldId, FieldType fieldType) async {
+          setGroupByField: (
+            String fieldId,
+            FieldType fieldType, [
+            List<int>? settingContent,
+          ]) async {
             final result = await _groupBackendSvc.groupByField(
               fieldId: fieldId,
+              settingContent: settingContent ?? [],
             );
             result.fold((l) => null, (err) => Log.error(err));
           },
@@ -96,8 +109,9 @@ class DatabaseGroupEvent with _$DatabaseGroupEvent {
   const factory DatabaseGroupEvent.initial() = _Initial;
   const factory DatabaseGroupEvent.setGroupByField(
     String fieldId,
-    FieldType fieldType,
-  ) = _DatabaseGroupEvent;
+    FieldType fieldType, [
+    @Default([]) List<int> settingContent,
+  ]) = _DatabaseGroupEvent;
   const factory DatabaseGroupEvent.didReceiveFieldUpdate(
     List<FieldInfo> fields,
   ) = _DidReceiveFieldUpdate;
@@ -112,16 +126,19 @@ class DatabaseGroupState with _$DatabaseGroupState {
     required String viewId,
     required List<FieldInfo> fieldInfos,
     required BoardLayoutSettingPB layoutSettings,
+    required List<GroupSettingPB> groupSettings,
   }) = _DatabaseGroupState;
 
   factory DatabaseGroupState.initial(
     String viewId,
     List<FieldInfo> fieldInfos,
     BoardLayoutSettingPB layoutSettings,
+    List<GroupSettingPB> groupSettings,
   ) =>
       DatabaseGroupState(
         viewId: viewId,
         fieldInfos: fieldInfos,
         layoutSettings: layoutSettings,
+        groupSettings: groupSettings,
       );
 }

frontend/appflowy_flutter/lib/plugins/database/board/application/board_bloc.dart

@@ -520,6 +520,9 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
       return "No ${field.name}";
     }
 
+    final groupSettings = databaseController.fieldController.groupSettings
+        .firstWhereOrNull((gs) => gs.fieldId == field.id);
+
     switch (field.fieldType) {
       case FieldType.SingleSelect:
         final options =
@@ -540,33 +543,61 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
       case FieldType.URL:
         return group.groupId;
       case FieldType.DateTime:
-        // Assume DateCondition::Relative as there isn't an option for this
-        // right now.
+        final config = groupSettings?.content != null
+            ? DateGroupConfigurationPB.fromBuffer(groupSettings!.content)
+            : DateGroupConfigurationPB();
         final dateFormat = DateFormat("y/MM/dd");
         try {
           final targetDateTime = dateFormat.parseLoose(group.groupId);
-          final targetDateTimeDay = DateTime(
-            targetDateTime.year,
-            targetDateTime.month,
-            targetDateTime.day,
-          );
-          final now = DateTime.now();
-          final nowDay = DateTime(
-            now.year,
-            now.month,
-            now.day,
-          );
-          final diff = targetDateTimeDay.difference(nowDay).inDays;
-          return switch (diff) {
-            0 => "Today",
-            -1 => "Yesterday",
-            1 => "Tomorrow",
-            -7 => "Last 7 days",
-            2 => "Next 7 days",
-            -30 => "Last 30 days",
-            8 => "Next 30 days",
-            _ => DateFormat("MMM y").format(targetDateTimeDay)
-          };
+          switch (config.condition) {
+            case DateConditionPB.Day:
+              return DateFormat("MMM dd, y").format(targetDateTime);
+            case DateConditionPB.Week:
+              final beginningOfWeek = targetDateTime
+                  .subtract(Duration(days: targetDateTime.weekday - 1));
+              final endOfWeek = targetDateTime.add(
+                Duration(days: DateTime.daysPerWeek - targetDateTime.weekday),
+              );
+
+              final beginningOfWeekFormat =
+                  beginningOfWeek.year != endOfWeek.year
+                      ? "MMM dd y"
+                      : "MMM dd";
+              final endOfWeekFormat = beginningOfWeek.month != endOfWeek.month
+                  ? "MMM dd y"
+                  : "dd y";
+
+              return 'Week of ${DateFormat(beginningOfWeekFormat).format(beginningOfWeek)} - ${DateFormat(endOfWeekFormat).format(endOfWeek)}';
+            case DateConditionPB.Month:
+              return DateFormat("MMM y").format(targetDateTime);
+            case DateConditionPB.Year:
+              return DateFormat("y").format(targetDateTime);
+            case DateConditionPB.Relative:
+              final targetDateTimeDay = DateTime(
+                targetDateTime.year,
+                targetDateTime.month,
+                targetDateTime.day,
+              );
+              final now = DateTime.now();
+              final nowDay = DateTime(
+                now.year,
+                now.month,
+                now.day,
+              );
+              final diff = targetDateTimeDay.difference(nowDay).inDays;
+              return switch (diff) {
+                0 => "Today",
+                -1 => "Yesterday",
+                1 => "Tomorrow",
+                -7 => "Last 7 days",
+                2 => "Next 7 days",
+                -30 => "Last 30 days",
+                8 => "Next 30 days",
+                _ => DateFormat("MMM y").format(targetDateTimeDay)
+              };
+            default:
+              return "";
+          }
         } on FormatException {
           return "";
         }

frontend/appflowy_flutter/lib/plugins/database/domain/group_service.dart

@@ -1,5 +1,5 @@
 import 'package:appflowy_backend/dispatch/dispatch.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/group.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/protobuf.dart';
 import 'package:appflowy_backend/protobuf/flowy-error/errors.pb.dart';
 import 'package:appflowy_result/appflowy_result.dart';
 
@@ -10,10 +10,12 @@ class GroupBackendService {
 
   Future<FlowyResult<void, FlowyError>> groupByField({
     required String fieldId,
+    required List<int> settingContent,
   }) {
     final payload = GroupByFieldPayloadPB.create()
       ..viewId = viewId
-      ..fieldId = fieldId;
+      ..fieldId = fieldId
+      ..settingContent = settingContent;
 
     return DatabaseEventSetGroupByField(payload).send();
   }

frontend/appflowy_flutter/lib/plugins/database/widgets/group/database_group.dart

@@ -8,15 +8,15 @@ import 'package:appflowy/plugins/database/grid/presentation/widgets/common/type_
 import 'package:appflowy/util/field_type_extension.dart';
 import 'package:appflowy/workspace/presentation/widgets/toggle/toggle.dart';
 import 'package:appflowy/workspace/presentation/widgets/toggle/toggle_style.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/board_entities.pb.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/protobuf.dart';
 import 'package:easy_localization/easy_localization.dart';
 
 import 'package:flowy_infra/theme_extension.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/spacing.dart';
 import 'package:flutter/material.dart';
+import 'package:collection/collection.dart';
 
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:protobuf/protobuf.dart' hide FieldInfo;
@@ -42,12 +42,11 @@ class DatabaseGroupList extends StatelessWidget {
       )..add(const DatabaseGroupEvent.initial()),
       child: BlocBuilder<DatabaseGroupBloc, DatabaseGroupState>(
         builder: (context, state) {
-          final showHideUngroupedToggle = state.fieldInfos.any(
-            (field) =>
-                field.canBeGroup &&
-                field.isGroupField &&
-                field.fieldType != FieldType.Checkbox,
+          final field = state.fieldInfos.firstWhereOrNull(
+            (field) => field.canBeGroup && field.isGroupField,
           );
+          final showHideUngroupedToggle =
+              field?.fieldType != FieldType.Checkbox;
           final children = [
             if (showHideUngroupedToggle) ...[
               SizedBox(
@@ -90,10 +89,46 @@ class DatabaseGroupList extends StatelessWidget {
             ...state.fieldInfos.where((fieldInfo) => fieldInfo.canBeGroup).map(
                   (fieldInfo) => _GridGroupCell(
                     fieldInfo: fieldInfo,
+                    name: fieldInfo.name,
+                    icon: fieldInfo.fieldType.svgData,
+                    checked: fieldInfo.isGroupField,
                     onSelected: onDismissed,
                     key: ValueKey(fieldInfo.id),
                   ),
                 ),
+            if (field?.groupConditions.isNotEmpty ?? false) ...[
+              const TypeOptionSeparator(spacing: 0),
+              SizedBox(
+                height: GridSize.popoverItemHeight,
+                child: Padding(
+                  padding:
+                      const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
+                  child: FlowyText.medium(
+                    LocaleKeys.board_groupCondition.tr(),
+                    textAlign: TextAlign.left,
+                    color: Theme.of(context).hintColor,
+                  ),
+                ),
+              ),
+              ...field!.groupConditions.map(
+                (condition) => _GridGroupCell(
+                  fieldInfo: field,
+                  name: condition.name,
+                  condition: condition.value,
+                  onSelected: onDismissed,
+                  checked: () {
+                    final gs = state.groupSettings
+                        .firstWhereOrNull((gs) => gs.fieldId == field.id);
+                    if (gs == null) {
+                      return false;
+                    }
+                    final config =
+                        DateGroupConfigurationPB.fromBuffer(gs.content);
+                    return config.condition == condition;
+                  }(),
+                ),
+              ),
+            ],
           ];
 
           return ListView.separated(
@@ -128,15 +163,23 @@ class _GridGroupCell extends StatelessWidget {
     super.key,
     required this.fieldInfo,
     required this.onSelected,
+    required this.checked,
+    required this.name,
+    this.condition = 0,
+    this.icon,
   });
 
   final FieldInfo fieldInfo;
   final VoidCallback onSelected;
+  final bool checked;
+  final int condition;
+  final String name;
+  final FlowySvgData? icon;
 
   @override
   Widget build(BuildContext context) {
     Widget? rightIcon;
-    if (fieldInfo.isGroupField) {
+    if (checked) {
       rightIcon = const Padding(
         padding: EdgeInsets.all(2.0),
         child: FlowySvg(FlowySvgs.check_s),
@@ -150,19 +193,31 @@ class _GridGroupCell extends StatelessWidget {
         child: FlowyButton(
           hoverColor: AFThemeExtension.of(context).lightGreyHover,
           text: FlowyText.medium(
-            fieldInfo.name,
+            name,
             color: AFThemeExtension.of(context).textColor,
           ),
-          leftIcon: FlowySvg(
-            fieldInfo.fieldType.svgData,
-            color: Theme.of(context).iconTheme.color,
-          ),
+          leftIcon: icon != null
+              ? FlowySvg(
+                  icon!,
+                  color: Theme.of(context).iconTheme.color,
+                )
+              : null,
           rightIcon: rightIcon,
           onTap: () {
+            List<int> settingContent = [];
+            switch (fieldInfo.fieldType) {
+              case FieldType.DateTime:
+                final config = DateGroupConfigurationPB()
+                  ..condition = DateConditionPB.values[condition];
+                settingContent = config.writeToBuffer();
+                break;
+              default:
+            }
             context.read<DatabaseGroupBloc>().add(
                   DatabaseGroupEvent.setGroupByField(
                     fieldInfo.id,
                     fieldInfo.fieldType,
+                    settingContent,
                   ),
                 );
             onSelected();