Skip to content

Commit

Permalink
Merge pull request #1274 from WalletConnect/fix/w3m/nested_scroll_fix
Browse files Browse the repository at this point in the history
[W3M] Fix nested scroll in BottomSheetFragments
kacperoak authored Jan 15, 2024
2 parents fc993c5 + e7e0374 commit 685ed43
Showing 3 changed files with 43 additions and 25 deletions.
Original file line number Diff line number Diff line change
@@ -1,23 +1,29 @@
package com.walletconnect.web3.modal.ui

import android.app.Dialog
import android.content.Context
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.FrameLayout
import androidx.activity.ComponentDialog
import androidx.activity.OnBackPressedCallback
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Surface
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.nestedscroll.nestedScroll
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.platform.ViewCompositionStrategy
import androidx.compose.ui.platform.rememberNestedScrollInteropConnection
import androidx.compose.ui.unit.dp
import androidx.core.content.res.use
import androidx.core.content.res.getColorOrThrow
import androidx.core.content.res.use
import androidx.navigation.NavHostController
import androidx.navigation.compose.rememberNavController
import com.google.android.material.bottomsheet.BottomSheetBehavior
import com.google.android.material.bottomsheet.BottomSheetDialogFragment
import com.walletconnect.modal.utils.theme.toComposeColor
import com.walletconnect.web3.modal.R
@@ -60,30 +66,34 @@ class Web3ModalSheet : BottomSheetDialogFragment() {
shouldOpenChooseNetwork: Boolean
) {
val navController = rememberNavController()
(dialog as? ComponentDialog)?.onBackPressedDispatcher?.addCallback(
this@Web3ModalSheet,
onBackPressedCallback(navController)
)
Surface(
shape = RoundedCornerShape(topStart = 36.dp, topEnd = 36.dp)
) {
dialog?.setupDialog(navController)

Surface(shape = RoundedCornerShape(topStart = 36.dp, topEnd = 36.dp)) {
Web3ModalComponent(
modifier = Modifier.nestedScroll(rememberNestedScrollInteropConnection()),
navController = navController,
shouldOpenChooseNetwork = shouldOpenChooseNetwork,
closeModal = { this@Web3ModalSheet.dismiss() }
)
closeModal = { this@Web3ModalSheet.dismiss() })
}
}

private fun Dialog.setupDialog(navController: NavHostController) {
(this as? ComponentDialog)?.onBackPressedDispatcher?.addCallback(
this@Web3ModalSheet, onBackPressedCallback(navController)
)
findViewById<FrameLayout>(com.google.android.material.R.id.design_bottom_sheet)?.let {
val behavior = BottomSheetBehavior.from(it)
behavior.state = BottomSheetBehavior.STATE_EXPANDED
}
}

private fun onBackPressedCallback(navController: NavHostController) =
object : OnBackPressedCallback(true) {
override fun handleOnBackPressed() {
if (navController.popBackStack().not()) {
dismiss()
}
private fun onBackPressedCallback(navController: NavHostController) = object : OnBackPressedCallback(true) {
override fun handleOnBackPressed() {
if (navController.popBackStack().not()) {
dismiss()
}
}
}
}

@Composable
@@ -177,14 +187,16 @@ private val themeColorsAttributesMap = mapOf(
23 to R.attr.modalError,
)

internal fun Context.getColorMap() =
obtainStyledAttributes(themeColorsAttributesMap.values.toIntArray()).use {
themeColorsAttributesMap.keys.map { id ->
themeColorsAttributesMap[id]!! to try { it.getColorOrThrow(id).toComposeColor() } catch (e: Exception) { null }
internal fun Context.getColorMap() = obtainStyledAttributes(themeColorsAttributesMap.values.toIntArray()).use {
themeColorsAttributesMap.keys.map { id ->
themeColorsAttributesMap[id]!! to try {
it.getColorOrThrow(id).toComposeColor()
} catch (e: Exception) {
null
}
}.toMap()
}
}.toMap()

internal fun Context.getThemeMode() = obtainStyledAttributes(intArrayOf(R.attr.modalMode))
.use { it.getInt(0, 0) }.toThemeMode()
internal fun Context.getThemeMode() = obtainStyledAttributes(intArrayOf(R.attr.modalMode)).use { it.getInt(0, 0) }.toThemeMode()

private fun Bundle?.getShouldOpenChooseNetworkArg() = this?.getBoolean(CHOOSE_NETWORK_KEY) ?: false
Original file line number Diff line number Diff line change
@@ -12,6 +12,7 @@ import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavHostController
import androidx.navigation.compose.rememberNavController
@@ -25,12 +26,12 @@ import com.walletconnect.web3.modal.ui.routes.connect.ConnectionNavGraph
import com.walletconnect.web3.modal.ui.utils.ComposableLifecycleEffect
import com.walletconnect.web3.modal.ui.utils.toComponentEvent
import kotlinx.coroutines.flow.collect
import kotlinx.coroutines.flow.filterIsInstance
import kotlinx.coroutines.flow.onEach
import kotlinx.coroutines.launch

@Composable
fun Web3ModalComponent(
modifier: Modifier = Modifier,
navController: NavHostController = rememberNavController(),
shouldOpenChooseNetwork: Boolean,
closeModal: () -> Unit
@@ -62,6 +63,7 @@ fun Web3ModalComponent(
)

Web3ModalRoot(
modifier = modifier,
navController = navController,
closeModal = closeModal
) {
Original file line number Diff line number Diff line change
@@ -42,6 +42,7 @@ import kotlinx.coroutines.flow.onEach
@Composable
internal fun Web3ModalRoot(
navController: NavHostController,
modifier: Modifier = Modifier,
closeModal: () -> Unit,
content: @Composable () -> Unit
) {
@@ -60,7 +61,10 @@ internal fun Web3ModalRoot(
.collect()
}

Column(verticalArrangement = Arrangement.Bottom) {
Column(
verticalArrangement = Arrangement.Bottom,
modifier = modifier
) {
ProvideWeb3ModalThemeComposition {
Web3ModalRoot(rootState, snackBarState, title, closeModal, content)
}

0 comments on commit 685ed43

Please sign in to comment.