From 9e3ad1a6be393ecbace0508eaab7a5a93eb2fd25 Mon Sep 17 00:00:00 2001
From: Destiny Saturday <84413505+DestinedCodes@users.noreply.github.com>
Date: Wed, 3 May 2023 08:29:17 +0100
Subject: [PATCH] feat: sync name on change (AppFlowy-IO#2033) (#2065)

---
 .../settings/widgets/settings_user_view.dart  | 42 ++++++++++++++++---
 1 file changed, 36 insertions(+), 6 deletions(-)

diff --git a/frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_user_view.dart b/frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_user_view.dart
index 6a57501804..826b4f12ca 100644
--- a/frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_user_view.dart
+++ b/frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_user_view.dart
@@ -1,4 +1,5 @@
 import 'dart:convert';
+import 'dart:async';
 
 import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/startup/startup.dart';
@@ -63,17 +64,34 @@ class SettingsUserView extends StatelessWidget {
 }
 
 @visibleForTesting
-class UserNameInput extends StatelessWidget {
+class UserNameInput extends StatefulWidget {
   final String name;
+
   const UserNameInput(
     this.name, {
     Key? key,
   }) : super(key: key);
 
+  @override
+  UserNameInputState createState() => UserNameInputState();
+}
+
+class UserNameInputState extends State<UserNameInput> {
+  late TextEditingController _controller;
+
+  Timer? _debounce;
+  final Duration _debounceDuration = const Duration(milliseconds: 500);
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = TextEditingController(text: widget.name);
+  }
+
   @override
   Widget build(BuildContext context) {
     return TextField(
-      controller: TextEditingController()..text = name,
+      controller: _controller,
       decoration: InputDecoration(
         labelText: LocaleKeys.settings_user_name.tr(),
         labelStyle: Theme.of(context)
@@ -88,13 +106,25 @@ class UserNameInput extends StatelessWidget {
           borderSide: BorderSide(color: Theme.of(context).colorScheme.primary),
         ),
       ),
-      onSubmitted: (val) {
-        context
-            .read<SettingsUserViewBloc>()
-            .add(SettingsUserEvent.updateUserName(val));
+      onChanged: (val) {
+        if (_debounce?.isActive ?? false) {
+          _debounce!.cancel();
+        }
+
+        _debounce = Timer(_debounceDuration, () {
+          context
+              .read<SettingsUserViewBloc>()
+              .add(SettingsUserEvent.updateUserName(val));
+        });
       },
     );
   }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
 }
 
 class _OpenaiKeyInput extends StatefulWidget {