Fix some issues with tabs tray

Following issues fixed in tabs tray:
* Place the tab indicator at the top for top tabs tray layout
* Disable reverse layout for compact tabs as it messes with the layout
* Make the new tab button visible in private mode in light theme

The third issue is a bug in upstream Fenix! They did not do sufficient
UI testing of the tabs tray!

app/src/main/java/org/mozilla/fenix/components/topsheet/TopSheetBehavior.kt

@@ -35,7 +35,7 @@ import kotlin.math.abs
 * limitations under the License.
 */ /**
  * An interaction behavior plugin for a child view of [CoordinatorLayout] to make it work as
- * a bottom sheet.
+ * a top sheet.
  */
 class TopSheetBehavior<V : View?>
 /**

app/src/main/java/org/mozilla/fenix/settings/CustomizationFragment.kt

@@ -9,10 +9,8 @@ import android.os.Build
 import android.os.Build.VERSION.SDK_INT
 import android.os.Bundle
 import androidx.appcompat.app.AppCompatDelegate
-import androidx.preference.EditTextPreference
+import androidx.core.content.edit
-import androidx.preference.PreferenceCategory
+import androidx.preference.*
-import androidx.preference.PreferenceFragmentCompat
-import androidx.preference.SwitchPreference
 import org.mozilla.fenix.FeatureFlags
 import org.mozilla.fenix.R
 import org.mozilla.fenix.components.metrics.Event
@@ -145,20 +143,38 @@ class CustomizationFragment : PreferenceFragmentCompat() {
     }
 
     private fun setupTabsTrayCategory() {
-        requirePreference<SwitchPreference>(R.string.pref_key_tabs_tray_compact_tab).apply {
-            isChecked = context.settings().enableCompactTabs
-            onPreferenceChangeListener = SharedPreferenceUpdater()
-        }
-
         requirePreference<SwitchPreference>(R.string.pref_key_tabs_tray_top_tray).apply {
             isChecked = context.settings().useTopTabsTray
             onPreferenceChangeListener = SharedPreferenceUpdater()
         }
 
-        requirePreference<SwitchPreference>(R.string.pref_key_tabs_tray_reverse_tab_order).apply {
+        val reverseOrderPref = requirePreference<SwitchPreference>(R.string.pref_key_tabs_tray_reverse_tab_order).apply {
-            isChecked = context.settings().reverseTabOrderInTabsTray
+            if (context.settings().enableCompactTabs) {
+                isChecked = false
+                isEnabled = false
+            } else {
+                isChecked = context.settings().reverseTabOrderInTabsTray
+                isEnabled = true
+            }
             onPreferenceChangeListener = SharedPreferenceUpdater()
         }
+
+        requirePreference<SwitchPreference>(R.string.pref_key_tabs_tray_compact_tab).apply {
+            isChecked = context.settings().enableCompactTabs
+
+            onPreferenceChangeListener = Preference.OnPreferenceChangeListener { preference, newValue ->
+                val newValueBoolean = newValue as Boolean
+                preference.context.settings().preferences.edit {
+                    putBoolean(preference.key, newValueBoolean)
+                    if (newValueBoolean) {
+                        reverseOrderPref.isChecked = false
+                        putBoolean(getString(R.string.pref_key_tabs_tray_reverse_tab_order), false)
+                    }
+                    reverseOrderPref.isEnabled = !newValueBoolean
+                }
+                true
+            }
+        }
     }
 
     private fun setupFabCategory() {

app/src/main/java/org/mozilla/fenix/tabtray/TabTrayView.kt

@@ -218,6 +218,8 @@ class TabTrayView(
                 // Put the 'Add to collections' button after the tabs have loaded.
                 // And, put the Synced Tabs adapter at the end.
                 if (reverseTabOrderInTabsTray) {
+                    // Put these at the start when reverse tab order is enabled. Also, we disallow
+                    // reverse tab order for compact tabs in settings.
                     concatAdapter.addAdapter(0, collectionsButtonAdapter)
                     concatAdapter.addAdapter(0, syncedTabsController.adapter)
                 } else {
@@ -330,32 +332,15 @@ class TabTrayView(
             if (enableCompactTabs) {
                 val gridLayoutManager = GridLayoutManager(container.context, gridViewNumberOfCols(container.context))
                 if (useTopTabsTray) {
-                    if (!reverseTabOrderInTabsTray) {
+                    gridLayoutManager.reverseLayout = true
-                        gridLayoutManager.reverseLayout = true
-                    }
-                } else {
-                    if (reverseTabOrderInTabsTray) {
-                        gridLayoutManager.reverseLayout = true
-                    }
                 }
                 gridLayoutManager.spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
                     override fun getSpanSize(position: Int): Int {
                         val numTabs = tabsAdapter.itemCount
-                        val totalItems = numTabs + collectionsButtonAdapter.itemCount +
+                        return if (position < numTabs) {
-                                syncedTabsController.adapter.itemCount
+                            1
-
-                        return if (reverseTabOrderInTabsTray) {
-                            if (totalItems - 1 - position < numTabs) {
-                                1
-                            } else {
-                                gridViewNumberOfCols(container.context)
-                            }
                         } else {
-                            if (position < numTabs) {
+                            gridViewNumberOfCols(container.context)
-                                1
-                            } else {
-                                gridViewNumberOfCols(container.context)
-                            }
                         }
                     }
                 }
@@ -664,18 +649,12 @@ class TabTrayView(
             val selectedBrowserTabIndex = tabs
                 .indexOfFirst { it.id == sessionId }
 
-            val recyclerViewIndex = if (reverseTabOrderInTabsTray && !enableCompactTabs) {
+            val recyclerViewIndex = if (reverseTabOrderInTabsTray) {
                 // For reverse tab order and non-compact tabs, we add the items in collections button
                 // adapter and synced tabs adapter, and offset by 1 to show the tab above the
                 // current tab, unless current tab is first in reverse order.
                 min(selectedBrowserTabIndex + 1, tabsAdapter.itemCount - 1) +
                         collectionsButtonAdapter.itemCount + syncedTabsController.adapter.itemCount
-            } else if (reverseTabOrderInTabsTray && enableCompactTabs) {
-                // For reverse tab order and compact tabs, we add the items in collections button
-                //  adapter and synced tabs adapter, and offset by -1 to show the tab above the
-                //  current tab, unless current tab is first in reverse order.
-                max(0, selectedBrowserTabIndex - 1 + collectionsButtonAdapter.itemCount +
-                    syncedTabsController.adapter.itemCount)
             } else {
                 // We offset index by -1 to show the tab above the current tab, unless current tab
                 // is the first.

app/src/main/res/drawable/ic_new.xml

@@ -8,6 +8,6 @@
     android:viewportWidth="24"
     android:viewportHeight="24">
     <path
-        android:fillColor="?primaryText"
+        android:fillColor="@color/primary_text_normal_theme"
         android:pathData="M13,4a1,1 0,1 0,-2 0v7H4a1,1 0,1 0,0 2h7v7a1,1 0,1 0,2 0v-7h7a1,1 0,1 0,0 -2h-7V4z" />
 </vector>

app/src/main/res/layout/component_tabstray_top.xml

@@ -108,6 +108,7 @@
             app:tabGravity="fill"
             app:tabIconTint="@color/tab_icon"
             app:tabIndicatorColor="@color/accent_normal_theme"
+            app:tabIndicatorGravity="top"
             app:tabRippleColor="@android:color/transparent">
 
             <com.google.android.material.tabs.TabItem