From 676dffbf2131809808ec4979e195b1ee86cae1c9 Mon Sep 17 00:00:00 2001 From: appflowy Date: Fri, 15 Apr 2022 10:24:59 +0800 Subject: [PATCH] chore: reorder fields --- .../grid/setting/property_bloc.dart | 9 +++++-- .../grid/src/widgets/header/grid_header.dart | 27 ++++++++++++------- .../src/widgets/toolbar/grid_property.dart | 14 ++++++---- 3 files changed, 34 insertions(+), 16 deletions(-) diff --git a/frontend/app_flowy/lib/workspace/application/grid/setting/property_bloc.dart b/frontend/app_flowy/lib/workspace/application/grid/setting/property_bloc.dart index 140aa388cd..0ec31d08b6 100644 --- a/frontend/app_flowy/lib/workspace/application/grid/setting/property_bloc.dart +++ b/frontend/app_flowy/lib/workspace/application/grid/setting/property_bloc.dart @@ -1,5 +1,6 @@ import 'package:app_flowy/workspace/application/grid/field/field_service.dart'; import 'package:app_flowy/workspace/application/grid/field/grid_listenr.dart'; +import 'package:app_flowy/workspace/application/grid/grid_service.dart'; import 'package:flowy_sdk/log.dart'; import 'package:flowy_sdk/protobuf/flowy-grid-data-model/grid.pb.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; @@ -11,10 +12,12 @@ part 'property_bloc.freezed.dart'; class GridPropertyBloc extends Bloc { final FieldService _service; final GridFieldsListener _fieldListener; + final GridFieldCache _fieldCache; GridPropertyBloc({required String gridId, required List fields}) : _service = FieldService(gridId: gridId), _fieldListener = GridFieldsListener(gridId: gridId), + _fieldCache = GridFieldCache(), super(GridPropertyState.initial(gridId, fields)) { on( (event, emit) async { @@ -43,14 +46,16 @@ class GridPropertyBloc extends Bloc { @override Future close() async { await _fieldListener.stop(); + _fieldCache.dispose(); return super.close(); } void _startListening() { _fieldListener.updateFieldsNotifier.addPublishListener((result) { result.fold( - (fields) { - // add(GridPropertyEvent.didReceiveFieldUpdate(fields)); + (changeset) { + _fieldCache.applyChangeset(changeset); + add(GridPropertyEvent.didReceiveFieldUpdate(_fieldCache.clonedFields)); }, (err) => Log.error(err), ); diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/grid_header.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/grid_header.dart index 15fb64f990..dcf5702f40 100644 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/grid_header.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/grid_header.dart @@ -5,10 +5,11 @@ import 'package:flowy_infra/image.dart'; import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra_ui/style_widget/button.dart'; import 'package:flowy_infra_ui/style_widget/text.dart'; +import 'package:flowy_sdk/log.dart'; import 'package:flowy_sdk/protobuf/flowy-grid-data-model/grid.pb.dart' hide Row; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; - +import 'package:reorderables/reorderables.dart'; import 'field_editor.dart'; import 'field_cell.dart'; @@ -62,7 +63,7 @@ class SliverHeaderDelegateImplementation extends SliverPersistentHeaderDelegate } } -class _GridHeader extends StatelessWidget { +class _GridHeader extends StatefulWidget { final String gridId; final List fields; @@ -72,26 +73,34 @@ class _GridHeader extends StatelessWidget { required this.fields, }) : super(key: key); + @override + State<_GridHeader> createState() => _GridHeaderState(); +} + +class _GridHeaderState extends State<_GridHeader> { @override Widget build(BuildContext context) { final theme = context.watch(); return BlocBuilder( + buildWhen: (previous, current) => previous.fields != current.fields, builder: (context, state) { final cells = state.fields .where((field) => field.visibility) - .map((field) => GridFieldCellContext(gridId: gridId, field: field)) + .map((field) => GridFieldCellContext(gridId: widget.gridId, field: field)) .map((ctx) => GridFieldCell(ctx, key: ValueKey(ctx.field.id))) .toList(); return Container( color: theme.surface, - child: Row( + child: ReorderableRow( crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - const _CellLeading(), - ...cells, - _CellTrailing(gridId: gridId), - ], + scrollController: ScrollController(), + header: const _CellLeading(), + footer: _CellTrailing(gridId: widget.gridId), + onReorder: (int oldIndex, int newIndex) { + Log.info("from $oldIndex to $newIndex"); + }, + children: cells, ), ); }, diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/toolbar/grid_property.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/toolbar/grid_property.dart index 54e2d5e97a..75898d5ba7 100644 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/toolbar/grid_property.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/toolbar/grid_property.dart @@ -10,6 +10,7 @@ import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flowy_infra_ui/style_widget/button.dart'; import 'package:flowy_infra_ui/style_widget/icon_button.dart'; import 'package:flowy_infra_ui/style_widget/text.dart'; +import 'package:flowy_infra_ui/widget/spacing.dart'; import 'package:flowy_sdk/protobuf/flowy-grid-data-model/grid.pb.dart' show Field; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; @@ -45,16 +46,19 @@ class GridPropertyList extends StatelessWidget with FlowyOverlayDelegate { getIt(param1: gridId, param2: fields)..add(const GridPropertyEvent.initial()), child: BlocBuilder( builder: (context, state) { - final children = state.fields.map((field) { + final cells = state.fields.map((field) { return _GridPropertyCell(gridId: gridId, field: field, key: ValueKey(field.id)); }).toList(); - return ReorderableListView( + return ListView.separated( shrinkWrap: true, - onReorder: (int oldIndex, int newIndex) { - context.read().add(GridPropertyEvent.moveField(oldIndex, newIndex)); + itemCount: cells.length, + itemBuilder: (BuildContext context, int index) { + return cells[index]; + }, + separatorBuilder: (BuildContext context, int index) { + return VSpace(GridSize.typeOptionSeparatorHeight); }, - children: children, ); }, ),