chore: revert reorder rows in grid (#2533) (#2669)

This reverts commit f8f0599462.
This commit is contained in:
Nathan.fooo 2023-05-31 11:21:33 +08:00 committed by GitHub
parent e8665dc76c
commit 757009a97d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 196 additions and 315 deletions

View File

@ -109,7 +109,6 @@
"openAsPage": "Open as a Page",
"addNewRow": "Add a new row",
"openMenu": "Click to open menu",
"dragRow": "Long press to reorder the row",
"viewDataBase": "View database",
"referencePage": "This {name} is referenced"
},

View File

@ -175,28 +175,18 @@ class DatabaseController {
);
}
Future<Either<Unit, FlowyError>> moveGroupRow({
Future<Either<Unit, FlowyError>> moveRow({
required RowPB fromRow,
required String groupId,
RowPB? toRow,
}) {
return _databaseViewBackendSvc.moveGroupRow(
return _databaseViewBackendSvc.moveRow(
fromRowId: fromRow.id,
toGroupId: groupId,
toRowId: toRow?.id,
);
}
Future<Either<Unit, FlowyError>> moveRow({
required RowPB fromRow,
required RowPB toRow,
}) {
return _databaseViewBackendSvc.moveRow(
fromRowId: fromRow.id,
toRowId: toRow.id,
);
}
Future<Either<Unit, FlowyError>> moveGroup({
required String fromGroupId,
required String toGroupId,

View File

@ -44,7 +44,7 @@ class DatabaseViewBackendService {
return DatabaseEventCreateRow(payload).send();
}
Future<Either<Unit, FlowyError>> moveGroupRow({
Future<Either<Unit, FlowyError>> moveRow({
required String fromRowId,
required String toGroupId,
String? toRowId,
@ -61,18 +61,6 @@ class DatabaseViewBackendService {
return DatabaseEventMoveGroupRow(payload).send();
}
Future<Either<Unit, FlowyError>> moveRow({
required String fromRowId,
required String toRowId,
}) {
var payload = MoveRowPayloadPB.create()
..viewId = viewId
..fromRowId = fromRowId
..toRowId = toRowId;
return DatabaseEventMoveRow(payload).send();
}
Future<Either<Unit, FlowyError>> moveGroup({
required String fromGroupId,
required String toGroupId,

View File

@ -29,7 +29,7 @@ abstract class RowCacheDelegate {
class RowCache {
final String viewId;
/// _rows contains the current block's rows
/// _rows containers the current block's rows
/// Use List to reverse the order of the GridRow.
final RowList _rowList = RowList();

View File

@ -53,7 +53,7 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
final fromRow = groupControllers[groupId]?.rowAtIndex(fromIndex);
final toRow = groupControllers[groupId]?.rowAtIndex(toIndex);
if (fromRow != null) {
_databaseController.moveGroupRow(
_databaseController.moveRow(
fromRow: fromRow,
toRow: toRow,
groupId: groupId,
@ -69,7 +69,7 @@ class BoardBloc extends Bloc<BoardEvent, BoardState> {
final fromRow = groupControllers[fromGroupId]?.rowAtIndex(fromIndex);
final toRow = groupControllers[toGroupId]?.rowAtIndex(toIndex);
if (fromRow != null) {
_databaseController.moveGroupRow(
_databaseController.moveRow(
fromRow: fromRow,
toRow: toRow,
groupId: toGroupId,

View File

@ -35,17 +35,6 @@ class GridBloc extends Bloc<GridEvent, GridState> {
);
await rowService.deleteRow(rowInfo.rowPB.id);
},
moveRow: (int from, int to) {
final List<RowInfo> rows = [...state.rowInfos];
final fromRow = rows[from].rowPB;
final toRow = rows[to].rowPB;
rows.insert(to, rows.removeAt(from));
emit(state.copyWith(rowInfos: rows));
databaseController.moveRow(fromRow: fromRow, toRow: toRow);
},
didReceiveGridUpdate: (grid) {
emit(state.copyWith(grid: Some(grid)));
},
@ -121,7 +110,6 @@ class GridEvent with _$GridEvent {
const factory GridEvent.initial() = InitialGrid;
const factory GridEvent.createRow() = _CreateRow;
const factory GridEvent.deleteRow(RowInfo rowInfo) = _DeleteRow;
const factory GridEvent.moveRow(int from, int to) = _MoveRow;
const factory GridEvent.didReceiveRowUpdate(
List<RowInfo> rows,
RowsChangedReason listState,

View File

@ -91,6 +91,21 @@ class _GridPageState extends State<GridPage> {
),
);
}
@override
void dispose() {
super.dispose();
}
@override
void deactivate() {
super.deactivate();
}
@override
void didUpdateWidget(covariant GridPage oldWidget) {
super.didUpdateWidget(oldWidget);
}
}
class FlowyGrid extends StatefulWidget {
@ -104,12 +119,12 @@ class _FlowyGridState extends State<FlowyGrid> {
final _scrollController = GridScrollController(
scrollGroupController: LinkedScrollControllerGroup(),
);
late final ScrollController headerScrollController;
late ScrollController headerScrollController;
@override
void initState() {
super.initState();
headerScrollController = _scrollController.linkHorizontalController();
super.initState();
}
@override
@ -201,11 +216,6 @@ class _GridRowsState extends State<_GridRows> {
@override
Widget build(BuildContext context) {
return Builder(
builder: (context) {
final filterState = context.watch<GridFilterMenuBloc>().state;
final sortState = context.watch<SortMenuBloc>().state;
return BlocConsumer<GridBloc, GridState>(
listenWhen: (previous, current) => previous.reason != current.reason,
listener: (context, state) {
@ -216,63 +226,39 @@ class _GridRowsState extends State<_GridRows> {
delete: (item) {
_key.currentState?.removeItem(
item.index,
(context, animation) => _renderRow(
context,
item.rowInfo,
animation: animation,
),
(context, animation) =>
_renderRow(context, item.rowInfo, animation),
);
},
reorderSingleRow: (reorderRow, rowInfo) {
// _key.currentState?.removeItem(
// reorderRow.oldIndex,
// (context, animation) => _renderRow(context, rowInfo, animation),
// );
// _key.currentState?.insertItem(reorderRow.newIndex);
},
);
},
buildWhen: (previous, current) {
return current.reason.maybeWhen(
return current.reason.whenOrNull(
reorderRows: () => true,
reorderSingleRow: (reorderRow, rowInfo) => true,
delete: (item) => true,
insert: (item) => true,
orElse: () => false,
);
) ??
false;
},
builder: (context, state) {
final rowInfos = context.watch<GridBloc>().state.rowInfos;
return SliverFillRemaining(
child: ReorderableListView.builder(
return SliverAnimatedList(
key: _key,
buildDefaultDragHandles: false,
proxyDecorator: (child, index, animation) => Material(
color: Colors.white.withOpacity(.1),
child: Opacity(
opacity: .5,
child: child,
),
),
onReorder: (fromIndex, newIndex) {
final toIndex =
newIndex > fromIndex ? newIndex - 1 : newIndex;
if (fromIndex == toIndex) {
return;
}
context
.read<GridBloc>()
.add(GridEvent.moveRow(fromIndex, toIndex));
},
itemCount: rowInfos.length,
itemBuilder: (BuildContext context, int index) {
initialItemCount: context.read<GridBloc>().state.rowInfos.length,
itemBuilder:
(BuildContext context, int index, Animation<double> animation) {
final rowInfos = context.read<GridBloc>().state.rowInfos;
if (index >= rowInfos.length) {
return const SizedBox();
} else {
final RowInfo rowInfo = rowInfos[index];
return _renderRow(
context,
rowInfo,
index: index,
isSortEnabled: sortState.sortInfos.isNotEmpty,
isFilterEnabled: filterState.filters.isNotEmpty,
);
},
),
);
return _renderRow(context, rowInfo, animation);
}
},
);
},
@ -281,19 +267,16 @@ class _GridRowsState extends State<_GridRows> {
Widget _renderRow(
BuildContext context,
RowInfo rowInfo, {
int? index,
bool isSortEnabled = false,
bool isFilterEnabled = false,
Animation<double>? animation,
}) {
RowInfo rowInfo,
Animation<double> animation,
) {
final rowCache = context.read<GridBloc>().getRowCache(
rowInfo.rowPB.blockId,
rowInfo.rowPB.id,
);
/// Return placeholder widget if the rowCache is null.
if (rowCache == null) return const SizedBox.shrink();
if (rowCache == null) return const SizedBox();
final fieldController =
context.read<GridBloc>().databaseController.fieldController;
@ -303,10 +286,9 @@ class _GridRowsState extends State<_GridRows> {
rowCache: rowCache,
);
final child = GridRow(
key: ValueKey(rowInfo.rowPB.id),
index: index,
isDraggable: !isSortEnabled && !isFilterEnabled,
return SizeTransition(
sizeFactor: animation,
child: GridRow(
rowInfo: rowInfo,
dataController: dataController,
cellBuilder: GridCellBuilder(cellCache: dataController.cellCache),
@ -319,16 +301,9 @@ class _GridRowsState extends State<_GridRows> {
cellBuilder,
);
},
key: ValueKey(rowInfo.rowPB.id),
),
);
if (animation != null) {
return SizeTransition(
sizeFactor: animation,
child: child,
);
}
return child;
}
void _openRowDetailPage(

View File

@ -25,34 +25,29 @@ class GridRow extends StatefulWidget {
final GridCellBuilder cellBuilder;
final void Function(BuildContext, GridCellBuilder) openDetailPage;
final int? index;
final bool isDraggable;
const GridRow({
super.key,
required this.rowInfo,
required this.dataController,
required this.cellBuilder,
required this.openDetailPage,
this.index,
this.isDraggable = false,
});
Key? key,
}) : super(key: key);
@override
State<GridRow> createState() => _GridRowState();
}
class _GridRowState extends State<GridRow> {
late final RowBloc _rowBloc;
late RowBloc _rowBloc;
@override
void initState() {
super.initState();
_rowBloc = RowBloc(
rowInfo: widget.rowInfo,
dataController: widget.dataController,
);
_rowBloc.add(const RowEvent.initial());
super.initState();
}
@override
@ -75,11 +70,9 @@ class _GridRowState extends State<GridRow> {
return Row(
children: [
_RowLeading(
index: widget.index,
isDraggable: widget.isDraggable,
),
const _RowLeading(),
content,
const _RowTrailing(),
],
);
},
@ -96,25 +89,19 @@ class _GridRowState extends State<GridRow> {
}
class _RowLeading extends StatefulWidget {
final int? index;
final bool isDraggable;
const _RowLeading({
this.index,
this.isDraggable = false,
});
const _RowLeading({Key? key}) : super(key: key);
@override
State<_RowLeading> createState() => _RowLeadingState();
}
class _RowLeadingState extends State<_RowLeading> {
late final PopoverController popoverController;
late PopoverController popoverController;
@override
void initState() {
super.initState();
popoverController = PopoverController();
super.initState();
}
@override
@ -144,28 +131,23 @@ class _RowLeadingState extends State<_RowLeading> {
mainAxisAlignment: MainAxisAlignment.center,
children: [
const _InsertButton(),
if (isDraggable) ...[
ReorderableDragStartListener(
index: widget.index!,
child: _MenuButton(
isDragEnabled: isDraggable,
openMenu: () {
popoverController.show();
},
),
),
] else ...[
_MenuButton(
openMenu: () {
popoverController.show();
},
),
],
],
);
}
}
bool get isDraggable => widget.index != null && widget.isDraggable;
class _RowTrailing extends StatelessWidget {
const _RowTrailing({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const SizedBox();
}
}
class _InsertButton extends StatelessWidget {
@ -190,31 +172,25 @@ class _InsertButton extends StatelessWidget {
class _MenuButton extends StatefulWidget {
final VoidCallback openMenu;
final bool isDragEnabled;
const _MenuButton({
required this.openMenu,
this.isDragEnabled = false,
});
Key? key,
}) : super(key: key);
@override
State<_MenuButton> createState() => _MenuButtonState();
}
class _MenuButtonState extends State<_MenuButton> {
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return FlowyIconButton(
tooltipText:
widget.isDragEnabled ? null : LocaleKeys.tooltip_openMenu.tr(),
richTooltipText: widget.isDragEnabled
? TextSpan(
children: [
TextSpan(text: '${LocaleKeys.tooltip_dragRow.tr()}\n'),
TextSpan(text: LocaleKeys.tooltip_openMenu.tr()),
],
)
: null,
tooltipText: LocaleKeys.tooltip_openMenu.tr(),
hoverColor: AFThemeExtension.of(context).lightGreyHover,
width: 20,
height: 30,
@ -282,7 +258,6 @@ class RowContent extends StatelessWidget {
if (builder != null) {
accessories.addAll(builder(buildContext));
}
return accessories;
},
child: child,
@ -314,12 +289,12 @@ class _RowEnterRegion extends StatefulWidget {
}
class _RowEnterRegionState extends State<_RowEnterRegion> {
late final RegionStateNotifier _rowStateNotifier;
late RegionStateNotifier _rowStateNotifier;
@override
void initState() {
super.initState();
_rowStateNotifier = RegionStateNotifier();
super.initState();
}
@override

View File

@ -74,7 +74,6 @@ class GridCellBuilder {
key: key,
);
}
throw UnimplementedError;
}
}
@ -84,7 +83,7 @@ class BlankCell extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const SizedBox.shrink();
return Container();
}
}

View File

@ -68,17 +68,20 @@ class CellContainer extends StatelessWidget {
if (isFocus) {
final borderSide = BorderSide(
color: Theme.of(context).colorScheme.primary,
width: 1.0,
);
return BoxDecoration(border: Border.fromBorderSide(borderSide));
}
final borderSide = BorderSide(color: Theme.of(context).dividerColor);
} else {
final borderSide = BorderSide(
color: Theme.of(context).dividerColor,
width: 1.0,
);
return BoxDecoration(
border: Border(right: borderSide, bottom: borderSide),
);
}
}
}
class _GridCellEnterRegion extends StatelessWidget {
final Widget child;

View File

@ -1,10 +1,10 @@
class HomeSizes {
static const double menuAddButtonHeight = 60;
static const double topBarHeight = 60;
static const double editPanelTopBarHeight = 60;
static const double editPanelWidth = 400;
static double get menuAddButtonHeight => 60;
static double get topBarHeight => 60;
static double get editPanelTopBarHeight => 60;
static double get editPanelWidth => 400;
}
class HomeInsets {
static const double topBarTitlePadding = 12;
static double get topBarTitlePadding => 12;
}

View File

@ -170,24 +170,23 @@ class HomeStackManager {
return MultiProvider(
providers: [ChangeNotifierProvider.value(value: _notifier)],
child: Consumer(
builder: (_, HomeStackNotifier notifier, __) {
builder: (ctx, HomeStackNotifier notifier, child) {
return FadingIndexedStack(
index: getIt<PluginSandbox>().indexOf(notifier.plugin.ty),
children: getIt<PluginSandbox>().supportPluginTypes.map(
(pluginType) {
children:
getIt<PluginSandbox>().supportPluginTypes.map((pluginType) {
if (pluginType == notifier.plugin.ty) {
final pluginWidget = notifier.plugin.display
.buildWidget(PluginContext(onDeleted: onDeleted));
if (pluginType == PluginType.editor) {
return pluginWidget;
}
} else {
return pluginWidget.padding(horizontal: 40, vertical: 28);
}
} else {
return const BlankPage();
},
).toList(),
}
}).toList(),
);
},
),
@ -205,10 +204,6 @@ class HomeTopBar extends StatelessWidget {
return Container(
color: Theme.of(context).colorScheme.onSecondaryContainer,
height: HomeSizes.topBarHeight,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: HomeInsets.topBarTitlePadding,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
@ -218,14 +213,21 @@ class HomeTopBar extends StatelessWidget {
ChangeNotifierProvider.value(
value: Provider.of<HomeStackNotifier>(context, listen: false),
child: Consumer(
builder: (_, HomeStackNotifier notifier, __) =>
notifier.plugin.display.rightBarItem ??
const SizedBox.shrink(),
),
builder: (
BuildContext context,
HomeStackNotifier notifier,
Widget? child,
) {
return notifier.plugin.display.rightBarItem ?? const SizedBox();
},
),
) // _renderMoreButton(),
],
).bottomBorder(color: Theme.of(context).dividerColor),
),
)
.padding(
horizontal: HomeInsets.topBarTitlePadding,
)
.bottomBorder(color: Theme.of(context).dividerColor),
);
}
}

View File

@ -17,13 +17,12 @@ class ViewLeftBarItem extends StatefulWidget {
class _ViewLeftBarItemState extends State<ViewLeftBarItem> {
final _controller = TextEditingController();
final _focusNode = FocusNode();
late final ViewService _viewService;
late final ViewListener _viewListener;
late ViewService _viewService;
late ViewListener _viewListener;
late ViewPB view;
@override
void initState() {
super.initState();
view = widget.view;
_viewService = ViewService();
_focusNode.addListener(_handleFocusChanged);
@ -40,8 +39,7 @@ class _ViewLeftBarItemState extends State<ViewLeftBarItem> {
);
},
);
_controller.text = view.name;
super.initState();
}
@override
@ -55,8 +53,11 @@ class _ViewLeftBarItemState extends State<ViewLeftBarItem> {
@override
Widget build(BuildContext context) {
return GestureDetector(
_controller.text = view.name;
return IntrinsicWidth(
key: ValueKey(_controller.text),
child: GestureDetector(
onDoubleTap: () {
_controller.selection = TextSelection(
baseOffset: 0,
@ -73,6 +74,9 @@ class _ViewLeftBarItemState extends State<ViewLeftBarItem> {
isDense: true,
),
style: Theme.of(context).textTheme.bodyMedium,
// cursorColor: widget.cursorColor,
// obscureText: widget.enableObscure,
),
),
);
}

View File

@ -3,7 +3,7 @@ export 'package:styled_widget/styled_widget.dart';
extension FlowyStyledWidget on Widget {
Widget bottomBorder({double width = 1.0, Color color = Colors.grey}) {
return DecoratedBox(
return Container(
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(width: width, color: color),
@ -14,7 +14,7 @@ extension FlowyStyledWidget on Widget {
}
Widget topBorder({double width = 1.0, Color color = Colors.grey}) {
return DecoratedBox(
return Container(
decoration: BoxDecoration(
border: Border(
top: BorderSide(width: width, color: color),

View File

@ -16,7 +16,6 @@ class FlowyIconButton extends StatelessWidget {
final EdgeInsets iconPadding;
final BorderRadius? radius;
final String? tooltipText;
final InlineSpan? richTooltipText;
final bool preferBelow;
const FlowyIconButton({
@ -30,22 +29,15 @@ class FlowyIconButton extends StatelessWidget {
this.iconPadding = EdgeInsets.zero,
this.radius,
this.tooltipText,
this.richTooltipText,
this.preferBelow = true,
required this.icon,
}) : assert((richTooltipText != null && tooltipText == null) ||
(richTooltipText == null && tooltipText != null) ||
(richTooltipText == null && tooltipText == null)),
super(key: key);
}) : super(key: key);
@override
Widget build(BuildContext context) {
Widget child = icon;
final size = Size(width, height ?? width);
final tooltipMessage =
tooltipText == null && richTooltipText == null ? '' : tooltipText;
assert(size.width > iconPadding.horizontal);
assert(size.height > iconPadding.vertical);
@ -54,14 +46,11 @@ class FlowyIconButton extends StatelessWidget {
final childSize = Size(childWidth, childWidth);
return ConstrainedBox(
constraints: BoxConstraints.tightFor(
width: size.width,
height: size.height,
),
constraints:
BoxConstraints.tightFor(width: size.width, height: size.height),
child: Tooltip(
preferBelow: preferBelow,
message: tooltipMessage,
richMessage: richTooltipText,
message: tooltipText ?? '',
showDuration: Duration.zero,
child: RawMaterialButton(
visualDensity: VisualDensity.compact,

View File

@ -13,11 +13,9 @@ void main() {
group('Edit Grid:', () {
late GridTestContext context;
setUp(() async {
context = await gridTest.createTestGrid();
});
// The initial number of rows is 3 for each grid.
blocTest<GridBloc, GridState>(
"create a row",
@ -56,34 +54,5 @@ void main() {
);
},
);
String? firstId;
String? secondId;
String? thirdId;
blocTest(
'reorder rows',
build: () => GridBloc(
view: context.gridView,
databaseController: DatabaseController(
view: context.gridView,
layoutType: LayoutTypePB.Grid,
),
)..add(const GridEvent.initial()),
act: (bloc) async {
await gridResponseFuture();
firstId = bloc.state.rowInfos[0].rowPB.id;
secondId = bloc.state.rowInfos[1].rowPB.id;
thirdId = bloc.state.rowInfos[2].rowPB.id;
bloc.add(const GridEvent.moveRow(0, 2));
},
verify: (bloc) {
expect(secondId, bloc.state.rowInfos[0].rowPB.id);
expect(thirdId, bloc.state.rowInfos[1].rowPB.id);
expect(firstId, bloc.state.rowInfos[2].rowPB.id);
},
);
});
}