Sort English and Spanish to the top of the language list

lib/pangea/widgets/user_settings/p_language_dropdown.dart

@@ -1,8 +1,8 @@
 // Flutter imports:
-import 'package:flutter/material.dart';
-
 // Project imports:
 import 'package:fluffychat/pangea/models/language_model.dart';
+import 'package:flutter/material.dart';
+
 import '../../widgets/flag.dart';
 
 class PLanguageDropdown extends StatefulWidget {
@@ -11,13 +11,13 @@ class PLanguageDropdown extends StatefulWidget {
   final Function(LanguageModel) onChange;
   final bool showMultilingual;
 
-  const PLanguageDropdown(
-      {Key? key,
-      required this.languages,
-      required this.onChange,
-      required this.initialLanguage,
-      this.showMultilingual = false})
-      : super(key: key);
+  const PLanguageDropdown({
+    super.key,
+    required this.languages,
+    required this.onChange,
+    required this.initialLanguage,
+    this.showMultilingual = false,
+  });
 
   @override
   State<PLanguageDropdown> createState() => _PLanguageDropdownState();
@@ -27,18 +27,32 @@ class _PLanguageDropdownState extends State<PLanguageDropdown> {
   @override
   Widget build(BuildContext context) {
     final List<LanguageModel> sortedLanguages = widget.languages;
-    sortedLanguages.sort((a, b) =>
-        a.getDisplayName(context)!.compareTo(b.getDisplayName(context)!));
+
+    int sortLanguages(LanguageModel a, LanguageModel b) {
+      if (a.langCode == 'en') {
+        return -1; // "English" comes first
+      } else if (b.langCode == 'en') {
+        return 1;
+      } else if (a.langCode == 'es') {
+        return -1; // "Spanish" comes second
+      } else if (b.langCode == 'es') {
+        return 1;
+      }
+      return a.getDisplayName(context)!.compareTo(b.getDisplayName(context)!);
+    }
+
+    sortedLanguages.sort((a, b) => sortLanguages(a, b));
 
     return Padding(
       padding: const EdgeInsets.all(12),
       child: Container(
         decoration: BoxDecoration(
-            border: Border.all(
-              color: Theme.of(context).colorScheme.secondary,
-              width: 0.5,
-            ),
-            borderRadius: const BorderRadius.all(Radius.circular(10))),
+          border: Border.all(
+            color: Theme.of(context).colorScheme.secondary,
+            width: 0.5,
+          ),
+          borderRadius: const BorderRadius.all(Radius.circular(10)),
+        ),
         child: DropdownButton<LanguageModel>(
           // Initial Value
           hint: Row(
@@ -55,11 +69,12 @@ class _PLanguageDropdownState extends State<PLanguageDropdown> {
               Text(
                 widget.initialLanguage.getDisplayName(context) ?? "",
                 style: const TextStyle().copyWith(
-                    color: Theme.of(context).textTheme.bodyLarge!.color,
-                    fontSize: 14),
+                  color: Theme.of(context).textTheme.bodyLarge!.color,
+                  fontSize: 14,
+                ),
                 overflow: TextOverflow.clip,
                 textAlign: TextAlign.center,
-              )
+              ),
             ],
           ),
 
@@ -71,19 +86,19 @@ class _PLanguageDropdownState extends State<PLanguageDropdown> {
           items: [
             if (widget.showMultilingual)
               DropdownMenuItem(
-                  value: LanguageModel.multiLingual(context),
-                  child: LanguageDropDownEntry(
-                    languageModel: LanguageModel.multiLingual(context),
-                  )),
-            ...sortedLanguages
-                .map(
-                  (languageModel) => DropdownMenuItem(
-                      value: languageModel,
-                      child: LanguageDropDownEntry(
-                        languageModel: languageModel,
-                      )),
-                )
-                .toList()
+                value: LanguageModel.multiLingual(context),
+                child: LanguageDropDownEntry(
+                  languageModel: LanguageModel.multiLingual(context),
+                ),
+              ),
+            ...sortedLanguages.map(
+              (languageModel) => DropdownMenuItem(
+                value: languageModel,
+                child: LanguageDropDownEntry(
+                  languageModel: languageModel,
+                ),
+              ),
+            ),
           ],
           onChanged: (value) => widget.onChange(value!),
         ),
@@ -95,9 +110,9 @@ class _PLanguageDropdownState extends State<PLanguageDropdown> {
 class LanguageDropDownEntry extends StatelessWidget {
   final LanguageModel languageModel;
   const LanguageDropDownEntry({
-    Key? key,
+    super.key,
     required this.languageModel,
-  }) : super(key: key);
+  });
 
   @override
   Widget build(BuildContext context) {
@@ -114,11 +129,12 @@ class LanguageDropDownEntry extends StatelessWidget {
           Text(
             languageModel.getDisplayName(context) ?? "",
             style: const TextStyle().copyWith(
-                color: Theme.of(context).textTheme.bodyLarge!.color,
-                fontSize: 14),
+              color: Theme.of(context).textTheme.bodyLarge!.color,
+              fontSize: 14,
+            ),
             overflow: TextOverflow.clip,
             textAlign: TextAlign.center,
-          )
+          ),
         ],
       ),
     );