diff --git a/app/src/main/java/one/mixin/android/compose/InputAmountScreen.kt b/app/src/main/java/one/mixin/android/compose/InputAmountScreen.kt
index 6d0b36467f..7cf0e412fa 100644
--- a/app/src/main/java/one/mixin/android/compose/InputAmountScreen.kt
+++ b/app/src/main/java/one/mixin/android/compose/InputAmountScreen.kt
@@ -59,9 +59,9 @@ import one.mixin.android.extension.generateQRCode
 import one.mixin.android.extension.tickVibrate
 import one.mixin.android.session.Session
 import one.mixin.android.ui.common.roundQrBackground
-import one.mixin.android.ui.home.web3.components.ActionButton
 import one.mixin.android.util.getChainName
 import one.mixin.android.vo.safe.TokenItem
+import one.mixin.android.widget.components.ActionButton
 import androidx.hilt.navigation.compose.hiltViewModel
 import one.mixin.android.ui.wallet.WalletViewModel
 import kotlinx.coroutines.launch
diff --git a/app/src/main/java/one/mixin/android/ui/common/profile/InputReferralBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/common/profile/InputReferralBottomSheetDialogFragment.kt
index a03cf796cb..4f3f74084b 100644
--- a/app/src/main/java/one/mixin/android/ui/common/profile/InputReferralBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/common/profile/InputReferralBottomSheetDialogFragment.kt
@@ -48,7 +48,7 @@ import one.mixin.android.extension.screenHeight
 import one.mixin.android.ui.common.BottomSheetViewModel
 import one.mixin.android.ui.common.MixinComposeBottomSheetDialogFragment
 import one.mixin.android.ui.common.compose.MaterialInputField
-import one.mixin.android.ui.home.web3.components.ActionButton
+import one.mixin.android.widget.components.ActionButton
 import one.mixin.android.ui.url.UrlInterpreterActivity
 import one.mixin.android.util.ErrorHandler.Companion.errorHandler
 import one.mixin.android.util.SystemUIManager
diff --git a/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBindPreviewBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBindPreviewBottomSheetDialogFragment.kt
index 105078b4e0..b7cd8d5abf 100644
--- a/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBindPreviewBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBindPreviewBottomSheetDialogFragment.kt
@@ -50,7 +50,7 @@ import one.mixin.android.extension.screenHeight
 import one.mixin.android.ui.common.BottomSheetViewModel
 import one.mixin.android.ui.common.MixinComposeBottomSheetDialogFragment
 import one.mixin.android.ui.common.UserBottomSheetDialogFragment
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.landing.components.HighlightedTextWithClick
 import one.mixin.android.ui.tip.wc.compose.ItemContent
 import one.mixin.android.ui.wallet.ItemUserContent
diff --git a/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBottomSheetDialogFragment.kt
index 9aa9fcfbfb..2d758bc0c4 100644
--- a/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/common/profile/ReferralBottomSheetDialogFragment.kt
@@ -51,7 +51,7 @@ import one.mixin.android.extension.roundTopOrBottom
 import one.mixin.android.extension.screenHeight
 import one.mixin.android.ui.common.MixinComposeBottomSheetDialogFragment
 import one.mixin.android.ui.home.bot.INTERNAL_REFERRAL_ID
-import one.mixin.android.ui.home.web3.components.ActionButton
+import one.mixin.android.widget.components.ActionButton
 import one.mixin.android.ui.landing.components.HighlightedTextWithClick
 import one.mixin.android.ui.landing.components.NumberedText
 import one.mixin.android.ui.setting.member.MixinMemberUpgradeBottomSheetDialogFragment
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/BrowserPage.kt b/app/src/main/java/one/mixin/android/ui/home/web3/BrowserPage.kt
index d18e6e3b68..fe5c450d6a 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/BrowserPage.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/BrowserPage.kt
@@ -53,7 +53,7 @@ import one.mixin.android.extension.toast
 import one.mixin.android.tip.wc.internal.Chain
 import one.mixin.android.tip.wc.internal.TipGas
 import one.mixin.android.tip.wc.internal.WCEthereumTransaction
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.home.web3.components.MessagePreview
 import one.mixin.android.ui.home.web3.components.ParsedTxPreview
 import one.mixin.android.ui.home.web3.components.TokenTransactionPreview
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/components/Review.kt b/app/src/main/java/one/mixin/android/ui/home/web3/components/Review.kt
index 9e48f16378..89d57daf06 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/components/Review.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/components/Review.kt
@@ -24,7 +24,7 @@ import androidx.compose.foundation.text.TextAutoSize
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
+import one.mixin.android.widget.components.MixinButton
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.Icon
@@ -72,6 +72,7 @@ import one.mixin.android.util.GsonHelper
 import one.mixin.android.vo.priceUSD
 import one.mixin.android.vo.safe.Token
 import one.mixin.android.web3.js.SolanaTxSource
+import one.mixin.android.widget.components.ActionBottom
 import java.math.BigDecimal
 
 private val gradientColors = listOf(Cyan, Color(0xFF0066FF), Color(0xFF800080))
@@ -722,75 +723,6 @@ private fun WarningPreview() {
     }
 }
 
-@Composable
-fun ActionButton(
-    text: String,
-    onClick: () -> Unit,
-    backgroundColor: Color,
-    contentColor: Color,
-    modifier: Modifier = Modifier,
-    enabled: Boolean = true,
-    disabledBackgroundColor: Color = backgroundColor.copy(alpha = 0.4f),
-    disabledContentColor: Color = contentColor.copy(alpha = 0.6f),
-) {
-    Button(
-        onClick = onClick,
-        enabled = enabled,
-        colors = ButtonDefaults.outlinedButtonColors(
-            backgroundColor = if (enabled) backgroundColor else disabledBackgroundColor,
-            contentColor = if (enabled) contentColor else disabledContentColor,
-        ),
-        shape = RoundedCornerShape(30.dp),
-        contentPadding = PaddingValues(horizontal = 35.dp, vertical = 10.dp),
-        elevation = ButtonDefaults.elevation(
-            pressedElevation = 0.dp,
-            defaultElevation = 0.dp,
-            hoveredElevation = 0.dp,
-            focusedElevation = 0.dp,
-        ),
-        modifier = modifier
-    ) {
-        Text(
-            text = text,
-            color = if (enabled) contentColor else disabledContentColor,
-            fontSize = 16.sp,
-            fontWeight = FontWeight.W400
-        )
-    }
-}
-
-@Composable
-fun ActionBottom(
-    modifier: Modifier,
-    cancelTitle: String,
-    confirmTitle: String,
-    cancelAction: () -> Unit,
-    confirmAction: () -> Unit,
-) {
-    Row(
-        modifier =
-        modifier
-            .background(MixinAppTheme.colors.background)
-            .padding(8.dp)
-            .fillMaxWidth(),
-        horizontalArrangement = Arrangement.Center,
-    ) {
-        ActionButton(
-            text = cancelTitle,
-            onClick = cancelAction,
-            backgroundColor = MixinAppTheme.colors.backgroundWindow,
-            contentColor = MixinAppTheme.colors.textPrimary
-        )
-        Box(modifier = Modifier.width(36.dp))
-        ActionButton(
-            text = confirmTitle,
-            onClick = confirmAction,
-            backgroundColor = MixinAppTheme.colors.accent,
-            contentColor = Color.White
-        )
-    }
-}
-
 @Preview
 @Composable
 fun TransferBottomPreview() {
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/stake/StakePage.kt b/app/src/main/java/one/mixin/android/ui/home/web3/stake/StakePage.kt
index 906579f102..49ad372745 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/stake/StakePage.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/stake/StakePage.kt
@@ -21,7 +21,7 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.BasicTextField
 import androidx.compose.foundation.text.KeyboardOptions
-import androidx.compose.material.Button
+import one.mixin.android.widget.components.MixinButton
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.Divider
@@ -127,7 +127,7 @@ fun StakePage(
                     LocalSoftwareKeyboardController.current
                 val focusManager = LocalFocusManager.current
                 if (amountText.isNotEmpty()) {
-                    Button(
+                    MixinButton(
                         modifier = Modifier.fillMaxWidth(),
                         enabled = !isLoading,
                         onClick = {
@@ -135,19 +135,8 @@ fun StakePage(
                             focusManager.clearFocus()
                             onStake.invoke()
                         },
-                        colors =
-                            ButtonDefaults.outlinedButtonColors(
-                                backgroundColor = if (checkBalance != true) MixinAppTheme.colors.backgroundGray else MixinAppTheme.colors.accent,
-                            ),
-                        shape = RoundedCornerShape(32.dp),
-                        contentPadding = PaddingValues(vertical = 16.dp),
-                        elevation =
-                            ButtonDefaults.elevation(
-                                pressedElevation = 0.dp,
-                                defaultElevation = 0.dp,
-                                hoveredElevation = 0.dp,
-                                focusedElevation = 0.dp,
-                            ),
+                        backgroundColor = if (checkBalance != true) MixinAppTheme.colors.backgroundGray else MixinAppTheme.colors.accent,
+                        contentColor = if (checkBalance != true) MixinAppTheme.colors.textAssist else Color.White,
                     ) {
                         if (isLoading) {
                             CircularProgressIndicator(
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/stake/UnstakePage.kt b/app/src/main/java/one/mixin/android/ui/home/web3/stake/UnstakePage.kt
index 8051b3ada8..f98d74310c 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/stake/UnstakePage.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/stake/UnstakePage.kt
@@ -12,7 +12,7 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
+import one.mixin.android.widget.components.MixinButton
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.Divider
@@ -79,24 +79,11 @@ fun UnstakePage(
                 StakeInfo(validator, stakeAccount, stakeActivation)
                 Spacer(modifier = Modifier.weight(1f))
                 if (!stakeState.isDeactivatingState()) {
-                    Button(
+                    MixinButton(
                         modifier = Modifier.fillMaxWidth(),
                         onClick = {
                             onClick.invoke()
                         },
-                        colors =
-                            ButtonDefaults.outlinedButtonColors(
-                                backgroundColor = MixinAppTheme.colors.accent,
-                            ),
-                        shape = RoundedCornerShape(32.dp),
-                        contentPadding = PaddingValues(vertical = 16.dp),
-                        elevation =
-                            ButtonDefaults.elevation(
-                                pressedElevation = 0.dp,
-                                defaultElevation = 0.dp,
-                                hoveredElevation = 0.dp,
-                                focusedElevation = 0.dp,
-                            ),
                     ) {
                         if (isLoading) {
                             CircularProgressIndicator(
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/trade/LimitOrderContent.kt b/app/src/main/java/one/mixin/android/ui/home/web3/trade/LimitOrderContent.kt
index 6393ece5ed..228a4282ae 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/trade/LimitOrderContent.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/trade/LimitOrderContent.kt
@@ -23,8 +23,7 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.Button
-import androidx.compose.material.ButtonDefaults
+import one.mixin.android.widget.components.MixinButton
 import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.Icon
 import androidx.compose.material.Text
@@ -440,7 +439,9 @@ fun LimitOrderContent(
                         val isOutputValid = outputText.toBigDecimalOrNull()?.let { it > BigDecimal.ZERO } == true
                         val isEnabled = isInputValid && isPriceValid && isOutputValid && checkBalance == true && toToken != null
                         val isBusy = isSubmitting || reviewing
-                        Button(
+                        val buttonBackgroundColor = if (isEnabled) MixinAppTheme.colors.accent else MixinAppTheme.colors.backgroundGrayLight
+                        val buttonContentColor = if (isEnabled) Color.White else MixinAppTheme.colors.textAssist
+                        MixinButton(
                             modifier = Modifier
                                 .fillMaxWidth()
                                 .height(48.dp),
@@ -492,16 +493,10 @@ fun LimitOrderContent(
                                 }
                             },
                             enabled = isEnabled && !isBusy,
-                            colors = ButtonDefaults.outlinedButtonColors(
-                                backgroundColor = if (isEnabled) MixinAppTheme.colors.accent else MixinAppTheme.colors.backgroundGrayLight,
-                            ),
-                            shape = RoundedCornerShape(32.dp),
-                            elevation = ButtonDefaults.elevation(
-                                pressedElevation = 0.dp,
-                                defaultElevation = 0.dp,
-                                hoveredElevation = 0.dp,
-                                focusedElevation = 0.dp,
-                            ),
+                            backgroundColor = buttonBackgroundColor,
+                            contentColor = buttonContentColor,
+                            disabledBackgroundColor = MixinAppTheme.colors.backgroundGrayLight,
+                            disabledContentColor = MixinAppTheme.colors.textAssist,
                         ) {
                             Box(
                                 modifier = Modifier
@@ -514,13 +509,13 @@ fun LimitOrderContent(
                                         modifier = Modifier
                                             .width(18.dp)
                                             .height(18.dp),
-                                        color = if (isEnabled) Color.White else MixinAppTheme.colors.textAssist,
+                                        color = buttonContentColor,
                                         strokeWidth = 2.dp,
                                     )
                                 } else {
                                     Text(
                                         text = if (checkBalance == false) "${fromToken?.symbol} ${stringResource(R.string.insufficient_balance)}" else stringResource(R.string.Review_Order),
-                                        color = if (isEnabled) Color.White else MixinAppTheme.colors.textAssist,
+                                        color = buttonContentColor,
                                     )
                                 }
                             }
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapContent.kt b/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapContent.kt
index d8a55cd60c..e5ad9e5390 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapContent.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapContent.kt
@@ -24,8 +24,7 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.Button
-import androidx.compose.material.ButtonDefaults
+import one.mixin.android.widget.components.MixinButton
 import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.Icon
 import androidx.compose.material.Text
@@ -399,7 +398,17 @@ fun ReviewButton(
     val checkBalance = checkBalance(inputText, fromBalance)
     val isBusy = isLoading || reviewing
     val hasError = quoteError != null
-    Button(
+    val buttonBackgroundColor = if (quoteResult != null && !hasError && checkBalance == true) {
+        MixinAppTheme.colors.accent
+    } else {
+        MixinAppTheme.colors.backgroundGrayLight
+    }
+    val buttonContentColor = if (checkBalance != true || hasError) {
+        MixinAppTheme.colors.textAssist
+    } else {
+        Color.White
+    }
+    MixinButton(
         modifier = Modifier
             .padding(horizontal = 20.dp)
             .fillMaxWidth()
@@ -417,29 +426,15 @@ fun ReviewButton(
             }
         },
         enabled = quoteResult != null && !hasError && !isBusy && checkBalance == true,
-        colors = ButtonDefaults.outlinedButtonColors(
-            backgroundColor = if (quoteResult != null && !hasError && checkBalance == true) {
-                MixinAppTheme.colors.accent
-            } else {
-                MixinAppTheme.colors.backgroundGrayLight
-            },
-        ),
-        shape = RoundedCornerShape(32.dp),
-        elevation = ButtonDefaults.elevation(
-            pressedElevation = 0.dp,
-            defaultElevation = 0.dp,
-            hoveredElevation = 0.dp,
-            focusedElevation = 0.dp,
-        ),
+        backgroundColor = buttonBackgroundColor,
+        contentColor = buttonContentColor,
+        disabledBackgroundColor = MixinAppTheme.colors.backgroundGrayLight,
+        disabledContentColor = MixinAppTheme.colors.textAssist,
     ) {
         if (isBusy) {
             CircularProgressIndicator(
                 modifier = Modifier.size(18.dp),
-                color = if (quoteResult != null && !hasError && checkBalance == true) {
-                    Color.White
-                } else {
-                    MixinAppTheme.colors.textAssist
-                },
+                color = buttonContentColor,
             )
         } else {
             Text(
@@ -448,11 +443,7 @@ fun ReviewButton(
                 } else {
                     stringResource(R.string.Review_Order)
                 },
-                color = if (checkBalance != true || hasError) {
-                    MixinAppTheme.colors.textAssist
-                } else {
-                    Color.White
-                },
+                color = buttonContentColor,
             )
         }
     }
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapTokenPage.kt b/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapTokenPage.kt
index cd17c5ffec..84add283a8 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapTokenPage.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/trade/SwapTokenPage.kt
@@ -14,7 +14,7 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
+import one.mixin.android.widget.components.MixinButton
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.Icon
 import androidx.compose.material.Text
@@ -103,23 +103,9 @@ fun SwapTokenPage(
                 }
             }
             Spacer(modifier = Modifier.height(20.dp))
-            Button(
+            MixinButton(
                 modifier = Modifier.fillMaxWidth(),
-                onClick =
-                confirmAction,
-                colors =
-                    ButtonDefaults.outlinedButtonColors(
-                        backgroundColor = MixinAppTheme.colors.accent,
-                    ),
-                shape = RoundedCornerShape(32.dp),
-                contentPadding = PaddingValues(vertical = 16.dp),
-                elevation =
-                    ButtonDefaults.elevation(
-                        pressedElevation = 0.dp,
-                        defaultElevation = 0.dp,
-                        hoveredElevation = 0.dp,
-                        focusedElevation = 0.dp,
-                    ),
+                onClick = confirmAction,
             ) {
                 Text(
                     text = stringResource(id = R.string.view_on_explorer),
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsCloseBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsCloseBottomSheetDialogFragment.kt
index f6a79311a1..6bfa7c5964 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsCloseBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsCloseBottomSheetDialogFragment.kt
@@ -63,7 +63,7 @@ import one.mixin.android.extension.withArgs
 import one.mixin.android.ui.common.BottomSheetViewModel
 import one.mixin.android.ui.common.MixinComposeBottomSheetDialogFragment
 import one.mixin.android.ui.common.VerifyBottomSheetDialogFragment
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.tip.wc.compose.ItemWalletContent
 import one.mixin.android.ui.wallet.ItemUserContent
 import one.mixin.android.ui.wallet.components.WalletLabel
diff --git a/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsConfirmBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsConfirmBottomSheetDialogFragment.kt
index 34f448527e..d0817600d8 100644
--- a/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsConfirmBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/home/web3/trade/perps/PerpsConfirmBottomSheetDialogFragment.kt
@@ -76,7 +76,7 @@ import one.mixin.android.ui.common.PinInputBottomSheetDialogFragment
 import one.mixin.android.ui.common.UtxoConsolidationBottomSheetDialogFragment
 import one.mixin.android.ui.common.biometric.BiometricInfo
 import one.mixin.android.ui.common.biometric.buildTransferBiometricItem
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.tip.wc.compose.ItemWalletContent
 import one.mixin.android.ui.wallet.ItemUserContent
 import one.mixin.android.ui.wallet.components.WalletLabel
diff --git a/app/src/main/java/one/mixin/android/ui/tip/wc/sessionproposal/SessionProposalPage.kt b/app/src/main/java/one/mixin/android/ui/tip/wc/sessionproposal/SessionProposalPage.kt
index c6883c971b..73fda2ad61 100644
--- a/app/src/main/java/one/mixin/android/ui/tip/wc/sessionproposal/SessionProposalPage.kt
+++ b/app/src/main/java/one/mixin/android/ui/tip/wc/sessionproposal/SessionProposalPage.kt
@@ -43,7 +43,7 @@ import one.mixin.android.extension.composeDp
 import one.mixin.android.extension.notNullWithElse
 import one.mixin.android.tip.wc.WalletConnect
 import one.mixin.android.tip.wc.internal.Chain
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.tip.wc.WalletConnectBottomSheetDialogFragment
 import one.mixin.android.ui.tip.wc.compose.ItemContent
 import one.mixin.android.ui.tip.wc.compose.Loading
diff --git a/app/src/main/java/one/mixin/android/ui/tip/wc/sessionrequest/SessionRequestPage.kt b/app/src/main/java/one/mixin/android/ui/tip/wc/sessionrequest/SessionRequestPage.kt
index 33623d8232..3b4972666b 100644
--- a/app/src/main/java/one/mixin/android/ui/tip/wc/sessionrequest/SessionRequestPage.kt
+++ b/app/src/main/java/one/mixin/android/ui/tip/wc/sessionrequest/SessionRequestPage.kt
@@ -59,8 +59,6 @@ import one.mixin.android.tip.wc.internal.Method
 import one.mixin.android.tip.wc.internal.TipGas
 import one.mixin.android.tip.wc.internal.WCEthereumSignMessage
 import one.mixin.android.tip.wc.internal.WCEthereumTransaction
-import one.mixin.android.ui.home.web3.components.ActionBottom
-import one.mixin.android.ui.home.web3.components.ActionButton
 import one.mixin.android.ui.home.web3.components.MessagePreview
 import one.mixin.android.ui.home.web3.components.TransactionPreview
 import one.mixin.android.ui.home.web3.components.Warning
@@ -71,6 +69,8 @@ import one.mixin.android.ui.wallet.components.WalletLabel
 import one.mixin.android.vo.priceUSD
 import one.mixin.android.vo.safe.Token
 import one.mixin.android.web3.js.Web3Signer
+import one.mixin.android.widget.components.ActionBottom
+import one.mixin.android.widget.components.ActionButton
 import one.mixin.android.widget.components.MixinButton
 import org.web3j.utils.Convert
 import org.web3j.utils.Numeric
diff --git a/app/src/main/java/one/mixin/android/ui/wallet/LimitTransferBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/wallet/LimitTransferBottomSheetDialogFragment.kt
index aa7fdf7f19..2fa28b2a25 100644
--- a/app/src/main/java/one/mixin/android/ui/wallet/LimitTransferBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/wallet/LimitTransferBottomSheetDialogFragment.kt
@@ -102,7 +102,7 @@ import one.mixin.android.ui.common.biometric.buildTransferBiometricItem
 import one.mixin.android.ui.common.biometric.getUtxoExceptionMsg
 import one.mixin.android.ui.common.biometric.isUtxoException
 import one.mixin.android.ui.home.web3.Web3ViewModel
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.tip.wc.compose.ItemContent
 import one.mixin.android.ui.tip.wc.compose.ItemWalletContent
 import one.mixin.android.ui.tip.wc.sessionrequest.FeeInfo
diff --git a/app/src/main/java/one/mixin/android/ui/wallet/SwapTransferBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/wallet/SwapTransferBottomSheetDialogFragment.kt
index 562c662195..9013b92878 100644
--- a/app/src/main/java/one/mixin/android/ui/wallet/SwapTransferBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/wallet/SwapTransferBottomSheetDialogFragment.kt
@@ -117,7 +117,7 @@ import one.mixin.android.ui.common.biometric.buildTransferBiometricItem
 import one.mixin.android.ui.common.biometric.getUtxoExceptionMsg
 import one.mixin.android.ui.common.biometric.isUtxoException
 import one.mixin.android.ui.home.web3.Web3ViewModel
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.tip.wc.WalletConnectActivity
 import one.mixin.android.ui.tip.wc.compose.ItemContent
 import one.mixin.android.ui.tip.wc.compose.ItemWalletContent
diff --git a/app/src/main/java/one/mixin/android/ui/wallet/WalletMultiSelectBottomSheetDialogFragment.kt b/app/src/main/java/one/mixin/android/ui/wallet/WalletMultiSelectBottomSheetDialogFragment.kt
index 0003d41a6d..c24d823da8 100644
--- a/app/src/main/java/one/mixin/android/ui/wallet/WalletMultiSelectBottomSheetDialogFragment.kt
+++ b/app/src/main/java/one/mixin/android/ui/wallet/WalletMultiSelectBottomSheetDialogFragment.kt
@@ -43,7 +43,7 @@ import one.mixin.android.extension.getSafeAreaInsetsTop
 import one.mixin.android.extension.screenHeight
 import one.mixin.android.extension.withArgs
 import one.mixin.android.ui.common.MixinComposeBottomSheetDialogFragment
-import one.mixin.android.ui.home.web3.components.ActionBottom
+import one.mixin.android.widget.components.ActionBottom
 import one.mixin.android.ui.wallet.components.PREF_NAME
 import one.mixin.android.ui.wallet.components.WalletCard
 import one.mixin.android.ui.wallet.components.WalletDestination
diff --git a/app/src/main/java/one/mixin/android/widget/components/MaterialButton.kt b/app/src/main/java/one/mixin/android/widget/components/MaterialButton.kt
index ba2486d8d6..c4c4111591 100644
--- a/app/src/main/java/one/mixin/android/widget/components/MaterialButton.kt
+++ b/app/src/main/java/one/mixin/android/widget/components/MaterialButton.kt
@@ -1,8 +1,14 @@
 package one.mixin.android.widget.components
 
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Button
 import androidx.compose.material.ButtonDefaults
@@ -11,8 +17,10 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
 import one.mixin.android.compose.theme.MixinAppTheme
 
 @Composable
@@ -54,7 +62,8 @@ fun MixinButton(
     contentColor: Color = Color.White,
     disabledBackgroundColor: Color = backgroundColor.copy(alpha = 0.4f),
     disabledContentColor: Color = contentColor.copy(alpha = 0.6f),
-    content: @Composable () -> Unit,
+    text: String? = null,
+    content: (@Composable () -> Unit)? = null,
 ) {
     Button(
         onClick = onClick,
@@ -75,6 +84,80 @@ fun MixinButton(
             focusedElevation = elevation,
         ),
     ) {
-        content()
+        when {
+            text != null -> {
+                Text(
+                    text = text,
+                    color = contentColor,
+                    fontSize = 16.sp,
+                    fontWeight = FontWeight.W500
+                )
+            }
+            content != null -> content()
+        }
+    }
+}
+
+
+@Composable
+fun ActionButton(
+    text: String,
+    onClick: () -> Unit,
+    backgroundColor: Color,
+    contentColor: Color,
+    modifier: Modifier = Modifier,
+    enabled: Boolean = true,
+    disabledBackgroundColor: Color = backgroundColor.copy(alpha = 0.4f),
+    disabledContentColor: Color = contentColor.copy(alpha = 0.6f),
+) {
+    MixinButton(
+        onClick = onClick,
+        enabled = enabled,
+        backgroundColor = backgroundColor,
+        contentColor = contentColor,
+        disabledBackgroundColor = disabledBackgroundColor,
+        disabledContentColor = disabledContentColor,
+        shape = RoundedCornerShape(30.dp),
+        contentPadding = PaddingValues(horizontal = 35.dp, vertical = 10.dp),
+        modifier = modifier
+    ) {
+        Text(
+            text = text,
+            color = if (enabled) contentColor else disabledContentColor,
+            fontSize = 16.sp,
+            fontWeight = FontWeight.W400
+        )
+    }
+}
+
+@Composable
+fun ActionBottom(
+    modifier: Modifier,
+    cancelTitle: String,
+    confirmTitle: String,
+    cancelAction: () -> Unit,
+    confirmAction: () -> Unit,
+) {
+    Row(
+        modifier =
+            modifier
+                .background(MixinAppTheme.colors.background)
+                .padding(8.dp)
+                .fillMaxWidth(),
+        horizontalArrangement = Arrangement.Center,
+    ) {
+        ActionButton(
+            text = cancelTitle,
+            onClick = cancelAction,
+            backgroundColor = MixinAppTheme.colors.backgroundWindow,
+            contentColor = MixinAppTheme.colors.textPrimary
+        )
+        Box(modifier = Modifier.width(36.dp))
+        ActionButton(
+            text = confirmTitle,
+            onClick = confirmAction,
+            backgroundColor = MixinAppTheme.colors.accent,
+            contentColor = Color.White
+        )
     }
 }