TF-527 Add presentation layer in add new identity

2022-05-05 09:10:32 +07:00
parent 32f99fcca2
commit 36e33b0866
19 changed files with 1030 additions and 57 deletions
@@ -0,0 +1,82 @@
+
+import 'package:core/core.dart';
+import 'package:dropdown_button2/dropdown_button2.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:jmap_dart_client/jmap/mail/email/email_address.dart';
+
+typedef OnSelectEmailAddressDropListAction = Function(EmailAddress? emailAddress);
+
+class IdentityDropListFieldBuilder {
+
+  final ImagePaths _imagePaths;
+  final String _label;
+  final EmailAddress? _emailAddressSelected;
+  final List<EmailAddress> _listEmailAddress;
+
+  OnSelectEmailAddressDropListAction? onSelectItemDropList;
+
+  IdentityDropListFieldBuilder(
+    this._imagePaths,
+    this._label,
+    this._emailAddressSelected,
+    this._listEmailAddress,
+  );
+
+  void addOnSelectEmailAddressDropListAction(OnSelectEmailAddressDropListAction action) {
+    onSelectItemDropList = action;
+  }
+
+  Widget build() {
+    return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
+      Text(_label, style: const TextStyle(
+        fontSize: 14,
+        fontWeight: FontWeight.normal,
+        color: AppColor.colorContentEmail)),
+      const SizedBox(height: 8),
+      DropdownButtonHideUnderline(
+        child: DropdownButton2<EmailAddress>(
+          isExpanded: true,
+          hint: Row(
+            children: [
+              Expanded(child: Text(
+                _emailAddressSelected?.email ?? '',
+                style: const TextStyle(fontSize: 16, fontWeight: FontWeight.normal, color: Colors.black),
+                maxLines: 1,
+                overflow: BuildUtils.isWeb ? null : TextOverflow.ellipsis,
+              )),
+            ],
+          ),
+          items: _listEmailAddress.map((item) => DropdownMenuItem<EmailAddress>(
+            value: item,
+            child: Text(
+              item.email ?? '',
+              style: const TextStyle(fontSize: 16, fontWeight: FontWeight.normal, color: Colors.black),
+              maxLines: 1,
+              overflow: BuildUtils.isWeb ? null : TextOverflow.ellipsis,
+            ),
+          )).toList(),
+          value: _emailAddressSelected,
+          onChanged: (newEmailAddress) => onSelectItemDropList?.call(newEmailAddress),
+          icon: SvgPicture.asset(_imagePaths.icDropDown),
+          buttonPadding: const EdgeInsets.symmetric(horizontal: 12),
+          buttonDecoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(10),
+              border: Border.all(color: AppColor.colorInputBorderCreateMailbox, width: 0.5),
+              color: AppColor.colorInputBackgroundCreateMailbox),
+          itemHeight: 44,
+          buttonHeight: 44,
+          selectedItemHighlightColor: Colors.black12,
+          itemPadding: const EdgeInsets.symmetric(horizontal: 12),
+          dropdownMaxHeight: 200,
+          dropdownDecoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(10),
+              color: Colors.white),
+          dropdownElevation: 4,
+          scrollbarRadius: const Radius.circular(40),
+          scrollbarThickness: 6,
+        ),
+      )
+    ]);
+  }
+}
@@ -0,0 +1,37 @@
+
+import 'package:core/core.dart';
+import 'package:flutter/material.dart';
+
+class IdentityInputDecorationBuilder extends InputDecorationBuilder {
+
+  @override
+  InputDecoration build() {
+    return InputDecoration(
+      enabledBorder: enabledBorder ?? const OutlineInputBorder(
+        borderRadius: BorderRadius.all(Radius.circular(10)),
+        borderSide: BorderSide(width: 1, color: AppColor.colorInputBorderCreateMailbox)),
+      focusedBorder: enabledBorder ?? const OutlineInputBorder(
+        borderRadius: BorderRadius.all(Radius.circular(10)),
+        borderSide: BorderSide(width: 1, color: AppColor.colorTextButton)),
+      errorBorder: errorBorder ?? const OutlineInputBorder(
+        borderRadius: BorderRadius.all(Radius.circular(10)),
+        borderSide: BorderSide(width: 1, color: AppColor.colorInputBorderErrorVerifyName)),
+      focusedErrorBorder: errorBorder ?? const OutlineInputBorder(
+          borderRadius: BorderRadius.all(Radius.circular(10)),
+          borderSide: BorderSide(width: 1, color: AppColor.colorInputBorderErrorVerifyName)),
+      prefixText: prefixText,
+      labelText: labelText,
+      floatingLabelBehavior: FloatingLabelBehavior.never,
+      labelStyle: labelStyle ?? const TextStyle(color: Colors.black, fontSize: 16),
+      hintText: hintText,
+      isDense: true,
+      hintStyle: hintStyle ?? const TextStyle(color: AppColor.colorHintInputCreateMailbox, fontSize: 16),
+      contentPadding: contentPadding ?? const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
+      errorText: errorText,
+      errorStyle: errorTextStyle ?? const TextStyle(color: AppColor.colorInputBorderErrorVerifyName, fontSize: 13),
+      filled: true,
+      fillColor: errorText?.isNotEmpty == true
+          ? AppColor.colorInputBackgroundErrorVerifyName
+          : AppColor.colorInputBackgroundCreateMailbox);
+  }
+}
@@ -0,0 +1,59 @@
+
+import 'package:core/core.dart';
+import 'package:flutter/material.dart';
+import 'package:tmail_ui_user/features/identity_creator/presentation/widgets/identity_input_decoration_builder.dart';
+
+typedef OnChangeInputNameAction = Function(String? value);
+
+class IdentityInputFieldBuilder {
+
+  final BuildContext _context;
+  final ResponsiveUtils _responsiveUtils;
+  final String _label;
+  final String? _error;
+  final TextEditingController? editingController;
+  final FocusNode? focusNode;
+  final TextInputType? inputType;
+  final bool isMandatory;
+
+  OnChangeInputNameAction? onChangeInputNameAction;
+
+  IdentityInputFieldBuilder(
+    this._context,
+    this._responsiveUtils,
+    this._label,
+    this._error, {
+    this.isMandatory = false,
+    this.editingController,
+    this.focusNode,
+    this.inputType
+  });
+
+  void addOnChangeInputNameAction(OnChangeInputNameAction action) {
+    onChangeInputNameAction = action;
+  }
+
+  Widget build() {
+    return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
+      Text(isMandatory ? '$_label*' : _label, style: const TextStyle(
+        fontSize: 14,
+        fontWeight: FontWeight.normal,
+        color: AppColor.colorContentEmail)),
+      const SizedBox(height: 8),
+      (TextFieldBuilder()
+          ..onChange((value) => onChangeInputNameAction?.call(value))
+          ..textInputAction(TextInputAction.next)
+          ..addController(editingController ?? TextEditingController())
+          ..addFocusNode(focusNode)
+          ..textStyle(const TextStyle(color: Colors.black, fontSize: 16))
+          ..keyboardType(inputType ?? TextInputType.text)
+          ..textDecoration((IdentityInputDecorationBuilder()
+                ..setContentPadding(EdgeInsets.symmetric(
+                    vertical: _responsiveUtils.isDesktop(_context) ? 16 : 12,
+                    horizontal: 12))
+                ..setErrorText(_error))
+              .build()))
+        .build()
+    ]);
+  }
+}