Fixed border radius on country picker and CEFR level, added descripti… (#2539)

* Fixed border radius on country picker and CEFR level, added description to CEFR level and arb files

* generated

* chore: move language level title and descriptions into enum extension

* chore: some spacing fixes

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: ggurdin <ggurdin@gmail.com>

assets/l10n/intl_en.arb

@@ -4867,6 +4867,13 @@
   "shareSpaceLink": "Share link to space",
   "byUsingPangeaChat": "By using Pangea Chat, I agree to the ",
   "details": "Details",
+  "languageLevelPreA1Desc": "I have never learned or used the language.",
+  "languageLevelA1Desc": "I can understand and use some familiar everyday expressions and very basic phrases.",
+  "languageLevelA2Desc": "I can understand sentences and frequently used expressions related to areas of immediate relevance",
+  "languageLevelB1Desc": "I can deal with most familiar situations and can produce simple connected text on familiar topics.",
+  "languageLevelB2Desc": "I can understand the mains ideas of complex texts and interact with a degree of fluency and spontaneity.",
+  "languageLevelC1Desc": "I can express ideas fluently and spontaneously without much struggle and understand a wide range of demanding texts.",
+  "languageLevelC2Desc": "I can understand virtually everything heard or read and express myself fluently and precisely.",
   "newVocab": "New vocab",
   "newGrammar": "New grammar concepts"
 }

lib/pangea/chat_settings/utils/language_level_copy.dart

@@ -1,30 +0,0 @@
-import 'package:flutter/material.dart';
-
-import 'package:flutter_gen/gen_l10n/l10n.dart';
-
-import 'package:fluffychat/pangea/learning_settings/enums/language_level_type_enum.dart';
-
-class LanguageLevelTextPicker {
-  static String languageLevelText(
-    BuildContext context,
-    LanguageLevelTypeEnum languageLevel,
-  ) {
-    final L10n copy = L10n.of(context);
-    switch (languageLevel) {
-      case LanguageLevelTypeEnum.preA1:
-        return copy.languageLevelPreA1;
-      case LanguageLevelTypeEnum.a1:
-        return copy.languageLevelA1;
-      case LanguageLevelTypeEnum.a2:
-        return copy.languageLevelA2;
-      case LanguageLevelTypeEnum.b1:
-        return copy.languageLevelB1;
-      case LanguageLevelTypeEnum.b2:
-        return copy.languageLevelB2;
-      case LanguageLevelTypeEnum.c1:
-        return copy.languageLevelC1;
-      case LanguageLevelTypeEnum.c2:
-        return copy.languageLevelC2;
-    }
-  }
-}

lib/pangea/chat_settings/widgets/language_level_dropdown.dart

@@ -4,7 +4,6 @@ import 'package:flutter/material.dart';
 import 'package:dropdown_button2/dropdown_button2.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
 
-import 'package:fluffychat/pangea/chat_settings/utils/language_level_copy.dart';
 import 'package:fluffychat/pangea/common/widgets/dropdown_text_button.dart';
 import 'package:fluffychat/pangea/learning_settings/enums/language_level_type_enum.dart';
 
@@ -26,21 +25,22 @@ class LanguageLevelDropdown extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final l10n = L10n.of(context);
+
     return DropdownButtonFormField2<LanguageLevelTypeEnum>(
       customButton: initialLevel != null &&
               LanguageLevelTypeEnum.values.contains(initialLevel)
-          ? CustomDropdownTextButton(
+          ? CustomDropdownTextButton(text: initialLevel!.title(context))
-              text: LanguageLevelTextPicker.languageLevelText(
-                context,
-                initialLevel!,
-              ),
-            )
           : null,
       menuItemStyleData: const MenuItemStyleData(
-        padding: EdgeInsets.zero, // Remove default padding
+        padding: EdgeInsets.symmetric(
+          vertical: 8.0,
+          horizontal: 16.0,
+        ),
+        height: 100.0,
       ),
       decoration: InputDecoration(
-        labelText: L10n.of(context).cefrLevelLabel,
+        labelText: l10n.cefrLevelLabel,
       ),
       isExpanded: true,
       dropdownStyleData: DropdownStyleData(
@@ -48,23 +48,38 @@ class LanguageLevelDropdown extends StatelessWidget {
         decoration: BoxDecoration(
           color: backgroundColor ??
               Theme.of(context).colorScheme.surfaceContainerHigh,
+          borderRadius: BorderRadius.circular(14.0),
         ),
       ),
       items:
           LanguageLevelTypeEnum.values.map((LanguageLevelTypeEnum levelOption) {
         return DropdownMenuItem(
           value: levelOption,
-          child: DropdownTextButton(
+          child: Column(
-            text: LanguageLevelTextPicker.languageLevelText(
+            crossAxisAlignment: CrossAxisAlignment.start,
-              context,
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-              levelOption,
+            mainAxisSize: MainAxisSize.min,
-            ),
+            children: [
-            isSelected: initialLevel == levelOption,
+              Text(levelOption.title(context)),
+              Flexible(
+                child: Text(
+                  levelOption.description(context),
+                  style: TextStyle(
+                    color: Theme.of(context).colorScheme.onSurfaceVariant,
+                    fontSize: 14,
+                  ),
+                  maxLines: 5,
+                  overflow: TextOverflow.ellipsis,
+                ),
+              ),
+            ],
           ),
         );
       }).toList(),
       onChanged: enabled
-          ? (value) => onChanged?.call(value as LanguageLevelTypeEnum)
+          ? (value) {
+              if (value != null) onChanged?.call(value);
+            }
           : null,
       value: initialLevel,
       validator: validator,

lib/pangea/learning_settings/enums/language_level_type_enum.dart

@@ -1,3 +1,7 @@
+import 'package:flutter/material.dart';
+
+import 'package:flutter_gen/gen_l10n/l10n.dart';
+
 enum LanguageLevelTypeEnum { preA1, a1, a2, b1, b2, c1, c2 }
 
 extension LanguageLevelTypeEnumExtension on LanguageLevelTypeEnum {
@@ -84,4 +88,44 @@ extension LanguageLevelTypeEnumExtension on LanguageLevelTypeEnum {
         return LanguageLevelTypeEnum.a1;
     }
   }
+
+  String title(BuildContext context) {
+    final L10n copy = L10n.of(context);
+    switch (this) {
+      case LanguageLevelTypeEnum.preA1:
+        return copy.languageLevelPreA1;
+      case LanguageLevelTypeEnum.a1:
+        return copy.languageLevelA1;
+      case LanguageLevelTypeEnum.a2:
+        return copy.languageLevelA2;
+      case LanguageLevelTypeEnum.b1:
+        return copy.languageLevelB1;
+      case LanguageLevelTypeEnum.b2:
+        return copy.languageLevelB2;
+      case LanguageLevelTypeEnum.c1:
+        return copy.languageLevelC1;
+      case LanguageLevelTypeEnum.c2:
+        return copy.languageLevelC2;
+    }
+  }
+
+  String description(BuildContext context) {
+    final L10n copy = L10n.of(context);
+    switch (this) {
+      case LanguageLevelTypeEnum.preA1:
+        return copy.languageLevelPreA1Desc;
+      case LanguageLevelTypeEnum.a1:
+        return copy.languageLevelA1Desc;
+      case LanguageLevelTypeEnum.a2:
+        return copy.languageLevelA2Desc;
+      case LanguageLevelTypeEnum.b1:
+        return copy.languageLevelB1Desc;
+      case LanguageLevelTypeEnum.b2:
+        return copy.languageLevelB2Desc;
+      case LanguageLevelTypeEnum.c1:
+        return copy.languageLevelC1Desc;
+      case LanguageLevelTypeEnum.c2:
+        return copy.languageLevelC2Desc;
+    }
+  }
 }

lib/pangea/learning_settings/widgets/country_picker_tile.dart

@@ -53,7 +53,7 @@ class CountryPickerDropdownState extends State<CountryPickerDropdown> {
       dropdownStyleData: DropdownStyleData(
         maxHeight: kIsWeb ? 500 : null,
         decoration: BoxDecoration(
-          // borderRadius: BorderRadius.circular(14),
+          borderRadius: BorderRadius.circular(14.0),
           color: Theme.of(context).colorScheme.surfaceContainerHigh,
         ),
       ),