Handle done and cancel button

lib/ui/components/keyboard/keyboard_top_button.dart

@@ -3,8 +3,8 @@ import 'package:flutter/material.dart';
 import 'package:photos/theme/ente_theme.dart';
 
 class KeyboardTopButton extends StatelessWidget {
-  final Function? onDoneTap;
-  final Function? onCancelTap;
+  final VoidCallback? onDoneTap;
+  final VoidCallback? onCancelTap;
   final String doneText;
   final String cancelText;
 
@@ -36,16 +36,12 @@ class KeyboardTopButton extends StatelessWidget {
           children: [
             CupertinoButton(
               padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 14),
-              onPressed: () {
-                onCancelTap?.call();
-              },
+              onPressed: onCancelTap,
               child: Text(cancelText, style: enteTheme.bodyBold),
             ),
             CupertinoButton(
               padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 14),
-              onPressed: () {
-                onDoneTap?.call();
-              },
+              onPressed: onDoneTap,
               child: Text(doneText, style: enteTheme.bodyBold),
             ),
           ],

lib/ui/viewer/file/file_caption_widget.dart

@@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
 import 'package:photos/core/constants.dart';
 import 'package:photos/models/file.dart';
 import 'package:photos/theme/ente_theme.dart';
+import 'package:photos/ui/components/keyboard/keybiard_oveylay.dart';
+import 'package:photos/ui/components/keyboard/keyboard_top_button.dart';
 import 'package:photos/utils/magic_util.dart';
 
 class FileCaptionWidget extends StatefulWidget {
@@ -18,10 +20,12 @@ class _FileCaptionWidgetState extends State<FileCaptionWidget> {
   // currentLength/maxLength will show up
   static const int counterThreshold = 1000;
   int currentLength = 0;
+
   final _textController = TextEditingController();
   final _focusNode = FocusNode();
   String? editedCaption;
   String hintText = fileCaptionDefaultHint;
+  Widget? keyboardTopButtoms;
 
   @override
   void initState() {
@@ -49,15 +53,7 @@ class _FileCaptionWidgetState extends State<FileCaptionWidget> {
     final textTheme = getEnteTextTheme(context);
     return TextField(
       onSubmitted: (value) async {
-        if (editedCaption != null) {
-          final isSuccesful =
-              await editFileCaption(context, widget.file, editedCaption);
-          if (isSuccesful) {
-            if (mounted) {
-              Navigator.pop(context);
-            }
-          }
-        }
+        await _onDoneClick(context);
       },
       controller: _textController,
       focusNode: _focusNode,
@@ -94,7 +90,7 @@ class _FileCaptionWidgetState extends State<FileCaptionWidget> {
       minLines: 1,
       maxLines: 10,
       textCapitalization: TextCapitalization.sentences,
-      keyboardType: TextInputType.text,
+      keyboardType: TextInputType.multiline,
       onChanged: (value) {
         setState(() {
           hintText = fileCaptionDefaultHint;
@@ -105,11 +101,48 @@ class _FileCaptionWidgetState extends State<FileCaptionWidget> {
     );
   }
 
+  Future<void> _onDoneClick(BuildContext context) async {
+    if (editedCaption != null) {
+      final isSuccesful =
+          await editFileCaption(context, widget.file, editedCaption);
+      if (isSuccesful) {
+        if (mounted) {
+          Navigator.pop(context);
+        }
+      }
+    }
+  }
+
+  void onCancelTap() {
+    _focusNode.unfocus();
+    if (widget.file.caption != null) {
+      _textController.text = widget.file.caption!;
+    }
+    editedCaption = null;
+  }
+
+  void onDoneTap() {
+    _focusNode.unfocus();
+    _onDoneClick(context);
+  }
+
   void _focusNodeListener() {
     final caption = widget.file.caption;
     if (_focusNode.hasFocus && caption != null) {
       _textController.text = caption;
       editedCaption = caption;
     }
+    final bool hasFocus = _focusNode.hasFocus;
+    keyboardTopButtoms ??= KeyboardTopButton(
+      onDoneTap: onDoneTap,
+      onCancelTap: onCancelTap,
+    );
+    if (hasFocus) {
+      KeyboardOverlay.showOverlay(context, keyboardTopButtoms!);
+    } else {
+      debugPrint("Removing listener");
+
+      KeyboardOverlay.removeOverlay();
+    }
   }
 }