flag order

Author: AzGasim

packages/localization/resources/views/filament/tables/columns/translations.blade.php

@@ -1,5 +1,5 @@
 @php
-    $flags = $getState(); // Example: More than 4 flags
+    $flags = $getState();
     $visibleFlags = [];
     $remainingFlags = 0;
     $currentLang = $this->lang ?? request()->get('lang', app()->getLocale());
@@ -9,9 +9,11 @@
             $currentLangFlag = null;
             $otherFlags = [];
 
-            foreach ($flags as $flag) {
-                $flagLang = str_replace('flag-', '', str_replace(' trashed', '', $flag));
-                if ($flagLang === $currentLang) {
+            foreach ($flags as $flagData) {
+                $flag = $flagData['flag'];
+                $locale = $flagData['locale'];
+
+                if ($locale === $currentLang) {
                     $currentLangFlag = $flag;
                 } else {
                     $otherFlags[] = $flag;
@@ -23,7 +25,7 @@
                 $otherVisibleFlags = array_slice($otherFlags, 0, 2);
                 $visibleFlags = array_merge($visibleFlags, $otherVisibleFlags);
             } else {
-                $visibleFlags = array_slice($flags, 0, 3);
+                $visibleFlags = array_slice(array_column($flags, 'flag'), 0, 3);
             }
 
             $remainingFlags = max(0, count($flags) - count($visibleFlags));
@@ -32,30 +34,27 @@
         $visibleFlags = [];
         $remainingFlags = 0;
     }
-    $visibleFlags = array_reverse($visibleFlags);
 @endphp
 <x-filament-forms::field-wrapper>
     <div style="padding-left: 30%; position: relative; height: 28px; min-width: 66px;">
         <div style="position: relative; height: 28px; min-width: 66px;">
-            @foreach($visibleFlags as $revIndex => $flag)
-                @php 
-                                                        $index = count($visibleFlags) - 1 - $revIndex;
-                    $isTrashed = str_contains($flag, 'trashed');
-                    $flagComponent = str_replace(' trashed', '', $flag);
-                @endphp
-                                        <span style="position: absolute; left: {{ $index * 18 }}px; z-index: {{ 10 + $index }};">
-                                                            <x-dynamic-component :component="$flagComponent"
-                                                style="width: 24px; height: 24px; border-radius: 50%; background: #fff;" />
-                </span>
+            @foreach($visibleFlags as $index => $flag)
+                    @php 
+                                                        $isTrashed = str_contains($flag, 'trashed');
+                        $flagComponent = str_replace(' trashed', '', $flag);
+                    @endphp
+                <span style="position: absolute; left: {{ $index * 18 }}px; z-index: {{ 10 + $index }};">
+                                <x-dynamic-component :component="$flagComponent"
+                                            style="width: 24px; height: 24px; border-radius: 50%; background: #fff;" />
+                            </span>
             @endforeach
-@if($remainingFlags > 0)
-    <span style="position: absolute; left: {{ (count($visibleFlags) * 18) + 8 }}px; z-index: 20;">
-                    <div
-                                                class="flex items-center justify-center w-6 h-6 text-sm font-bold text-black rounded-full bg-white border border-gray-300">
-                            +{{ $remainingFlags }}
-                        </div>
-                    </span>
-@endif
+    @if($remainingFlags > 0)
+        <span style="position: absolute; left: {{ (count($visibleFlags) * 18) + 8 }}px; z-index: 20;">
+            <div class="flex items-center justify-center w-6 h-6 text-sm font-bold text-black rounded-full bg-white border border-gray-300">
+                        +{{ $remainingFlags }}
+            </div>
+        </span>
+    @endif
         </div>
     </div>
 </x-filament-forms::field-wrapper>

packages/localization/src/Filament/Tables/Columns/TranslationColumn.php

@@ -38,7 +38,10 @@ protected function setUp(): void
                         $flagClass .= ' trashed';
                     }
 
-                    return $flagClass;
+                    return [
+                        'flag' => $flagClass,
+                        'locale' => $translation->locale,
+                    ];
                 })->toArray();
 
                 return $flags;