stripe-android
stripe-android copied to clipboard
[BUG] The use of rememberPaymentSheet in jetpack compose Generate Thousands of recompositions in all the view
Summary
The number of recompositions before to implement stripe is normal, but if I only add this line.
import com.stripe.android.paymentsheet.rememberPaymentSheet
rememberPaymentSheet(paymentResultCallback = {
Log.e("teste","test $it")
})
Generate to much recompositions by seconds.
Code to reproduce
@Composable
@Preview
fun TestForStripe(){
val typePayments= listOf("Basic", "Premium")
var currentPayment by remember {
mutableStateOf("Basic")
}
val data= rememberPaymentSheet(paymentResultCallback = {
Log.e("teste","test $it")
})
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun SegmentedPicker(
modifier: Modifier = Modifier,
items: List<String>,
currentSelected: String = currentPayment,
cornerRadius: Int = 24,
onItemSelection: (selectedItem: String) -> Unit
) {
Card(
modifier = Modifier
.fillMaxWidth()
.height(38.dp),
colors = CardDefaults.cardColors(
containerColor = Color.White.copy(alpha = 0.16f)
),
shape = RoundedCornerShape(cornerRadius)
) {
Row(
modifier = modifier
.fillMaxWidth()
.background(Color.White.copy(alpha = 0.16f)),
horizontalArrangement = Arrangement.Center
) {
items.forEachIndexed { index, item ->
Card(
modifier = modifier
.weight(1f)
.height((38 + 8).dp),
onClick = {
onItemSelection(item)
},
colors = CardDefaults.cardColors(
containerColor = if (item == currentSelected) {
Color.White
} else {
Color.Transparent
},
contentColor = if (item == currentSelected)
Color.Black
else
Color.White
),
shape = when (index) {
0 -> RoundedCornerShape(
topStartPercent = cornerRadius,
topEndPercent = cornerRadius,
bottomStartPercent = cornerRadius,
bottomEndPercent = cornerRadius
)
items.size - 1 -> RoundedCornerShape(
topStartPercent = cornerRadius,
topEndPercent = cornerRadius,
bottomStartPercent = cornerRadius,
bottomEndPercent = cornerRadius
)
else -> RoundedCornerShape(
topStartPercent = 0,
topEndPercent = 0,
bottomStartPercent = 0,
bottomEndPercent = 0
)
},
) {
Box(modifier = modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
Text(
text = item,
textAlign = TextAlign.Center
)
}
}
}
}
}
}
Box(modifier = Modifier
.fillMaxSize()
.background(Color.Black)){
Column {
SegmentedPicker(
items = typePayments,
currentSelected = currentPayment,
onItemSelection = {
currentPayment =it
}
)
Text(currentPayment, color = Color.White, style = MaterialTheme.typography.titleLarge)
}
}
}```
## Android version
All
kotlin:
stripe-android: com.stripe:stripe-android:20.34.4
## Video
<img width="981" alt="Screenshot 2024-02-28 at 9 45 48 AM" src="https://github.com/stripe/stripe-android/assets/48421004/65cb4c3a-6416-46b5-8edf-2ed5498936f5">
## Other information
This error happens when you start any interaction with the screen like push a button, edit text, etc.
If this error generate more than 200 times only with 2 items, if I have one complete screen this will generate all the screen will be lag.