diff --git a/.github/workflows/flowy_editor_test.yml b/.github/workflows/appflowy_editor_test.yml similarity index 90% rename from .github/workflows/flowy_editor_test.yml rename to .github/workflows/appflowy_editor_test.yml index 450f72e61d..80b9337f7b 100644 --- a/.github/workflows/flowy_editor_test.yml +++ b/.github/workflows/appflowy_editor_test.yml @@ -1,4 +1,4 @@ -name: FlowyEditor test +name: AppFlowyEditor test on: push: @@ -37,6 +37,8 @@ jobs: working-directory: frontend/app_flowy/packages/appflowy_editor run: | flutter pub get + flutter format --set-exit-if-changed . + flutter analyze . flutter test --coverage - uses: codecov/codecov-action@v3 diff --git a/frontend/app_flowy/ios/Runner/Info.plist b/frontend/app_flowy/ios/Runner/Info.plist index 848c264d70..122f6a8cd7 100644 --- a/frontend/app_flowy/ios/Runner/Info.plist +++ b/frontend/app_flowy/ios/Runner/Info.plist @@ -45,5 +45,7 @@ en + CADisableMinimumFrameDurationOnPhone + diff --git a/frontend/app_flowy/lib/plugins/board/application/board_bloc.dart b/frontend/app_flowy/lib/plugins/board/application/board_bloc.dart index afb04e8f38..ce72413425 100644 --- a/frontend/app_flowy/lib/plugins/board/application/board_bloc.dart +++ b/frontend/app_flowy/lib/plugins/board/application/board_bloc.dart @@ -89,18 +89,30 @@ class BoardBloc extends Bloc { (err) => Log.error(err), ); }, - didCreateRow: (String groupId, RowPB row, int? index) { + didCreateRow: (group, row, int? index) { emit(state.copyWith( editingRow: Some(BoardEditingRow( - columnId: groupId, + group: group, row: row, index: index, )), )); + _groupItemStartEditing(group, row, true); }, - endEditRow: (rowId) { + startEditingRow: (group, row) { + emit(state.copyWith( + editingRow: Some(BoardEditingRow( + group: group, + row: row, + index: null, + )), + )); + _groupItemStartEditing(group, row, true); + }, + endEditingRow: (rowId) { state.editingRow.fold(() => null, (editingRow) { assert(editingRow.row.id == rowId); + _groupItemStartEditing(editingRow.group, editingRow.row, false); emit(state.copyWith(editingRow: none())); }); }, @@ -122,6 +134,24 @@ class BoardBloc extends Bloc { ); } + void _groupItemStartEditing(GroupPB group, RowPB row, bool isEdit) { + final fieldContext = fieldController.getField(group.fieldId); + if (fieldContext == null) { + Log.warn("FieldContext should not be null"); + return; + } + + boardController.enableGroupDragging(!isEdit); + // boardController.updateGroupItem( + // group.groupId, + // GroupItem( + // row: row, + // fieldContext: fieldContext, + // isDraggable: !isEdit, + // ), + // ); + } + void _moveRow(RowPB? fromRow, String columnId, RowPB? toRow) { if (fromRow != null) { _rowService @@ -136,11 +166,11 @@ class BoardBloc extends Bloc { } } - void _moveGroup(String fromColumnId, String toColumnId) { + void _moveGroup(String fromGroupId, String toGroupId) { _rowService .moveGroup( - fromGroupId: fromColumnId, - toGroupId: toColumnId, + fromGroupId: fromGroupId, + toGroupId: toGroupId, ) .then((result) { result.fold((l) => null, (r) => add(BoardEvent.didReceiveError(r))); @@ -156,7 +186,7 @@ class BoardBloc extends Bloc { return super.close(); } - void initializeGroups(List groups) { + void initializeGroups(List groupsData) { for (var controller in groupControllers.values) { controller.dispose(); } @@ -164,27 +194,27 @@ class BoardBloc extends Bloc { boardController.clear(); // - List columns = groups + List groups = groupsData .where((group) => fieldController.getField(group.fieldId) != null) .map((group) { return AppFlowyGroupData( id: group.groupId, name: group.desc, - items: _buildRows(group), - customData: BoardCustomData( + items: _buildGroupItems(group), + customData: GroupData( group: group, fieldContext: fieldController.getField(group.fieldId)!, ), ); }).toList(); - boardController.addGroups(columns); + boardController.addGroups(groups); - for (final group in groups) { + for (final group in groupsData) { final delegate = GroupControllerDelegateImpl( controller: boardController, fieldController: fieldController, onNewColumnItem: (groupId, row, index) { - add(BoardEvent.didCreateRow(groupId, row, index)); + add(BoardEvent.didCreateRow(group, row, index)); }, ); final controller = GroupController( @@ -242,10 +272,13 @@ class BoardBloc extends Bloc { ); } - List _buildRows(GroupPB group) { + List _buildGroupItems(GroupPB group) { final items = group.rows.map((row) { final fieldContext = fieldController.getField(group.fieldId); - return BoardColumnItem(row: row, fieldContext: fieldContext!); + return GroupItem( + row: row, + fieldContext: fieldContext!, + ); }).toList(); return [...items]; @@ -270,11 +303,15 @@ class BoardEvent with _$BoardEvent { const factory BoardEvent.createBottomRow(String groupId) = _CreateBottomRow; const factory BoardEvent.createHeaderRow(String groupId) = _CreateHeaderRow; const factory BoardEvent.didCreateRow( - String groupId, + GroupPB group, RowPB row, int? index, ) = _DidCreateRow; - const factory BoardEvent.endEditRow(String rowId) = _EndEditRow; + const factory BoardEvent.startEditingRow( + GroupPB group, + RowPB row, + ) = _StartEditRow; + const factory BoardEvent.endEditingRow(String rowId) = _EndEditRow; const factory BoardEvent.didReceiveError(FlowyError error) = _DidReceiveError; const factory BoardEvent.didReceiveGridUpdate( GridPB grid, @@ -334,14 +371,17 @@ class GridFieldEquatable extends Equatable { UnmodifiableListView get value => UnmodifiableListView(_fields); } -class BoardColumnItem extends AppFlowyGroupItem { +class GroupItem extends AppFlowyGroupItem { final RowPB row; final GridFieldContext fieldContext; - BoardColumnItem({ + GroupItem({ required this.row, required this.fieldContext, - }); + bool draggable = true, + }) { + super.draggable = draggable; + } @override String get id => row.id; @@ -367,10 +407,16 @@ class GroupControllerDelegateImpl extends GroupControllerDelegate { } if (index != null) { - final item = BoardColumnItem(row: row, fieldContext: fieldContext); + final item = GroupItem( + row: row, + fieldContext: fieldContext, + ); controller.insertGroupItem(group.groupId, index, item); } else { - final item = BoardColumnItem(row: row, fieldContext: fieldContext); + final item = GroupItem( + row: row, + fieldContext: fieldContext, + ); controller.addGroupItem(group.groupId, item); } } @@ -389,7 +435,10 @@ class GroupControllerDelegateImpl extends GroupControllerDelegate { } controller.updateGroupItem( group.groupId, - BoardColumnItem(row: row, fieldContext: fieldContext), + GroupItem( + row: row, + fieldContext: fieldContext, + ), ); } @@ -400,7 +449,11 @@ class GroupControllerDelegateImpl extends GroupControllerDelegate { Log.warn("FieldContext should not be null"); return; } - final item = BoardColumnItem(row: row, fieldContext: fieldContext); + final item = GroupItem( + row: row, + fieldContext: fieldContext, + draggable: false, + ); if (index != null) { controller.insertGroupItem(group.groupId, index, item); @@ -412,21 +465,21 @@ class GroupControllerDelegateImpl extends GroupControllerDelegate { } class BoardEditingRow { - String columnId; + GroupPB group; RowPB row; int? index; BoardEditingRow({ - required this.columnId, + required this.group, required this.row, required this.index, }); } -class BoardCustomData { +class GroupData { final GroupPB group; final GridFieldContext fieldContext; - BoardCustomData({ + GroupData({ required this.group, required this.fieldContext, }); diff --git a/frontend/app_flowy/lib/plugins/board/application/board_data_controller.dart b/frontend/app_flowy/lib/plugins/board/application/board_data_controller.dart index 923bb4ef8c..641239e767 100644 --- a/frontend/app_flowy/lib/plugins/board/application/board_data_controller.dart +++ b/frontend/app_flowy/lib/plugins/board/application/board_data_controller.dart @@ -87,13 +87,13 @@ class BoardDataController { onUpdatedGroup.call(changeset.updateGroups); } - if (changeset.insertedGroups.isNotEmpty) { - onInsertedGroup.call(changeset.insertedGroups); - } - if (changeset.deletedGroups.isNotEmpty) { onDeletedGroup.call(changeset.deletedGroups); } + + if (changeset.insertedGroups.isNotEmpty) { + onInsertedGroup.call(changeset.insertedGroups); + } }, (e) => _onError?.call(e), ); diff --git a/frontend/app_flowy/lib/plugins/board/presentation/board_page.dart b/frontend/app_flowy/lib/plugins/board/presentation/board_page.dart index dd5e619b46..a7f0d90557 100644 --- a/frontend/app_flowy/lib/plugins/board/presentation/board_page.dart +++ b/frontend/app_flowy/lib/plugins/board/presentation/board_page.dart @@ -83,7 +83,7 @@ class _BoardContentState extends State { @override Widget build(BuildContext context) { return BlocListener( - listener: (context, state) => _handleEditState(state, context), + listener: (context, state) => _handleEditStateChanged(state, context), child: BlocBuilder( buildWhen: (previous, current) => previous.groupIds != current.groupIds, builder: (context, state) { @@ -128,21 +128,14 @@ class _BoardContentState extends State { ); } - void _handleEditState(BoardState state, BuildContext context) { + void _handleEditStateChanged(BoardState state, BuildContext context) { state.editingRow.fold( () => null, (editingRow) { WidgetsBinding.instance.addPostFrameCallback((_) { if (editingRow.index != null) { - context - .read() - .add(BoardEvent.endEditRow(editingRow.row.id)); } else { - scrollManager.scrollToBottom(editingRow.columnId, (boardContext) { - context - .read() - .add(BoardEvent.endEditRow(editingRow.row.id)); - }); + scrollManager.scrollToBottom(editingRow.group.groupId); } }); }, @@ -156,14 +149,14 @@ class _BoardContentState extends State { Widget _buildHeader( BuildContext context, - AppFlowyGroupData columnData, + AppFlowyGroupData groupData, ) { - final boardCustomData = columnData.customData as BoardCustomData; + final boardCustomData = groupData.customData as GroupData; return AppFlowyGroupHeader( title: Flexible( fit: FlexFit.tight, child: FlowyText.medium( - columnData.headerData.groupName, + groupData.headerData.groupName, fontSize: 14, overflow: TextOverflow.clip, color: context.read().textColor, @@ -180,7 +173,7 @@ class _BoardContentState extends State { ), onAddButtonClick: () { context.read().add( - BoardEvent.createHeaderRow(columnData.id), + BoardEvent.createHeaderRow(groupData.id), ); }, height: 50, @@ -218,15 +211,16 @@ class _BoardContentState extends State { Widget _buildCard( BuildContext context, - AppFlowyGroupData group, - AppFlowyGroupItem columnItem, + AppFlowyGroupData afGroupData, + AppFlowyGroupItem afGroupItem, ) { - final boardColumnItem = columnItem as BoardColumnItem; - final rowPB = boardColumnItem.row; + final groupItem = afGroupItem as GroupItem; + final groupData = afGroupData.customData as GroupData; + final rowPB = groupItem.row; final rowCache = context.read().getRowCache(rowPB.blockId); /// Return placeholder widget if the rowCache is null. - if (rowCache == null) return SizedBox(key: ObjectKey(columnItem)); + if (rowCache == null) return SizedBox(key: ObjectKey(groupItem)); final fieldController = context.read().fieldController; final gridId = context.read().gridId; @@ -241,19 +235,19 @@ class _BoardContentState extends State { context.read().state.editingRow.fold( () => null, (editingRow) { - isEditing = editingRow.row.id == columnItem.row.id; + isEditing = editingRow.row.id == groupItem.row.id; }, ); - final groupItemId = columnItem.id + group.id; + final groupItemId = groupItem.row.id + groupData.group.groupId; return AppFlowyGroupCard( key: ValueKey(groupItemId), margin: config.cardPadding, decoration: _makeBoxDecoration(context), child: BoardCard( gridId: gridId, - groupId: group.id, - fieldId: boardColumnItem.fieldContext.id, + groupId: groupData.group.groupId, + fieldId: groupItem.fieldContext.id, isEditing: isEditing, cellBuilder: cellBuilder, dataController: cardController, @@ -264,6 +258,19 @@ class _BoardContentState extends State { rowCache, context, ), + onStartEditing: () { + context.read().add( + BoardEvent.startEditingRow( + groupData.group, + groupItem.row, + ), + ); + }, + onEndEditing: () { + context + .read() + .add(BoardEvent.endEditingRow(groupItem.row.id)); + }, ), ); } @@ -345,7 +352,7 @@ extension HexColor on Color { } } -Widget? _buildHeaderIcon(BoardCustomData customData) { +Widget? _buildHeaderIcon(GroupData customData) { Widget? widget; switch (customData.fieldType) { case FieldType.Checkbox: diff --git a/frontend/app_flowy/lib/plugins/board/presentation/card/board_cell.dart b/frontend/app_flowy/lib/plugins/board/presentation/card/board_cell.dart index 3968c6463c..549f7ba64c 100644 --- a/frontend/app_flowy/lib/plugins/board/presentation/card/board_cell.dart +++ b/frontend/app_flowy/lib/plugins/board/presentation/card/board_cell.dart @@ -76,6 +76,10 @@ class EditableRowNotifier { } abstract class EditableCell { + // Each cell notifier will be bind to the [EditableRowNotifier], which enable + // the row notifier receive its cells event. For example: begin editing the + // cell or end editing the cell. + // EditableCellNotifier? get editableNotifier; } diff --git a/frontend/app_flowy/lib/plugins/board/presentation/card/board_text_cell.dart b/frontend/app_flowy/lib/plugins/board/presentation/card/board_text_cell.dart index 4a48e8fe48..3237316c13 100644 --- a/frontend/app_flowy/lib/plugins/board/presentation/card/board_text_cell.dart +++ b/frontend/app_flowy/lib/plugins/board/presentation/card/board_text_cell.dart @@ -42,6 +42,9 @@ class _BoardTextCellState extends State { focusNode.requestFocus(); } + // If the focusNode lost its focus, the widget's editableNotifier will + // set to false, which will cause the [EditableRowNotifier] to receive + // end edit event. focusNode.addListener(() { if (!focusNode.hasFocus) { focusWhenInit = false; @@ -131,7 +134,11 @@ class _BoardTextCellState extends State { padding: EdgeInsets.symmetric( vertical: BoardSizes.cardCellVPadding, ), - child: FlowyText.medium(state.content, fontSize: 14), + child: FlowyText.medium( + state.content, + fontSize: 14, + maxLines: null, // Enable multiple lines + ), ); } diff --git a/frontend/app_flowy/lib/plugins/board/presentation/card/card.dart b/frontend/app_flowy/lib/plugins/board/presentation/card/card.dart index c08ece7474..bf1143523a 100644 --- a/frontend/app_flowy/lib/plugins/board/presentation/card/card.dart +++ b/frontend/app_flowy/lib/plugins/board/presentation/card/card.dart @@ -21,6 +21,8 @@ class BoardCard extends StatefulWidget { final CardDataController dataController; final BoardCellBuilder cellBuilder; final void Function(BuildContext) openCard; + final VoidCallback onStartEditing; + final VoidCallback onEndEditing; const BoardCard({ required this.gridId, @@ -30,6 +32,8 @@ class BoardCard extends StatefulWidget { required this.dataController, required this.cellBuilder, required this.openCard, + required this.onStartEditing, + required this.onEndEditing, Key? key, }) : super(key: key); @@ -56,6 +60,12 @@ class _BoardCardState extends State { rowNotifier.isEditing.addListener(() { if (!mounted) return; _cardBloc.add(BoardCardEvent.setIsEditing(rowNotifier.isEditing.value)); + + if (rowNotifier.isEditing.value) { + widget.onStartEditing(); + } else { + widget.onEndEditing(); + } }); popoverController = PopoverController(); diff --git a/frontend/app_flowy/lib/plugins/doc/document.dart b/frontend/app_flowy/lib/plugins/doc/document.dart index d186513acc..b2c75a08fe 100644 --- a/frontend/app_flowy/lib/plugins/doc/document.dart +++ b/frontend/app_flowy/lib/plugins/doc/document.dart @@ -15,6 +15,7 @@ import 'package:clipboard/clipboard.dart'; import 'package:dartz/dartz.dart' as dartz; import 'package:easy_localization/easy_localization.dart'; import 'package:flowy_infra/size.dart'; +import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flowy_infra_ui/widget/rounded_button.dart'; import 'package:flowy_sdk/log.dart'; @@ -112,7 +113,6 @@ class DocumentShareButton extends StatelessWidget { @override Widget build(BuildContext context) { - double buttonWidth = 60; return BlocProvider( create: (context) => getIt(param1: view), child: BlocListener( @@ -130,6 +130,7 @@ class DocumentShareButton extends StatelessWidget { }, child: BlocBuilder( builder: (context, state) { + final theme = context.watch(); return ChangeNotifierProvider.value( value: Provider.of(context, listen: true), child: Selector( @@ -137,16 +138,15 @@ class DocumentShareButton extends StatelessWidget { builder: (ctx, _, child) => ConstrainedBox( constraints: const BoxConstraints.expand( height: 30, - // minWidth: buttonWidth, width: 100, ), child: RoundedTextButton( title: LocaleKeys.shareAction_buttonText.tr(), fontSize: 12, borderRadius: Corners.s6Border, - color: Colors.lightBlue, - onPressed: () => _showActionList( - context, Offset(-(buttonWidth / 2), 10)), + color: theme.main1, + onPressed: () => + _showActionList(context, const Offset(0, 10)), ), ), ), @@ -193,7 +193,7 @@ class DocumentShareButton extends StatelessWidget { }); actionList.show( context, - anchorDirection: AnchorDirection.bottomWithCenterAligned, + anchorDirection: AnchorDirection.bottomWithRightAligned, anchorOffset: offset, ); } diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_editor.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_editor.dart index 4018c0acb6..672e0e648e 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_editor.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_editor.dart @@ -159,6 +159,7 @@ class _CellCalendarWidgetState extends State<_CellCalendarWidget> { focusedDay: state.focusedDay, rowHeight: 40, calendarFormat: state.format, + daysOfWeekHeight: 40, headerStyle: HeaderStyle( formatButtonVisible: false, titleCentered: true, @@ -168,6 +169,7 @@ class _CellCalendarWidgetState extends State<_CellCalendarWidget> { rightChevronPadding: EdgeInsets.zero, rightChevronMargin: EdgeInsets.zero, rightChevronIcon: svgWidget("home/arrow_right"), + headerMargin: const EdgeInsets.only(bottom: 8.0), ), daysOfWeekStyle: DaysOfWeekStyle( dowTextFormatter: (date, locale) => @@ -182,13 +184,31 @@ class _CellCalendarWidgetState extends State<_CellCalendarWidget> { ), ), calendarStyle: CalendarStyle( + cellMargin: const EdgeInsets.all(3), + defaultDecoration: BoxDecoration( + color: theme.surface, + shape: BoxShape.rectangle, + borderRadius: const BorderRadius.all(Radius.circular(6)), + ), selectedDecoration: BoxDecoration( color: theme.main1, - shape: BoxShape.circle, + shape: BoxShape.rectangle, + borderRadius: const BorderRadius.all(Radius.circular(6)), ), todayDecoration: BoxDecoration( color: theme.shader4, - shape: BoxShape.circle, + shape: BoxShape.rectangle, + borderRadius: const BorderRadius.all(Radius.circular(6)), + ), + weekendDecoration: BoxDecoration( + color: theme.surface, + shape: BoxShape.rectangle, + borderRadius: const BorderRadius.all(Radius.circular(6)), + ), + outsideDecoration: BoxDecoration( + color: theme.surface, + shape: BoxShape.rectangle, + borderRadius: const BorderRadius.all(Radius.circular(6)), ), selectedTextStyle: TextStyle( color: theme.surface, diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_editor.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_editor.dart index 1b683713a3..21c2355621 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_editor.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_editor.dart @@ -142,11 +142,12 @@ class _TextField extends StatelessWidget { value: (option) => option); return SizedBox( - height: 42, + height: 62, child: SelectOptionTextField( options: state.options, selectedOptionMap: optionMap, distanceToText: _editorPanelWidth * 0.7, + maxLength: 30, tagController: _tagController, onClick: () => popoverMutex.close(), newText: (text) { diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/text_field.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/text_field.dart index 2bb249dbd5..93bbc1de68 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/text_field.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/text_field.dart @@ -6,6 +6,7 @@ import 'package:flowy_sdk/protobuf/flowy-grid/select_option.pb.dart'; import 'package:flutter/material.dart'; import 'package:easy_localization/easy_localization.dart'; import 'package:app_flowy/generated/locale_keys.g.dart'; +import 'package:flutter/services.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:textfield_tags/textfield_tags.dart'; @@ -20,6 +21,7 @@ class SelectOptionTextField extends StatefulWidget { final Function(String) onSubmitted; final Function(String) newText; final VoidCallback? onClick; + final int? maxLength; const SelectOptionTextField({ required this.options, @@ -29,6 +31,7 @@ class SelectOptionTextField extends StatefulWidget { required this.onSubmitted, required this.newText, this.onClick, + this.maxLength, TextEditingController? textController, FocusNode? focusNode, Key? key, @@ -93,6 +96,9 @@ class _SelectOptionTextFieldState extends State { } }, maxLines: 1, + maxLength: widget.maxLength, + maxLengthEnforcement: + MaxLengthEnforcement.truncateAfterCompositionEnds, style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500), decoration: InputDecoration( enabledBorder: OutlineInputBorder( diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/common/text_field.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/common/text_field.dart index 43d394bfe1..bd59b8b82c 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/common/text_field.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/common/text_field.dart @@ -9,6 +9,7 @@ class InputTextField extends StatefulWidget { final void Function() onCanceled; final bool autoClearWhenDone; final String text; + final int? maxLength; const InputTextField({ required this.text, @@ -16,6 +17,7 @@ class InputTextField extends StatefulWidget { required this.onCanceled, this.onChanged, this.autoClearWhenDone = false, + this.maxLength, Key? key, }) : super(key: key); @@ -41,11 +43,14 @@ class _InputTextFieldState extends State { Widget build(BuildContext context) { final theme = context.watch(); + final height = widget.maxLength == null ? 36.0 : 56.0; + return RoundedInputField( controller: _controller, focusNode: _focusNode, autoFocus: true, - height: 36, + height: height, + maxLength: widget.maxLength, style: const TextStyle(fontSize: 13, fontWeight: FontWeight.w500), normalBorderColor: theme.shader4, focusBorderColor: theme.main1, diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option.dart index 06a9cd84b6..002dda79f1 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option.dart @@ -256,6 +256,7 @@ class _CreateOptionTextField extends StatelessWidget { final text = state.newOptionName.foldRight("", (a, previous) => a); return InputTextField( autoClearWhenDone: true, + maxLength: 30, text: text, onCanceled: () { context diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option_editor.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option_editor.dart index 53ede57f4c..ab9303b189 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option_editor.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/type_option/select_option_editor.dart @@ -106,6 +106,7 @@ class _OptionNameTextField extends StatelessWidget { Widget build(BuildContext context) { return InputTextField( text: name, + maxLength: 30, onCanceled: () {}, onDone: (optionName) { if (name != optionName) { diff --git a/frontend/app_flowy/lib/workspace/application/home/home_bloc.dart b/frontend/app_flowy/lib/workspace/application/home/home_bloc.dart index 87bac230da..d325fc7705 100644 --- a/frontend/app_flowy/lib/workspace/application/home/home_bloc.dart +++ b/frontend/app_flowy/lib/workspace/application/home/home_bloc.dart @@ -1,5 +1,6 @@ import 'package:app_flowy/user/application/user_listener.dart'; import 'package:app_flowy/workspace/application/edit_panel/edit_context.dart'; +import 'package:flowy_infra/time/duration.dart'; import 'package:flowy_sdk/log.dart'; import 'package:flowy_sdk/protobuf/flowy-error-code/code.pb.dart'; import 'package:flowy_sdk/protobuf/flowy-error/errors.pb.dart'; @@ -50,13 +51,24 @@ class HomeBloc extends Bloc { unauthorized: (_Unauthorized value) { emit(state.copyWith(unauthorized: true)); }, - collapseMenu: (e) { + collapseMenu: (_CollapseMenu e) { emit(state.copyWith(isMenuCollapsed: !state.isMenuCollapsed)); }, - editPanelResized: (e) { - final newOffset = - (state.resizeOffset + e.offset).clamp(-50, 200).toDouble(); - emit(state.copyWith(resizeOffset: newOffset)); + editPanelResizeStart: (_EditPanelResizeStart e) { + emit(state.copyWith( + resizeType: MenuResizeType.drag, + resizeStart: state.resizeOffset, + )); + }, + editPanelResized: (_EditPanelResized e) { + final newPosition = + (e.offset + state.resizeStart).clamp(-50, 200).toDouble(); + if (state.resizeOffset != newPosition) { + emit(state.copyWith(resizeOffset: newPosition)); + } + }, + editPanelResizeEnd: (_EditPanelResizeEnd e) { + emit(state.copyWith(resizeType: MenuResizeType.slide)); }, ); }, @@ -78,6 +90,22 @@ class HomeBloc extends Bloc { } } +enum MenuResizeType { + slide, + drag, +} + +extension MenuResizeTypeExtension on MenuResizeType { + Duration duration() { + switch (this) { + case MenuResizeType.drag: + return 30.milliseconds; + case MenuResizeType.slide: + return 350.milliseconds; + } + } +} + @freezed class HomeEvent with _$HomeEvent { const factory HomeEvent.initial() = _Initial; @@ -91,6 +119,8 @@ class HomeEvent with _$HomeEvent { const factory HomeEvent.unauthorized(String msg) = _Unauthorized; const factory HomeEvent.collapseMenu() = _CollapseMenu; const factory HomeEvent.editPanelResized(double offset) = _EditPanelResized; + const factory HomeEvent.editPanelResizeStart() = _EditPanelResizeStart; + const factory HomeEvent.editPanelResizeEnd() = _EditPanelResizeEnd; } @freezed @@ -103,6 +133,8 @@ class HomeState with _$HomeState { required bool unauthorized, required bool isMenuCollapsed, required double resizeOffset, + required double resizeStart, + required MenuResizeType resizeType, }) = _HomeState; factory HomeState.initial(CurrentWorkspaceSettingPB workspaceSetting) => @@ -114,5 +146,7 @@ class HomeState with _$HomeState { unauthorized: false, isMenuCollapsed: false, resizeOffset: 0, + resizeStart: 0, + resizeType: MenuResizeType.slide, ); } diff --git a/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart b/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart index 9a3d5636ab..e515eb9a1b 100644 --- a/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart +++ b/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart @@ -2,7 +2,6 @@ import 'dart:io' show Platform; import 'package:app_flowy/workspace/application/home/home_bloc.dart'; import 'package:flowy_infra/size.dart'; -import 'package:flowy_infra/time/duration.dart'; import 'package:flutter/material.dart'; // ignore: import_of_legacy_library_into_null_safe import 'package:sized_context/sized_context.dart'; @@ -44,7 +43,7 @@ class HomeLayout { homePageLOffset = (showMenu && !menuIsDrawer) ? menuWidth : 0.0; menuSpacing = !showMenu && Platform.isMacOS ? 80.0 : 0.0; - animDuration = .35.seconds; + animDuration = homeBlocState.resizeType.duration(); editPanelWidth = HomeSizes.editPanelWidth; homePageROffset = showEditPanel ? editPanelWidth : 0; diff --git a/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart b/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart index 1d46ade005..ae4dc7f3b9 100644 --- a/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart +++ b/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart @@ -176,11 +176,18 @@ class _HomeScreenState extends State { cursor: SystemMouseCursors.resizeLeftRight, child: GestureDetector( dragStartBehavior: DragStartBehavior.down, - onPanUpdate: ((details) { - context - .read() - .add(HomeEvent.editPanelResized(details.delta.dx)); - }), + onHorizontalDragStart: (details) => context + .read() + .add(const HomeEvent.editPanelResizeStart()), + onHorizontalDragUpdate: (details) => context + .read() + .add(HomeEvent.editPanelResized(details.localPosition.dx)), + onHorizontalDragEnd: (details) => context + .read() + .add(const HomeEvent.editPanelResizeEnd()), + onHorizontalDragCancel: () => context + .read() + .add(const HomeEvent.editPanelResizeEnd()), behavior: HitTestBehavior.translucent, child: SizedBox( width: 10, @@ -208,7 +215,6 @@ class _HomeScreenState extends State { top: 0, animate: true) .animate(layout.animDuration, Curves.easeOut), - homeMenuResizer.positioned(left: layout.homePageLOffset - 5), bubble .positioned( right: 20, @@ -236,6 +242,9 @@ class _HomeScreenState extends State { bottom: 0, animate: true) .animate(layout.animDuration, Curves.easeOut), + homeMenuResizer + .positioned(left: layout.homePageLOffset - 5) + .animate(layout.animDuration, Curves.easeOut), ], ); } diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart index f6aa316f29..2c48cec9d5 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart @@ -97,10 +97,8 @@ class ActionCell extends StatelessWidget { child: SizedBox( height: itemHeight, child: Row( - crossAxisAlignment: CrossAxisAlignment.start, children: [ - if (icon != null) icon, - HSpace(ActionListSizes.itemHPadding), + if (icon != null) ...[icon, HSpace(ActionListSizes.itemHPadding)], FlowyText.medium(action.name, fontSize: 12), ], ), diff --git a/frontend/app_flowy/packages/appflowy_board/CHANGELOG.md b/frontend/app_flowy/packages/appflowy_board/CHANGELOG.md index 2a29982421..a4d3ca722b 100644 --- a/frontend/app_flowy/packages/appflowy_board/CHANGELOG.md +++ b/frontend/app_flowy/packages/appflowy_board/CHANGELOG.md @@ -1,8 +1,14 @@ +# 0.0.9 +* Enable slide to select text in card +* Fix some bugs + # 0.0.8 * Enable drag and drop group + # 0.0.7 * Rename some classes * Add documentation + # 0.0.6 * Support scroll to bottom * Fix some bugs diff --git a/frontend/app_flowy/packages/appflowy_board/example/lib/multi_board_list_example.dart b/frontend/app_flowy/packages/appflowy_board/example/lib/multi_board_list_example.dart index 2a256a51c4..ddf764d5ea 100644 --- a/frontend/app_flowy/packages/appflowy_board/example/lib/multi_board_list_example.dart +++ b/frontend/app_flowy/packages/appflowy_board/example/lib/multi_board_list_example.dart @@ -78,7 +78,7 @@ class _MultiBoardListExampleState extends State { height: 50, margin: config.groupItemPadding, onAddButtonClick: () { - boardController.scrollToBottom(columnData.id, (p0) {}); + boardController.scrollToBottom(columnData.id); }, ); }, diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/utils/log.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/utils/log.dart index 0b8d436d81..b73d28eed2 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/utils/log.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/utils/log.dart @@ -32,4 +32,8 @@ class Log { 'AppFlowyBoard: ❗️[Trace] - ${DateTime.now().second}=> $message'); } } + + static void error(String? message) { + debugPrint('AppFlowyBoard: ❌[Error] - ${DateTime.now().second}=> $message'); + } } diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board.dart index 8aaf94e6d6..a295b575cd 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board.dart @@ -11,10 +11,11 @@ import 'reorder_phantom/phantom_controller.dart'; import '../rendering/board_overlay.dart'; class AppFlowyBoardScrollController { - AppFlowyBoardState? _groupState; + AppFlowyBoardState? _boardState; - void scrollToBottom(String groupId, void Function(BuildContext)? completed) { - _groupState?.reorderFlexActionMap[groupId]?.scrollToBottom(completed); + void scrollToBottom(String groupId, + {void Function(BuildContext)? completed}) { + _boardState?.reorderFlexActionMap[groupId]?.scrollToBottom(completed); } } @@ -39,9 +40,6 @@ class AppFlowyBoardConfig { } class AppFlowyBoard extends StatelessWidget { - /// The direction to use as the main axis. - final Axis direction = Axis.vertical; - /// The widget that will be rendered as the background of the board. final Widget? background; @@ -94,11 +92,7 @@ class AppFlowyBoard extends StatelessWidget { /// final AppFlowyBoardScrollController? boardScrollController; - final AppFlowyBoardState _groupState = AppFlowyBoardState(); - - late final BoardPhantomController _phantomController; - - AppFlowyBoard({ + const AppFlowyBoard({ required this.controller, required this.cardBuilder, this.background, @@ -109,12 +103,7 @@ class AppFlowyBoard extends StatelessWidget { this.groupConstraints = const BoxConstraints(maxWidth: 200), this.config = const AppFlowyBoardConfig(), Key? key, - }) : super(key: key) { - _phantomController = BoardPhantomController( - delegate: controller, - groupsState: _groupState, - ); - } + }) : super(key: key); @override Widget build(BuildContext context) { @@ -122,8 +111,14 @@ class AppFlowyBoard extends StatelessWidget { value: controller, child: Consumer( builder: (context, notifier, child) { + final boardState = AppFlowyBoardState(); + BoardPhantomController phantomController = BoardPhantomController( + delegate: controller, + groupsState: boardState, + ); + if (boardScrollController != null) { - boardScrollController!._groupState = _groupState; + boardScrollController!._boardState = boardState; } return _AppFlowyBoardContent( @@ -131,14 +126,14 @@ class AppFlowyBoard extends StatelessWidget { dataController: controller, scrollController: scrollController, scrollManager: boardScrollController, - groupState: _groupState, + boardState: boardState, background: background, - delegate: _phantomController, + delegate: phantomController, groupConstraints: groupConstraints, cardBuilder: cardBuilder, footerBuilder: footerBuilder, headerBuilder: headerBuilder, - phantomController: _phantomController, + phantomController: phantomController, onReorder: controller.moveGroup, ); }, @@ -156,7 +151,7 @@ class _AppFlowyBoardContent extends StatefulWidget { final ReorderFlexConfig reorderFlexConfig; final BoxConstraints groupConstraints; final AppFlowyBoardScrollController? scrollManager; - final AppFlowyBoardState groupState; + final AppFlowyBoardState boardState; final AppFlowyBoardCardBuilder cardBuilder; final AppFlowyBoardHeaderBuilder? headerBuilder; final AppFlowyBoardFooterBuilder? footerBuilder; @@ -169,7 +164,7 @@ class _AppFlowyBoardContent extends StatefulWidget { required this.delegate, required this.dataController, required this.scrollManager, - required this.groupState, + required this.boardState, this.scrollController, this.background, required this.groupConstraints, @@ -178,7 +173,10 @@ class _AppFlowyBoardContent extends StatefulWidget { this.headerBuilder, required this.phantomController, Key? key, - }) : reorderFlexConfig = const ReorderFlexConfig(), + }) : reorderFlexConfig = const ReorderFlexConfig( + direction: Axis.horizontal, + dragDirection: Axis.horizontal, + ), super(key: key); @override @@ -198,7 +196,7 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> { reorderFlexId: widget.dataController.identifier, acceptedReorderFlexId: widget.dataController.groupIds, delegate: widget.delegate, - columnsState: widget.groupState, + columnsState: widget.boardState, ); final reorderFlex = ReorderFlex( @@ -206,9 +204,7 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> { scrollController: widget.scrollController, onReorder: widget.onReorder, dataSource: widget.dataController, - direction: Axis.horizontal, interceptor: interceptor, - reorderable: true, children: _buildColumns(), ); @@ -254,7 +250,7 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> { ); final reorderFlexAction = ReorderFlexActionImpl(); - widget.groupState.reorderFlexActionMap[columnData.id] = + widget.boardState.reorderFlexActionMap[columnData.id] = reorderFlexAction; return ChangeNotifierProvider.value( @@ -275,8 +271,8 @@ class _AppFlowyBoardContentState extends State<_AppFlowyBoardContent> { onReorder: widget.dataController.moveGroupItem, cornerRadius: widget.config.cornerRadius, backgroundColor: widget.config.groupBackgroundColor, - dragStateStorage: widget.groupState, - dragTargetKeys: widget.groupState, + dragStateStorage: widget.boardState, + dragTargetKeys: widget.boardState, reorderFlexAction: reorderFlexAction, ); diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_data.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_data.dart index 2fd2f1f3a1..43dd9728fc 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_data.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_data.dart @@ -138,7 +138,11 @@ class AppFlowyBoardController extends ChangeNotifier /// groups or get ready to reinitialize the [AppFlowyBoard]. void clear() { _groupDatas.clear(); + for (final group in _groupControllers.values) { + group.dispose(); + } _groupControllers.clear(); + notifyListeners(); } @@ -202,6 +206,14 @@ class AppFlowyBoardController extends ChangeNotifier getGroupController(groupId)?.replaceOrInsertItem(item); } + void enableGroupDragging(bool isEnable) { + for (var groupController in _groupControllers.values) { + groupController.enableDragging(isEnable); + } + + notifyListeners(); + } + /// Moves the item at [fromGroupIndex] in group with id [fromGroupId] to /// group with id [toGroupId] at [toGroupIndex] @override @@ -215,6 +227,8 @@ class AppFlowyBoardController extends ChangeNotifier final fromGroupController = getGroupController(fromGroupId)!; final toGroupController = getGroupController(toGroupId)!; final fromGroupItem = fromGroupController.removeAt(fromGroupIndex); + if (fromGroupItem == null) return; + if (toGroupController.items.length > toGroupIndex) { assert(toGroupController.items[toGroupIndex] is PhantomGroupItem); @@ -275,7 +289,9 @@ class AppFlowyBoardController extends ChangeNotifier Log.trace( '[$BoardPhantomController] update $groupId:$index to $groupId:$newIndex'); final item = groupController.removeAt(index, notify: false); - groupController.insert(newIndex, item, notify: false); + if (item != null) { + groupController.insert(newIndex, item, notify: false); + } } } } diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group.dart index 880a81f666..b0c69b1070 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group.dart @@ -156,9 +156,9 @@ class _AppFlowyBoardGroupState extends State { widget.onDragStarted?.call(index); }, onReorder: ((fromIndex, toIndex) { - if (widget.phantomController.isFromGroup(widget.groupId)) { + if (widget.phantomController.shouldReorder(widget.groupId)) { widget.onReorder(widget.groupId, fromIndex, toIndex); - widget.phantomController.transformIndex(fromIndex, toIndex); + widget.phantomController.updateIndex(fromIndex, toIndex); } }), onDragEnded: () { diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group_data.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group_data.dart index 5223e10e90..659e87fadd 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group_data.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/board_group/group_data.dart @@ -5,6 +5,8 @@ import 'package:appflowy_board/src/widgets/reorder_flex/reorder_flex.dart'; import 'package:equatable/equatable.dart'; import 'package:flutter/material.dart'; +typedef IsDraggable = bool; + /// A item represents the generic data model of each group card. /// /// Each item displayed in the group required to implement this class. @@ -50,8 +52,17 @@ class AppFlowyGroupController extends ChangeNotifier with EquatableMixin { /// * [notify] the default value of [notify] is true, it will notify the /// listener. Set to false if you do not want to notify the listeners. /// - AppFlowyGroupItem removeAt(int index, {bool notify = true}) { - assert(index >= 0); + AppFlowyGroupItem? removeAt(int index, {bool notify = true}) { + if (groupData._items.length <= index) { + Log.error( + 'Fatal error, index is out of bounds. Index: $index, len: ${groupData._items.length}'); + return null; + } + + if (index < 0) { + Log.error('Invalid index:$index'); + return null; + } Log.debug('[$AppFlowyGroupController] $groupData remove item at $index'); final item = groupData._items.removeAt(index); @@ -71,12 +82,17 @@ class AppFlowyGroupController extends ChangeNotifier with EquatableMixin { /// Move the item from [fromIndex] to [toIndex]. It will do nothing if the /// [fromIndex] equal to the [toIndex]. bool move(int fromIndex, int toIndex) { - assert(fromIndex >= 0); assert(toIndex >= 0); + if (groupData._items.length < fromIndex) { + Log.error( + 'Out of bounds error. index: $fromIndex should not greater than ${groupData._items.length}'); + return false; + } if (fromIndex == toIndex) { return false; } + Log.debug( '[$AppFlowyGroupController] $groupData move item from $fromIndex to $toIndex'); final item = groupData._items.removeAt(fromIndex); @@ -124,7 +140,7 @@ class AppFlowyGroupController extends ChangeNotifier with EquatableMixin { Log.debug('[$AppFlowyGroupController] $groupData add $newItem'); } else { if (index >= groupData._items.length) { - Log.warn( + Log.error( '[$AppFlowyGroupController] unexpected items length, index should less than the count of the items. Index: $index, items count: ${items.length}'); return; } @@ -155,6 +171,15 @@ class AppFlowyGroupController extends ChangeNotifier with EquatableMixin { -1; } + void enableDragging(bool isEnable) { + groupData.draggable = isEnable; + + for (var item in groupData._items) { + item.draggable = isEnable; + } + _notify(); + } + void _notify() { notifyListeners(); } diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_state.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_state.dart index 8e1a61be1a..d24c99bfbd 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_state.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_state.dart @@ -16,13 +16,13 @@ class FlexDragTargetData extends DragTargetData { @override final int draggingIndex; - final DraggingState _state; + final DraggingState _draggingState; - Widget? get draggingWidget => _state.draggingWidget; + Widget? get draggingWidget => _draggingState.draggingWidget; - Size? get feedbackSize => _state.feedbackSize; + Size? get feedbackSize => _draggingState.feedbackSize; - bool get isDragging => _state.isDragging(); + bool get isDragging => _draggingState.isDragging(); final String dragTargetId; @@ -40,8 +40,8 @@ class FlexDragTargetData extends DragTargetData { required this.reorderFlexId, required this.reorderFlexItem, required this.dragTargetIndexKey, - required DraggingState state, - }) : _state = state; + required DraggingState draggingState, + }) : _draggingState = draggingState; @override String toString() { diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_target.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_target.dart index fde9c3470a..7482eb36e0 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_target.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/drag_target.dart @@ -1,3 +1,4 @@ +import 'package:appflowy_board/appflowy_board.dart'; import 'package:appflowy_board/src/utils/log.dart'; import 'package:flutter/material.dart'; import 'package:flutter/scheduler.dart'; @@ -78,10 +79,12 @@ class ReorderDragTarget extends StatefulWidget { final bool useMoveAnimation; - final bool draggable; + final IsDraggable draggable; final double draggingOpacity; + final Axis? dragDirection; + const ReorderDragTarget({ Key? key, required this.child, @@ -99,6 +102,7 @@ class ReorderDragTarget extends StatefulWidget { this.onLeave, this.draggableTargetBuilder, this.draggingOpacity = 0.3, + this.dragDirection, }) : super(key: key); @override @@ -115,8 +119,10 @@ class _ReorderDragTargetState Widget dragTarget = DragTarget( builder: _buildDraggableWidget, onWillAccept: (dragTargetData) { - assert(dragTargetData != null); - if (dragTargetData == null) return false; + if (dragTargetData == null) { + return false; + } + return widget.onWillAccept(dragTargetData); }, onAccept: widget.onAccept, @@ -140,9 +146,6 @@ class _ReorderDragTargetState List acceptedCandidates, List rejectedCandidates, ) { - if (!widget.draggable) { - return widget.child; - } Widget feedbackBuilder = Builder(builder: (BuildContext context) { BoxConstraints contentSizeConstraints = BoxConstraints.loose(_draggingFeedbackSize!); @@ -163,7 +166,8 @@ class _ReorderDragTargetState widget.deleteAnimationController, ) ?? Draggable( - maxSimultaneousDrags: 1, + axis: widget.dragDirection, + maxSimultaneousDrags: widget.draggable ? 1 : 0, data: widget.dragTargetData, ignoringFeedbackSemantics: false, feedback: feedbackBuilder, diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/reorder_flex.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/reorder_flex.dart index 69d763804d..2fe79c839f 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/reorder_flex.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_flex/reorder_flex.dart @@ -1,6 +1,7 @@ import 'dart:collection'; import 'dart:math'; +import 'package:appflowy_board/appflowy_board.dart'; import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; import '../../utils/log.dart'; @@ -29,6 +30,8 @@ abstract class ReoderFlexDataSource { abstract class ReoderFlexItem { /// [id] is used to identify the item. It must be unique. String get id; + + IsDraggable draggable = true; } /// Cache each dragTarget's key. @@ -73,8 +76,15 @@ class ReorderFlexConfig { final bool useMovePlaceholder; + /// [direction] How to place the children, default is Axis.vertical + final Axis direction; + + final Axis? dragDirection; + const ReorderFlexConfig({ this.useMoveAnimation = true, + this.direction = Axis.vertical, + this.dragDirection, }) : useMovePlaceholder = !useMoveAnimation; } @@ -82,8 +92,6 @@ class ReorderFlex extends StatefulWidget { final ReorderFlexConfig config; final List children; - /// [direction] How to place the children, default is Axis.vertical - final Axis direction; final MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start; final ScrollController? scrollController; @@ -108,8 +116,6 @@ class ReorderFlex extends StatefulWidget { final ReorderFlexAction? reorderFlexAction; - final bool reorderable; - ReorderFlex({ Key? key, this.scrollController, @@ -117,14 +123,12 @@ class ReorderFlex extends StatefulWidget { required this.children, required this.config, required this.onReorder, - this.reorderable = true, this.dragStateStorage, this.dragTargetKeys, this.onDragStarted, this.onDragEnded, this.interceptor, this.reorderFlexAction, - this.direction = Axis.vertical, }) : assert(children.every((Widget w) => w.key != null), 'All child must have a key.'), super(key: key); @@ -146,8 +150,8 @@ class ReorderFlexState extends State /// Whether or not we are currently scrolling this view to show a widget. bool _scrolling = false; - /// [dragState] records the dragging state including dragStartIndex, and phantomIndex, etc. - late DraggingState dragState; + /// [draggingState] records the dragging state including dragStartIndex, and phantomIndex, etc. + late DraggingState draggingState; /// [_animation] controls the dragging animations late DragTargetAnimation _animation; @@ -158,9 +162,9 @@ class ReorderFlexState extends State void initState() { _notifier = ReorderFlexNotifier(); final flexId = widget.reorderFlexId; - dragState = widget.dragStateStorage?.readState(flexId) ?? + draggingState = widget.dragStateStorage?.readState(flexId) ?? DraggingState(widget.reorderFlexId); - Log.trace('[DragTarget] init dragState: $dragState'); + Log.trace('[DragTarget] init dragState: $draggingState'); widget.dragStateStorage?.removeState(flexId); @@ -168,7 +172,7 @@ class ReorderFlexState extends State reorderAnimationDuration: widget.config.reorderAnimationDuration, entranceAnimateStatusChanged: (status) { if (status == AnimationStatus.completed) { - if (dragState.nextIndex == -1) return; + if (draggingState.nextIndex == -1) return; setState(() => _requestAnimationToNextIndex()); } }, @@ -225,7 +229,7 @@ class ReorderFlexState extends State indexKey, ); - children.add(_wrap(child, i, indexKey)); + children.add(_wrap(child, i, indexKey, item.draggable)); // if (widget.config.useMovePlaceholder) { // children.add(DragTargeMovePlaceholder( @@ -256,64 +260,70 @@ class ReorderFlexState extends State /// when the animation finish. if (_animation.entranceController.isCompleted) { - dragState.removePhantom(); + draggingState.removePhantom(); - if (!isAcceptingNewTarget && dragState.didDragTargetMoveToNext()) { + if (!isAcceptingNewTarget && draggingState.didDragTargetMoveToNext()) { return; } - dragState.moveDragTargetToNext(); + draggingState.moveDragTargetToNext(); _animation.animateToNext(); } } /// [child]: the child will be wrapped with dartTarget /// [childIndex]: the index of the child in a list - Widget _wrap(Widget child, int childIndex, GlobalObjectKey indexKey) { + Widget _wrap( + Widget child, + int childIndex, + GlobalObjectKey indexKey, + IsDraggable draggable, + ) { return Builder(builder: (context) { final ReorderDragTarget dragTarget = _buildDragTarget( context, child, childIndex, indexKey, + draggable, ); int shiftedIndex = childIndex; - if (dragState.isOverlapWithPhantom()) { - shiftedIndex = dragState.calculateShiftedIndex(childIndex); + if (draggingState.isOverlapWithPhantom()) { + shiftedIndex = draggingState.calculateShiftedIndex(childIndex); } Log.trace( - 'Rebuild: Group:[${dragState.reorderFlexId}] ${dragState.toString()}, childIndex: $childIndex shiftedIndex: $shiftedIndex'); - final currentIndex = dragState.currentIndex; - final dragPhantomIndex = dragState.phantomIndex; + 'Rebuild: Group:[${draggingState.reorderFlexId}] ${draggingState.toString()}, childIndex: $childIndex shiftedIndex: $shiftedIndex'); + final currentIndex = draggingState.currentIndex; + final dragPhantomIndex = draggingState.phantomIndex; if (shiftedIndex == currentIndex || childIndex == dragPhantomIndex) { Widget dragSpace; - if (dragState.draggingWidget != null) { - if (dragState.draggingWidget is PhantomWidget) { - dragSpace = dragState.draggingWidget!; + if (draggingState.draggingWidget != null) { + if (draggingState.draggingWidget is PhantomWidget) { + dragSpace = draggingState.draggingWidget!; } else { dragSpace = PhantomWidget( opacity: widget.config.draggingWidgetOpacity, - child: dragState.draggingWidget, + child: draggingState.draggingWidget, ); } } else { - dragSpace = SizedBox.fromSize(size: dragState.dropAreaSize); + dragSpace = SizedBox.fromSize(size: draggingState.dropAreaSize); } /// Returns the dragTarget it is not start dragging. The size of the /// dragTarget is the same as the the passed in child. /// - if (dragState.isNotDragging()) { + if (draggingState.isNotDragging()) { return _buildDraggingContainer(children: [dragTarget]); } /// Determine the size of the drop area to show under the dragging widget. Size? feedbackSize = Size.zero; if (widget.config.useMoveAnimation) { - feedbackSize = dragState.feedbackSize; + feedbackSize = draggingState.feedbackSize; } Widget appearSpace = _makeAppearSpace(dragSpace, feedbackSize); @@ -321,7 +331,7 @@ class ReorderFlexState extends State /// When start dragging, the dragTarget, [ReorderDragTarget], will /// return a [IgnorePointerWidget] which size is zero. - if (dragState.isPhantomAboveDragTarget()) { + if (draggingState.isPhantomAboveDragTarget()) { _notifier.updateDragTargetIndex(currentIndex); if (shiftedIndex == currentIndex && childIndex == dragPhantomIndex) { return _buildDraggingContainer(children: [ @@ -343,7 +353,7 @@ class ReorderFlexState extends State } /// - if (dragState.isPhantomBelowDragTarget()) { + if (draggingState.isPhantomBelowDragTarget()) { _notifier.updateDragTargetIndex(currentIndex); if (shiftedIndex == currentIndex && childIndex == dragPhantomIndex) { return _buildDraggingContainer(children: [ @@ -364,10 +374,10 @@ class ReorderFlexState extends State } } - assert(!dragState.isOverlapWithPhantom()); + assert(!draggingState.isOverlapWithPhantom()); List children = []; - if (dragState.isDragTargetMovingDown()) { + if (draggingState.isDragTargetMovingDown()) { children.addAll([dragTarget, appearSpace]); } else { children.addAll([appearSpace, dragTarget]); @@ -395,15 +405,17 @@ class ReorderFlexState extends State Widget child, int dragTargetIndex, GlobalObjectKey indexKey, + IsDraggable draggable, ) { final reorderFlexItem = widget.dataSource.items[dragTargetIndex]; return ReorderDragTarget( indexGlobalKey: indexKey, + draggable: draggable, dragTargetData: FlexDragTargetData( draggingIndex: dragTargetIndex, reorderFlexId: widget.reorderFlexId, reorderFlexItem: reorderFlexItem, - state: dragState, + draggingState: draggingState, dragTargetId: reorderFlexItem.id, dragTargetIndexKey: indexKey, ), @@ -432,11 +444,11 @@ class ReorderFlexState extends State setState(() { if (dragTargetData.reorderFlexId == widget.reorderFlexId) { _onReordered( - dragState.dragStartIndex, - dragState.currentIndex, + draggingState.dragStartIndex, + draggingState.currentIndex, ); } - dragState.endDragging(); + draggingState.endDragging(); widget.onDragEnded?.call(); }); }, @@ -482,8 +494,8 @@ class ReorderFlexState extends State deleteAnimationController: _animation.deleteController, draggableTargetBuilder: widget.interceptor?.draggableTargetBuilder, useMoveAnimation: widget.config.useMoveAnimation, - draggable: widget.reorderable, draggingOpacity: widget.config.draggingWidgetOpacity, + dragDirection: widget.config.dragDirection, child: child, ); } @@ -506,7 +518,7 @@ class ReorderFlexState extends State child, _animation.entranceController, feedbackSize, - widget.direction, + widget.config.direction, ); } @@ -515,7 +527,7 @@ class ReorderFlexState extends State child, _animation.phantomController, feedbackSize, - widget.direction, + widget.config.direction, ); } @@ -525,7 +537,7 @@ class ReorderFlexState extends State Size? feedbackSize, ) { setState(() { - dragState.startDragging(draggingWidget, dragIndex, feedbackSize); + draggingState.startDragging(draggingWidget, dragIndex, feedbackSize); _animation.startDragging(); }); } @@ -535,34 +547,34 @@ class ReorderFlexState extends State return; } - dragState.setStartDraggingIndex(dragTargetIndex); + draggingState.setStartDraggingIndex(dragTargetIndex); widget.dragStateStorage?.insertState( widget.reorderFlexId, - dragState, + draggingState, ); } bool handleOnWillAccept(BuildContext context, int dragTargetIndex) { - final dragIndex = dragState.dragStartIndex; + final dragIndex = draggingState.dragStartIndex; /// The [willAccept] will be true if the dargTarget is the widget that gets /// dragged and it is dragged on top of the other dragTargets. /// - bool willAccept = - dragState.dragStartIndex == dragIndex && dragIndex != dragTargetIndex; + bool willAccept = draggingState.dragStartIndex == dragIndex && + dragIndex != dragTargetIndex; setState(() { if (willAccept) { - int shiftedIndex = dragState.calculateShiftedIndex(dragTargetIndex); - dragState.updateNextIndex(shiftedIndex); + int shiftedIndex = draggingState.calculateShiftedIndex(dragTargetIndex); + draggingState.updateNextIndex(shiftedIndex); } else { - dragState.updateNextIndex(dragTargetIndex); + draggingState.updateNextIndex(dragTargetIndex); } _requestAnimationToNextIndex(isAcceptingNewTarget: true); }); Log.trace( - '[$ReorderDragTarget] ${widget.reorderFlexId} dragging state: $dragState}'); + '[$ReorderDragTarget] ${widget.reorderFlexId} dragging state: $draggingState}'); _scrollTo(context); @@ -587,7 +599,7 @@ class ReorderFlexState extends State return child; } else { return SingleChildScrollView( - scrollDirection: widget.direction, + scrollDirection: widget.config.direction, controller: _scrollController, child: child, ); @@ -595,7 +607,7 @@ class ReorderFlexState extends State } Widget _wrapContainer(List children) { - switch (widget.direction) { + switch (widget.config.direction) { case Axis.horizontal: return Row( crossAxisAlignment: CrossAxisAlignment.start, @@ -613,7 +625,7 @@ class ReorderFlexState extends State } Widget _buildDraggingContainer({required List children}) { - switch (widget.direction) { + switch (widget.config.direction) { case Axis.horizontal: return Row( crossAxisAlignment: CrossAxisAlignment.start, @@ -660,6 +672,7 @@ class ReorderFlexState extends State .ensureVisible( dragTargetRenderObject, alignment: 0.5, + alignmentPolicy: ScrollPositionAlignmentPolicy.keepVisibleAtStart, duration: const Duration(milliseconds: 120), ) .then((value) { @@ -683,9 +696,9 @@ class ReorderFlexState extends State // If and only if the current scroll offset falls in-between the offsets // necessary to reveal the selected context at the top or bottom of the // screen, then it is already on-screen. - final double margin = widget.direction == Axis.horizontal - ? dragState.dropAreaSize.width - : dragState.dropAreaSize.height / 2.0; + final double margin = widget.config.direction == Axis.horizontal + ? draggingState.dropAreaSize.width + : draggingState.dropAreaSize.height / 2.0; if (_scrollController.hasClients) { final double scrollOffset = _scrollController.offset; final double topOffset = max( diff --git a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_phantom/phantom_controller.dart b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_phantom/phantom_controller.dart index ad2778f6d8..7e991b34cd 100644 --- a/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_phantom/phantom_controller.dart +++ b/frontend/app_flowy/packages/appflowy_board/lib/src/widgets/reorder_phantom/phantom_controller.dart @@ -46,15 +46,23 @@ class BoardPhantomController extends OverlapDragTargetDelegate required this.groupsState, }); - bool isFromGroup(String groupId) { + /// Determines whether the group should perform reorder + /// + /// Returns `true` if the fromGroupId and toGroupId of the phantomRecord + /// equal to the passed in groupId. + /// + /// Returns `true` if the phantomRecord is null + /// + bool shouldReorder(String groupId) { if (phantomRecord != null) { - return phantomRecord!.fromGroupId == groupId; + return phantomRecord!.toGroupId == groupId && + phantomRecord!.fromGroupId == groupId; } else { return true; } } - void transformIndex(int fromIndex, int toIndex) { + void updateIndex(int fromIndex, int toIndex) { if (phantomRecord == null) { return; } @@ -69,7 +77,6 @@ class BoardPhantomController extends OverlapDragTargetDelegate /// Remove the phantom in the group when the group is end dragging. void groupEndDragging(String groupId) { phantomState.setGroupIsDragging(groupId, false); - if (phantomRecord == null) return; final fromGroupId = phantomRecord!.fromGroupId; @@ -246,10 +253,6 @@ class PhantomRecord { }); void updateFromGroupIndex(int index) { - if (fromGroupIndex == index) { - return; - } - fromGroupIndex = index; } diff --git a/frontend/app_flowy/packages/appflowy_board/pubspec.yaml b/frontend/app_flowy/packages/appflowy_board/pubspec.yaml index 35c7aa2b67..23c3b8be82 100644 --- a/frontend/app_flowy/packages/appflowy_board/pubspec.yaml +++ b/frontend/app_flowy/packages/appflowy_board/pubspec.yaml @@ -1,6 +1,6 @@ name: appflowy_board description: AppFlowyBoard is a board-style widget that consists of multi-groups. It supports drag and drop between different groups. -version: 0.0.8 +version: 0.0.9 homepage: https://github.com/AppFlowy-IO/AppFlowy repository: https://github.com/AppFlowy-IO/AppFlowy/tree/main/frontend/app_flowy/packages/appflowy_board diff --git a/frontend/app_flowy/packages/appflowy_editor/CHANGELOG.md b/frontend/app_flowy/packages/appflowy_editor/CHANGELOG.md index 4bc418fc81..db9b213e67 100644 --- a/frontend/app_flowy/packages/appflowy_editor/CHANGELOG.md +++ b/frontend/app_flowy/packages/appflowy_editor/CHANGELOG.md @@ -1,3 +1,13 @@ +## 0.0.6 +* Add three plugins: Code Block, LateX, and Horizontal rule. +* Support web platform. +* Support more markdown syntax conversions. + * `~ ~` to format text as strikethrough + * `_ _` to format text as italic + * \` \` to format text as code + * `[]()` to format text as link +* Fix some bugs. + ## 0.0.5 * Support customize the hotkeys for a shortcut on different platforms. * Support customize a theme. diff --git a/frontend/app_flowy/packages/appflowy_editor/example/assets/example.json b/frontend/app_flowy/packages/appflowy_editor/example/assets/example.json index 991c03296a..2d441d3367 100644 --- a/frontend/app_flowy/packages/appflowy_editor/example/assets/example.json +++ b/frontend/app_flowy/packages/appflowy_editor/example/assets/example.json @@ -9,12 +9,6 @@ "align": "center" } }, - { - "type": "tex", - "attributes": { - "tex": "x = 2" - } - }, { "type": "text", "attributes": { "subtype": "heading", "heading": "h1" }, diff --git a/frontend/app_flowy/packages/appflowy_editor/example/lib/main.dart b/frontend/app_flowy/packages/appflowy_editor/example/lib/main.dart index 4283752a03..f6c2fd21ff 100644 --- a/frontend/app_flowy/packages/appflowy_editor/example/lib/main.dart +++ b/frontend/app_flowy/packages/appflowy_editor/example/lib/main.dart @@ -2,6 +2,7 @@ import 'dart:convert'; import 'dart:io'; import 'package:example/plugin/code_block_node_widget.dart'; +import 'package:example/plugin/horizontal_rule_node_widget.dart'; import 'package:example/plugin/tex_block_node_widget.dart'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; @@ -121,15 +122,18 @@ class _MyHomePageState extends State { customBuilders: { 'text/code_block': CodeBlockNodeWidgetBuilder(), 'tex': TeXBlockNodeWidgetBuidler(), + 'horizontal_rule': HorizontalRuleWidgetBuilder(), }, shortcutEvents: [ enterInCodeBlock, ignoreKeysInCodeBlock, underscoreToItalic, + insertHorizontalRule, ], selectionMenuItems: [ - codeBlockItem, + codeBlockMenuItem, teXBlockMenuItem, + horizontalRuleMenuItem, ], ), ); diff --git a/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/code_block_node_widget.dart b/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/code_block_node_widget.dart index 8f80990fc4..c40a3f0ece 100644 --- a/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/code_block_node_widget.dart +++ b/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/code_block_node_widget.dart @@ -44,9 +44,13 @@ ShortcutEventHandler _ignorekHandler = (editorState, event) { return KeyEventResult.ignored; }; -SelectionMenuItem codeBlockItem = SelectionMenuItem( +SelectionMenuItem codeBlockMenuItem = SelectionMenuItem( name: () => 'Code Block', - icon: const Icon(Icons.abc), + icon: const Icon( + Icons.abc, + color: Colors.black, + size: 18.0, + ), keywords: ['code block'], handler: (editorState, _, __) { final selection = diff --git a/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/horizontal_rule_node_widget.dart b/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/horizontal_rule_node_widget.dart new file mode 100644 index 0000000000..fca3df7b64 --- /dev/null +++ b/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/horizontal_rule_node_widget.dart @@ -0,0 +1,167 @@ +import 'dart:collection'; + +import 'package:appflowy_editor/appflowy_editor.dart'; +import 'package:flutter/material.dart'; + +ShortcutEvent insertHorizontalRule = ShortcutEvent( + key: 'Horizontal rule', + command: 'Minus', + handler: _insertHorzaontalRule, +); + +ShortcutEventHandler _insertHorzaontalRule = (editorState, event) { + final selection = editorState.service.selectionService.currentSelection.value; + final textNodes = editorState.service.selectionService.currentSelectedNodes + .whereType(); + if (textNodes.length != 1 || selection == null) { + return KeyEventResult.ignored; + } + final textNode = textNodes.first; + if (textNode.toRawString() == '--') { + TransactionBuilder(editorState) + ..deleteText(textNode, 0, 2) + ..insertNode( + textNode.path, + Node( + type: 'horizontal_rule', + children: LinkedList(), + attributes: {}, + ), + ) + ..afterSelection = + Selection.single(path: textNode.path.next, startOffset: 0) + ..commit(); + return KeyEventResult.handled; + } + return KeyEventResult.ignored; +}; + +SelectionMenuItem horizontalRuleMenuItem = SelectionMenuItem( + name: () => 'Horizontal rule', + icon: const Icon( + Icons.horizontal_rule, + color: Colors.black, + size: 18.0, + ), + keywords: ['horizontal rule'], + handler: (editorState, _, __) { + final selection = + editorState.service.selectionService.currentSelection.value; + final textNodes = editorState.service.selectionService.currentSelectedNodes + .whereType(); + if (selection == null || textNodes.isEmpty) { + return; + } + final textNode = textNodes.first; + if (textNode.toRawString().isEmpty) { + TransactionBuilder(editorState) + ..insertNode( + textNode.path, + Node( + type: 'horizontal_rule', + children: LinkedList(), + attributes: {}, + ), + ) + ..afterSelection = + Selection.single(path: textNode.path.next, startOffset: 0) + ..commit(); + } else { + TransactionBuilder(editorState) + ..insertNode( + selection.end.path.next, + TextNode( + type: 'text', + children: LinkedList(), + attributes: { + 'subtype': 'horizontal_rule', + }, + delta: Delta()..insert('---'), + ), + ) + ..afterSelection = selection + ..commit(); + } + }, +); + +class HorizontalRuleWidgetBuilder extends NodeWidgetBuilder { + @override + Widget build(NodeWidgetContext context) { + return _HorizontalRuleWidget( + key: context.node.key, + node: context.node, + editorState: context.editorState, + ); + } + + @override + NodeValidator get nodeValidator => (node) { + return true; + }; +} + +class _HorizontalRuleWidget extends StatefulWidget { + const _HorizontalRuleWidget({ + Key? key, + required this.node, + required this.editorState, + }) : super(key: key); + + final Node node; + final EditorState editorState; + + @override + State<_HorizontalRuleWidget> createState() => __HorizontalRuleWidgetState(); +} + +class __HorizontalRuleWidgetState extends State<_HorizontalRuleWidget> + with SelectableMixin { + RenderBox get _renderBox => context.findRenderObject() as RenderBox; + + @override + Widget build(BuildContext context) { + return Container( + padding: const EdgeInsets.symmetric(vertical: 10), + child: Container( + height: 1, + color: Colors.grey, + ), + ); + } + + @override + Position start() => Position(path: widget.node.path, offset: 0); + + @override + Position end() => Position(path: widget.node.path, offset: 1); + + @override + Position getPositionInOffset(Offset start) => end(); + + @override + bool get shouldCursorBlink => false; + + @override + CursorStyle get cursorStyle => CursorStyle.borderLine; + + @override + Rect? getCursorRectInPosition(Position position) { + final size = _renderBox.size; + return Rect.fromLTWH(-size.width / 2.0, 0, size.width, size.height); + } + + @override + List getRectsInSelection(Selection selection) => + [Offset.zero & _renderBox.size]; + + @override + Selection getSelectionInRange(Offset start, Offset end) => Selection.single( + path: widget.node.path, + startOffset: 0, + endOffset: 1, + ); + + @override + Offset localToGlobal(Offset offset) => _renderBox.localToGlobal(offset); +} diff --git a/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/tex_block_node_widget.dart b/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/tex_block_node_widget.dart index e76c3e160b..ac40a31508 100644 --- a/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/tex_block_node_widget.dart +++ b/frontend/app_flowy/packages/appflowy_editor/example/lib/plugin/tex_block_node_widget.dart @@ -6,7 +6,11 @@ import 'package:flutter_math_fork/flutter_math.dart'; SelectionMenuItem teXBlockMenuItem = SelectionMenuItem( name: () => 'Tex', - icon: const Icon(Icons.text_fields_rounded), + icon: const Icon( + Icons.text_fields_rounded, + color: Colors.black, + size: 18.0, + ), keywords: ['tex, latex, katex'], handler: (editorState, _, __) { final selection = diff --git a/frontend/app_flowy/packages/appflowy_editor/example/macos/Podfile.lock b/frontend/app_flowy/packages/appflowy_editor/example/macos/Podfile.lock index 79143cb186..49a5879fa6 100644 --- a/frontend/app_flowy/packages/appflowy_editor/example/macos/Podfile.lock +++ b/frontend/app_flowy/packages/appflowy_editor/example/macos/Podfile.lock @@ -24,7 +24,7 @@ EXTERNAL SOURCES: :path: Flutter/ephemeral/.symlinks/plugins/url_launcher_macos/macos SPEC CHECKSUMS: - FlutterMacOS: ae6af50a8ea7d6103d888583d46bd8328a7e9811 + FlutterMacOS: 57701585bf7de1b3fc2bb61f6378d73bbdea8424 path_provider_macos: 3c0c3b4b0d4a76d2bf989a913c2de869c5641a19 rich_clipboard_macos: 43364b66b9dc69d203eb8dd6d758e2d12e02723c url_launcher_macos: 597e05b8e514239626bcf4a850fcf9ef5c856ec3 diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/l10n/intl_ml_IN.arb b/frontend/app_flowy/packages/appflowy_editor/lib/l10n/intl_ml_IN.arb new file mode 100644 index 0000000000..d48179e149 --- /dev/null +++ b/frontend/app_flowy/packages/appflowy_editor/lib/l10n/intl_ml_IN.arb @@ -0,0 +1,35 @@ +{ + "@@locale": "ml_IN", + "bold": "ബോൾഡ്", + "@bold": {}, + "bulletedList": "ബുള്ളറ്റഡ് പട്ടിക", + "@bulletedList": {}, + "checkbox": "ചെക്ക്ബോക്സ്", + "@checkbox": {}, + "embedCode": "എംബെഡഡ് കോഡ്", + "@embedCode": {}, + "heading1": "തലക്കെട്ട് 1", + "@heading1": {}, + "heading2": "തലക്കെട്ട് 2", + "@heading2": {}, + "heading3": "തലക്കെട്ട് 3", + "@heading3": {}, + "highlight": "പ്രമുഖമാക്കിക്കാട്ടുക", + "@highlight": {}, + "image": "ചിത്രം", + "@image": {}, + "italic": "ഇറ്റാലിക്", + "@italic": {}, + "link": "ലിങ്ക്", + "@link": {}, + "numberedList": "അക്കമിട്ട പട്ടിക", + "@numberedList": {}, + "quote": "ഉദ്ധരണി", + "@quote": {}, + "strikethrough": "സ്ട്രൈക്ക്ത്രൂ", + "@strikethrough": {}, + "text": "വചനം", + "@text": {}, + "underline": "അടിവരയിടുക", + "@underline": {} +} \ No newline at end of file diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/extensions/text_node_extensions.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/extensions/text_node_extensions.dart index 4d8c44b9fa..bcc8722dfa 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/extensions/text_node_extensions.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/extensions/text_node_extensions.dart @@ -19,8 +19,9 @@ extension TextNodeExtension on TextNode { } final length = op.length; if (start < endOffset && start + length > startOffset) { - if (op.attributes?.containsKey(styleKey) == true) { - return op.attributes![styleKey]; + final attributes = op.attributes; + if (attributes != null && attributes[styleKey] is T?) { + return attributes[styleKey]; } } start += length; @@ -29,42 +30,40 @@ extension TextNodeExtension on TextNode { } bool allSatisfyLinkInSelection(Selection selection) => - allSatisfyInSelection(selection, BuiltInAttributeKey.href, (value) { + allSatisfyInSelection(selection, BuiltInAttributeKey.href, (value) { return value != null; }); bool allSatisfyBoldInSelection(Selection selection) => - allSatisfyInSelection(selection, BuiltInAttributeKey.bold, (value) { + allSatisfyInSelection(selection, BuiltInAttributeKey.bold, (value) { return value == true; }); bool allSatisfyItalicInSelection(Selection selection) => - allSatisfyInSelection(selection, BuiltInAttributeKey.italic, - (value) { + allSatisfyInSelection(selection, BuiltInAttributeKey.italic, (value) { return value == true; }); bool allSatisfyUnderlineInSelection(Selection selection) => - allSatisfyInSelection(selection, BuiltInAttributeKey.underline, - (value) { + allSatisfyInSelection(selection, BuiltInAttributeKey.underline, (value) { return value == true; }); bool allSatisfyStrikethroughInSelection(Selection selection) => allSatisfyInSelection(selection, BuiltInAttributeKey.strikethrough, - (value) { + (value) { return value == true; }); bool allSatisfyCodeInSelection(Selection selection) => - allSatisfyInSelection(selection, BuiltInAttributeKey.code, (value) { + allSatisfyInSelection(selection, BuiltInAttributeKey.code, (value) { return value == true; }); bool allSatisfyInSelection( Selection selection, String styleKey, - bool Function(T value) test, + bool Function(dynamic value) test, ) { if (BuiltInAttributeKey.globalStyleKeys.contains(styleKey)) { if (attributes.containsKey(styleKey)) { @@ -129,40 +128,40 @@ extension TextNodesExtension on List { bool allSatisfyBoldInSelection(Selection selection) => allSatisfyInSelection( selection, BuiltInAttributeKey.bold, - (value) => value == true, + (value) => value == true, ); bool allSatisfyItalicInSelection(Selection selection) => allSatisfyInSelection( selection, BuiltInAttributeKey.italic, - (value) => value == true, + (value) => value == true, ); bool allSatisfyUnderlineInSelection(Selection selection) => allSatisfyInSelection( selection, BuiltInAttributeKey.underline, - (value) => value == true, + (value) => value == true, ); bool allSatisfyStrikethroughInSelection(Selection selection) => allSatisfyInSelection( selection, BuiltInAttributeKey.strikethrough, - (value) => value == true, + (value) => value == true, ); bool allSatisfyInSelection( Selection selection, String styleKey, - bool Function(T value) test, + bool Function(dynamic value) test, ) { if (isEmpty) { return false; } if (length == 1) { - return first.allSatisfyInSelection(selection, styleKey, (value) { + return first.allSatisfyInSelection(selection, styleKey, (value) { return test(value); }); } else { diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_all.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_all.dart index 02e3d46041..b25b964b13 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_all.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_all.dart @@ -26,6 +26,7 @@ import 'messages_hu-HU.dart' as messages_hu_hu; import 'messages_id-ID.dart' as messages_id_id; import 'messages_it-IT.dart' as messages_it_it; import 'messages_ja-JP.dart' as messages_ja_jp; +import 'messages_ml_IN.dart' as messages_ml_in; import 'messages_nl-NL.dart' as messages_nl_nl; import 'messages_pl-PL.dart' as messages_pl_pl; import 'messages_pt-BR.dart' as messages_pt_br; @@ -48,6 +49,7 @@ Map _deferredLibraries = { 'id_ID': () => new Future.value(null), 'it_IT': () => new Future.value(null), 'ja_JP': () => new Future.value(null), + 'ml_IN': () => new Future.value(null), 'nl_NL': () => new Future.value(null), 'pl_PL': () => new Future.value(null), 'pt_BR': () => new Future.value(null), @@ -82,6 +84,8 @@ MessageLookupByLibrary? _findExact(String localeName) { return messages_it_it.messages; case 'ja_JP': return messages_ja_jp.messages; + case 'ml_IN': + return messages_ml_in.messages; case 'nl_NL': return messages_nl_nl.messages; case 'pl_PL': diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_ml_IN.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_ml_IN.dart new file mode 100644 index 0000000000..e7378a907e --- /dev/null +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/intl/messages_ml_IN.dart @@ -0,0 +1,45 @@ +// DO NOT EDIT. This is code generated via package:intl/generate_localized.dart +// This is a library that provides messages for a ml_IN locale. All the +// messages from the main program should be duplicated here with the same +// function name. + +// Ignore issues from commonly used lints in this file. +// ignore_for_file:unnecessary_brace_in_string_interps, unnecessary_new +// ignore_for_file:prefer_single_quotes,comment_references, directives_ordering +// ignore_for_file:annotate_overrides,prefer_generic_function_type_aliases +// ignore_for_file:unused_import, file_names, avoid_escaping_inner_quotes +// ignore_for_file:unnecessary_string_interpolations, unnecessary_string_escapes + +import 'package:intl/intl.dart'; +import 'package:intl/message_lookup_by_library.dart'; + +final messages = new MessageLookup(); + +typedef String MessageIfAbsent(String messageStr, List args); + +class MessageLookup extends MessageLookupByLibrary { + String get localeName => 'ml_IN'; + + final messages = _notInlinedMessages(_notInlinedMessages); + static Map _notInlinedMessages(_) => { + "bold": MessageLookupByLibrary.simpleMessage("ബോൾഡ്"), + "bulletedList": + MessageLookupByLibrary.simpleMessage("ബുള്ളറ്റഡ് പട്ടിക"), + "checkbox": MessageLookupByLibrary.simpleMessage("ചെക്ക്ബോക്സ്"), + "embedCode": MessageLookupByLibrary.simpleMessage("എംബെഡഡ് കോഡ്"), + "heading1": MessageLookupByLibrary.simpleMessage("തലക്കെട്ട് 1"), + "heading2": MessageLookupByLibrary.simpleMessage("തലക്കെട്ട് 2"), + "heading3": MessageLookupByLibrary.simpleMessage("തലക്കെട്ട് 3"), + "highlight": + MessageLookupByLibrary.simpleMessage("പ്രമുഖമാക്കിക്കാട്ടുക"), + "image": MessageLookupByLibrary.simpleMessage("ചിത്രം"), + "italic": MessageLookupByLibrary.simpleMessage("ഇറ്റാലിക്"), + "link": MessageLookupByLibrary.simpleMessage("ലിങ്ക്"), + "numberedList": + MessageLookupByLibrary.simpleMessage("അക്കമിട്ട പട്ടിക"), + "quote": MessageLookupByLibrary.simpleMessage("ഉദ്ധരണി"), + "strikethrough": MessageLookupByLibrary.simpleMessage("സ്ട്രൈക്ക്ത്രൂ"), + "text": MessageLookupByLibrary.simpleMessage("വചനം"), + "underline": MessageLookupByLibrary.simpleMessage("അടിവരയിടുക") + }; +} diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/l10n.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/l10n.dart index 9ef7ddf4c9..38590a144c 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/l10n.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/l10n/l10n.dart @@ -229,6 +229,7 @@ class AppLocalizationDelegate Locale.fromSubtags(languageCode: 'id', countryCode: 'ID'), Locale.fromSubtags(languageCode: 'it', countryCode: 'IT'), Locale.fromSubtags(languageCode: 'ja', countryCode: 'JP'), + Locale.fromSubtags(languageCode: 'ml', countryCode: 'IN'), Locale.fromSubtags(languageCode: 'nl', countryCode: 'NL'), Locale.fromSubtags(languageCode: 'pl', countryCode: 'PL'), Locale.fromSubtags(languageCode: 'pt', countryCode: 'BR'), diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/cursor_widget.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/cursor_widget.dart index 19da4b55f4..a7b68d410d 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/cursor_widget.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/cursor_widget.dart @@ -1,5 +1,6 @@ import 'dart:async'; +import 'package:appflowy_editor/src/render/selection/selectable.dart'; import 'package:flutter/material.dart'; class CursorWidget extends StatefulWidget { @@ -9,9 +10,13 @@ class CursorWidget extends StatefulWidget { required this.rect, required this.color, this.blinkingInterval = 0.5, + this.shouldBlink = true, + this.cursorStyle = CursorStyle.verticalLine, }) : super(key: key); final double blinkingInterval; // milliseconds + final bool shouldBlink; + final CursorStyle cursorStyle; final Color color; final Rect rect; final LayerLink layerLink; @@ -67,11 +72,28 @@ class CursorWidgetState extends State { // Ignore the gestures in cursor // to solve the problem that cursor area cannot be selected. child: IgnorePointer( - child: Container( - color: showCursor ? widget.color : Colors.transparent, - ), + child: _buildCursor(context), ), ), ); } + + Widget _buildCursor(BuildContext context) { + var color = widget.color; + if (widget.shouldBlink && !showCursor) { + color = Colors.transparent; + } + switch (widget.cursorStyle) { + case CursorStyle.verticalLine: + return Container( + color: color, + ); + case CursorStyle.borderLine: + return Container( + decoration: BoxDecoration( + border: Border.all(color: color, width: 2), + ), + ); + } + } } diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/selectable.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/selectable.dart index 372dbd7067..6f4f92c2e9 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/selectable.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection/selectable.dart @@ -2,6 +2,11 @@ import 'package:appflowy_editor/src/document/position.dart'; import 'package:appflowy_editor/src/document/selection.dart'; import 'package:flutter/material.dart'; +enum CursorStyle { + verticalLine, + borderLine, +} + /// [SelectableMixin] is used for the editor to calculate the position /// and size of the selection. /// @@ -53,4 +58,8 @@ mixin SelectableMixin on State { Selection? getWorldBoundaryInOffset(Offset start) { return null; } + + bool get shouldCursorBlink => true; + + CursorStyle get cursorStyle => CursorStyle.verticalLine; } diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection_menu/selection_menu_widget.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection_menu/selection_menu_widget.dart index c5a35ef73c..6bce03d15a 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection_menu/selection_menu_widget.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/selection_menu/selection_menu_widget.dart @@ -7,10 +7,10 @@ import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; typedef SelectionMenuItemHandler = void Function( - EditorState editorState, - SelectionMenuService menuService, - BuildContext context, - ); + EditorState editorState, + SelectionMenuService menuService, + BuildContext context, +); /// Selection Menu Item class SelectionMenuItem { @@ -23,7 +23,7 @@ class SelectionMenuItem { this.handler = (editorState, menuService, context) { _deleteToSlash(editorState); WidgetsBinding.instance.addPostFrameCallback((timeStamp) { - handler(editorState, menuService, context); + handler(editorState, menuService, context); }); }; } diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/toolbar/toolbar_item.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/toolbar/toolbar_item.dart index 1b531f306b..b3ed2e2471 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/render/toolbar/toolbar_item.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/render/toolbar/toolbar_item.dart @@ -73,7 +73,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.heading, - (value) => value == BuiltInAttributeKey.h1, + (value) => value == BuiltInAttributeKey.h1, ), handler: (editorState, context) => formatHeading(editorState, BuiltInAttributeKey.h1), @@ -90,7 +90,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.heading, - (value) => value == BuiltInAttributeKey.h2, + (value) => value == BuiltInAttributeKey.h2, ), handler: (editorState, context) => formatHeading(editorState, BuiltInAttributeKey.h2), @@ -107,7 +107,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.heading, - (value) => value == BuiltInAttributeKey.h3, + (value) => value == BuiltInAttributeKey.h3, ), handler: (editorState, context) => formatHeading(editorState, BuiltInAttributeKey.h3), @@ -124,7 +124,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.bold, - (value) => value == true, + (value) => value == true, ), handler: (editorState, context) => formatBold(editorState), ), @@ -140,7 +140,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.italic, - (value) => value == true, + (value) => value == true, ), handler: (editorState, context) => formatItalic(editorState), ), @@ -156,7 +156,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.underline, - (value) => value == true, + (value) => value == true, ), handler: (editorState, context) => formatUnderline(editorState), ), @@ -172,7 +172,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.strikethrough, - (value) => value == true, + (value) => value == true, ), handler: (editorState, context) => formatStrikethrough(editorState), ), @@ -188,7 +188,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.code, - (value) => value == true, + (value) => value == true, ), handler: (editorState, context) => formatEmbedCode(editorState), ), @@ -204,7 +204,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.subtype, - (value) => value == BuiltInAttributeKey.quote, + (value) => value == BuiltInAttributeKey.quote, ), handler: (editorState, context) => formatQuote(editorState), ), @@ -220,7 +220,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.subtype, - (value) => value == BuiltInAttributeKey.bulletedList, + (value) => value == BuiltInAttributeKey.bulletedList, ), handler: (editorState, context) => formatBulletedList(editorState), ), @@ -236,7 +236,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.href, - (value) => value != null, + (value) => value != null, ), handler: (editorState, context) => showLinkMenu(context, editorState), ), @@ -252,7 +252,7 @@ List defaultToolbarItems = [ highlightCallback: (editorState) => _allSatisfy( editorState, BuiltInAttributeKey.backgroundColor, - (value) => value != null, + (value) => value != null, ), handler: (editorState, context) => formatHighlight( editorState, @@ -284,7 +284,7 @@ ToolbarItemValidator _showInBuiltInTextSelection = (editorState) { bool _allSatisfy( EditorState editorState, String styleKey, - bool Function(T value) test, + bool Function(dynamic value) test, ) { final selection = editorState.service.selectionService.currentSelection.value; return selection != null && diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/service/default_text_operations/format_rich_text_style.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/service/default_text_operations/format_rich_text_style.dart index b1ddbb50ae..adf45bec65 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/service/default_text_operations/format_rich_text_style.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/service/default_text_operations/format_rich_text_style.dart @@ -195,7 +195,7 @@ bool _allSatisfyInSelection( return false; } - return textNodes.allSatisfyInSelection(selection, styleKey, (value) { + return textNodes.allSatisfyInSelection(selection, styleKey, (value) { return value == matchValue; }); } diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart index c9956635ba..229d011743 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/service/internal_key_event_handlers/backspace_handler.dart @@ -83,6 +83,11 @@ KeyEventResult _handleBackspace(EditorState editorState, RawKeyEvent event) { } } else { if (textNodes.isEmpty) { + if (nonTextNodes.isNotEmpty) { + transactionBuilder.afterSelection = + Selection.collapsed(selection.start); + } + transactionBuilder.commit(); return KeyEventResult.handled; } final startPosition = selection.start; diff --git a/frontend/app_flowy/packages/appflowy_editor/lib/src/service/selection_service.dart b/frontend/app_flowy/packages/appflowy_editor/lib/src/service/selection_service.dart index d9b5422aa1..4eacc5674c 100644 --- a/frontend/app_flowy/packages/appflowy_editor/lib/src/service/selection_service.dart +++ b/frontend/app_flowy/packages/appflowy_editor/lib/src/service/selection_service.dart @@ -457,6 +457,8 @@ class _AppFlowySelectionState extends State rect: cursorRect, color: widget.cursorColor, layerLink: node.layerLink, + shouldBlink: selectable.shouldCursorBlink, + cursorStyle: selectable.cursorStyle, ), ); diff --git a/frontend/app_flowy/packages/appflowy_editor/pubspec.yaml b/frontend/app_flowy/packages/appflowy_editor/pubspec.yaml index b41f9243c0..a778fa8e91 100644 --- a/frontend/app_flowy/packages/appflowy_editor/pubspec.yaml +++ b/frontend/app_flowy/packages/appflowy_editor/pubspec.yaml @@ -1,12 +1,13 @@ name: appflowy_editor description: A highly customizable rich-text editor for Flutter -version: 0.0.5 +version: 0.0.6 homepage: https://github.com/AppFlowy-IO/AppFlowy platforms: linux: macos: windows: + web: environment: sdk: ">=2.17.0 <3.0.0" diff --git a/frontend/app_flowy/packages/appflowy_editor/test/extensions/text_node_extensions_test.dart b/frontend/app_flowy/packages/appflowy_editor/test/extensions/text_node_extensions_test.dart index bec92362f4..0d7f1ba125 100644 --- a/frontend/app_flowy/packages/appflowy_editor/test/extensions/text_node_extensions_test.dart +++ b/frontend/app_flowy/packages/appflowy_editor/test/extensions/text_node_extensions_test.dart @@ -1,10 +1,7 @@ -import 'package:appflowy_editor/appflowy_editor.dart'; import 'package:flutter_test/flutter_test.dart'; void main() { group('TextNodeExtension::', () { - test('description', () { - final selecion = Selection.single(path: [0, 1, 2], startOffset: 0); - }); + test('description', () {}); }); } diff --git a/frontend/app_flowy/packages/appflowy_editor/test/render/rich_text/toolbar_rich_text_test.dart b/frontend/app_flowy/packages/appflowy_editor/test/render/rich_text/toolbar_rich_text_test.dart index 49990b4662..c9d9ef9e70 100644 --- a/frontend/app_flowy/packages/appflowy_editor/test/render/rich_text/toolbar_rich_text_test.dart +++ b/frontend/app_flowy/packages/appflowy_editor/test/render/rich_text/toolbar_rich_text_test.dart @@ -229,7 +229,7 @@ void main() async { node.allSatisfyInSelection( code, BuiltInAttributeKey.code, - (value) { + (value) { return value == true; }, ), @@ -319,7 +319,7 @@ void main() async { node.allSatisfyInSelection( selection, BuiltInAttributeKey.backgroundColor, - (value) { + (value) { return value == blue; }, ), diff --git a/frontend/app_flowy/packages/appflowy_editor/test/service/internal_key_event_handlers/format_style_handler_test.dart b/frontend/app_flowy/packages/appflowy_editor/test/service/internal_key_event_handlers/format_style_handler_test.dart index 684e7d21f1..0cb4c71600 100644 --- a/frontend/app_flowy/packages/appflowy_editor/test/service/internal_key_event_handlers/format_style_handler_test.dart +++ b/frontend/app_flowy/packages/appflowy_editor/test/service/internal_key_event_handlers/format_style_handler_test.dart @@ -111,7 +111,7 @@ Future _testUpdateTextStyleByCommandX( textNode.allSatisfyInSelection( selection, matchStyle, - (value) { + (value) { return value == matchValue; }, ), @@ -138,7 +138,7 @@ Future _testUpdateTextStyleByCommandX( textNode.allSatisfyInSelection( selection, matchStyle, - (value) { + (value) { return value == matchValue; }, ), @@ -192,7 +192,7 @@ Future _testUpdateTextStyleByCommandX( endOffset: text.length, ), matchStyle, - (value) { + (value) { return value == matchValue; }, ), @@ -266,7 +266,7 @@ Future _testLinkMenuInSingleTextSelection(WidgetTester tester) async { node.allSatisfyInSelection( selection, BuiltInAttributeKey.href, - (value) => value == link, + (value) => value == link, ), true); @@ -303,7 +303,7 @@ Future _testLinkMenuInSingleTextSelection(WidgetTester tester) async { node.allSatisfyInSelection( selection, BuiltInAttributeKey.href, - (value) => value == link, + (value) => value == link, ), false); } diff --git a/frontend/app_flowy/packages/flowy_infra_ui/lib/widget/rounded_input_field.dart b/frontend/app_flowy/packages/flowy_infra_ui/lib/widget/rounded_input_field.dart index 37eb782a2c..e5f6b8899a 100644 --- a/frontend/app_flowy/packages/flowy_infra_ui/lib/widget/rounded_input_field.dart +++ b/frontend/app_flowy/packages/flowy_infra_ui/lib/widget/rounded_input_field.dart @@ -2,6 +2,7 @@ import 'package:flowy_infra/size.dart'; import 'package:flowy_infra_ui/widget/rounded_button.dart'; import 'package:flutter/material.dart'; import 'package:flowy_infra/time/duration.dart'; +import 'package:flutter/services.dart'; class RoundedInputField extends StatefulWidget { final String? hintText; @@ -24,6 +25,7 @@ class RoundedInputField extends StatefulWidget { final FocusNode? focusNode; final TextEditingController? controller; final bool autoFocus; + final int? maxLength; const RoundedInputField({ Key? key, @@ -47,6 +49,7 @@ class RoundedInputField extends StatefulWidget { this.focusNode, this.controller, this.autoFocus = false, + this.maxLength, }) : super(key: key); @override @@ -89,6 +92,9 @@ class _RoundedInputFieldState extends State { initialValue: widget.initialValue, focusNode: widget.focusNode, autofocus: widget.autoFocus, + maxLength: widget.maxLength, + maxLengthEnforcement: + MaxLengthEnforcement.truncateAfterCompositionEnds, onChanged: (value) { inputText = value; if (widget.onChanged != null) { diff --git a/frontend/rust-lib/flowy-grid/src/services/grid_editor.rs b/frontend/rust-lib/flowy-grid/src/services/grid_editor.rs index 29f7b759b8..3607a1ce74 100644 --- a/frontend/rust-lib/flowy-grid/src/services/grid_editor.rs +++ b/frontend/rust-lib/flowy-grid/src/services/grid_editor.rs @@ -623,7 +623,7 @@ impl GridRevisionEditor { self.view_manager .move_group_row(row_rev, to_group_id, to_row_id.clone(), |row_changeset| { wrap_future(async move { - tracing::trace!("Move group row cause row data changed: {:?}", row_changeset); + tracing::trace!("Row data changed: {:?}", row_changeset); let cell_changesets = row_changeset .cell_by_field_id .into_iter() diff --git a/frontend/rust-lib/flowy-grid/src/services/grid_view_editor.rs b/frontend/rust-lib/flowy-grid/src/services/grid_view_editor.rs index 6316135f5a..ce0edbef6f 100644 --- a/frontend/rust-lib/flowy-grid/src/services/grid_view_editor.rs +++ b/frontend/rust-lib/flowy-grid/src/services/grid_view_editor.rs @@ -79,7 +79,7 @@ impl GridViewRevisionEditor { Ok(json_str) } - pub(crate) async fn will_create_row(&self, row_rev: &mut RowRevision, params: &CreateRowParams) { + pub(crate) async fn will_create_view_row(&self, row_rev: &mut RowRevision, params: &CreateRowParams) { if params.group_id.is_none() { return; } @@ -92,7 +92,7 @@ impl GridViewRevisionEditor { .await; } - pub(crate) async fn did_create_row(&self, row_pb: &RowPB, params: &CreateRowParams) { + pub(crate) async fn did_create_view_row(&self, row_pb: &RowPB, params: &CreateRowParams) { // Send the group notification if the current view has groups match params.group_id.as_ref() { None => {} @@ -115,7 +115,7 @@ impl GridViewRevisionEditor { } #[tracing::instrument(level = "trace", skip_all)] - pub(crate) async fn did_delete_row(&self, row_rev: &RowRevision) { + pub(crate) async fn did_delete_view_row(&self, row_rev: &RowRevision) { // Send the group notification if the current view has groups; let changesets = self .mut_group_controller(|group_controller, field_rev| group_controller.did_delete_row(row_rev, &field_rev)) @@ -129,7 +129,7 @@ impl GridViewRevisionEditor { } } - pub(crate) async fn did_update_row(&self, row_rev: &RowRevision) { + pub(crate) async fn did_update_view_row(&self, row_rev: &RowRevision) { let changesets = self .mut_group_controller(|group_controller, field_rev| group_controller.did_update_row(row_rev, &field_rev)) .await; @@ -141,7 +141,7 @@ impl GridViewRevisionEditor { } } - pub(crate) async fn move_group_row( + pub(crate) async fn move_view_group_row( &self, row_rev: &RowRevision, row_changeset: &mut RowChangeset, @@ -167,14 +167,14 @@ impl GridViewRevisionEditor { } /// Only call once after grid view editor initialized #[tracing::instrument(level = "trace", skip(self))] - pub(crate) async fn load_groups(&self) -> FlowyResult> { + pub(crate) async fn load_view_groups(&self) -> FlowyResult> { let groups = self.group_controller.read().await.groups(); tracing::trace!("Number of groups: {}", groups.len()); Ok(groups.into_iter().map(GroupPB::from).collect()) } #[tracing::instrument(level = "trace", skip(self), err)] - pub(crate) async fn move_group(&self, params: MoveGroupParams) -> FlowyResult<()> { + pub(crate) async fn move_view_group(&self, params: MoveGroupParams) -> FlowyResult<()> { let _ = self .group_controller .write() @@ -206,13 +206,13 @@ impl GridViewRevisionEditor { self.group_controller.read().await.field_id().to_owned() } - pub(crate) async fn get_setting(&self) -> GridSettingPB { + pub(crate) async fn get_view_setting(&self) -> GridSettingPB { let field_revs = self.field_delegate.get_field_revs().await; let grid_setting = make_grid_setting(&*self.pad.read().await, &field_revs); grid_setting } - pub(crate) async fn get_filters(&self) -> Vec { + pub(crate) async fn get_view_filters(&self) -> Vec { let field_revs = self.field_delegate.get_field_revs().await; match self.pad.read().await.get_all_filters(&field_revs) { None => vec![], @@ -245,7 +245,7 @@ impl GridViewRevisionEditor { Ok(()) } - pub(crate) async fn delete_group(&self, params: DeleteGroupParams) -> FlowyResult<()> { + pub(crate) async fn delete_view_group(&self, params: DeleteGroupParams) -> FlowyResult<()> { self.modify(|pad| { let changeset = pad.delete_filter(¶ms.field_id, ¶ms.field_type_rev, ¶ms.group_id)?; Ok(changeset) @@ -253,7 +253,7 @@ impl GridViewRevisionEditor { .await } - pub(crate) async fn insert_filter(&self, params: InsertFilterParams) -> FlowyResult<()> { + pub(crate) async fn insert_view_filter(&self, params: InsertFilterParams) -> FlowyResult<()> { self.modify(|pad| { let filter_rev = FilterConfigurationRevision { id: gen_grid_filter_id(), @@ -267,7 +267,7 @@ impl GridViewRevisionEditor { .await } - pub(crate) async fn delete_filter(&self, delete_filter: DeleteFilterParams) -> FlowyResult<()> { + pub(crate) async fn delete_view_filter(&self, delete_filter: DeleteFilterParams) -> FlowyResult<()> { self.modify(|pad| { let changeset = pad.delete_filter( &delete_filter.field_id, @@ -324,7 +324,7 @@ impl GridViewRevisionEditor { } async fn notify_did_update_setting(&self) { - let setting = self.get_setting().await; + let setting = self.get_view_setting().await; send_dart_notification(&self.view_id, GridNotification::DidUpdateGridSetting) .payload(setting) .send(); diff --git a/frontend/rust-lib/flowy-grid/src/services/grid_view_manager.rs b/frontend/rust-lib/flowy-grid/src/services/grid_view_manager.rs index 98b8ee51b9..65ed1af6c5 100644 --- a/frontend/rust-lib/flowy-grid/src/services/grid_view_manager.rs +++ b/frontend/rust-lib/flowy-grid/src/services/grid_view_manager.rs @@ -65,14 +65,14 @@ impl GridViewManager { /// When the row was created, we may need to modify the [RowRevision] according to the [CreateRowParams]. pub(crate) async fn will_create_row(&self, row_rev: &mut RowRevision, params: &CreateRowParams) { for view_editor in self.view_editors.iter() { - view_editor.will_create_row(row_rev, params).await; + view_editor.will_create_view_row(row_rev, params).await; } } /// Notify the view that the row was created. For the moment, the view is just sending notifications. pub(crate) async fn did_create_row(&self, row_pb: &RowPB, params: &CreateRowParams) { for view_editor in self.view_editors.iter() { - view_editor.did_create_row(row_pb, params).await; + view_editor.did_create_view_row(row_pb, params).await; } } @@ -84,7 +84,7 @@ impl GridViewManager { } Some(row_rev) => { for view_editor in self.view_editors.iter() { - view_editor.did_update_row(&row_rev).await; + view_editor.did_update_view_row(&row_rev).await; } } } @@ -102,33 +102,33 @@ impl GridViewManager { pub(crate) async fn did_delete_row(&self, row_rev: Arc) { for view_editor in self.view_editors.iter() { - view_editor.did_delete_row(&row_rev).await; + view_editor.did_delete_view_row(&row_rev).await; } } pub(crate) async fn get_setting(&self) -> FlowyResult { let view_editor = self.get_default_view_editor().await?; - Ok(view_editor.get_setting().await) + Ok(view_editor.get_view_setting().await) } pub(crate) async fn get_filters(&self) -> FlowyResult> { let view_editor = self.get_default_view_editor().await?; - Ok(view_editor.get_filters().await) + Ok(view_editor.get_view_filters().await) } pub(crate) async fn insert_or_update_filter(&self, params: InsertFilterParams) -> FlowyResult<()> { let view_editor = self.get_default_view_editor().await?; - view_editor.insert_filter(params).await + view_editor.insert_view_filter(params).await } pub(crate) async fn delete_filter(&self, params: DeleteFilterParams) -> FlowyResult<()> { let view_editor = self.get_default_view_editor().await?; - view_editor.delete_filter(params).await + view_editor.delete_view_filter(params).await } pub(crate) async fn load_groups(&self) -> FlowyResult { let view_editor = self.get_default_view_editor().await?; - let groups = view_editor.load_groups().await?; + let groups = view_editor.load_view_groups().await?; Ok(RepeatedGridGroupPB { items: groups }) } @@ -139,12 +139,12 @@ impl GridViewManager { pub(crate) async fn delete_group(&self, params: DeleteGroupParams) -> FlowyResult<()> { let view_editor = self.get_default_view_editor().await?; - view_editor.delete_group(params).await + view_editor.delete_view_group(params).await } pub(crate) async fn move_group(&self, params: MoveGroupParams) -> FlowyResult<()> { let view_editor = self.get_default_view_editor().await?; - let _ = view_editor.move_group(params).await?; + let _ = view_editor.move_view_group(params).await?; Ok(()) } @@ -161,7 +161,7 @@ impl GridViewManager { let mut row_changeset = RowChangeset::new(row_rev.id.clone()); let view_editor = self.get_default_view_editor().await?; let group_changesets = view_editor - .move_group_row(&row_rev, &mut row_changeset, &to_group_id, to_row_id.clone()) + .move_view_group_row(&row_rev, &mut row_changeset, &to_group_id, to_row_id.clone()) .await; if !row_changeset.is_empty() { diff --git a/frontend/rust-lib/flowy-grid/src/services/group/configuration.rs b/frontend/rust-lib/flowy-grid/src/services/group/configuration.rs index 8f3df66727..595af8174a 100644 --- a/frontend/rust-lib/flowy-grid/src/services/group/configuration.rs +++ b/frontend/rust-lib/flowy-grid/src/services/group/configuration.rs @@ -119,12 +119,20 @@ where self.mut_configuration(|configuration| { let from_index = configuration.groups.iter().position(|group| group.id == from_id); let to_index = configuration.groups.iter().position(|group| group.id == to_id); - tracing::info!("Configuration groups: {:?} ", configuration.groups); if let (Some(from), Some(to)) = &(from_index, to_index) { tracing::trace!("Move group from index:{:?} to index:{:?}", from_index, to_index); let group = configuration.groups.remove(*from); configuration.groups.insert(*to, group); } + tracing::debug!( + "Group order: {:?} ", + configuration + .groups + .iter() + .map(|group| group.name.clone()) + .collect::>() + .join(",") + ); from_index.is_some() && to_index.is_some() })?; diff --git a/frontend/rust-lib/flowy-grid/src/services/group/controller_impls/select_option_controller/util.rs b/frontend/rust-lib/flowy-grid/src/services/group/controller_impls/select_option_controller/util.rs index 9c3e71bc3e..e5cbc8a8ec 100644 --- a/frontend/rust-lib/flowy-grid/src/services/group/controller_impls/select_option_controller/util.rs +++ b/frontend/rust-lib/flowy-grid/src/services/group/controller_impls/select_option_controller/util.rs @@ -80,9 +80,9 @@ pub fn move_group_row(group: &mut Group, context: &mut MoveGroupRowContext) -> O }; // Remove the row in which group contains it - if from_index.is_some() { + if let Some(from_index) = &from_index { changeset.deleted_rows.push(row_rev.id.clone()); - tracing::debug!("Group:{} remove row:{}", group.id, row_rev.id); + tracing::debug!("Group:{} remove {} at {}", group.id, row_rev.id, from_index); group.remove_row(&row_rev.id); } @@ -97,10 +97,11 @@ pub fn move_group_row(group: &mut Group, context: &mut MoveGroupRowContext) -> O } Some(to_index) => { if to_index < group.number_of_row() { - tracing::debug!("Group:{} insert row:{} at {} ", group.id, row_rev.id, to_index); + tracing::debug!("Group:{} insert {} at {} ", group.id, row_rev.id, to_index); inserted_row.index = Some(to_index as i32); group.insert_row(to_index, row_pb); } else { + tracing::warn!("Mote to index: {} is out of bounds", to_index); tracing::debug!("Group:{} append row:{}", group.id, row_rev.id); group.add_row(row_pb); } diff --git a/frontend/rust-lib/flowy-grid/tests/grid/group_test/test.rs b/frontend/rust-lib/flowy-grid/tests/grid/group_test/test.rs index 42fdc6b61c..2040379c4c 100644 --- a/frontend/rust-lib/flowy-grid/tests/grid/group_test/test.rs +++ b/frontend/rust-lib/flowy-grid/tests/grid/group_test/test.rs @@ -350,6 +350,36 @@ async fn group_move_from_default_group_test() { #[tokio::test] async fn group_move_group_test() { + let mut test = GridGroupTest::new().await; + let group_0 = test.group_at_index(0).await; + let group_1 = test.group_at_index(1).await; + let scripts = vec![ + MoveGroup { + from_group_index: 0, + to_group_index: 1, + }, + AssertGroupRowCount { + group_index: 0, + row_count: 2, + }, + AssertGroup { + group_index: 0, + expected_group: group_1, + }, + AssertGroupRowCount { + group_index: 1, + row_count: 2, + }, + AssertGroup { + group_index: 1, + expected_group: group_0, + }, + ]; + test.run_scripts(scripts).await; +} + +#[tokio::test] +async fn group_move_group_row_after_move_group_test() { let mut test = GridGroupTest::new().await; let group_0 = test.group_at_index(0).await; let group_1 = test.group_at_index(1).await; @@ -366,6 +396,20 @@ async fn group_move_group_test() { group_index: 1, expected_group: group_0, }, + MoveRow { + from_group_index: 0, + from_row_index: 0, + to_group_index: 1, + to_row_index: 0, + }, + AssertGroupRowCount { + group_index: 0, + row_count: 1, + }, + AssertGroupRowCount { + group_index: 1, + row_count: 3, + }, ]; test.run_scripts(scripts).await; } diff --git a/frontend/scripts/flatpack-buildfiles/.gitignore b/frontend/scripts/flatpack-buildfiles/.gitignore new file mode 100644 index 0000000000..c267f688da --- /dev/null +++ b/frontend/scripts/flatpack-buildfiles/.gitignore @@ -0,0 +1,2 @@ +build-dir/ +.flatpak-builder/ diff --git a/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.desktop b/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.desktop new file mode 100644 index 0000000000..572fb2a9e7 --- /dev/null +++ b/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.desktop @@ -0,0 +1,7 @@ +[Desktop Entry] +Type=Application +Name=AppFlowy +Icon=io.appflowy.AppFlowy +Exec=env GDK_GL=gles app_flowy %U +Categories=Network;Productivity; +Keywords=Notes diff --git a/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.metainfo.xml b/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.metainfo.xml new file mode 100644 index 0000000000..4178c3d2a5 --- /dev/null +++ b/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.metainfo.xml @@ -0,0 +1,38 @@ + + + io.appflowy.AppFlowy + + AppFlowy + Open Source Notion Alternative + + CC-BY-4.0 + AGPL-3.0-only + + +

+ # Built for teams that need more control and flexibility ## 100% data control You can host AppFlowy wherever you want; no vendor lock-in. +

+

+ ## Unlimited customizations Design and modify AppFlowy your way with an open core codebase. +

+

+ ## One codebase supporting multiple platforms AppFlowy is built with Flutter and Rust. What does this mean? Faster development, better native experience, and more reliable performance. +

+

+ # Built for individuals who care about data security and mobile experience ## 100% control of your data Download and install AppFlowy on your local machine. You own and control your personal data. +

+

+ ## Extensively extensible For those with no coding experience, AppFlowy enables you to create apps that suit your needs. It's built on a community-driven toolbox, including templates, plugins, themes, and more. +

+

+ ## Truely native experience Faster, more stable with support for offline mode. It's also better integrated with different devices. Moreover, AppFlowy enables users to access features and possibilities not available on the web. +

+ + + io.appflowy.AppFlowy.desktop + + + https://github.com/AppFlowy-IO/appflowy/raw/main/doc/imgs/welcome.png + + + diff --git a/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.yml b/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.yml new file mode 100644 index 0000000000..f36b4df432 --- /dev/null +++ b/frontend/scripts/flatpack-buildfiles/io.appflowy.AppFlowy.yml @@ -0,0 +1,35 @@ +app-id: io.appflowy.AppFlowy +runtime: org.freedesktop.Platform +runtime-version: '21.08' +sdk: org.freedesktop.Sdk +command: app_flowy +separate-locales: false +finish-args: + - --share=ipc + - --socket=x11 + - --socket=fallback-x11 + - --socket=wayland + - --socket=pulseaudio + - --share=network + - --device=all +modules: + - name: appflowy + buildsystem: simple + build-commands: + # - ls . + - cp -r appflowy /app/appflowy + - chmod +x /app/appflowy/app_flowy + - install -Dm644 logo.svg /app/share/icons/hicolor/scalable/apps/io.appflowy.AppFlowy.svg + - mkdir /app/bin + - ln -s /app/appflowy/app_flowy /app/bin/app_flowy + - install -Dm644 io.appflowy.AppFlowy.desktop /app/share/applications/io.appflowy.AppFlowy.desktop + sources: + - type: archive + url: https://github.com/AppFlowy-IO/appflowy/releases/download/0.0.2/AppFlowy-linux-x86.tar.gz + sha256: b0dbe669bb9f34a65171adecaf61b02578bab5214d18a54009f0e4ec10665711 + dest: appflowy + - type: file + path: io.appflowy.AppFlowy.desktop + - type: file + path: logo.svg + diff --git a/frontend/scripts/flatpack-buildfiles/logo.svg b/frontend/scripts/flatpack-buildfiles/logo.svg new file mode 100644 index 0000000000..6b5430bfa0 --- /dev/null +++ b/frontend/scripts/flatpack-buildfiles/logo.svg @@ -0,0 +1,11 @@ + + + + + + + + + + +