Browse Source

Made a working TextInputDialog

ashilkn 2 years ago
parent
commit
c48108a2da

+ 42 - 11
lib/ui/components/dialog_widget.dart

@@ -6,8 +6,11 @@ import 'package:photos/theme/colors.dart';
 import 'package:photos/theme/effects.dart';
 import 'package:photos/theme/effects.dart';
 import 'package:photos/theme/ente_theme.dart';
 import 'package:photos/theme/ente_theme.dart';
 import 'package:photos/ui/components/button_widget.dart';
 import 'package:photos/ui/components/button_widget.dart';
+import 'package:photos/ui/components/models/button_type.dart';
 import 'package:photos/utils/separators_util.dart';
 import 'package:photos/utils/separators_util.dart';
 
 
+typedef FutureVoidCallbackParamStr = Future<void> Function(String);
+
 ///Will return null if dismissed by tapping outside
 ///Will return null if dismissed by tapping outside
 Future<ButtonAction?> showDialogWidget({
 Future<ButtonAction?> showDialogWidget({
   required BuildContext context,
   required BuildContext context,
@@ -152,23 +155,31 @@ class Actions extends StatelessWidget {
   }
   }
 }
 }
 
 
-class TextInputDialog extends StatelessWidget {
+class TextInputDialog extends StatefulWidget {
   final String title;
   final String title;
   final String? body;
   final String? body;
-  final List<ButtonWidget> buttons;
+  final String confirmationButtonLabel;
   final IconData? icon;
   final IconData? icon;
   final String? label;
   final String? label;
   final String? message;
   final String? message;
+  final FutureVoidCallbackParamStr onConfirm;
   const TextInputDialog({
   const TextInputDialog({
     required this.title,
     required this.title,
     this.body,
     this.body,
-    required this.buttons,
+    required this.confirmationButtonLabel,
+    required this.onConfirm,
     this.icon,
     this.icon,
     this.label,
     this.label,
     this.message,
     this.message,
     super.key,
     super.key,
   });
   });
 
 
+  @override
+  State<TextInputDialog> createState() => _TextInputDialogState();
+}
+
+class _TextInputDialogState extends State<TextInputDialog> {
+  final TextEditingController _textController = TextEditingController();
   @override
   @override
   Widget build(BuildContext context) {
   Widget build(BuildContext context) {
     final widthOfScreen = MediaQuery.of(context).size.width;
     final widthOfScreen = MediaQuery.of(context).size.width;
@@ -176,12 +187,13 @@ class TextInputDialog extends StatelessWidget {
     final colorScheme = getEnteColorScheme(context);
     final colorScheme = getEnteColorScheme(context);
     final textTheme = getEnteTextTheme(context);
     final textTheme = getEnteTextTheme(context);
     var textInputChildren = <Widget>[];
     var textInputChildren = <Widget>[];
-    if (label != null) textInputChildren.add(Text(label!));
+    if (widget.label != null) textInputChildren.add(Text(widget.label!));
     textInputChildren.add(
     textInputChildren.add(
       ClipRRect(
       ClipRRect(
         borderRadius: const BorderRadius.all(Radius.circular(8)),
         borderRadius: const BorderRadius.all(Radius.circular(8)),
         child: Material(
         child: Material(
           child: TextFormField(
           child: TextFormField(
+            controller: _textController,
             decoration: InputDecoration(
             decoration: InputDecoration(
               hintText: "Placeholder",
               hintText: "Placeholder",
               hintStyle: textTheme.body.copyWith(color: colorScheme.textMuted),
               hintStyle: textTheme.body.copyWith(color: colorScheme.textMuted),
@@ -218,12 +230,12 @@ class TextInputDialog extends StatelessWidget {
         ),
         ),
       ),
       ),
     );
     );
-    if (message != null) {
+    if (widget.message != null) {
       textInputChildren.add(
       textInputChildren.add(
         Padding(
         Padding(
           padding: const EdgeInsets.symmetric(horizontal: 8),
           padding: const EdgeInsets.symmetric(horizontal: 8),
           child: Text(
           child: Text(
-            message!,
+            widget.message!,
             style: textTheme.small.copyWith(color: colorScheme.textMuted),
             style: textTheme.small.copyWith(color: colorScheme.textMuted),
           ),
           ),
         ),
         ),
@@ -247,9 +259,9 @@ class TextInputDialog extends StatelessWidget {
           mainAxisSize: MainAxisSize.min,
           mainAxisSize: MainAxisSize.min,
           children: [
           children: [
             ContentContainer(
             ContentContainer(
-              title: title,
-              body: body,
-              icon: icon,
+              title: widget.title,
+              body: widget.body,
+              icon: widget.icon,
             ),
             ),
             Padding(
             Padding(
               padding: const EdgeInsets.only(top: 19),
               padding: const EdgeInsets.only(top: 19),
@@ -263,9 +275,24 @@ class TextInputDialog extends StatelessWidget {
             Row(
             Row(
               mainAxisSize: MainAxisSize.min,
               mainAxisSize: MainAxisSize.min,
               children: [
               children: [
-                Expanded(child: buttons.first),
+                const Expanded(
+                  child: ButtonWidget(
+                    buttonType: ButtonType.secondary,
+                    buttonSize: ButtonSize.small,
+                    labelText: "Cancel",
+                    isInAlert: true,
+                  ),
+                ),
                 const SizedBox(width: 8),
                 const SizedBox(width: 8),
-                Expanded(child: buttons.last),
+                Expanded(
+                  child: ButtonWidget(
+                    buttonSize: ButtonSize.small,
+                    buttonType: ButtonType.neutral,
+                    labelText: widget.confirmationButtonLabel,
+                    onTap: _onTap,
+                    isInAlert: true,
+                  ),
+                ),
               ],
               ],
             )
             )
           ],
           ],
@@ -273,4 +300,8 @@ class TextInputDialog extends StatelessWidget {
       ),
       ),
     );
     );
   }
   }
+
+  Future<void> _onTap() async {
+    await widget.onConfirm.call(_textController.text);
+  }
 }
 }

+ 17 - 12
lib/ui/viewer/gallery/gallery_app_bar_widget.dart

@@ -115,18 +115,23 @@ class _GalleryAppBarWidgetState extends State<GalleryAppBarWidget> {
       context,
       context,
       title: "Title",
       title: "Title",
       message: "Message",
       message: "Message",
-      buttons: const [
-        ButtonWidget(
-          buttonType: ButtonType.secondary,
-          buttonSize: ButtonSize.small,
-          labelText: "Cancel",
-        ),
-        ButtonWidget(
-          buttonSize: ButtonSize.small,
-          buttonType: ButtonType.neutral,
-          labelText: "Rename",
-        ),
-      ],
+      confirmationButtonLabel: "Rename",
+      onConfirm: (String text) async {
+        // indicates user cancelled the rename request
+        if (text == "" || text.trim() == _appBarTitle!.trim()) {
+          return;
+        }
+
+        try {
+          await CollectionsService.instance.rename(widget.collection!, text);
+          if (mounted) {
+            _appBarTitle = text;
+            setState(() {});
+          }
+        } catch (e) {
+          showGenericErrorDialog(context: context);
+        }
+      },
     );
     );
     // final result = await showDialog<String>(
     // final result = await showDialog<String>(
     //   context: context,
     //   context: context,

+ 4 - 2
lib/utils/dialog_util.dart

@@ -255,10 +255,11 @@ showTextInputDialog(
   BuildContext context, {
   BuildContext context, {
   required String title,
   required String title,
   String? body,
   String? body,
-  required List<ButtonWidget> buttons,
+  required String confirmationButtonLabel,
   IconData? icon,
   IconData? icon,
   String? label,
   String? label,
   String? message,
   String? message,
+  required FutureVoidCallbackParamStr onConfirm,
 }) {
 }) {
   return showDialog(
   return showDialog(
     context: context,
     context: context,
@@ -270,7 +271,8 @@ showTextInputDialog(
           label: label,
           label: label,
           body: body,
           body: body,
           icon: icon,
           icon: icon,
-          buttons: buttons,
+          confirmationButtonLabel: confirmationButtonLabel,
+          onConfirm: onConfirm,
         ),
         ),
       );
       );
     },
     },