eduvia/workavia-mail-front
11
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

TF-3758 Allow Folders to be expandable

Browse Source 
Signed-off-by: dab246 <tdvu@linagora.com>
This commit is contained in:
dab246
2025-05-30 03:44:19 +07:00
committed by Dat H. Pham
parent f179a9a6a8
commit d97a743542
4 changed files with 109 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/mailbox/presentation/extensions/toggle_expand_folders_extension.dart
+14
View File
@@ -0,0 +1,14 @@
import 'package:model/mailbox/expand_mode.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/mailbox_controller.dart';
extension ToggleExpandFoldersExtension on MailboxController {
void toggleExpandFolders() {
final currentExpand = foldersExpandMode.value;
if (currentExpand == ExpandMode.COLLAPSE) {
foldersExpandMode.value = ExpandMode.EXPAND;
} else {
foldersExpandMode.value = ExpandMode.COLLAPSE;
}
}
}
lib/features/mailbox/presentation/mailbox_controller.dart
+1
View File
@@ -122,6 +122,7 @@ class MailboxController extends BaseMailboxController
final _activeScrollTop = RxBool(false);
final _activeScrollBottom = RxBool(true);
final foldersExpandMode = Rx(ExpandMode.EXPAND);
MailboxId? _newFolderId;
NavigationRouter? _navigationRouter;
lib/features/mailbox/presentation/mailbox_view.dart
+56 -32
View File
@@ -5,6 +5,7 @@ import 'package:model/model.dart';
import 'package:tmail_ui_user/features/base/widget/application_version_widget.dart';
import 'package:tmail_ui_user/features/home/domain/extensions/session_extensions.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/base_mailbox_view.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/extensions/toggle_expand_folders_extension.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_categories.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_item_widget_styles.dart';
@@ -98,37 +99,25 @@ class MailboxView extends BaseMailboxView {
return const SizedBox.shrink();
}
}),
FoldersBarWidget(
onOpenSearchFolder: () => controller.openSearchViewAction(context),
onAddNewFolder: () => controller.goToCreateNewMailboxView(context),
imagePaths: controller.imagePaths,
responsiveUtils: controller.responsiveUtils,
height: 40,
padding: const EdgeInsets.symmetric(horizontal: 24),
labelStyle: ThemeUtils.textStyleInter500(),
),
Obx(() {
if (controller.personalMailboxIsNotEmpty) {
return _buildMailboxCategory(
context,
MailboxCategories.personalFolders,
controller.personalRootNode
);
} else {
return const SizedBox.shrink();
}
}),
Obx(() {
if (controller.teamMailboxesIsNotEmpty) {
return _buildMailboxCategory(
context,
MailboxCategories.teamMailboxes,
controller.teamMailboxesRootNode
);
} else {
return const SizedBox.shrink();
}
return FoldersBarWidget(
onOpenSearchFolder: () => controller.openSearchViewAction(context),
onAddNewFolder: () => controller.goToCreateNewMailboxView(context),
imagePaths: controller.imagePaths,
responsiveUtils: controller.responsiveUtils,
height: 40,
padding: const EdgeInsetsDirectional.only(start: 24, end: 12),
labelStyle: ThemeUtils.textStyleInter500(),
expandMode: controller.foldersExpandMode.value,
onToggleExpandFolder: controller.toggleExpandFolders,
);
}),
Obx(() => AnimatedContainer(
duration: const Duration(milliseconds: 400),
child: controller.foldersExpandMode.value == ExpandMode.EXPAND
? _buildFolders(context)
: const Offstage(),
)),
Obx(() {
final accountId = controller
.mailboxDashBoardController
@@ -146,12 +135,17 @@ class MailboxView extends BaseMailboxView {
return const SizedBox.shrink();
}
final isFoldersExpanded =
controller.foldersExpandMode.value == ExpandMode.EXPAND;
return Column(
mainAxisSize: MainAxisSize.min,
children: [
const Padding(
padding: EdgeInsets.only(top: 8),
child: Divider(color: AppColor.folderDivider, height: 1),
Padding(
padding: isFoldersExpanded
? const EdgeInsets.only(top: 8)
: EdgeInsets.zero,
child: const Divider(color: AppColor.folderDivider, height: 1),
),
FolderWidget(
icon: controller.imagePaths.icHelp,
@@ -175,6 +169,36 @@ class MailboxView extends BaseMailboxView {
);
}
Widget _buildFolders(BuildContext context) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
Obx(() {
if (controller.personalMailboxIsNotEmpty) {
return _buildMailboxCategory(
context,
MailboxCategories.personalFolders,
controller.personalRootNode,
);
} else {
return const SizedBox.shrink();
}
}),
Obx(() {
if (controller.teamMailboxesIsNotEmpty) {
return _buildMailboxCategory(
context,
MailboxCategories.teamMailboxes,
controller.teamMailboxesRootNode,
);
} else {
return const SizedBox.shrink();
}
}),
],
);
}
Widget _buildBodyMailboxCategory({
required BuildContext context,
required MailboxCategories categories,
lib/features/mailbox/presentation/widgets/folders_bar_widget.dart
+38 -8
View File
@@ -3,7 +3,11 @@ import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:core/presentation/utils/theme_utils.dart';
import 'package:core/presentation/views/button/tmail_button_widget.dart';
import 'package:core/utils/direction_utils.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
import 'package:model/mailbox/expand_mode.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/extensions/expand_mode_extension.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
class FoldersBarWidget extends StatelessWidget {
@@ -14,6 +18,8 @@ class FoldersBarWidget extends StatelessWidget {
final double? height;
final EdgeInsetsGeometry? padding;
final TextStyle? labelStyle;
final ExpandMode? expandMode;
final VoidCallback? onToggleExpandFolder;
const FoldersBarWidget({
super.key,
@@ -24,6 +30,8 @@ class FoldersBarWidget extends StatelessWidget {
this.height,
this.padding,
this.labelStyle,
this.expandMode,
this.onToggleExpandFolder,
});
@override
@@ -61,6 +69,13 @@ class FoldersBarWidget extends StatelessWidget {
);
}
final labelFolder = Text(
AppLocalizations.of(context).folders,
style: labelStyle ?? ThemeUtils.textStyleInter700(),
maxLines: 1,
overflow: TextOverflow.ellipsis,
);
return Container(
padding: padding ?? EdgeInsetsDirectional.only(
start: responsiveUtils.isWebDesktop(context) ? 10 : 26,
@@ -69,15 +84,30 @@ class FoldersBarWidget extends StatelessWidget {
height: height ?? 48,
child: Row(
children: [
Expanded(
child: Text(
AppLocalizations.of(context).folders,
style: labelStyle ?? ThemeUtils.textStyleInter700(),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
if (expandMode != null)
Expanded(child: Row(
children: [
Flexible(child: labelFolder),
TMailButtonWidget.fromIcon(
icon: expandMode!.getIcon(
imagePaths,
DirectionUtils.isDirectionRTLByLanguage(context),
),
iconColor: Colors.black,
iconSize: PlatformInfo.isMobile ? 17 : 20,
backgroundColor: Colors.transparent,
padding: EdgeInsets.all(PlatformInfo.isMobile ? 3 : 5),
tooltipMessage: expandMode!.getTooltipMessage(AppLocalizations.of(context)),
onTapActionCallback: () => onToggleExpandFolder?.call(),
)
],
))
else
Expanded(child: labelFolder),
Row(
mainAxisSize: MainAxisSize.min,
children: [searchBarIcon, newFolderIcon],
),
Row(children: [searchBarIcon, newFolderIcon]),
],
),
);