Add align Folder with icon of folder

Signed-off-by: dab246 <tdvu@linagora.com>
This commit is contained in:
dab246
2025-05-23 18:16:30 +07:00
committed by Dat H. Pham
parent 9e6e9574b1
commit 4741092faa
3 changed files with 89 additions and 73 deletions
@@ -11,6 +11,7 @@ import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.d
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/app_grid_view.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/bottom_bar_selection_mailbox_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/folder_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/folders_bar_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_category_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_item_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_loading_bar_widget.dart';
@@ -237,39 +238,11 @@ class MailboxView extends BaseMailboxView {
}),
const SizedBox(height: 8),
const Divider(color: AppColor.colorDividerMailbox, height: 1),
Container(
padding: const EdgeInsetsDirectional.symmetric(
horizontal: 16,
vertical: 6
),
child: Row(
children: [
Expanded(
child: Text(
AppLocalizations.of(context).folders,
style: ThemeUtils.textStyleInter700(color: Colors.black),
),
),
Row(children: [
TMailButtonWidget.fromIcon(
icon: controller.imagePaths.icSearchBar,
iconColor: AppColor.steelGrayA540,
iconSize: 20,
backgroundColor: Colors.transparent,
tooltipMessage: AppLocalizations.of(context).searchForFolders,
onTapActionCallback: () => controller.openSearchViewAction(context)
),
TMailButtonWidget.fromIcon(
icon: controller.imagePaths.icAddNewFolder,
iconColor: AppColor.steelGrayA540,
iconSize: 20,
backgroundColor: Colors.transparent,
tooltipMessage: AppLocalizations.of(context).newFolder,
onTapActionCallback: () => controller.goToCreateNewMailboxView(context)
),
]),
],
),
FoldersBarWidget(
onOpenSearchFolder: () => controller.openSearchViewAction(context),
onAddNewFolder: () => controller.goToCreateNewMailboxView(context),
imagePaths: controller.imagePaths,
responsiveUtils: controller.responsiveUtils,
),
Obx(() {
if (controller.personalMailboxIsNotEmpty) {
@@ -12,6 +12,7 @@ import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_catego
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/app_grid_view.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/folder_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/folders_bar_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_category_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_item_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_loading_bar_widget.dart';
@@ -135,46 +136,11 @@ class MailboxView extends BaseMailboxView {
}),
const SizedBox(height: 8),
const Divider(color: AppColor.colorDividerMailbox, height: 1),
Padding(
padding: const EdgeInsetsDirectional.symmetric(vertical: 4),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Padding(
padding: EdgeInsetsDirectional.only(
start: controller.responsiveUtils.isWebDesktop(context) ? 0 : 16,
),
child: Text(
AppLocalizations.of(context).folders,
style: ThemeUtils.textStyleInter700(color: Colors.black),
),
),
),
Padding(
padding: EdgeInsetsDirectional.only(end: controller.responsiveUtils.isDesktop(context) ? 0 : 12),
child: Row(
children: [
TMailButtonWidget.fromIcon(
icon: controller.imagePaths.icSearchBar,
backgroundColor: Colors.transparent,
iconColor: AppColor.steelGrayA540,
iconSize: 20,
tooltipMessage: AppLocalizations.of(context).searchForFolders,
onTapActionCallback: () => controller.openSearchViewAction(context)
),
TMailButtonWidget.fromIcon(
icon: controller.imagePaths.icAddNewFolder,
backgroundColor: Colors.transparent,
iconColor: AppColor.steelGrayA540,
iconSize: 20,
tooltipMessage: AppLocalizations.of(context).newFolder,
onTapActionCallback: () => controller.goToCreateNewMailboxView(context)
),
],
)
),
]),
FoldersBarWidget(
onOpenSearchFolder: () => controller.openSearchViewAction(context),
onAddNewFolder: () => controller.goToCreateNewMailboxView(context),
imagePaths: controller.imagePaths,
responsiveUtils: controller.responsiveUtils,
),
Obx(() {
if (controller.personalMailboxIsNotEmpty) {
@@ -0,0 +1,77 @@
import 'package:core/presentation/extensions/color_extension.dart';
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:flutter/material.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
class FoldersBarWidget extends StatelessWidget {
final VoidCallback onOpenSearchFolder;
final VoidCallback onAddNewFolder;
final ImagePaths imagePaths;
final ResponsiveUtils responsiveUtils;
const FoldersBarWidget({
super.key,
required this.onOpenSearchFolder,
required this.onAddNewFolder,
required this.imagePaths,
required this.responsiveUtils,
});
@override
Widget build(BuildContext context) {
Widget searchBarIcon = TMailButtonWidget.fromIcon(
icon: imagePaths.icSearchBar,
backgroundColor: Colors.transparent,
iconColor: AppColor.steelGrayA540,
iconSize: 20,
tooltipMessage: AppLocalizations.of(context).searchForFolders,
onTapActionCallback: onOpenSearchFolder,
);
if (responsiveUtils.isWebDesktop(context)) {
searchBarIcon = Transform(
transform: Matrix4.translationValues(8, 0, 0),
child: searchBarIcon,
);
}
Widget newFolderIcon = TMailButtonWidget.fromIcon(
icon: imagePaths.icAddNewFolder,
backgroundColor: Colors.transparent,
iconColor: AppColor.steelGrayA540,
iconSize: 24,
padding: const EdgeInsets.all(5),
tooltipMessage: AppLocalizations.of(context).newFolder,
onTapActionCallback: onAddNewFolder,
);
if (responsiveUtils.isWebDesktop(context)) {
newFolderIcon = Transform(
transform: Matrix4.translationValues(8, 0, 0),
child: newFolderIcon,
);
}
return Container(
padding: EdgeInsetsDirectional.only(
start: responsiveUtils.isWebDesktop(context) ? 10 : 26,
end: responsiveUtils.isWebDesktop(context) ? 0 : 8,
),
height: 48,
child: Row(
children: [
Expanded(
child: Text(
AppLocalizations.of(context).folders,
style: ThemeUtils.textStyleInter700(color: Colors.black),
),
),
Row(children: [searchBarIcon, newFolderIcon]),
],
),
);
}
}