Skip to content

Commit

Permalink
Add WalletConnect Modal support (#22)
Browse files Browse the repository at this point in the history
* Add WalletConnect Modal support

* Clean up
  • Loading branch information
ruixhuang authored Nov 27, 2024
1 parent a3a4ccb commit 358387d
Show file tree
Hide file tree
Showing 16 changed files with 855 additions and 119 deletions.
24 changes: 15 additions & 9 deletions app/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ plugins {

android {
namespace 'exchange.dydx.carteraexample'
compileSdk 34
compileSdk 35

defaultConfig {
applicationId "exchange.dydx.carteraexample"
Expand Down Expand Up @@ -47,24 +47,30 @@ android {
dependencies {
implementation project(path: ':cartera')

implementation 'androidx.core:core-ktx:1.12.0'
implementation platform('org.jetbrains.kotlin:kotlin-bom:1.8.0')
implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.7.0'
implementation 'androidx.activity:activity-compose:1.8.2'
implementation platform('androidx.compose:compose-bom:2022.10.00')
implementation 'androidx.core:core-ktx:1.15.0'
implementation platform('org.jetbrains.kotlin:kotlin-bom:1.9.24')
implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.8.7'
implementation 'androidx.activity:activity-compose:1.9.3'
implementation platform('androidx.compose:compose-bom:2024.11.00')
implementation 'com.google.accompanist:accompanist-navigation-material:0.34.0'
implementation 'androidx.compose.ui:ui'
implementation 'androidx.compose.ui:ui-graphics'
implementation 'androidx.compose.ui:ui-tooling-preview'
implementation 'androidx.compose.material3:material3'
implementation 'androidx.compose.material:material'
implementation 'androidx.navigation:navigation-runtime-ktx:2.8.4'
implementation 'androidx.navigation:navigation-compose:2.8.4'
testImplementation 'junit:junit:4.13.2'
androidTestImplementation 'androidx.test.ext:junit:1.1.5'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
androidTestImplementation platform('androidx.compose:compose-bom:2022.10.00')
androidTestImplementation 'androidx.test.ext:junit:1.2.1'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.6.1'
androidTestImplementation platform('androidx.compose:compose-bom:2024.11.00')
androidTestImplementation 'androidx.compose.ui:ui-test-junit4'
debugImplementation 'androidx.compose.ui:ui-tooling'
debugImplementation 'androidx.compose.ui:ui-test-manifest'

implementation 'com.github.kenglxn.QRGen:android:3.0.1'

implementation platform('com.walletconnect:android-bom:1.35.2')
implementation("com.walletconnect:android-core")
implementation("com.walletconnect:walletconnect-modal")
}
40 changes: 39 additions & 1 deletion app/src/main/java/exchange/dydx/carteraExample/MainActivity.kt
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,26 @@ import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.result.contract.ActivityResultContracts
import androidx.compose.material.ModalBottomSheetValue
import androidx.compose.material.rememberModalBottomSheetState
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.rememberNavController
import com.google.accompanist.navigation.material.BottomSheetNavigator
import com.google.accompanist.navigation.material.ExperimentalMaterialNavigationApi
import com.google.accompanist.navigation.material.ModalBottomSheetLayout
import com.walletconnect.wcmodal.ui.walletConnectModalGraph
import exchange.dydx.cartera.CarteraConfig
import exchange.dydx.cartera.WalletConnectionType
import exchange.dydx.cartera.walletprovider.providers.WalletConnectModalProvider

class MainActivity : ComponentActivity() {

@OptIn(ExperimentalMaterialNavigationApi::class)
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)

Expand All @@ -29,7 +42,32 @@ class MainActivity : ComponentActivity() {

setContent {
MyApp {
WalletList.Content()
val sheetState = rememberModalBottomSheetState(
initialValue = ModalBottomSheetValue.Hidden,
skipHalfExpanded = true,
)
val bottomSheetNavigator = BottomSheetNavigator(sheetState)
val navController = rememberNavController(bottomSheetNavigator)

LaunchedEffect(Unit) {
// Need to set the nav controller for the WalletConnectModalProvider
// so that it can open the modal when needed
val modal = CarteraConfig.shared?.getProvider(WalletConnectionType.WalletConnectModal) as? WalletConnectModalProvider
modal?.nav = navController
}

ModalBottomSheetLayout(bottomSheetNavigator = bottomSheetNavigator) {
NavHost(
navController = navController,
startDestination = "walletList",
) {
composable("walletList") {
WalletList.Content()
}

walletConnectModalGraph(navController)
}
}
}
}
}
Expand Down
60 changes: 50 additions & 10 deletions app/src/main/java/exchange/dydx/carteraExample/WalletList.kt
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.Divider
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.MaterialTheme
import androidx.compose.material.ModalBottomSheetLayout
import androidx.compose.material.ModalBottomSheetState
Expand Down Expand Up @@ -55,7 +54,7 @@ import net.glxn.qrgen.android.QRCode

object WalletList {
enum class WalletAction {
Connect, SignMessage, SignTypedData, SignTransaction
Connect, SignMessage, SignTypedData, SignTransaction, Disconnect
}

enum class QrCodeAction {
Expand All @@ -65,17 +64,18 @@ object WalletList {
data class WalletListState(
val wallets: List<Wallet> = listOf(),
var selectedWallet: Wallet? = null,
val walletAction: ((WalletAction, Wallet?, Boolean) -> Unit)? = null,
val debugQRCodeAction: ((QrCodeAction, Boolean) -> Unit)? = null
val walletAction: ((WalletAction, Wallet?, Boolean, Boolean) -> Unit)? = null,
val debugQRCodeAction: ((QrCodeAction, Boolean) -> Unit)? = null,
val wcModalAction: (() -> Unit)? = null
) {
var showingQrCodeState: Boolean by mutableStateOf(false)
var deeplinkUri: String? by mutableStateOf(null)
var showBottomSheet: Boolean by mutableStateOf(false)
var useTestnet: Boolean by mutableStateOf(true)
var useWcModal: Boolean by mutableStateOf(false)
}

@SuppressLint("CoroutineCreationDuringComposition")
@OptIn(ExperimentalMaterialApi::class)
@Composable
fun Content() {
val context = LocalContext.current
Expand All @@ -91,11 +91,11 @@ object WalletList {

ModalBottomSheetLayout(
sheetContent = {
walletActionSheetView(viewState = state.value)
WalletActionSheetView(viewState = state.value)
},
sheetState = bottomSheetState,
) {
walletListContent(
WalletListContent(
viewState = state.value,
coroutineScope = coroutineScope,
bottomSheetState = bottomSheetState,
Expand All @@ -119,9 +119,8 @@ object WalletList {
}
}

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun walletListContent(
fun WalletListContent(
viewState: WalletList.WalletListState,
coroutineScope: CoroutineScope,
bottomSheetState: ModalBottomSheetState
Expand All @@ -137,6 +136,7 @@ object WalletList {
.clickable {
if (wallet.installed(context)) {
viewState.selectedWallet = wallet
viewState.useWcModal = false
coroutineScope.launch {
bottomSheetState.show()
}
Expand Down Expand Up @@ -172,6 +172,29 @@ object WalletList {

item { Spacer(modifier = Modifier.height(24.dp)) }

item {
Divider()
Row(
horizontalArrangement = Arrangement.SpaceBetween,
modifier = Modifier
.fillMaxWidth()
.clickable {
viewState.wcModalAction?.invoke()
},
) {
Text(
"WalletConnect Modal",
modifier = Modifier
.padding(16.dp)
.weight(1f, false),
textAlign = TextAlign.Start,
)
}
Divider()
}

item { Spacer(modifier = Modifier.height(24.dp)) }

item {
Divider()
Row(
Expand Down Expand Up @@ -227,7 +250,7 @@ object WalletList {
}

@Composable
private fun walletActionSheetView(viewState: WalletListState) {
private fun WalletActionSheetView(viewState: WalletListState) {
val buttonModifier = Modifier
.padding(all = 15.dp)
.fillMaxWidth()
Expand All @@ -244,6 +267,7 @@ object WalletList {
WalletAction.Connect,
viewState.selectedWallet,
viewState.useTestnet,
viewState.useWcModal,
)
},
modifier = buttonModifier,
Expand All @@ -256,6 +280,7 @@ object WalletList {
WalletAction.SignMessage,
viewState.selectedWallet,
viewState.useTestnet,
viewState.useWcModal,
)
},
modifier = buttonModifier,
Expand All @@ -268,6 +293,7 @@ object WalletList {
WalletAction.SignTypedData,
viewState.selectedWallet,
viewState.useTestnet,
viewState.useWcModal,
)
},
modifier = buttonModifier,
Expand All @@ -280,12 +306,26 @@ object WalletList {
WalletAction.SignTransaction,
viewState.selectedWallet,
viewState.useTestnet,
viewState.useWcModal,
)
},
modifier = buttonModifier,
) {
Text("Send Transaction", style = buttonTextStyle)
}
TextButton(
onClick = {
viewState.walletAction?.invoke(
WalletAction.Disconnect,
viewState.selectedWallet,
viewState.useTestnet,
viewState.useWcModal,
)
},
modifier = buttonModifier,
) {
Text("Disconnect", style = buttonTextStyle)
}
Spacer(modifier = Modifier.height(20.dp))
TextButton(
onClick = {
Expand Down
Loading

0 comments on commit 358387d

Please sign in to comment.