1759-get-rid-of-redundant-language-selection-error

lib/pangea/learning_settings/pages/settings_learning.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 
 import 'package:country_picker/country_picker.dart';
+import 'package:flutter_gen/gen_l10n/l10n.dart';
 
 import 'package:fluffychat/pangea/common/controllers/pangea_controller.dart';
 import 'package:fluffychat/pangea/learning_settings/enums/language_level_type_enum.dart';
@@ -26,6 +27,7 @@ class SettingsLearningController extends State<SettingsLearning> {
   final tts = TtsController();
 
   final GlobalKey<FormState> formKey = GlobalKey<FormState>();
+  String? languageMatchError;
 
   @override
   void initState() {
@@ -41,6 +43,18 @@ class SettingsLearningController extends State<SettingsLearning> {
   }
 
   Future<void> submit() async {
+    if (selectedSourceLanguage?.langCodeShort ==
+        selectedTargetLanguage?.langCodeShort) {
+      setState(() {
+        languageMatchError = L10n.of(context).noIdenticalLanguages;
+      });
+      return;
+    }
+
+    setState(() {
+      languageMatchError = null; // Clear error if languages don't match
+    });
+
     if (formKey.currentState!.validate()) {
       if (!isTTSSupported) {
         updateToolSetting(ToolSetting.enableTTS, false);

lib/pangea/learning_settings/pages/settings_learning_view.dart

@@ -72,15 +72,10 @@ class SettingsLearningView extends StatelessWidget {
                                     .pLanguageStore.baseOptions,
                                 isL2List: false,
                                 decorationText: L10n.of(context).myBaseLanguage,
-                                validator: (lang) {
-                                  if (lang?.langCodeShort ==
-                                      controller.selectedTargetLanguage
-                                          ?.langCodeShort) {
-                                    return L10n.of(context)
-                                        .noIdenticalLanguages;
-                                  }
-                                  return null;
-                                },
+                                hasError: controller.languageMatchError != null,
+                                backgroundColor: Theme.of(context)
+                                    .colorScheme
+                                    .surfaceContainerHigh,
                               ),
                               PLanguageDropdown(
                                 onChange: (lang) =>
@@ -93,15 +88,10 @@ class SettingsLearningView extends StatelessWidget {
                                     .pLanguageStore.targetOptions,
                                 isL2List: true,
                                 decorationText: L10n.of(context).iWantToLearn,
-                                validator: (lang) {
-                                  if (lang?.langCodeShort ==
-                                      controller.selectedSourceLanguage
-                                          ?.langCodeShort) {
-                                    return L10n.of(context)
-                                        .noIdenticalLanguages;
-                                  }
-                                  return null;
-                                },
+                                error: controller.languageMatchError,
+                                backgroundColor: Theme.of(context)
+                                    .colorScheme
+                                    .surfaceContainerHigh,
                               ),
                               CountryPickerDropdown(controller),
                               LanguageLevelDropdown(

lib/pangea/learning_settings/widgets/p_language_dropdown.dart

@@ -20,6 +20,7 @@ class PLanguageDropdown extends StatefulWidget {
   final String? error;
   final String? Function(LanguageModel?)? validator;
   final Color? backgroundColor;
+  final bool hasError;
 
   const PLanguageDropdown({
     super.key,
@@ -32,6 +33,7 @@ class PLanguageDropdown extends StatefulWidget {
     this.error,
     this.validator,
     this.backgroundColor,
+    this.hasError = false,
   });
 
   @override
@@ -79,6 +81,8 @@ class PLanguageDropdownState extends State<PLanguageDropdown> {
 
     sortedLanguages.sort((a, b) => sortLanguages(a, b));
 
+    final bool hasError = widget.error != null || widget.hasError;
+
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
@@ -91,7 +95,28 @@ class PLanguageDropdownState extends State<PLanguageDropdown> {
                   isDropdown: true,
                 )
               : null,
-          decoration: InputDecoration(labelText: widget.decorationText),
+          decoration: InputDecoration(
+            labelText: widget.decorationText,
+            border: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(36.0),
+            ),
+            enabledBorder: hasError
+                ? OutlineInputBorder(
+                    borderRadius: BorderRadius.circular(36.0),
+                    borderSide:
+                        BorderSide(color: Theme.of(context).colorScheme.error),
+                  )
+                : null,
+            focusedBorder: hasError
+                ? OutlineInputBorder(
+                    borderRadius: BorderRadius.circular(36.0),
+                    borderSide: BorderSide(
+                      color: Theme.of(context).colorScheme.error,
+                      width: 2,
+                    ),
+                  )
+                : null,
+          ),
           isExpanded: true,
           dropdownStyleData: DropdownStyleData(
             maxHeight: kIsWeb ? 500 : null,