Updated on 2026-08-14

features/referral/presentation/build.gradle.kts

@@ -19,11 +19,10 @@ dependencies {
     implementation(deps.androidx.appCompat)
     implementation(deps.androidx.fragment.ktx)
     implementation(deps.lifecycle.viewModel.ktx)
-    implementation(deps.material)
 
     /** Compose */
     implementation(deps.compose.foundation)
-    implementation(deps.compose.material)
+    implementation(deps.compose.material3)
     implementation(deps.compose.ui.tooling)
 
     /** Domain */

features/referral/presentation/src/main/java/com/tangem/feature/referral/ui/AgreementBottomSheetContent.kt

@@ -16,7 +16,6 @@ import androidx.compose.ui.unit.dp
 import com.google.accompanist.web.WebView
 import com.google.accompanist.web.rememberWebViewState
 import com.tangem.core.ui.components.appbar.AppBarWithAdditionalButtons
-import com.tangem.core.ui.components.atoms.Hand
 import com.tangem.core.ui.res.TangemTheme
 import com.tangem.feature.referral.presentation.R
 
@@ -29,11 +28,9 @@ import com.tangem.feature.referral.presentation.R
 internal fun AgreementBottomSheetContent(url: String) {
     Column(
         modifier = Modifier
-            .background(color = TangemTheme.colors.background.secondary)
             .fillMaxWidth()
             .height(LocalConfiguration.current.screenHeightDp.dp - TangemTheme.dimens.spacing16),
     ) {
-        Hand()
         Column(modifier = Modifier.verticalScroll(rememberScrollState())) {
             AppBarWithAdditionalButtons(text = stringResource(id = R.string.details_referral_title))
             AgreementHtmlView(url = url)
@@ -48,6 +45,7 @@ private fun AgreementHtmlView(url: String) {
     WebView(
         state = state,
         modifier = Modifier.background(TangemTheme.colors.background.secondary),
+        captureBackPresses = false,
         onCreated = {
             if (!isInPreviewMode) {
                 it.settings.apply {

features/referral/presentation/src/main/java/com/tangem/feature/referral/ui/AwardItems.kt

@@ -1,8 +1,8 @@
 package com.tangem.feature.referral.ui
 
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier

features/referral/presentation/src/main/java/com/tangem/feature/referral/ui/ParticipateBottomBlock.kt

@@ -7,16 +7,15 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Divider
-import androidx.compose.material.Icon
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
+import androidx.compose.material3.Divider
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
-import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.hapticfeedback.HapticFeedbackType
@@ -36,7 +35,6 @@ import com.tangem.feature.referral.domain.models.ExpectedAwards
 import com.tangem.feature.referral.presentation.R
 
 @Suppress("LongParameterList")
-@OptIn(ExperimentalComposeUiApi::class)
 @Composable
 internal fun ParticipateBottomBlock(
     purchasedWalletCount: Int,
@@ -240,7 +238,6 @@ private fun ExtraItems(extraItems: List<ExpectedAward>) {
                 endTextColor = TangemTheme.colors.text.primary1,
                 endTextStyle = TangemTheme.typography.subtitle2,
                 cornersToRound = CornersToRound.ZERO,
-
             )
         }
     }

features/referral/presentation/src/main/java/com/tangem/feature/referral/ui/ReferralBottomSheet.kt

@@ -0,0 +1,38 @@
+package com.tangem.feature.referral.ui
+
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.SheetState
+import androidx.compose.runtime.Composable
+import com.tangem.core.ui.res.TangemTheme
+import com.tangem.feature.referral.models.ReferralStateHolder
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun ReferralBottomSheet(
+    sheetState: SheetState,
+    isVisible: Boolean,
+    onDismissRequest: () -> Unit,
+    config: ReferralStateHolder.ReferralInfoState,
+) {
+    if (isVisible) {
+        ModalBottomSheet(
+            onDismissRequest = onDismissRequest,
+            sheetState = sheetState,
+            shape = RoundedCornerShape(
+                topStart = TangemTheme.dimens.radius16,
+                topEnd = TangemTheme.dimens.radius16,
+            ),
+            containerColor = TangemTheme.colors.background.primary,
+        ) {
+            AgreementBottomSheetContent(
+                url = when (config) {
+                    is ReferralStateHolder.ReferralInfoState.NonParticipantContent -> config.url
+                    is ReferralStateHolder.ReferralInfoState.ParticipantContent -> config.url
+                    is ReferralStateHolder.ReferralInfoState.Loading -> ""
+                },
+            )
+        }
+    }
+}

features/referral/presentation/src/main/java/com/tangem/feature/referral/ui/ReferralScreen.kt

@@ -1,14 +1,12 @@
 package com.tangem.feature.referral.ui
 
 import androidx.annotation.DrawableRes
-import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.LocalOverscrollConfiguration
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.*
+import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -43,78 +41,62 @@ import kotlinx.coroutines.launch
  * Referral program screen for participant and non-participant
  *
  * @param stateHolder state holder
+ * @param modifier    modifier
  */
-@OptIn(ExperimentalMaterialApi::class)
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 internal fun ReferralScreen(stateHolder: ReferralStateHolder, modifier: Modifier = Modifier) {
-    val coroutineScope = rememberCoroutineScope()
-    val bottomSheetScaffoldState = rememberBottomSheetScaffoldState(
-        bottomSheetState = BottomSheetState(BottomSheetValue.Collapsed),
-    )
+    var isBottomSheetVisible by remember { mutableStateOf(value = false) }
+    val sheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
 
-    BottomSheetScaffold(
+    Scaffold(
         modifier = modifier,
-        sheetContent = {
-            AgreementBottomSheetContent(
-                url = when (val state = stateHolder.referralInfoState) {
-                    is ReferralInfoState.NonParticipantContent -> state.url
-                    is ReferralInfoState.ParticipantContent -> state.url
-                    is ReferralInfoState.Loading -> ""
-                },
-            )
-        },
-        scaffoldState = bottomSheetScaffoldState,
-        sheetShape = RoundedCornerShape(
-            topStart = TangemTheme.dimens.radius16,
-            topEnd = TangemTheme.dimens.radius16,
-        ),
-        sheetElevation = TangemTheme.dimens.elevation24,
-        sheetPeekHeight = TangemTheme.dimens.size0,
-        content = {
-            ReferralContent(
-                stateHolder = stateHolder,
-                onAgreementClick = {
-                    stateHolder.analytics.onAgreementClicked.invoke()
-                    coroutineScope.launch {
-                        if (bottomSheetScaffoldState.bottomSheetState.isCollapsed) {
-                            bottomSheetScaffoldState.bottomSheetState.expand()
-                        } else {
-                            bottomSheetScaffoldState.bottomSheetState.collapse()
-                        }
-                    }
-                },
+        topBar = {
+            AppBarWithBackButton(
+                text = stringResource(R.string.details_referral_title),
+                onBackClick = stateHolder.headerState.onBackClicked,
             )
         },
+        containerColor = TangemTheme.colors.background.secondary,
+    ) {
+        ReferralContent(
+            stateHolder = stateHolder,
+            onAgreementClick = {
+                stateHolder.analytics.onAgreementClicked.invoke()
+                isBottomSheetVisible = true
+            },
+            modifier = Modifier.padding(it),
+        )
+    }
+
+    ReferralBottomSheet(
+        sheetState = sheetState,
+        isVisible = isBottomSheetVisible,
+        onDismissRequest = { isBottomSheetVisible = false },
+        config = stateHolder.referralInfoState,
     )
 }
 
-@OptIn(ExperimentalFoundationApi::class)
 @Composable
-private fun ReferralContent(stateHolder: ReferralStateHolder, onAgreementClick: () -> Unit) {
-    val isCopyButtonPressed = remember { mutableStateOf(false) }
+private fun ReferralContent(
+    stateHolder: ReferralStateHolder,
+    onAgreementClick: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    val isCopyButtonPressed = remember { mutableStateOf(value = false) }
 
-    Box {
-        CompositionLocalProvider(LocalOverscrollConfiguration provides null) {
-            LazyColumn(
-                modifier = Modifier
-                    .background(color = TangemTheme.colors.background.secondary)
-                    .fillMaxSize(),
-                horizontalAlignment = Alignment.CenterHorizontally,
-            ) {
-                stickyHeader {
-                    AppBarWithBackButton(
-                        text = stringResource(R.string.details_referral_title),
-                        onBackClick = stateHolder.headerState.onBackClicked,
-                    )
-                }
-                item { Header() }
-                item {
-                    ReferralInfo(
-                        stateHolder = stateHolder,
-                        onAgreementClick = onAgreementClick,
-                        onShowCopySnackbar = { isCopyButtonPressed.value = true },
-                    )
-                }
+    Box(modifier = modifier) {
+        LazyColumn(
+            modifier = Modifier.fillMaxSize(),
+            horizontalAlignment = Alignment.CenterHorizontally,
+        ) {
+            item { Header() }
+            item {
+                ReferralInfo(
+                    stateHolder = stateHolder,
+                    onAgreementClick = onAgreementClick,
+                    onShowCopySnackbar = { isCopyButtonPressed.value = true },
+                )
             }
         }
 
@@ -368,10 +350,9 @@ private fun BoxScope.ErrorSnackbarHost(errorSnackbar: ErrorSnackbar?) {
                     modifier = Modifier.fillMaxWidth(),
                     actionOnNewLine = true,
                     shape = RoundedCornerShape(size = TangemTheme.dimens.radius8),
-                    backgroundColor = TangemColorPalette.Black,
+                    containerColor = TangemColorPalette.Black,
                     contentColor = TangemTheme.colors.text.primary2,
                     actionColor = TangemTheme.colors.text.primary2,
-                    elevation = TangemTheme.dimens.elevation3,
                 )
             },
         )
@@ -400,7 +381,7 @@ private fun BoxScope.CopySnackbarHost(isCopyButtonPressed: MutableState<Boolean>
         val snackbarHostState by remember { mutableStateOf(SnackbarHostState()) }
         val coroutineScope = rememberCoroutineScope()
 
-        var snackbarSize by remember { mutableStateOf(0) }
+        var snackbarSize by remember { mutableIntStateOf(value = 0) }
         val width = LocalConfiguration.current.screenWidthDp.dp
         val snackbarWidth = with(LocalDensity.current) { snackbarSize.toDp() }
 
@@ -424,7 +405,7 @@ private fun BoxScope.CopySnackbarHost(isCopyButtonPressed: MutableState<Boolean>
                         ),
                 ) {
                     Text(
-                        text = it.message,
+                        text = it.visuals.message,
                         color = TangemTheme.colors.text.primary2,
                         style = TangemTheme.typography.body2,
                     )