TF-2116 Apply new design attachment in web composer
(cherry picked from commit 0e0773159fc6c1ed4d44f078a184d2b0f315d360)
This commit is contained in:
@@ -27,7 +27,7 @@ import 'package:tmail_ui_user/features/composer/presentation/mixin/composer_load
|
||||
import 'package:tmail_ui_user/features/composer/presentation/mixin/rich_text_button_mixin.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/model/prefix_recipient_state.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/styles/composer_style.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/attachment_file_composer_builder.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/attachment_item_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/recipient_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/upload/presentation/extensions/list_upload_file_state_extension.dart';
|
||||
import 'package:tmail_ui_user/features/upload/presentation/model/upload_file_state.dart';
|
||||
@@ -321,11 +321,11 @@ abstract class BaseComposerView extends GetWidget<ComposerController>
|
||||
scrollDirection: Axis.horizontal,
|
||||
controller: controller.scrollControllerAttachment,
|
||||
itemCount: uploadFilesState.length,
|
||||
itemBuilder: (context, index) => AttachmentFileComposerBuilder(
|
||||
uploadFilesState[index],
|
||||
itemBuilder: (context, index) => AttachmentItemComposerWidget(
|
||||
fileState: uploadFilesState[index],
|
||||
itemMargin: const EdgeInsetsDirectional.only(end: 8),
|
||||
maxWidth: ComposerStyle.getMaxWidthItemListAttachment(context, constraints),
|
||||
onDeleteAttachmentAction: (attachment) => controller.deleteAttachmentUploaded(attachment.uploadTaskId)
|
||||
onDeleteAttachmentAction: (attachment) => controller.deleteAttachmentUploaded(attachment.uploadTaskId),
|
||||
)
|
||||
),
|
||||
)
|
||||
@@ -344,8 +344,8 @@ abstract class BaseComposerView extends GetWidget<ComposerController>
|
||||
crossAxisCount: ComposerStyle.getMaxItemRowListAttachment(context, constraints),
|
||||
crossAxisSpacing: 8.0,
|
||||
mainAxisSpacing: 8.0),
|
||||
itemBuilder: (context, index) => AttachmentFileComposerBuilder(
|
||||
uploadFilesState[index],
|
||||
itemBuilder: (context, index) => AttachmentItemComposerWidget(
|
||||
fileState: uploadFilesState[index],
|
||||
onDeleteAttachmentAction: (attachment) => controller.deleteAttachmentUploaded(attachment.uploadTaskId)
|
||||
)
|
||||
);
|
||||
@@ -366,8 +366,8 @@ abstract class BaseComposerView extends GetWidget<ComposerController>
|
||||
physics: const ClampingScrollPhysics(),
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: uploadFilesState.length,
|
||||
itemBuilder: (context, index) => AttachmentFileComposerBuilder(
|
||||
uploadFilesState[index],
|
||||
itemBuilder: (context, index) => AttachmentItemComposerWidget(
|
||||
fileState: uploadFilesState[index],
|
||||
itemMargin: const EdgeInsetsDirectional.only(end: 8),
|
||||
maxWidth: ComposerStyle.getMaxWidthItemListAttachment(context, constraints),
|
||||
onDeleteAttachmentAction: (attachment) => controller.deleteAttachmentUploaded(attachment.uploadTaskId)
|
||||
|
||||
@@ -162,6 +162,8 @@ class ComposerController extends BaseController {
|
||||
String? _initTextEditor;
|
||||
double? maxWithEditor;
|
||||
EmailId? _emailIdEditing;
|
||||
bool isAttachmentCollapsed = false;
|
||||
|
||||
late Worker uploadInlineImageWorker;
|
||||
late Worker dashboardViewStateWorker;
|
||||
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
import 'package:core/presentation/views/button/icon_button_web.dart';
|
||||
import 'package:core/presentation/utils/responsive_utils.dart';
|
||||
import 'package:core/presentation/views/responsive/responsive_widget.dart';
|
||||
import 'package:file_picker/file_picker.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:model/email/prefix_email_address.dart';
|
||||
import 'package:pointer_interceptor/pointer_interceptor.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/base_composer_view.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/composer_controller.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/model/prefix_recipient_state.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/styles/composer_style.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/view/desktop_container_view.dart';
|
||||
@@ -13,21 +12,23 @@ import 'package:tmail_ui_user/features/composer/presentation/view/mobile_contain
|
||||
import 'package:tmail_ui_user/features/composer/presentation/view/tablet_container_view.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/view/web_editor_view.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/app_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/attachment_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/bottom_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile_app_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/recipient_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/subject_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/toolbar_rich_text_builder.dart';
|
||||
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
|
||||
class ComposerView extends BaseComposerView {
|
||||
class ComposerView extends GetWidget<ComposerController> {
|
||||
|
||||
final _responsiveUtils = Get.find<ResponsiveUtils>();
|
||||
|
||||
ComposerView({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ResponsiveWidget(
|
||||
responsiveUtils: responsiveUtils,
|
||||
responsiveUtils: _responsiveUtils,
|
||||
mobile: MobileContainerView(
|
||||
childBuilder: (context, constraints) {
|
||||
return Column(
|
||||
@@ -49,7 +50,7 @@ class ComposerView extends BaseComposerView {
|
||||
maxHeight: ComposerStyle.getMaxHeightEmailAddressWidget(
|
||||
context,
|
||||
constraints,
|
||||
responsiveUtils
|
||||
_responsiveUtils
|
||||
)
|
||||
),
|
||||
child: SingleChildScrollView(
|
||||
@@ -139,34 +140,45 @@ class ComposerView extends BaseComposerView {
|
||||
),
|
||||
color: ComposerStyle.backgroundEditorColor
|
||||
),
|
||||
child: Stack(
|
||||
child: Column(
|
||||
children: [
|
||||
Obx(() => Padding(
|
||||
padding: ComposerStyle.mobileEditorPadding,
|
||||
child: WebEditorView(
|
||||
editorController: controller.richTextWebController.editorController,
|
||||
arguments: controller.composerArguments.value,
|
||||
contentViewState: controller.emailContentsViewState.value,
|
||||
currentWebContent: controller.textEditorWeb,
|
||||
onInitial: controller.handleInitHtmlEditorWeb,
|
||||
onChangeContent: controller.onChangeTextEditorWeb,
|
||||
onFocus: controller.handleOnFocusHtmlEditorWeb,
|
||||
onUnFocus: controller.handleOnUnFocusHtmlEditorWeb,
|
||||
onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
|
||||
onEditorSettings: controller.richTextWebController.onEditorSettingsChange,
|
||||
Obx(() => Expanded(
|
||||
child: Padding(
|
||||
padding: ComposerStyle.mobileEditorPadding,
|
||||
child: WebEditorView(
|
||||
editorController: controller.richTextWebController.editorController,
|
||||
arguments: controller.composerArguments.value,
|
||||
contentViewState: controller.emailContentsViewState.value,
|
||||
currentWebContent: controller.textEditorWeb,
|
||||
onInitial: controller.handleInitHtmlEditorWeb,
|
||||
onChangeContent: controller.onChangeTextEditorWeb,
|
||||
onFocus: controller.handleOnFocusHtmlEditorWeb,
|
||||
onUnFocus: controller.handleOnUnFocusHtmlEditorWeb,
|
||||
onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
|
||||
onEditorSettings: controller.richTextWebController.onEditorSettingsChange,
|
||||
),
|
||||
),
|
||||
)),
|
||||
Obx(() {
|
||||
if (controller.uploadController.listUploadAttachments.isNotEmpty) {
|
||||
return AttachmentComposerWidget(
|
||||
listFileUploaded: controller.uploadController.listUploadAttachments,
|
||||
isCollapsed: controller.isAttachmentCollapsed,
|
||||
onDeleteAttachmentAction: (fileState) => controller.deleteAttachmentUploaded(fileState.uploadTaskId),
|
||||
onToggleExpandAttachmentAction: (isCollapsed) => controller.isAttachmentCollapsed = isCollapsed,
|
||||
);
|
||||
} else {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
}),
|
||||
Obx(() {
|
||||
if (controller.richTextWebController.isFormattingOptionsEnabled) {
|
||||
return Align(
|
||||
alignment: AlignmentDirectional.bottomCenter,
|
||||
child: ToolbarRichTextWebBuilder(
|
||||
richTextWebController: controller.richTextWebController,
|
||||
padding: ComposerStyle.richToolbarPadding,
|
||||
decoration: const BoxDecoration(
|
||||
color: ComposerStyle.richToolbarColor,
|
||||
boxShadow: ComposerStyle.richToolbarShadow
|
||||
),
|
||||
return ToolbarRichTextWebBuilder(
|
||||
richTextWebController: controller.richTextWebController,
|
||||
padding: ComposerStyle.richToolbarPadding,
|
||||
decoration: const BoxDecoration(
|
||||
color: ComposerStyle.richToolbarColor,
|
||||
boxShadow: ComposerStyle.richToolbarShadow
|
||||
),
|
||||
);
|
||||
} else {
|
||||
@@ -196,7 +208,7 @@ class ComposerView extends BaseComposerView {
|
||||
maxHeight: ComposerStyle.getMaxHeightEmailAddressWidget(
|
||||
context,
|
||||
constraints,
|
||||
responsiveUtils
|
||||
_responsiveUtils
|
||||
)
|
||||
),
|
||||
child: SingleChildScrollView(
|
||||
@@ -286,34 +298,45 @@ class ComposerView extends BaseComposerView {
|
||||
),
|
||||
color: ComposerStyle.backgroundEditorColor
|
||||
),
|
||||
child: Stack(
|
||||
child: Column(
|
||||
children: [
|
||||
Obx(() => Padding(
|
||||
padding: ComposerStyle.desktopEditorPadding,
|
||||
child: WebEditorView(
|
||||
editorController: controller.richTextWebController.editorController,
|
||||
arguments: controller.composerArguments.value,
|
||||
contentViewState: controller.emailContentsViewState.value,
|
||||
currentWebContent: controller.textEditorWeb,
|
||||
onInitial: controller.handleInitHtmlEditorWeb,
|
||||
onChangeContent: controller.onChangeTextEditorWeb,
|
||||
onFocus: controller.handleOnFocusHtmlEditorWeb,
|
||||
onUnFocus: controller.handleOnUnFocusHtmlEditorWeb,
|
||||
onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
|
||||
onEditorSettings: controller.richTextWebController.onEditorSettingsChange,
|
||||
Obx(() => Expanded(
|
||||
child: Padding(
|
||||
padding: ComposerStyle.desktopEditorPadding,
|
||||
child: WebEditorView(
|
||||
editorController: controller.richTextWebController.editorController,
|
||||
arguments: controller.composerArguments.value,
|
||||
contentViewState: controller.emailContentsViewState.value,
|
||||
currentWebContent: controller.textEditorWeb,
|
||||
onInitial: controller.handleInitHtmlEditorWeb,
|
||||
onChangeContent: controller.onChangeTextEditorWeb,
|
||||
onFocus: controller.handleOnFocusHtmlEditorWeb,
|
||||
onUnFocus: controller.handleOnUnFocusHtmlEditorWeb,
|
||||
onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
|
||||
onEditorSettings: controller.richTextWebController.onEditorSettingsChange,
|
||||
),
|
||||
),
|
||||
)),
|
||||
Obx(() {
|
||||
if (controller.uploadController.listUploadAttachments.isNotEmpty) {
|
||||
return AttachmentComposerWidget(
|
||||
listFileUploaded: controller.uploadController.listUploadAttachments,
|
||||
isCollapsed: controller.isAttachmentCollapsed,
|
||||
onDeleteAttachmentAction: (fileState) => controller.deleteAttachmentUploaded(fileState.uploadTaskId),
|
||||
onToggleExpandAttachmentAction: (isCollapsed) => controller.isAttachmentCollapsed = isCollapsed,
|
||||
);
|
||||
} else {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
}),
|
||||
Obx(() {
|
||||
if (controller.richTextWebController.isFormattingOptionsEnabled) {
|
||||
return Align(
|
||||
alignment: AlignmentDirectional.bottomCenter,
|
||||
child: ToolbarRichTextWebBuilder(
|
||||
richTextWebController: controller.richTextWebController,
|
||||
padding: ComposerStyle.richToolbarPadding,
|
||||
decoration: const BoxDecoration(
|
||||
color: ComposerStyle.richToolbarColor,
|
||||
boxShadow: ComposerStyle.richToolbarShadow
|
||||
),
|
||||
return ToolbarRichTextWebBuilder(
|
||||
richTextWebController: controller.richTextWebController,
|
||||
padding: ComposerStyle.richToolbarPadding,
|
||||
decoration: const BoxDecoration(
|
||||
color: ComposerStyle.richToolbarColor,
|
||||
boxShadow: ComposerStyle.richToolbarShadow
|
||||
),
|
||||
);
|
||||
} else {
|
||||
@@ -355,7 +378,7 @@ class ComposerView extends BaseComposerView {
|
||||
maxHeight: ComposerStyle.getMaxHeightEmailAddressWidget(
|
||||
context,
|
||||
constraints,
|
||||
responsiveUtils
|
||||
_responsiveUtils
|
||||
)
|
||||
),
|
||||
child: SingleChildScrollView(
|
||||
@@ -445,34 +468,45 @@ class ComposerView extends BaseComposerView {
|
||||
),
|
||||
color: ComposerStyle.backgroundEditorColor
|
||||
),
|
||||
child: Stack(
|
||||
child: Column(
|
||||
children: [
|
||||
Obx(() => Padding(
|
||||
padding: ComposerStyle.tabletEditorPadding,
|
||||
child: WebEditorView(
|
||||
editorController: controller.richTextWebController.editorController,
|
||||
arguments: controller.composerArguments.value,
|
||||
contentViewState: controller.emailContentsViewState.value,
|
||||
currentWebContent: controller.textEditorWeb,
|
||||
onInitial: controller.handleInitHtmlEditorWeb,
|
||||
onChangeContent: controller.onChangeTextEditorWeb,
|
||||
onFocus: controller.handleOnFocusHtmlEditorWeb,
|
||||
onUnFocus: controller.handleOnUnFocusHtmlEditorWeb,
|
||||
onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
|
||||
onEditorSettings: controller.richTextWebController.onEditorSettingsChange,
|
||||
Obx(() => Expanded(
|
||||
child: Padding(
|
||||
padding: ComposerStyle.tabletEditorPadding,
|
||||
child: WebEditorView(
|
||||
editorController: controller.richTextWebController.editorController,
|
||||
arguments: controller.composerArguments.value,
|
||||
contentViewState: controller.emailContentsViewState.value,
|
||||
currentWebContent: controller.textEditorWeb,
|
||||
onInitial: controller.handleInitHtmlEditorWeb,
|
||||
onChangeContent: controller.onChangeTextEditorWeb,
|
||||
onFocus: controller.handleOnFocusHtmlEditorWeb,
|
||||
onUnFocus: controller.handleOnUnFocusHtmlEditorWeb,
|
||||
onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
|
||||
onEditorSettings: controller.richTextWebController.onEditorSettingsChange,
|
||||
),
|
||||
),
|
||||
)),
|
||||
Obx(() {
|
||||
if (controller.uploadController.listUploadAttachments.isNotEmpty) {
|
||||
return AttachmentComposerWidget(
|
||||
listFileUploaded: controller.uploadController.listUploadAttachments,
|
||||
isCollapsed: controller.isAttachmentCollapsed,
|
||||
onDeleteAttachmentAction: (fileState) => controller.deleteAttachmentUploaded(fileState.uploadTaskId),
|
||||
onToggleExpandAttachmentAction: (isCollapsed) => controller.isAttachmentCollapsed = isCollapsed,
|
||||
);
|
||||
} else {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
}),
|
||||
Obx(() {
|
||||
if (controller.richTextWebController.isFormattingOptionsEnabled) {
|
||||
return Align(
|
||||
alignment: AlignmentDirectional.bottomCenter,
|
||||
child: ToolbarRichTextWebBuilder(
|
||||
richTextWebController: controller.richTextWebController,
|
||||
padding: ComposerStyle.richToolbarPadding,
|
||||
decoration: const BoxDecoration(
|
||||
color: ComposerStyle.richToolbarColor,
|
||||
boxShadow: ComposerStyle.richToolbarShadow
|
||||
),
|
||||
return ToolbarRichTextWebBuilder(
|
||||
richTextWebController: controller.richTextWebController,
|
||||
padding: ComposerStyle.richToolbarPadding,
|
||||
decoration: const BoxDecoration(
|
||||
color: ComposerStyle.richToolbarColor,
|
||||
boxShadow: ComposerStyle.richToolbarShadow
|
||||
),
|
||||
);
|
||||
} else {
|
||||
@@ -499,39 +533,4 @@ class ComposerView extends BaseComposerView {
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
List<PopupMenuEntry> popUpMoreActionMenu(BuildContext context) {
|
||||
return [
|
||||
PopupMenuItem(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8),
|
||||
child: PointerInterceptor(
|
||||
child: IntrinsicHeight(
|
||||
child: Row(
|
||||
children: [
|
||||
Obx(() => buildIconWeb(
|
||||
icon: Icon(controller.hasRequestReadReceipt.value ? Icons.done : null, color: Colors.black))),
|
||||
Expanded(
|
||||
child: InkResponse(
|
||||
child: SizedBox(
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
child: Center(
|
||||
child: Text(
|
||||
AppLocalizations.of(context).requestReadReceipt,
|
||||
style: const TextStyle(color: Colors.black, fontSize: 15),
|
||||
)
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
]),
|
||||
),
|
||||
),
|
||||
onTap: () {
|
||||
controller.toggleRequestReadReceipt();
|
||||
},
|
||||
)
|
||||
];
|
||||
}
|
||||
}
|
||||
@@ -11,6 +11,7 @@ class BottomBarComposerWidgetStyle {
|
||||
static const double sendButtonRadius = 8;
|
||||
static const double sendButtonIconSpace = 5;
|
||||
|
||||
static const Color backgroundColor = Colors.white;
|
||||
static const Color iconColor = AppColor.colorRichButtonComposer;
|
||||
static const Color sendButtonBackgroundColor = AppColor.primaryColor;
|
||||
static const Color selectedBackgroundColor = AppColor.colorSelected;
|
||||
|
||||
@@ -36,6 +36,7 @@ class BottomBarComposerWidget extends StatelessWidget {
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: BottomBarComposerWidgetStyle.padding,
|
||||
color: BottomBarComposerWidgetStyle.backgroundColor,
|
||||
child: Row(
|
||||
children: [
|
||||
TMailButtonWidget.fromIcon(
|
||||
|
||||
Reference in New Issue
Block a user