From 3e31e9326a781258448d55dac4efe8fd3c32410f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?L=E2=89=A1ZRS?= <12814349+LZRS@users.noreply.github.com>
Date: Thu, 26 Oct 2023 12:37:31 +0300
Subject: [PATCH] Shared layout for bottom navigation items, for scroll and
 sticky

---
 .../datacapture/QuestionnaireAdapterItem.kt   |   2 +-
 .../datacapture/QuestionnaireEditAdapter.kt   |   4 +-
 .../fhir/datacapture/QuestionnaireFragment.kt |  87 ++++++-----
 .../QuestionnaireNavigationViewUIState.kt     |  33 ++++
 .../QuestionnairePageNavigationState.kt       |  32 ----
 .../datacapture/QuestionnaireReviewAdapter.kt |   2 +-
 .../datacapture/QuestionnaireViewModel.kt     | 142 +++++++++---------
 .../datacapture/views/NavigationViewHolder.kt |  56 +++----
 .../res/layout/pagination_navigation_view.xml |  12 +-
 .../res/layout/questionnaire_fragment.xml     |  90 +----------
 .../datacapture/QuestionnaireViewModelTest.kt |   6 +-
 11 files changed, 202 insertions(+), 264 deletions(-)
 create mode 100644 datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireNavigationViewUIState.kt
 delete mode 100644 datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnairePageNavigationState.kt

diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireAdapterItem.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireAdapterItem.kt
index 25e9b607ef..b0ae4b85f0 100644
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireAdapterItem.kt
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireAdapterItem.kt
@@ -23,6 +23,6 @@ internal sealed interface QuestionnaireAdapterItem {
   /** A row for a question in a Questionnaire RecyclerView. */
   data class Question(val item: QuestionnaireViewItem) : QuestionnaireAdapterItem
 
-  data class Navigation(val questionnairePageNavigationState: QuestionnairePageNavigationState) :
+  data class Navigation(val questionnaireNavigationUIState: QuestionnaireNavigationUIState) :
     QuestionnaireAdapterItem
 }
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireEditAdapter.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireEditAdapter.kt
index b34b17da89..b7b9939ae6 100644
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireEditAdapter.kt
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireEditAdapter.kt
@@ -115,7 +115,7 @@ internal class QuestionnaireEditAdapter(
       }
       is QuestionnaireAdapterItem.Navigation -> {
         holder as NavigationViewHolder
-        holder.bind(item.questionnairePageNavigationState)
+        holder.bind(item.questionnaireNavigationUIState)
       }
     }
   }
@@ -293,7 +293,7 @@ internal object DiffCallbacks {
           }
           is QuestionnaireAdapterItem.Navigation -> {
             newItem is QuestionnaireAdapterItem.Navigation &&
-              oldItem.questionnairePageNavigationState == newItem.questionnairePageNavigationState
+              oldItem.questionnaireNavigationUIState == newItem.questionnaireNavigationUIState
           }
         }
     }
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireFragment.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireFragment.kt
index 63aea13a1b..2b82552736 100644
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireFragment.kt
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireFragment.kt
@@ -21,7 +21,6 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import androidx.annotation.VisibleForTesting
 import androidx.appcompat.view.ContextThemeWrapper
 import androidx.core.content.res.use
@@ -93,8 +92,9 @@ class QuestionnaireFragment : Fragment() {
       view.findViewById<RecyclerView>(R.id.questionnaire_edit_recycler_view)
     val questionnaireReviewRecyclerView =
       view.findViewById<RecyclerView>(R.id.questionnaire_review_recycler_view)
-    val bottomNavGroup = view.findViewById<View>(R.id.bottom_nav_group)
-    view.findViewById<Button>(R.id.cancel_questionnaire).setOnClickListener {
+    val bottomNavGroup = view.findViewById<View>(R.id.questionnaire_bottom_view_container)
+
+    viewModel.setOnCancelButtonClickListener {
       QuestionnaireCancelDialogFragment()
         .show(requireActivity().supportFragmentManager, QuestionnaireCancelDialogFragment.TAG)
     }
@@ -119,8 +119,6 @@ class QuestionnaireFragment : Fragment() {
       QuestionnaireEditAdapter(questionnaireItemViewHolderFactoryMatchersProvider.get())
     val questionnaireReviewAdapter = QuestionnaireReviewAdapter()
 
-    val cancelButton = requireView().findViewById<Button>(R.id.cancel_questionnaire)
-
     val reviewModeEditButton =
       view.findViewById<View>(R.id.review_mode_edit_button).apply {
         setOnClickListener { viewModel.setReviewMode(false) }
@@ -138,20 +136,23 @@ class QuestionnaireFragment : Fragment() {
     // Listen to updates from the view model.
     viewLifecycleOwner.lifecycleScope.launchWhenCreated {
       viewModel.questionnaireStateFlow.collect { state ->
-        updateQuestionnairePageViewNavigation(bottomNavGroup, state.pageNavigationState)
-
         when (val displayMode = state.displayMode) {
           is DisplayMode.ReviewMode -> {
             // Set items
             questionnaireEditRecyclerView.visibility = View.GONE
+            val itemsData =
+              if (displayMode.showNavAsScroll) {
+                bottomNavGroup.visibility = View.GONE
+                state.items + QuestionnaireAdapterItem.Navigation(state.bottomNavigation)
+              } else {
+                updateNavigation(bottomNavGroup, state.bottomNavigation)
+                state.items
+              }
             questionnaireReviewAdapter.submitList(
-              state.items,
+              itemsData,
             )
             questionnaireReviewRecyclerView.visibility = View.VISIBLE
 
-            // Set button visibility
-            cancelButton.visibility = if (displayMode.showCancelButton) View.VISIBLE else View.GONE
-
             reviewModeEditButton.visibility =
               if (displayMode.showEditButton) {
                 View.VISIBLE
@@ -165,12 +166,16 @@ class QuestionnaireFragment : Fragment() {
           is DisplayMode.EditMode -> {
             // Set items
             questionnaireReviewRecyclerView.visibility = View.GONE
-            questionnaireEditAdapter.submitList(state.items)
+            val itemsData =
+              if (displayMode.showNavAsScroll) {
+                bottomNavGroup.visibility = View.GONE
+                state.items + QuestionnaireAdapterItem.Navigation(state.bottomNavigation)
+              } else {
+                updateNavigation(bottomNavGroup, state.bottomNavigation)
+                state.items
+              }
+            questionnaireEditAdapter.submitList(itemsData)
             questionnaireEditRecyclerView.visibility = View.VISIBLE
-
-            // Set button visibility
-            cancelButton.visibility =
-              if (displayMode.pagination.showCancelButton) View.VISIBLE else View.GONE
             reviewModeEditButton.visibility = View.GONE
 
             // Set progress indicator
@@ -206,8 +211,8 @@ class QuestionnaireFragment : Fragment() {
             questionnaireReviewRecyclerView.visibility = View.GONE
             questionnaireEditRecyclerView.visibility = View.GONE
             questionnaireProgressIndicator.visibility = View.GONE
-            cancelButton.visibility = View.GONE
             reviewModeEditButton.visibility = View.GONE
+            bottomNavGroup.visibility = View.GONE
           }
         }
       }
@@ -252,45 +257,49 @@ class QuestionnaireFragment : Fragment() {
     }
   }
 
-  internal fun updateQuestionnairePageViewNavigation(
+  internal fun updateNavigation(
     navigationViewGroup: View,
-    questionnairePageNavigationState: QuestionnairePageNavigationState?,
+    questionnaireNavigationUIState: QuestionnaireNavigationUIState?,
   ) {
-    if (questionnairePageNavigationState == null) {
+    if (questionnaireNavigationUIState == null) {
       navigationViewGroup.visibility = View.GONE
       return
     }
 
-    fun View.updateState(navigationViewState: QuestionnaireNavigationViewState) {
-      when (navigationViewState) {
-        QuestionnaireNavigationViewState.Disabled -> {
-          visibility = View.VISIBLE
-          isEnabled = false
-        }
-        is QuestionnaireNavigationViewState.Enabled -> {
-          visibility = View.VISIBLE
-          isEnabled = true
-          setOnClickListener { navigationViewState.onClickAction() }
-        }
-        QuestionnaireNavigationViewState.Hidden -> {
-          visibility = View.GONE
-        }
-      }
+    navigationViewGroup.findViewById<View>(R.id.cancel_questionnaire).apply {
+      updateState(questionnaireNavigationUIState.navCancel)
     }
 
     navigationViewGroup.findViewById<View>(R.id.pagination_previous_button).apply {
-      updateState(questionnairePageNavigationState.previousPageNavigationActionState)
+      updateState(questionnaireNavigationUIState.navPrevious)
     }
 
     navigationViewGroup.findViewById<View>(R.id.pagination_next_button).apply {
-      updateState(questionnairePageNavigationState.nextPageNavigationActionState)
+      updateState(questionnaireNavigationUIState.navNext)
     }
 
     navigationViewGroup.findViewById<View>(R.id.review_mode_button).apply {
-      updateState(questionnairePageNavigationState.reviewNavigationActionState)
+      updateState(questionnaireNavigationUIState.navReview)
     }
     navigationViewGroup.findViewById<View>(R.id.submit_questionnaire).apply {
-      updateState(questionnairePageNavigationState.submitNavigationActionState)
+      updateState(questionnaireNavigationUIState.navSubmit)
+    }
+  }
+
+  private fun View.updateState(navigationViewState: QuestionnaireNavigationViewUIState) {
+    when (navigationViewState) {
+      QuestionnaireNavigationViewUIState.Disabled -> {
+        visibility = View.VISIBLE
+        isEnabled = false
+      }
+      is QuestionnaireNavigationViewUIState.Enabled -> {
+        visibility = View.VISIBLE
+        isEnabled = true
+        setOnClickListener { navigationViewState.onClickAction() }
+      }
+      QuestionnaireNavigationViewUIState.Hidden -> {
+        visibility = View.GONE
+      }
     }
   }
 
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireNavigationViewUIState.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireNavigationViewUIState.kt
new file mode 100644
index 0000000000..8cf13efb0d
--- /dev/null
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireNavigationViewUIState.kt
@@ -0,0 +1,33 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *       http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package com.google.android.fhir.datacapture
+
+sealed class QuestionnaireNavigationViewUIState {
+  object Hidden : QuestionnaireNavigationViewUIState()
+
+  object Disabled : QuestionnaireNavigationViewUIState()
+
+  data class Enabled(val onClickAction: () -> Unit) : QuestionnaireNavigationViewUIState()
+}
+
+data class QuestionnaireNavigationUIState(
+  val navPrevious: QuestionnaireNavigationViewUIState = QuestionnaireNavigationViewUIState.Hidden,
+  val navNext: QuestionnaireNavigationViewUIState = QuestionnaireNavigationViewUIState.Hidden,
+  val navSubmit: QuestionnaireNavigationViewUIState = QuestionnaireNavigationViewUIState.Hidden,
+  val navCancel: QuestionnaireNavigationViewUIState = QuestionnaireNavigationViewUIState.Hidden,
+  val navReview: QuestionnaireNavigationViewUIState = QuestionnaireNavigationViewUIState.Hidden,
+)
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnairePageNavigationState.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnairePageNavigationState.kt
deleted file mode 100644
index 56864f27ba..0000000000
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnairePageNavigationState.kt
+++ /dev/null
@@ -1,32 +0,0 @@
-/*
- * Copyright 2023 Google LLC
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *       http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-package com.google.android.fhir.datacapture
-
-sealed class QuestionnaireNavigationViewState {
-  object Hidden : QuestionnaireNavigationViewState()
-
-  object Disabled : QuestionnaireNavigationViewState()
-
-  data class Enabled(val onClickAction: () -> Unit) : QuestionnaireNavigationViewState()
-}
-
-data class QuestionnairePageNavigationState(
-  val previousPageNavigationActionState: QuestionnaireNavigationViewState,
-  val nextPageNavigationActionState: QuestionnaireNavigationViewState,
-  val submitNavigationActionState: QuestionnaireNavigationViewState,
-  val reviewNavigationActionState: QuestionnaireNavigationViewState,
-)
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireReviewAdapter.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireReviewAdapter.kt
index 6598589618..f944a401c2 100644
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireReviewAdapter.kt
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireReviewAdapter.kt
@@ -49,7 +49,7 @@ internal class QuestionnaireReviewAdapter :
       }
       is QuestionnaireAdapterItem.Navigation -> {
         holder as NavigationViewHolder
-        holder.bind(item.questionnairePageNavigationState)
+        holder.bind(item.questionnaireNavigationUIState)
       }
     }
   }
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireViewModel.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireViewModel.kt
index d626aa6621..2ae8308230 100644
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireViewModel.kt
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/QuestionnaireViewModel.kt
@@ -229,6 +229,8 @@ internal class QuestionnaireViewModel(application: Application, state: SavedStat
 
   private var onSubmitButtonClickListener: () -> Unit = {}
 
+  private var onCancelButtonClickListener: () -> Unit = {}
+
   /** Flag to show/hide cancel button. Default is false */
   private var shouldShowCancelButton =
     state[QuestionnaireFragment.EXTRA_SHOW_CANCEL_BUTTON] ?: false
@@ -509,6 +511,10 @@ internal class QuestionnaireViewModel(application: Application, state: SavedStat
     onSubmitButtonClickListener = onClickAction
   }
 
+  internal fun setOnCancelButtonClickListener(onClickAction: () -> Unit) {
+    onCancelButtonClickListener = onClickAction
+  }
+
   internal fun setShowSubmitButtonFlag(showSubmitButton: Boolean) {
     this.shouldShowSubmitButton = showSubmitButton
   }
@@ -543,7 +549,7 @@ internal class QuestionnaireViewModel(application: Application, state: SavedStat
           QuestionnaireState(
             items = emptyList(),
             displayMode = DisplayMode.InitMode,
-            pageNavigationState = null,
+            bottomNavigation = QuestionnaireNavigationUIState(),
           ),
       )
 
@@ -638,111 +644,110 @@ internal class QuestionnaireViewModel(application: Application, state: SavedStat
     if (isReadOnly || isInReviewModeFlow.value) {
       val showSubmitButton = !isReadOnly && shouldShowSubmitButton
       val pageNavigationViewState =
-        QuestionnairePageNavigationState(
-          previousPageNavigationActionState = QuestionnaireNavigationViewState.Hidden,
-          nextPageNavigationActionState = QuestionnaireNavigationViewState.Hidden,
-          submitNavigationActionState =
+        QuestionnaireNavigationUIState(
+          navSubmit =
             if (showSubmitButton) {
-              QuestionnaireNavigationViewState.Enabled(onSubmitButtonClickListener)
+              QuestionnaireNavigationViewUIState.Enabled(onSubmitButtonClickListener)
+            } else {
+              QuestionnaireNavigationViewUIState.Hidden
+            },
+          navCancel =
+            if (!isReadOnly && shouldShowCancelButton) {
+              QuestionnaireNavigationViewUIState.Enabled(onCancelButtonClickListener)
             } else {
-              QuestionnaireNavigationViewState.Hidden
+              QuestionnaireNavigationViewUIState.Hidden
             },
-          reviewNavigationActionState = QuestionnaireNavigationViewState.Hidden,
         )
-      val itemsViewItems =
-        if (shouldSetNavigationInLongScroll) {
-          questionnaireItemViewItems + QuestionnaireAdapterItem.Navigation(pageNavigationViewState)
-        } else {
-          questionnaireItemViewItems
-        }
-      val pageNavState = if (shouldSetNavigationInLongScroll) null else pageNavigationViewState
 
       return QuestionnaireState(
-        items = itemsViewItems,
+        items = questionnaireItemViewItems,
         displayMode =
           DisplayMode.ReviewMode(
             showEditButton = !isReadOnly,
-            showSubmitButton = showSubmitButton,
-            showCancelButton = !isReadOnly && shouldShowCancelButton,
+            showNavAsScroll = shouldSetNavigationInLongScroll,
           ),
-        pageNavigationState = pageNavState,
+        bottomNavigation = pageNavigationViewState,
       )
     }
 
+    val showReviewButton: Boolean
+    val showSubmitButton: Boolean
+    val showCancelButton: Boolean
     // Editing the questionnaire
     val questionnairePagination =
       if (!questionnaire.isPaginated) {
-        val showReviewButton = shouldEnableReviewPage && !isInReviewModeFlow.value
-        val showSubmitButton = shouldShowSubmitButton && !showReviewButton
-        val showCancelButton = shouldShowCancelButton && !showReviewButton
+        showReviewButton = shouldEnableReviewPage && !isInReviewModeFlow.value
+        showSubmitButton = shouldShowSubmitButton && !showReviewButton
+        showCancelButton = shouldShowCancelButton && !showReviewButton
         QuestionnairePagination(
           false,
           emptyList(),
           -1,
-          showSubmitButton,
-          showCancelButton,
-          showReviewButton,
         )
       } else {
         val hasNextPage =
           QuestionnairePagination(pages = pages!!, currentPageIndex = currentPageIndexFlow.value!!)
             .hasNextPage
-        val showReviewButton = shouldEnableReviewPage && !hasNextPage
-        val showSubmitButton = shouldShowSubmitButton && !showReviewButton && !hasNextPage
-        val showCancelButton = shouldShowCancelButton
+        showReviewButton = shouldEnableReviewPage && !hasNextPage
+        showSubmitButton = shouldShowSubmitButton && !showReviewButton && !hasNextPage
+        showCancelButton = shouldShowCancelButton
         QuestionnairePagination(
           true,
           pages!!,
           currentPageIndexFlow.value!!,
-          showSubmitButton,
-          showCancelButton,
-          showReviewButton,
         )
       }
 
     val pageNavigationViewState =
-      QuestionnairePageNavigationState(
-        previousPageNavigationActionState =
-          if (questionnairePagination.isPaginated && questionnairePagination.hasPreviousPage) {
-            QuestionnaireNavigationViewState.Enabled { goToPreviousPage() }
-          } else if (questionnairePagination.isPaginated) {
-            QuestionnaireNavigationViewState.Disabled
-          } else {
-            QuestionnaireNavigationViewState.Hidden
+      QuestionnaireNavigationUIState(
+        navPrevious =
+          when {
+            questionnairePagination.isPaginated && questionnairePagination.hasPreviousPage -> {
+              QuestionnaireNavigationViewUIState.Enabled { goToPreviousPage() }
+            }
+            questionnairePagination.isPaginated -> {
+              QuestionnaireNavigationViewUIState.Disabled
+            }
+            else -> {
+              QuestionnaireNavigationViewUIState.Hidden
+            }
+          },
+        navNext =
+          when {
+            questionnairePagination.isPaginated && questionnairePagination.hasNextPage -> {
+              QuestionnaireNavigationViewUIState.Enabled { goToNextPage() }
+            }
+            questionnairePagination.isPaginated -> {
+              QuestionnaireNavigationViewUIState.Disabled
+            }
+            else -> {
+              QuestionnaireNavigationViewUIState.Hidden
+            }
           },
-        nextPageNavigationActionState =
-          if (questionnairePagination.isPaginated && questionnairePagination.hasNextPage) {
-            QuestionnaireNavigationViewState.Enabled { goToNextPage() }
-          } else if (questionnairePagination.isPaginated) {
-            QuestionnaireNavigationViewState.Disabled
+        navSubmit =
+          if (showSubmitButton) {
+            QuestionnaireNavigationViewUIState.Enabled(onSubmitButtonClickListener)
           } else {
-            QuestionnaireNavigationViewState.Hidden
+            QuestionnaireNavigationViewUIState.Hidden
           },
-        submitNavigationActionState =
-          if (questionnairePagination.showSubmitButton) {
-            QuestionnaireNavigationViewState.Enabled(onSubmitButtonClickListener)
+        navReview =
+          if (showReviewButton) {
+            QuestionnaireNavigationViewUIState.Enabled { setReviewMode(true) }
           } else {
-            QuestionnaireNavigationViewState.Hidden
+            QuestionnaireNavigationViewUIState.Hidden
           },
-        reviewNavigationActionState =
-          if (questionnairePagination.showReviewButton) {
-            QuestionnaireNavigationViewState.Enabled { setReviewMode(true) }
+        navCancel =
+          if (showCancelButton) {
+            QuestionnaireNavigationViewUIState.Enabled { setReviewMode(true) }
           } else {
-            QuestionnaireNavigationViewState.Hidden
+            QuestionnaireNavigationViewUIState.Hidden
           },
       )
-    val itemsViewItems =
-      if (shouldSetNavigationInLongScroll) {
-        questionnaireItemViewItems + QuestionnaireAdapterItem.Navigation(pageNavigationViewState)
-      } else {
-        questionnaireItemViewItems
-      }
-    val pageNavState = if (shouldSetNavigationInLongScroll) null else pageNavigationViewState
 
     return QuestionnaireState(
-      items = itemsViewItems,
-      displayMode = DisplayMode.EditMode(questionnairePagination),
-      pageNavigationState = pageNavState,
+      items = questionnaireItemViewItems,
+      displayMode = DisplayMode.EditMode(questionnairePagination, shouldSetNavigationInLongScroll),
+      bottomNavigation = pageNavigationViewState,
     )
   }
 
@@ -996,16 +1001,16 @@ typealias ItemToParentMap = MutableMap<QuestionnaireItemComponent, Questionnaire
 internal data class QuestionnaireState(
   val items: List<QuestionnaireAdapterItem>,
   val displayMode: DisplayMode,
-  val pageNavigationState: QuestionnairePageNavigationState? = null,
+  val bottomNavigation: QuestionnaireNavigationUIState,
 )
 
 internal sealed class DisplayMode {
-  class EditMode(val pagination: QuestionnairePagination) : DisplayMode()
+  class EditMode(val pagination: QuestionnairePagination, val showNavAsScroll: Boolean) :
+    DisplayMode()
 
   data class ReviewMode(
     val showEditButton: Boolean,
-    val showSubmitButton: Boolean,
-    val showCancelButton: Boolean,
+    val showNavAsScroll: Boolean,
   ) : DisplayMode()
 
   // Sentinel displayMode that's used in setting the initial default QuestionnaireState
@@ -1020,9 +1025,6 @@ internal data class QuestionnairePagination(
   val isPaginated: Boolean = false,
   val pages: List<QuestionnairePage>,
   val currentPageIndex: Int,
-  val showSubmitButton: Boolean = false,
-  val showCancelButton: Boolean = false,
-  val showReviewButton: Boolean = false,
 )
 
 /** A single page in the questionnaire. This is used for the UI to render pagination controls. */
diff --git a/datacapture/src/main/java/com/google/android/fhir/datacapture/views/NavigationViewHolder.kt b/datacapture/src/main/java/com/google/android/fhir/datacapture/views/NavigationViewHolder.kt
index 67ef2140d9..1e277bdbbc 100644
--- a/datacapture/src/main/java/com/google/android/fhir/datacapture/views/NavigationViewHolder.kt
+++ b/datacapture/src/main/java/com/google/android/fhir/datacapture/views/NavigationViewHolder.kt
@@ -18,43 +18,47 @@ package com.google.android.fhir.datacapture.views
 
 import android.view.View
 import androidx.recyclerview.widget.RecyclerView
-import com.google.android.fhir.datacapture.QuestionnaireNavigationViewState
-import com.google.android.fhir.datacapture.QuestionnairePageNavigationState
+import com.google.android.fhir.datacapture.QuestionnaireNavigationUIState
+import com.google.android.fhir.datacapture.QuestionnaireNavigationViewUIState
 import com.google.android.fhir.datacapture.R
 
 class NavigationViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
 
-  fun bind(questionnairePageNavigationState: QuestionnairePageNavigationState) {
-    fun View.updateState(navigationViewState: QuestionnaireNavigationViewState) {
-      when (navigationViewState) {
-        QuestionnaireNavigationViewState.Disabled -> {
-          visibility = View.VISIBLE
-          isEnabled = false
-        }
-        is QuestionnaireNavigationViewState.Enabled -> {
-          visibility = View.VISIBLE
-          isEnabled = true
-          setOnClickListener { navigationViewState.onClickAction() }
-        }
-        QuestionnaireNavigationViewState.Hidden -> {
-          visibility = View.GONE
-        }
-      }
+  fun bind(questionnaireNavigationUIState: QuestionnaireNavigationUIState) {
+    itemView.findViewById<View>(R.id.cancel_questionnaire).apply {
+      updateState(questionnaireNavigationUIState.navCancel)
     }
 
-    itemView.findViewById<View>(R.id.navigation_item_pagination_previous_button).apply {
-      updateState(questionnairePageNavigationState.previousPageNavigationActionState)
+    itemView.findViewById<View>(R.id.pagination_previous_button).apply {
+      updateState(questionnaireNavigationUIState.navPrevious)
     }
 
-    itemView.findViewById<View>(R.id.navigation_item_pagination_next_button).apply {
-      updateState(questionnairePageNavigationState.nextPageNavigationActionState)
+    itemView.findViewById<View>(R.id.pagination_next_button).apply {
+      updateState(questionnaireNavigationUIState.navNext)
     }
 
-    itemView.findViewById<View>(R.id.navigation_item_review_mode_button).apply {
-      updateState(questionnairePageNavigationState.reviewNavigationActionState)
+    itemView.findViewById<View>(R.id.review_mode_button).apply {
+      updateState(questionnaireNavigationUIState.navReview)
+    }
+    itemView.findViewById<View>(R.id.submit_questionnaire).apply {
+      updateState(questionnaireNavigationUIState.navSubmit)
     }
-    itemView.findViewById<View>(R.id.navigation_item_submit_questionnaire).apply {
-      updateState(questionnairePageNavigationState.submitNavigationActionState)
+  }
+
+  private fun View.updateState(navigationViewState: QuestionnaireNavigationViewUIState) {
+    when (navigationViewState) {
+      QuestionnaireNavigationViewUIState.Disabled -> {
+        visibility = View.VISIBLE
+        isEnabled = false
+      }
+      is QuestionnaireNavigationViewUIState.Enabled -> {
+        visibility = View.VISIBLE
+        isEnabled = true
+        setOnClickListener { navigationViewState.onClickAction() }
+      }
+      QuestionnaireNavigationViewUIState.Hidden -> {
+        visibility = View.GONE
+      }
     }
   }
 }
diff --git a/datacapture/src/main/res/layout/pagination_navigation_view.xml b/datacapture/src/main/res/layout/pagination_navigation_view.xml
index 4ce652471d..65cc9ee520 100644
--- a/datacapture/src/main/res/layout/pagination_navigation_view.xml
+++ b/datacapture/src/main/res/layout/pagination_navigation_view.xml
@@ -11,11 +11,11 @@
         style="?attr/questionnaireBottomNavContainerDividerStyle"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        app:layout_constraintBottom_toTopOf="@id/navigation_item_container"
+        app:layout_constraintBottom_toTopOf="@id/bottom_nav_container"
     />
 
     <LinearLayout
-        android:id="@+id/navigation_item_container"
+        android:id="@+id/bottom_nav_container"
         style="?attr/questionnaireBottomNavContainerStyle"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
@@ -42,7 +42,7 @@
         />
 
         <Button
-            android:id="@+id/navigation_item_pagination_previous_button"
+            android:id="@+id/pagination_previous_button"
             style="?attr/questionnaireButtonStyle"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
@@ -52,7 +52,7 @@
         />
 
         <Button
-            android:id="@+id/navigation_item_pagination_next_button"
+            android:id="@+id/pagination_next_button"
             style="?attr/questionnaireButtonStyle"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
@@ -62,7 +62,7 @@
         />
 
         <Button
-            android:id="@+id/navigation_item_review_mode_button"
+            android:id="@+id/review_mode_button"
             style="?attr/questionnaireButtonStyle"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
@@ -72,7 +72,7 @@
         />
 
         <Button
-            android:id="@+id/navigation_item_submit_questionnaire"
+            android:id="@+id/submit_questionnaire"
             style="?attr/questionnaireSubmitButtonStyle"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
diff --git a/datacapture/src/main/res/layout/questionnaire_fragment.xml b/datacapture/src/main/res/layout/questionnaire_fragment.xml
index 59dfc800ed..4ad6365186 100644
--- a/datacapture/src/main/res/layout/questionnaire_fragment.xml
+++ b/datacapture/src/main/res/layout/questionnaire_fragment.xml
@@ -51,7 +51,7 @@
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:scrollbars="vertical"
-        app:layout_constraintBottom_toTopOf="@+id/bottom_nav_group"
+        app:layout_constraintBottom_toTopOf="@+id/questionnaire_bottom_view_container"
         app:layout_constraintTop_toBottomOf="@+id/questionnaire_progress_indicator"
     />
 
@@ -60,94 +60,16 @@
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:scrollbars="vertical"
-        app:layout_constraintBottom_toTopOf="@+id/bottom_nav_group"
+        app:layout_constraintBottom_toTopOf="@+id/questionnaire_bottom_view_container"
         app:layout_constraintTop_toBottomOf="@+id/review_mode_edit_button"
     />
 
-    <androidx.constraintlayout.widget.ConstraintLayout
-        android:id="@+id/bottom_nav_group"
+    <include
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
+        android:id="@+id/questionnaire_bottom_view_container"
+        layout="@layout/pagination_navigation_view"
         app:layout_constraintBottom_toBottomOf="parent"
-    >
-
-        <com.google.android.material.divider.MaterialDivider
-            android:id="@+id/bottom_nav_container_divider"
-            style="?attr/questionnaireBottomNavContainerDividerStyle"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            app:layout_constraintBottom_toTopOf="@id/bottom_nav_container"
-        />
-
-        <LinearLayout
-            android:id="@+id/bottom_nav_container"
-            style="?attr/questionnaireBottomNavContainerStyle"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:layout_alignParentTop="true"
-            android:layout_alignParentBottom="true"
-            android:orientation="horizontal"
-            app:layout_constraintBottom_toBottomOf="parent"
-        >
-
-            <Button
-                android:id="@+id/cancel_questionnaire"
-                style="?attr/questionnaireCancelButtonStyle"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/action_button_margin_horizontal"
-                android:layout_marginVertical="@dimen/action_button_margin_vertical"
-                android:text="@string/cancel_questionnaire"
-            />
-
-            <View
-                android:layout_width="0dp"
-                android:layout_height="match_parent"
-                android:layout_weight="1"
-            />
-
-            <Button
-                android:id="@+id/pagination_previous_button"
-                style="?attr/questionnaireButtonStyle"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/action_button_margin_horizontal"
-                android:layout_marginVertical="@dimen/action_button_margin_vertical"
-                android:text="@string/button_pagination_previous"
-            />
-
-            <Button
-                android:id="@+id/pagination_next_button"
-                style="?attr/questionnaireButtonStyle"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/action_button_margin_horizontal"
-                android:layout_marginVertical="@dimen/action_button_margin_vertical"
-                android:text="@string/button_pagination_next"
-            />
-
-            <Button
-                android:id="@+id/review_mode_button"
-                style="?attr/questionnaireButtonStyle"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/action_button_margin_horizontal"
-                android:layout_marginVertical="@dimen/action_button_margin_vertical"
-                android:text="@string/button_review"
-            />
-
-            <Button
-                android:id="@+id/submit_questionnaire"
-                style="?attr/questionnaireSubmitButtonStyle"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginHorizontal="@dimen/action_button_margin_horizontal"
-                android:layout_marginVertical="@dimen/action_button_margin_vertical"
-                android:text="@string/submit_questionnaire"
-            />
-
-        </LinearLayout>
-
-    </androidx.constraintlayout.widget.ConstraintLayout>
+    />
 
 </androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/datacapture/src/test/java/com/google/android/fhir/datacapture/QuestionnaireViewModelTest.kt b/datacapture/src/test/java/com/google/android/fhir/datacapture/QuestionnaireViewModelTest.kt
index 629a94f983..9b497d6d2b 100644
--- a/datacapture/src/test/java/com/google/android/fhir/datacapture/QuestionnaireViewModelTest.kt
+++ b/datacapture/src/test/java/com/google/android/fhir/datacapture/QuestionnaireViewModelTest.kt
@@ -2729,7 +2729,7 @@ class QuestionnaireViewModelTest {
     viewModel.setReviewMode(true)
 
     val questionnaireState = viewModel.questionnaireStateFlow.first()
-    assertThat(questionnaireState.pageNavigationState).isNull()
+    assertThat(questionnaireState.bottomNavigation).isNull()
     assertThat(questionnaireState.items.last())
       .isInstanceOf(QuestionnaireAdapterItem.Navigation::class.java)
   }
@@ -2783,7 +2783,7 @@ class QuestionnaireViewModelTest {
       )
 
     val questionnaireState = viewModel.questionnaireStateFlow.first()
-    assertThat(questionnaireState.pageNavigationState).isNull()
+    assertThat(questionnaireState.bottomNavigation).isNull()
     assertThat(questionnaireState.items.last())
       .isInstanceOf(QuestionnaireAdapterItem.Navigation::class.java)
   }
@@ -3078,7 +3078,7 @@ class QuestionnaireViewModelTest {
         }
       val viewModel = createQuestionnaireViewModel(questionnaire, showNavigationInLongScroll = true)
       val questionnaireState = viewModel.questionnaireStateFlow.first()
-      assertThat(questionnaireState.pageNavigationState).isNull()
+      assertThat(questionnaireState.bottomNavigation).isNull()
       assertThat(questionnaireState.items.last())
         .isInstanceOf(QuestionnaireAdapterItem.Navigation::class.java)
     }