fix: long text doesn't wrap to another line

ice-blockchain · Dec 12, 2024 · 436bb43 · 436bb43
1 parent 3107055
commit 436bb43
Showing 1 changed file with 62 additions and 40 deletions.
diff --git a/...eatures/feed/stories/views/components/story_viewer/components/core/story_input_field.dart b/...eatures/feed/stories/views/components/story_viewer/components/core/story_input_field.dart
@@ -4,10 +4,12 @@ import 'dart:ui';
 
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:ion/app/extensions/extensions.dart';
+import 'package:ion/app/features/feed/stories/providers/story_pause_provider.c.dart';
 import 'package:ion/app/features/feed/views/components/toolbar_buttons/toolbar_send_button.dart';
 
-class StoryInputField extends HookWidget {
+class StoryInputField extends HookConsumerWidget {
   const StoryInputField({
     required this.controller,
     required this.bottomPadding,
@@ -18,10 +20,23 @@ class StoryInputField extends HookWidget {
   final double bottomPadding;
 
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     final isTextNotEmpty = useState(false);
     final focusNode = useFocusNode();
 
+    useEffect(
+      () {
+        focusNode.addListener(
+          () => focusNode.hasFocus
+              ? ref.read(storyPauseControllerProvider.notifier).paused = true
+              : ref.read(storyPauseControllerProvider.notifier).paused = false,
+        );
+
+        return null;
+      },
+      [],
+    );
+
     useEffect(
       () {
         void onTextChanged() {
@@ -51,47 +66,54 @@ class StoryInputField extends HookWidget {
             ),
             child: ClipRRect(
               borderRadius: BorderRadius.circular(16.0.s),
-              child: SizedBox(
-                height: 36.0.s,
+              child: Container(
+                constraints: BoxConstraints(
+                  minHeight: 36.0.s,
+                ),
                 child: BackdropFilter(
                   filter: ImageFilter.blur(sigmaX: 3, sigmaY: 3),
-                  child: TextField(
-                    cursorColor: context.theme.appColors.onPrimaryAccent,
-                    controller: controller,
-                    focusNode: focusNode,
-                    decoration: InputDecoration(
-                      filled: true,
-                      fillColor: context.theme.appColors.primaryText.withOpacity(0.5),
-                      contentPadding: EdgeInsets.symmetric(
-                        horizontal: 12.0.s,
-                        vertical: 9.0.s,
-                      ),
-                      border: OutlineInputBorder(
-                        borderRadius: BorderRadius.circular(16.0.s),
-                        borderSide: BorderSide.none,
-                      ),
-                      suffixIcon: isTextNotEmpty.value
-                          ? Padding(
-                              padding: EdgeInsets.only(
-                                top: 4.0.s,
-                                bottom: 4.0.s,
-                                right: 4.0.s,
-                              ),
-                              child: ToolbarSendButton(
-                                enabled: true,
-                                onPressed: () {},
-                              ),
-                            )
-                          : null,
-                      hintText: context.i18n.write_a_message,
-                      hintStyle: context.theme.appTextThemes.body2.copyWith(
-                        color: context.theme.appColors.onPrimaryAccent,
+                  child: Stack(
+                    children: [
+                      TextField(
+                        minLines: 1,
+                        maxLines: 4,
+                        scrollPhysics: const BouncingScrollPhysics(),
+                        cursorColor: context.theme.appColors.onPrimaryAccent,
+                        controller: controller,
+                        focusNode: focusNode,
+                        decoration: InputDecoration(
+                          filled: true,
+                          fillColor: context.theme.appColors.primaryText.withOpacity(0.5),
+                          contentPadding: EdgeInsets.only(
+                            left: 12.0.s,
+                            top: 9.0.s,
+                            bottom: 9.0.s,
+                            right: 58.0.s,
+                          ),
+                          border: OutlineInputBorder(
+                            borderRadius: BorderRadius.circular(16.0.s),
+                            borderSide: BorderSide.none,
+                          ),
+                          hintText: context.i18n.write_a_message,
+                          hintStyle: context.theme.appTextThemes.body2.copyWith(
+                            color: context.theme.appColors.onPrimaryAccent,
+                          ),
+                          isDense: true,
+                        ),
+                        style: context.theme.appTextThemes.body2.copyWith(
+                          color: context.theme.appColors.onPrimaryAccent,
+                        ),
                       ),
-                      isDense: true,
-                    ),
-                    style: context.theme.appTextThemes.body2.copyWith(
-                      color: context.theme.appColors.onPrimaryAccent,
-                    ),
+                      if (isTextNotEmpty.value)
+                        Positioned(
+                          bottom: 4.0.s,
+                          right: 4.0.s,
+                          child: ToolbarSendButton(
+                            enabled: true,
+                            onPressed: () {},
+                          ),
+                        ),
+                    ],
                   ),
                 ),
               ),