Integrated confetti burst into CheckInViewModel and MainNavigationWrapper

Author: melissavelasquezz

app/src/main/java/com/cornellappdev/uplift/ui/MainNavigationWrapper.kt

@@ -13,10 +13,15 @@ import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.geometry.Rect
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.layout.boundsInRoot
+import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
@@ -31,6 +36,7 @@ import androidx.navigation.compose.composable
 import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
 import com.cornellappdev.uplift.ui.components.general.CheckInPopUp
+import com.cornellappdev.uplift.ui.components.general.ConfettiBurst
 import com.cornellappdev.uplift.ui.nav.BottomNavScreens
 import com.cornellappdev.uplift.ui.nav.popBackClass
 import com.cornellappdev.uplift.ui.nav.popBackGym
@@ -51,6 +57,7 @@ import com.cornellappdev.uplift.ui.viewmodels.gyms.GymDetailViewModel
 import com.cornellappdev.uplift.ui.viewmodels.nav.RootNavigationViewModel
 import com.cornellappdev.uplift.ui.viewmodels.profile.CheckInMode
 import com.cornellappdev.uplift.ui.viewmodels.profile.CheckInViewModel
+import com.cornellappdev.uplift.ui.viewmodels.profile.ConfettiViewModel
 import com.cornellappdev.uplift.util.PRIMARY_BLACK
 import com.cornellappdev.uplift.util.PRIMARY_YELLOW
 import com.cornellappdev.uplift.util.montserratFamily
@@ -74,6 +81,7 @@ fun MainNavigationWrapper(
 
 ) {
 
+    val confettiViewModel: ConfettiViewModel = hiltViewModel()
     val checkInViewModel: CheckInViewModel = hiltViewModel()
     val rootNavigationUiState = rootNavigationViewModel.collectUiStateValue()
     val startDestination = rootNavigationUiState.startDestination
@@ -82,6 +90,7 @@ fun MainNavigationWrapper(
     val systemUiController: SystemUiController = rememberSystemUiController()
 
     val checkInUiState = checkInViewModel.collectUiStateValue()
+    var confettiBounds by remember { mutableStateOf<Rect?>(null) }
 
     val yourShimmerTheme = defaultShimmerTheme.copy(
         shaderColors = listOf(
@@ -252,24 +261,37 @@ fun MainNavigationWrapper(
                 composable<UpliftRootRoute.Favorites> {}
             }
 
-            AnimatedVisibility(
-                visible = checkInUiState.showPopUp && isMainScreen(),
-                modifier = Modifier
-                    .align(Alignment.BottomCenter)
-                    .fillMaxWidth()
-                    .padding(
-                        start = 10.dp,
-                        end = 9.dp,
-                        bottom = it.calculateBottomPadding() + 13.dp
-                    )
-            ){
-                CheckInPopUp(
-                    gymName = checkInUiState.gymName,
-                    currentTimeText = checkInUiState.timeText,
-                    onDismiss = { checkInViewModel.onDismiss() },
-                    onCheckIn = { checkInViewModel.onCheckIn() },
-                    onClosePopUp = { checkInViewModel.onClose() },
-                    mode = checkInUiState.mode,
+            Box(modifier = Modifier.fillMaxSize()){
+                AnimatedVisibility(
+                    visible = checkInUiState.showPopUp && isMainScreen(),
+                    modifier = Modifier
+                        .align(Alignment.BottomCenter)
+                        .fillMaxWidth()
+                        .padding(
+                            start = 10.dp,
+                            end = 9.dp,
+                            bottom = it.calculateBottomPadding() + 13.dp
+                        )
+                ){
+                    Box(
+                        modifier = Modifier.onGloballyPositioned { coords ->
+                            confettiBounds = coords.boundsInRoot()
+                        }
+                    ){
+                        CheckInPopUp(
+                            gymName = checkInUiState.gymName,
+                            currentTimeText = checkInUiState.timeText,
+                            onDismiss = checkInViewModel::onDismiss,
+                            onCheckIn = checkInViewModel::onCheckIn,
+                            onClosePopUp = checkInViewModel::onClose,
+                            mode = checkInUiState.mode,
+                        )
+                    }
+                }
+                ConfettiBurst(
+                    confettiViewModel = confettiViewModel,
+                    originRectInRoot = confettiBounds,
+                    modifier = Modifier
                 )
             }
 

app/src/main/java/com/cornellappdev/uplift/ui/viewmodels/profile/CheckInViewModel.kt

@@ -4,6 +4,7 @@ import android.content.Context
 import android.util.Log
 import androidx.lifecycle.viewModelScope
 import com.cornellappdev.uplift.data.repositories.CheckInRepository
+import com.cornellappdev.uplift.data.repositories.ConfettiRepository
 import com.cornellappdev.uplift.data.repositories.LocationRepository
 import com.cornellappdev.uplift.ui.viewmodels.UpliftViewModel
 import com.cornellappdev.uplift.util.isOpen
@@ -37,14 +38,14 @@ data class CheckInUiState(
     val mode: CheckInMode = CheckInMode.Prompt,
     val gymId: String? = "",
     val gymName: String = "",
-    val timeText: String = "",
-    val showConfetti: Boolean = false
+    val timeText: String = ""
 )
 
 /** A [CheckInViewModel] manages state and actions for the Check-In pop-up on main screens. */
 @HiltViewModel
 class CheckInViewModel @Inject constructor(
     private val checkInRepository: CheckInRepository,
+    private val confettiRepository: ConfettiRepository
 ) : UpliftViewModel<CheckInUiState>(CheckInUiState()) {
 
     private var locationJob: Job? = null
@@ -127,7 +128,7 @@ class CheckInViewModel @Inject constructor(
     /**
      * Marks the user as checked in for the day, triggering a cooldown til the end of day and a
      * logworkout mutation through [checkInRepository]. On a successful call, transitions UI into
-     * [CheckInMode.Complete].
+     * [CheckInMode.Complete] and bursts confetti from popup through a [confettiRepository].
      *
      * Note: Temporarily skips over failed backend log workout call to keep functionality while auth and
      * sign in are not working.
@@ -148,6 +149,7 @@ class CheckInViewModel @Inject constructor(
                     mode = CheckInMode.Complete
                 )
             }
+            confettiRepository.showConfetti(ConfettiViewModel.ConfettiUiState())
             checkInRepository.logWorkoutFromCheckIn(gymIdInt)
         } catch (e: Exception) {
             Log.e(tag, "Error checking in", e)