Fix MotionLayout animation the proper way

app/src/main/java/org/mozilla/fenix/home/HomeFragment.kt

@@ -16,11 +16,12 @@ import androidx.fragment.app.Fragment
 import androidx.navigation.Navigation
 import androidx.navigation.fragment.FragmentNavigator
 import kotlinx.android.synthetic.main.fragment_home.*
+import kotlinx.android.synthetic.main.fragment_home.view.*
 import org.mozilla.fenix.R
+import org.mozilla.fenix.ext.requireComponents
 import org.mozilla.fenix.home.sessions.SessionsComponent
 import org.mozilla.fenix.home.sessions.layoutComponents
 import org.mozilla.fenix.mvi.ActionBusFactory
-import org.mozilla.fenix.ext.requireComponents
 import kotlin.math.roundToInt
 
 class HomeFragment : Fragment() {
@@ -28,7 +29,9 @@ class HomeFragment : Fragment() {
         inflater: LayoutInflater, container: ViewGroup?,
         savedInstanceState: Bundle?
     ): View? {
-        return inflater.inflate(R.layout.fragment_home, container, false)
+        val view = inflater.inflate(R.layout.fragment_home, container, false)
+        SessionsComponent(view.homeLayout, ActionBusFactory.get(this)).setup()
+        return view
     }
 
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
@@ -43,8 +46,6 @@ class HomeFragment : Fragment() {
         toolbar.setOnClickListener { it ->
             Navigation.findNavController(it).navigate(R.id.action_homeFragment_to_searchFragment, null, null)
         }
-
-        SessionsComponent(homeLayout, ActionBusFactory.get(this)).setup()
         layoutComponents(homeLayout)
     }
 }

app/src/main/java/org/mozilla/fenix/home/sessions/SessionsLayouts.kt

@@ -2,6 +2,7 @@ package org.mozilla.fenix.home.sessions
 
 import androidx.constraintlayout.widget.ConstraintLayout
 import androidx.constraintlayout.widget.ConstraintLayout.LayoutParams.PARENT_ID
+import kotlinx.android.synthetic.main.component_sessions.*
 import kotlinx.android.synthetic.main.fragment_home.*
 import org.jetbrains.anko.constraint.layout.ConstraintSetBuilder.Side.*
 import org.jetbrains.anko.constraint.layout.applyConstraintSet

app/src/main/java/org/mozilla/fenix/home/sessions/SessionsUIView.kt

@@ -4,21 +4,27 @@
 
 package org.mozilla.fenix.home.sessions
 
+import android.view.LayoutInflater
 import android.view.ViewGroup
 import androidx.recyclerview.widget.LinearLayoutManager
+import androidx.recyclerview.widget.RecyclerView
 import io.reactivex.functions.Consumer
-import kotlinx.android.synthetic.main.fragment_home.*
+import org.mozilla.fenix.R
 import org.mozilla.fenix.mvi.ActionBusFactory
 import org.mozilla.fenix.mvi.UIView
 
-class SessionsUIView(container: ViewGroup, bus: ActionBusFactory) : UIView<SessionsState>(container, bus) {
+class SessionsUIView(container: ViewGroup, bus: ActionBusFactory) :
+    UIView<SessionsState>(container, bus) {
 
-    private var sessionAdapter = SessionsAdapter()
+    override val view: RecyclerView = LayoutInflater.from(container.context)
+        .inflate(R.layout.component_sessions, container, true)
+        .findViewById(R.id.session_list)
 
+    private val sessionsAdapter = SessionsAdapter()
     init {
-        session_list.apply {
+        view.apply {
             layoutManager = LinearLayoutManager(container.context)
-            adapter = sessionAdapter
+            adapter = sessionsAdapter
         }
     }
 

app/src/main/java/org/mozilla/fenix/mvi/UIComponent.kt

@@ -23,7 +23,7 @@ abstract class UIComponent<S: ViewState, A: Action, C: Change>(open val bus: Act
      * Render the ViewState to the View through the Reducer
      */
     inline fun <reified C : Change> render(noinline reducer: Reducer<S, C>): Disposable =
-        bus.getSafeManagedObservable(C::class.java)
+        getModelChangeEvents<C>()
             .scan(initialState, reducer)
             .distinctUntilChanged()
             .subscribeOn(Schedulers.io())

app/src/main/java/org/mozilla/fenix/mvi/UIView.kt

@@ -13,6 +13,9 @@ import kotlinx.android.extensions.LayoutContainer
 abstract class UIView<S : ViewState>(
     private val container: ViewGroup, val bus: ActionBusFactory
 ) : LayoutContainer {
+
+    abstract val view: View
+
     /**
      * Get the XML id for the UIView
      */
@@ -29,12 +32,12 @@ abstract class UIView<S : ViewState>(
     /**
      * Show the UIView
      */
-    open fun show() { container.visibility = View.VISIBLE }
+    open fun show() { view.visibility = View.VISIBLE }
 
     /**
      * Hide the UIView
      */
-    open fun hide() { container.visibility = View.GONE }
+    open fun hide() { view.visibility = View.GONE }
 
     /**
      * Update the view from the ViewState

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

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.recyclerview.widget.RecyclerView
+        xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"
+        android:id="@+id/session_list"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:layout_margin="16dp"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/toolbar_wrapper"/>

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

@@ -70,16 +70,4 @@
                 android:textSize="14sp" />
     </org.mozilla.fenix.home.SearchView>
 
-    <androidx.recyclerview.widget.RecyclerView
-            xmlns:android="http://schemas.android.com/apk/res/android"
-            xmlns:app="http://schemas.android.com/apk/res-auto"
-            android:id="@+id/session_list"
-            android:layout_width="0dp"
-            android:layout_height="0dp"
-            android:layout_margin="16dp"
-            app:layout_constraintTop_toBottomOf="@id/toolbar_wrapper"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintEnd_toEndOf="parent"/>
-
 </androidx.constraintlayout.motion.widget.MotionLayout>

app/src/main/res/xml/home_scene.xml

@@ -81,12 +81,12 @@
     <ConstraintSet android:id="@+id/end">
         <Constraint
                 android:id="@+id/wordmark"
-                android:layout_marginLeft="16dp"
+                android:layout_marginStart="16dp"
                 android:layout_marginTop="12dp"
                 android:alpha="0"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                motion:layout_constraintLeft_toLeftOf="parent"
+                motion:layout_constraintStart_toStartOf="parent"
                 motion:layout_constraintTop_toTopOf="parent" />
 
         <Constraint
@@ -94,11 +94,11 @@
             android:layout_marginTop="16dp"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
-            android:layout_marginLeft="16dp"
+            android:layout_marginStart="16dp"
-            android:layout_marginRight="16dp"
+            android:layout_marginEnd="16dp"
             motion:layout_constraintTop_toTopOf="parent"
-            motion:layout_constraintLeft_toLeftOf="parent"
+            motion:layout_constraintStart_toStartOf="parent"
-            motion:layout_constraintRight_toRightOf="parent"
+            motion:layout_constraintEnd_toEndOf="parent"
             android:elevation="0dp"/>
 
         <Constraint