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

[Part 2] TF-4308 Add Create new label button in ChooseLabelModal (#4457)

Browse Source
This commit is contained in:
Dat Vu
2026-04-17 16:51:49 +07:00
committed by GitHub
parent a80de79537
commit a693ceb456
9 changed files with 297 additions and 254 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/labels/presentation/widgets/choose_label_modal.dart
+98 -60
View File
@@ -12,17 +12,20 @@ import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
import 'package:tmail_ui_user/main/routes/route_navigation.dart';
typedef OnLabelAsToEmailsAction = Function(List<Label> labels);
typedef OnCreateALabelAction = Future<Label?> Function();
class ChooseLabelModal extends StatefulWidget {
final List<Label> labels;
final ImagePaths imagePaths;
final OnLabelAsToEmailsAction onLabelAsToEmailsAction;
final OnCreateALabelAction onCreateALabelAction;
const ChooseLabelModal({
super.key,
required this.labels,
required this.imagePaths,
required this.onLabelAsToEmailsAction,
required this.onCreateALabelAction,
});
@override
@@ -30,84 +33,80 @@ class ChooseLabelModal extends StatefulWidget {
}
class _ChooseLabelModalState extends State<ChooseLabelModal> {
late final ValueNotifier<List<Label>> _labelListNotifier;
@override
void initState() {
super.initState();
_labelListNotifier = ValueNotifier([...widget.labels]);
}
@override
void dispose() {
_labelListNotifier.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final appLocalizations = AppLocalizations.of(context);
return LayoutBuilder(builder: (_, constraints) {
final currentScreenWidth = constraints.maxWidth;
final currentScreenHeight = constraints.maxHeight;
final height = math.max(0.0, math.min(currentScreenHeight - 100, 645.0));
final width = math.max(0.0, math.min(currentScreenWidth - 32, 536.0));
Widget bodyWidget = Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: const BorderRadius.all(Radius.circular(16)),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.08),
blurRadius: 24,
offset: const Offset(0, 2),
),
BoxShadow(
color: Colors.black.withValues(alpha: 0.08),
blurRadius: 2,
),
],
),
width: width,
height: height,
clipBehavior: Clip.antiAlias,
child: Stack(
children: [
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildTitle(appLocalizations),
const Divider(height: 1, color: Colors.black12),
_buildSubtitle(appLocalizations),
if (widget.labels.isNotEmpty)
Expanded(
child: ListLabelWithActionModal(
labels: widget.labels,
imagePaths: widget.imagePaths,
onLabelAsToEmailsAction: widget.onLabelAsToEmailsAction,
onCloseModal: _onCloseModal,
),
)
else
Expanded(
child: Center(
child: NoLabelYetWidget(imagePaths: widget.imagePaths),
),
),
],
),
DefaultCloseButtonWidget(
iconClose: widget.imagePaths.icCloseDialog,
isAlignTopEnd: false,
onTapActionCallback: _onCloseModal,
),
],
return Center(
child: Container(
width: width,
height: height,
decoration: _buildModalDecoration(),
clipBehavior: Clip.antiAlias,
child: Stack(children: [_buildBodyContent(), _buildCloseButton()]),
),
);
return Center(child: bodyWidget);
});
}
Widget _buildTitle(AppLocalizations appLocalizations) {
BoxDecoration _buildModalDecoration() {
return BoxDecoration(
color: Colors.white,
borderRadius: const BorderRadius.all(Radius.circular(16)),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.08),
blurRadius: 24,
offset: const Offset(0, 2),
),
BoxShadow(
color: Colors.black.withValues(alpha: 0.08),
blurRadius: 2,
),
],
);
}
Widget _buildBodyContent() {
final appLocalizations = AppLocalizations.of(context);
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildHeader(appLocalizations),
const Divider(height: 1, color: Colors.black12),
_buildSubtitle(appLocalizations),
Expanded(child: _buildListOrEmptyState()),
],
);
}
Widget _buildHeader(AppLocalizations appLocalizations) {
return Container(
height: 52,
alignment: Alignment.center,
padding: const EdgeInsetsDirectional.symmetric(horizontal: 32),
padding: const EdgeInsets.symmetric(horizontal: 32),
child: Text(
appLocalizations.chooseLabel,
style: ThemeUtils.textStyleHeadingH6().copyWith(
color: Colors.black,
),
style: ThemeUtils.textStyleHeadingH6().copyWith(color: Colors.black),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
@@ -130,6 +129,45 @@ class _ChooseLabelModalState extends State<ChooseLabelModal> {
);
}
Widget _buildListOrEmptyState() {
return ValueListenableBuilder<List<Label>>(
valueListenable: _labelListNotifier,
builder: (context, labels, _) {
if (labels.isEmpty) {
return Center(
child: NoLabelYetWidget(
imagePaths: widget.imagePaths,
onCreateLabel: _onCreateNewLabel,
),
);
}
return ListLabelWithActionModal(
labels: labels,
imagePaths: widget.imagePaths,
onLabelAsToEmailsAction: widget.onLabelAsToEmailsAction,
onCloseModal: _onCloseModal,
onCreateALabelAction: _onCreateNewLabel,
);
},
);
}
Widget _buildCloseButton() {
return DefaultCloseButtonWidget(
iconClose: widget.imagePaths.icCloseDialog,
isAlignTopEnd: false,
onTapActionCallback: _onCloseModal,
);
}
Future<void> _onCreateNewLabel() async {
final newLabel = await widget.onCreateALabelAction();
if (newLabel != null) {
_labelListNotifier.value = [..._labelListNotifier.value, newLabel];
}
}
void _onCloseModal() {
popBack();
}