Skip to content

Commit e177a14

Browse files
appflowyappflowy
authored
Merge pull request #516 from AppFlowy-IO/fix/grid_ui
Fix: Grid UI bugs
2 parents 43ae87c + 76da449 commit e177a14

File tree

25 files changed

+885
-728
lines changed

25 files changed

+885
-728
lines changed

‎frontend/app_flowy/lib/workspace/application/grid/cell/cell_service/data_loader.dart‎

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -58,11 +58,7 @@ class GridCellDataLoader<T> extends IGridCellDataLoader<T> {
5858
return fut.then(
5959
(result) => result.fold((Cell cell) {
6060
try {
61-
if (cell.data.isEmpty) {
62-
return null;
63-
} else {
64-
return parser.parserData(cell.data);
65-
}
61+
return parser.parserData(cell.data);
6662
} catch (e, s) {
6763
Log.error('$parser parser cellData failed, $e');
6864
Log.error('Stack trace \n $s');
@@ -102,27 +98,37 @@ class SelectOptionCellDataLoader extends IGridCellDataLoader<SelectOptionCellDat
10298
class StringCellDataParser implements ICellDataParser<String> {
10399
@override
104100
String? parserData(List<int> data) {
105-
return utf8.decode(data);
101+
final s = utf8.decode(data);
102+
return s;
106103
}
107104
}
108105

109106
class DateCellDataParser implements ICellDataParser<DateCellData> {
110107
@override
111108
DateCellData? parserData(List<int> data) {
109+
if (data.isEmpty) {
110+
return null;
111+
}
112112
return DateCellData.fromBuffer(data);
113113
}
114114
}
115115

116116
class SelectOptionCellDataParser implements ICellDataParser<SelectOptionCellData> {
117117
@override
118118
SelectOptionCellData? parserData(List<int> data) {
119+
if (data.isEmpty) {
120+
return null;
121+
}
119122
return SelectOptionCellData.fromBuffer(data);
120123
}
121124
}
122125

123126
class URLCellDataParser implements ICellDataParser<URLCellData> {
124127
@override
125128
URLCellData? parserData(List<int> data) {
129+
if (data.isEmpty) {
130+
return null;
131+
}
126132
return URLCellData.fromBuffer(data);
127133
}
128134
}

‎frontend/app_flowy/lib/workspace/application/grid/cell/number_cell_bloc.dart‎

Lines changed: 21 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1+
import 'package:flowy_sdk/protobuf/flowy-error/errors.pb.dart';
12
import 'package:flutter_bloc/flutter_bloc.dart';
23
import 'package:freezed_annotation/freezed_annotation.dart';
34
import 'dart:async';
5+
import 'package:dartz/dartz.dart';
46
import 'cell_service/cell_service.dart';
57

68
part 'number_cell_bloc.freezed.dart';
@@ -14,25 +16,28 @@ class NumberCellBloc extends Bloc<NumberCellEvent, NumberCellState> {
1416
}) : super(NumberCellState.initial(cellContext)) {
1517
on<NumberCellEvent>(
1618
(event, emit) async {
17-
await event.map(
18-
initial: (_Initial value) async {
19+
event.when(
20+
initial: () {
1921
_startListening();
2022
},
21-
didReceiveCellUpdate: (_DidReceiveCellUpdate value) {
22-
emit(state.copyWith(content: value.cellContent ?? ""));
23+
didReceiveCellUpdate: (content) {
24+
emit(state.copyWith(content: content));
2325
},
24-
updateCell: (_UpdateCell value) async {
25-
await _updateCellValue(value, emit);
26+
updateCell: (text) {
27+
cellContext.saveCellData(text, resultCallback: (result) {
28+
result.fold(
29+
() => null,
30+
(err) {
31+
if (!isClosed) add(NumberCellEvent.didReceiveCellUpdate(right(err)));
32+
},
33+
);
34+
});
2635
},
2736
);
2837
},
2938
);
3039
}
3140

32-
Future<void> _updateCellValue(_UpdateCell value, Emitter<NumberCellState> emit) async {
33-
cellContext.saveCellData(value.text);
34-
}
35-
3641
@override
3742
Future<void> close() async {
3843
if (_onCellChangedFn != null) {
@@ -47,7 +52,7 @@ class NumberCellBloc extends Bloc<NumberCellEvent, NumberCellState> {
4752
_onCellChangedFn = cellContext.startListening(
4853
onCellChanged: ((cellContent) {
4954
if (!isClosed) {
50-
add(NumberCellEvent.didReceiveCellUpdate(cellContent));
55+
add(NumberCellEvent.didReceiveCellUpdate(left(cellContent ?? "")));
5156
}
5257
}),
5358
);
@@ -58,17 +63,19 @@ class NumberCellBloc extends Bloc<NumberCellEvent, NumberCellState> {
5863
class NumberCellEvent with _$NumberCellEvent {
5964
const factory NumberCellEvent.initial() = _Initial;
6065
const factory NumberCellEvent.updateCell(String text) = _UpdateCell;
61-
const factory NumberCellEvent.didReceiveCellUpdate(String? cellContent) = _DidReceiveCellUpdate;
66+
const factory NumberCellEvent.didReceiveCellUpdate(Either<String, FlowyError> cellContent) = _DidReceiveCellUpdate;
6267
}
6368

6469
@freezed
6570
class NumberCellState with _$NumberCellState {
6671
const factory NumberCellState({
67-
required String content,
72+
required Either<String, FlowyError> content,
6873
}) = _NumberCellState;
6974

7075
factory NumberCellState.initial(GridCellContext context) {
7176
final cellContent = context.getCellData() ?? "";
72-
return NumberCellState(content: cellContent);
77+
return NumberCellState(
78+
content: left(cellContent),
79+
);
7380
}
7481
}

‎frontend/app_flowy/lib/workspace/application/grid/field/type_option/number_bloc.dart‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:app_flowy/workspace/application/grid/field/type_option/type_option_service.dart';
2+
import 'package:flowy_sdk/protobuf/flowy-grid/format.pbenum.dart';
23
import 'package:flowy_sdk/protobuf/flowy-grid/number_type_option.pb.dart';
34
import 'package:flutter_bloc/flutter_bloc.dart';
45
import 'package:freezed_annotation/freezed_annotation.dart';

‎frontend/app_flowy/lib/workspace/application/grid/field/type_option/number_format_bloc.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import 'package:flowy_sdk/protobuf/flowy-grid/number_type_option.pb.dart';
1+
import 'package:flowy_sdk/protobuf/flowy-grid/format.pbenum.dart';
22
import 'package:flutter_bloc/flutter_bloc.dart';
33
import 'package:freezed_annotation/freezed_annotation.dart';
44
import 'dart:async';

‎frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/number_cell.dart‎

Lines changed: 26 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ class _NumberCellState extends State<NumberCell> {
2929
void initState() {
3030
final cellContext = widget.cellContextBuilder.build();
3131
_cellBloc = getIt<NumberCellBloc>(param1: cellContext)..add(const NumberCellEvent.initial());
32-
_controller = TextEditingController(text: _cellBloc.state.content);
32+
_controller = TextEditingController(text: contentFromState(_cellBloc.state));
3333
_focusNode = CellSingleFocusNode();
3434
_listenFocusNode();
3535
super.initState();
@@ -40,26 +40,25 @@ class _NumberCellState extends State<NumberCell> {
4040
_listenCellRequestFocus(context);
4141
return BlocProvider.value(
4242
value: _cellBloc,
43-
child: BlocConsumer<NumberCellBloc, NumberCellState>(
44-
listener: (context, state) {
45-
if (_controller.text != state.content) {
46-
_controller.text = state.content;
47-
}
48-
},
49-
builder: (context, state) {
50-
return TextField(
51-
controller: _controller,
52-
focusNode: _focusNode,
53-
onEditingComplete: () => _focusNode.unfocus(),
54-
maxLines: null,
55-
style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500),
56-
decoration: const InputDecoration(
57-
contentPadding: EdgeInsets.zero,
58-
border: InputBorder.none,
59-
isDense: true,
60-
),
61-
);
62-
},
43+
child: MultiBlocListener(
44+
listeners: [
45+
BlocListener<NumberCellBloc, NumberCellState>(
46+
listenWhen: (p, c) => p.content != c.content,
47+
listener: (context, state) => _controller.text = contentFromState(state),
48+
),
49+
],
50+
child: TextField(
51+
controller: _controller,
52+
focusNode: _focusNode,
53+
onEditingComplete: () => _focusNode.unfocus(),
54+
maxLines: null,
55+
style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500),
56+
decoration: const InputDecoration(
57+
contentPadding: EdgeInsets.zero,
58+
border: InputBorder.none,
59+
isDense: true,
60+
),
61+
),
6362
),
6463
);
6564
}
@@ -86,13 +85,8 @@ class _NumberCellState extends State<NumberCell> {
8685
if (mounted) {
8786
_delayOperation?.cancel();
8887
_delayOperation = Timer(const Duration(milliseconds: 300), () {
89-
if (_cellBloc.isClosed == false && _controller.text != _cellBloc.state.content) {
90-
final number = num.tryParse(_controller.text);
91-
if (number != null) {
92-
_cellBloc.add(NumberCellEvent.updateCell(_controller.text));
93-
} else {
94-
_controller.text = "";
95-
}
88+
if (_cellBloc.isClosed == false && _controller.text != contentFromState(_cellBloc.state)) {
89+
_cellBloc.add(NumberCellEvent.updateCell(_controller.text));
9690
}
9791
});
9892
}
@@ -113,4 +107,8 @@ class _NumberCellState extends State<NumberCell> {
113107
}
114108
});
115109
}
110+
111+
String contentFromState(NumberCellState state) {
112+
return state.content.fold((l) => l, (r) => "");
113+
}
116114
}

‎frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/select_option_cell/extension.dart‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -64,22 +64,26 @@ class SelectOptionTag extends StatelessWidget {
6464
final String name;
6565
final Color color;
6666
final bool isSelected;
67+
final VoidCallback? onSelected;
6768
const SelectOptionTag({
6869
required this.name,
6970
required this.color,
71+
this.onSelected,
7072
this.isSelected = false,
7173
Key? key,
7274
}) : super(key: key);
7375

7476
factory SelectOptionTag.fromSelectOption({
7577
required BuildContext context,
7678
required SelectOption option,
79+
VoidCallback? onSelected,
7780
bool isSelected = false,
7881
}) {
7982
return SelectOptionTag(
8083
name: option.name,
8184
color: option.color.make(context),
8285
isSelected: isSelected,
86+
onSelected: onSelected,
8387
);
8488
}
8589

@@ -92,19 +96,12 @@ class SelectOptionTag extends StatelessWidget {
9296
backgroundColor: color,
9397
labelPadding: const EdgeInsets.symmetric(horizontal: 6),
9498
selected: true,
95-
onSelected: (_) {},
99+
onSelected: (_) {
100+
if (onSelected != null) {
101+
onSelected!();
102+
}
103+
},
96104
);
97-
98-
// return Container(
99-
// decoration: BoxDecoration(
100-
// color: option.color.make(context),
101-
// shape: BoxShape.rectangle,
102-
// borderRadius: BorderRadius.circular(8.0),
103-
// ),
104-
// child: Center(child: FlowyText.medium(option.name, fontSize: 12)),
105-
// margin: const EdgeInsets.symmetric(horizontal: 3.0),
106-
// padding: const EdgeInsets.symmetric(horizontal: 6.0),
107-
// );
108105
}
109106
}
110107

@@ -136,7 +133,11 @@ class SelectOptionTagCell extends StatelessWidget {
136133
Flexible(
137134
fit: FlexFit.loose,
138135
flex: 2,
139-
child: SelectOptionTag.fromSelectOption(context: context, option: option),
136+
child: SelectOptionTag.fromSelectOption(
137+
context: context,
138+
option: option,
139+
onSelected: () => onSelected(option),
140+
),
140141
),
141142
const Spacer(),
142143
...children,

‎frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/select_option_cell/select_option_editor.dart‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -233,7 +233,11 @@ class _SelectOptionCell extends StatelessWidget {
233233
context.read<SelectOptionCellEditorBloc>().add(SelectOptionEditorEvent.selectOption(option.id));
234234
},
235235
children: [
236-
if (isSelected) svgWidget("grid/checkmark"),
236+
if (isSelected)
237+
Padding(
238+
padding: const EdgeInsets.only(right: 6),
239+
child: svgWidget("grid/checkmark"),
240+
),
237241
],
238242
),
239243
),

‎frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/url_cell/url_cell.dart‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,10 @@ class _GridURLCellState extends State<GridURLCell> {
7272

7373
return CellEnterRegion(
7474
child: Align(alignment: Alignment.centerLeft, child: richText),
75-
expander: _EditCellIndicator(onTap: () {}),
75+
expander: _EditCellIndicator(onTap: () {
76+
final cellContext = widget.cellContextBuilder.build() as GridURLCellContext;
77+
URLCellEditor.show(context, cellContext);
78+
}),
7679
);
7780
},
7881
),

‎frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/type_option/number.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import 'package:flowy_infra_ui/flowy_infra_ui.dart';
99
import 'package:flowy_infra_ui/style_widget/button.dart';
1010
import 'package:flowy_infra_ui/style_widget/text.dart';
1111
import 'package:flowy_infra_ui/widget/spacing.dart';
12-
import 'package:flowy_sdk/protobuf/flowy-grid/number_type_option.pb.dart';
12+
import 'package:flowy_sdk/protobuf/flowy-grid/format.pbenum.dart';
1313
import 'package:flutter/material.dart';
1414
import 'package:flutter_bloc/flutter_bloc.dart';
1515
import 'package:easy_localization/easy_localization.dart' hide NumberFormat;

‎frontend/app_flowy/packages/flowy_sdk/lib/protobuf/flowy-grid/format.pb.dart‎

Lines changed: 11 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)