Migrate AssignedFacilityView to compose (#5458)

https://app.shortcut.com/simpledotorg/story/15919/migrate-follow-up-appointment-container-to-jetpack-compose?team_id=1&iteration_ids=15786

---------

Co-authored-by: sagarwal <[email protected]>

Author: siddh1004

CHANGELOG.md

@@ -14,6 +14,7 @@
 - Migrate blood pressure summary view to Jetpack Compose
 - Migrate blood sugar summary view to Jetpack Compose
 - Migrate medical history summary view to Jetpack Compose
+- Migrate assigned facility view to Jetpack Compose
 
 ## 2025.05.20
 

app/src/main/java/org/simple/clinic/summary/assignedfacility/AssignedFacilityView.kt

@@ -5,8 +5,14 @@ import android.content.Context
 import android.os.Parcelable
 import android.util.AttributeSet
 import android.view.LayoutInflater
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.platform.ComposeView
+import androidx.compose.ui.platform.ViewCompositionStrategy
 import com.google.android.material.card.MaterialCardView
 import io.reactivex.Observable
+import org.simple.clinic.common.ui.theme.SimpleTheme
 import org.simple.clinic.databinding.PatientsummaryAssignedFacilityContentBinding
 import org.simple.clinic.di.injector
 import org.simple.clinic.facility.Facility
@@ -17,6 +23,7 @@ import org.simple.clinic.navigation.v2.keyprovider.ScreenKeyProvider
 import org.simple.clinic.summary.PatientSummaryChildView
 import org.simple.clinic.summary.PatientSummaryModelUpdateCallback
 import org.simple.clinic.summary.PatientSummaryScreenKey
+import org.simple.clinic.summary.assignedfacility.ui.AssignedFacility
 import org.simple.clinic.util.unsafeLazy
 import javax.inject.Inject
 
@@ -33,11 +40,7 @@ class AssignedFacilityView(
 
   private var binding: PatientsummaryAssignedFacilityContentBinding? = null
 
-  private val assignedFacilityTextView
-    get() = binding!!.assignedFacilityTextView
-
-  private val changeAssignedFacilityButton
-    get() = binding!!.changeAssignedFacilityButton
+  private var assignedFacilityName by mutableStateOf("")
 
   init {
     val layoutInflater = LayoutInflater.from(context)
@@ -83,9 +86,20 @@ class AssignedFacilityView(
     }
 
     context.injector<Injector>().inject(this)
-    changeAssignedFacilityButton.setOnClickListener {
-      changeAssignedFacilityClicks?.invoke()
-    }
+
+    addView(ComposeView(context).apply {
+      setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnDetachedFromWindow)
+
+      setContent {
+        SimpleTheme {
+          AssignedFacility(
+              facilityName = assignedFacilityName
+          ) {
+            changeAssignedFacilityClicks?.invoke()
+          }
+        }
+      }
+    })
   }
 
   override fun onAttachedToWindow() {
@@ -107,7 +121,7 @@ class AssignedFacilityView(
   }
 
   override fun renderAssignedFacilityName(facilityName: String) {
-    assignedFacilityTextView.text = facilityName
+    assignedFacilityName = facilityName
   }
 
   override fun registerSummaryModelUpdateCallback(callback: PatientSummaryModelUpdateCallback?) {

app/src/main/java/org/simple/clinic/summary/assignedfacility/ui/AssignedFacility.kt

@@ -0,0 +1,86 @@
+package org.simple.clinic.summary.assignedfacility.ui
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.offset
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Card
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.dimensionResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import org.simple.clinic.R
+import org.simple.clinic.common.ui.components.ButtonSize
+import org.simple.clinic.common.ui.components.TextButton
+import org.simple.clinic.common.ui.theme.SimpleTheme
+
+@Composable
+fun AssignedFacility(
+    modifier: Modifier = Modifier,
+    facilityName: String,
+    onChangeClick: () -> Unit,
+) {
+  Card(
+      modifier = modifier,
+      backgroundColor = MaterialTheme.colors.surface
+  )
+  {
+    Column(
+        modifier = Modifier.padding(
+            start = dimensionResource(R.dimen.spacing_16),
+            bottom = dimensionResource(R.dimen.spacing_12)
+        )
+    ) {
+
+      Row(
+          modifier = Modifier.padding(
+              top = dimensionResource(R.dimen.spacing_4),
+              end = dimensionResource(R.dimen.spacing_8)
+          ),
+          verticalAlignment = Alignment.CenterVertically,
+          horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.spacing_8))
+      ) {
+        Text(
+            modifier = Modifier.weight(1f),
+            text = stringResource(R.string.assigned_facility_view_title),
+            style = SimpleTheme.typography.subtitle1Medium,
+            color = MaterialTheme.colors.onSurface,
+        )
+
+        TextButton(
+            buttonSize = ButtonSize.ExtraSmall,
+            onClick = onChangeClick
+        ) {
+          Text(
+              text = stringResource(R.string.assigned_facility_view_change).uppercase(),
+              style = MaterialTheme.typography.button,
+          )
+        }
+      }
+
+      Text(
+          modifier = Modifier
+                  .offset(y = (-dimensionResource(R.dimen.spacing_4)))
+                  .padding(end = dimensionResource(R.dimen.spacing_16)),
+          text = facilityName,
+          style = MaterialTheme.typography.body1,
+          color = MaterialTheme.colors.onSurface,
+      )
+    }
+  }
+}
+
+@Preview
+@Composable
+fun AssignedFacilityPreview(modifier: Modifier = Modifier) {
+  SimpleTheme {
+    AssignedFacility(
+        facilityName = "UHC Khardi"
+    ) { }
+  }
+}

common-ui/src/main/java/org/simple/clinic/common/ui/components/Button.kt

@@ -1,11 +1,13 @@
 package org.simple.clinic.common.ui.components
 
 import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.requiredWidth
+import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.Icon
 import androidx.compose.material.ProvideTextStyle
 import androidx.compose.material.Text
@@ -30,6 +32,7 @@ fun OutlinedButton(
     content: @Composable RowScope.() -> Unit
 ) {
   val minHeight = when (buttonSize) {
+    ButtonSize.ExtraSmall -> 32.dp
     ButtonSize.Small -> 40.dp
     ButtonSize.Default -> 48.dp
     ButtonSize.Big -> 56.dp
@@ -68,6 +71,7 @@ fun FilledButton(
     content: @Composable RowScope.() -> Unit
 ) {
   val minHeight = when (buttonSize) {
+    ButtonSize.ExtraSmall -> 32.dp
     ButtonSize.Small -> 40.dp
     ButtonSize.Default -> 48.dp
     ButtonSize.Big -> 56.dp
@@ -103,6 +107,7 @@ fun TextButton(
     content: @Composable RowScope.() -> Unit
 ) {
   val minHeight = when (buttonSize) {
+    ButtonSize.ExtraSmall -> 32.dp
     ButtonSize.Small -> 40.dp
     ButtonSize.Default -> 48.dp
     ButtonSize.Big -> 56.dp
@@ -134,6 +139,7 @@ sealed interface ButtonSize {
   data object Default : ButtonSize
   data object Big : ButtonSize
   data object Small : ButtonSize
+  data object ExtraSmall : ButtonSize
 }
 
 @Preview(group = "OutlinedButton")

gradle.properties

@@ -26,7 +26,7 @@ android.experimental.enableTestFixturesKotlinSupport=true
 # Manifest URL endpoint
 # These are currently the same as the API endpoints declared earlier. Those will be removed later
 # once the country selection feature is complete.
-manifestEndpoint=https://manifest.simple.org/sandbox/
+manifestEndpoint=https://manifest.simple.org/qa/
 # Needed to switch NDK versions on the CI server since they have different
 # NDK versions on macOS and Linux environments. Gradle plugin 3.6+ requires
 # us to pin an NDK version if we package native libs.