From 5fce96257ad7266f2e771f7249f3825682a60486 Mon Sep 17 00:00:00 2001
From: Simon Duchastel <163092709+simond-stripe@users.noreply.github.com>
Date: Mon, 7 Oct 2024 12:15:04 -0700
Subject: [PATCH] [Connect SDK] UI for Connect SDK Example App (#9276)
* Build UI of example app
# Conflicts:
# gradle.properties
* Update build.gradle to use version catalog
* Update EmbeddedComponentService.kt
* Update PayoutsExampleActivity.kt
* Update AccountOnboardingExampleActivity.kt
* Fix dependencies
* Fix lint
* Fix fetch client secret
* Fix lint
* Fix lint
* Move to color/string res
* fix color values
---
stripe-connect-example/build.gradle | 2 +
.../dependencies/dependencies.txt | 19 ++
.../src/main/AndroidManifest.xml | 13 +-
.../connectsdk/example/MainActivity.kt | 188 ++++++++++++++----
.../android/connectsdk/example/Theme.kt | 56 ++++++
.../networking/EmbeddedComponentService.kt | 15 ++
.../AccountOnboardingExampleActivity.kt | 52 +++++
.../AccountOnboardingExampleViewModel.kt | 25 +++
.../ui/payouts/PayoutsExampleActivity.kt | 52 +++++
.../ui/payouts/PayoutsExampleViewModel.kt | 25 +++
.../src/main/res/values/colors.xml | 6 +
.../src/main/res/values/strings.xml | 8 +
.../connectsdk/FetchClientSecretCallback.kt | 2 +-
13 files changed, 419 insertions(+), 44 deletions(-)
create mode 100644 stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/Theme.kt
create mode 100644 stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/networking/EmbeddedComponentService.kt
create mode 100644 stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/ui/accountonboarding/AccountOnboardingExampleActivity.kt
create mode 100644 stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/ui/accountonboarding/AccountOnboardingExampleViewModel.kt
create mode 100644 stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/ui/payouts/PayoutsExampleActivity.kt
create mode 100644 stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/ui/payouts/PayoutsExampleViewModel.kt
create mode 100644 stripe-connect-example/src/main/res/values/colors.xml
create mode 100644 stripe-connect-example/src/main/res/values/strings.xml
diff --git a/stripe-connect-example/build.gradle b/stripe-connect-example/build.gradle
index 8f9021c9d84..8170e7b781c 100644
--- a/stripe-connect-example/build.gradle
+++ b/stripe-connect-example/build.gradle
@@ -24,6 +24,7 @@ dependencies {
// Compose
implementation libs.compose.ui
+ implementation libs.compose.uiToolingPreview
implementation libs.compose.uiViewBinding
implementation libs.compose.foundation
implementation libs.compose.material
@@ -31,6 +32,7 @@ dependencies {
implementation libs.compose.activity
implementation libs.compose.navigation
implementation libs.accompanist.systemUiController
+ debugImplementation libs.compose.uiTooling
// Test
testImplementation testLibs.androidx.archCore
diff --git a/stripe-connect-example/dependencies/dependencies.txt b/stripe-connect-example/dependencies/dependencies.txt
index f0f0488a057..53a2c34ae04 100644
--- a/stripe-connect-example/dependencies/dependencies.txt
+++ b/stripe-connect-example/dependencies/dependencies.txt
@@ -376,12 +376,14 @@
| | | | +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
| | | | +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
| | | | +--- androidx.compose.ui:ui-text:1.5.4 (c)
+| | | | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | | | +--- androidx.compose.ui:ui-unit:1.5.4 (c)
| | | | \--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
| | | +--- org.jetbrains.kotlin:kotlin-stdlib:1.8.21 -> 1.9.24 (*)
| | | +--- androidx.compose.ui:ui:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-text:1.5.4 (c)
+| | | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-unit:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-util:1.5.4 (c)
| | | \--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
@@ -400,12 +402,14 @@
| | | | +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
| | | | +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
| | | | +--- androidx.compose.ui:ui-text:1.5.4 (c)
+| | | | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | | | +--- androidx.compose.ui:ui-util:1.5.4 (c)
| | | | \--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-util:1.5.4 (*)
| | | +--- androidx.compose.ui:ui:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-text:1.5.4 (c)
+| | | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-unit:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-util:1.5.4 (c)
| | | \--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
@@ -425,6 +429,7 @@
| | | +--- androidx.compose.ui:ui:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
+| | | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-unit:1.5.4 (c)
| | | +--- androidx.compose.ui:ui-util:1.5.4 (c)
| | | \--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
@@ -446,6 +451,7 @@
| | +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
| | +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
| | +--- androidx.compose.ui:ui-text:1.5.4 (c)
+| | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | +--- androidx.compose.ui:ui-unit:1.5.4 (c)
| | +--- androidx.compose.ui:ui-util:1.5.4 (c)
| | +--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
@@ -457,6 +463,7 @@
| | +--- androidx.fragment:fragment-ktx:1.3.2 -> 1.6.2 (*)
| | +--- org.jetbrains.kotlin:kotlin-stdlib:1.8.21 -> 1.9.24 (*)
| | +--- androidx.compose.ui:ui:1.5.4 (c)
+| | +--- androidx.compose.ui:ui-tooling-preview:1.5.4 (c)
| | +--- androidx.compose.ui:ui-util:1.5.4 (c)
| | +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
| | +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
@@ -646,6 +653,18 @@
+--- androidx.lifecycle:lifecycle-viewmodel-savedstate:2.7.0 (*)
+--- androidx.lifecycle:lifecycle-viewmodel-ktx:2.7.0 (*)
+--- androidx.compose.ui:ui:1.5.4 (*)
++--- androidx.compose.ui:ui-tooling-preview:1.5.4
+| \--- androidx.compose.ui:ui-tooling-preview-android:1.5.4
+| +--- androidx.annotation:annotation:1.2.0 -> 1.7.1 (*)
+| +--- androidx.compose.runtime:runtime:1.5.4 (*)
+| +--- org.jetbrains.kotlin:kotlin-stdlib-common:1.8.21 -> 1.9.24 (*)
+| +--- androidx.compose.ui:ui:1.5.4 (c)
+| +--- androidx.compose.ui:ui-geometry:1.5.4 (c)
+| +--- androidx.compose.ui:ui-graphics:1.5.4 (c)
+| +--- androidx.compose.ui:ui-text:1.5.4 (c)
+| +--- androidx.compose.ui:ui-unit:1.5.4 (c)
+| +--- androidx.compose.ui:ui-util:1.5.4 (c)
+| \--- androidx.compose.ui:ui-viewbinding:1.5.4 (c)
+--- androidx.compose.ui:ui-viewbinding:1.5.4 (*)
+--- androidx.compose.foundation:foundation:1.5.4 (*)
+--- androidx.compose.material:material:1.5.4 (*)
diff --git a/stripe-connect-example/src/main/AndroidManifest.xml b/stripe-connect-example/src/main/AndroidManifest.xml
index 8934fd2d324..eaae5a28c77 100644
--- a/stripe-connect-example/src/main/AndroidManifest.xml
+++ b/stripe-connect-example/src/main/AndroidManifest.xml
@@ -1,14 +1,23 @@
-
+ android:exported="true"
+ android:theme="@style/Theme.AppCompat.Light.NoActionBar">
+
+
+
diff --git a/stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/MainActivity.kt b/stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/MainActivity.kt
index dee57e83a70..cfce1f953b0 100644
--- a/stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/MainActivity.kt
+++ b/stripe-connect-example/src/main/java/com/stripe/android/connectsdk/example/MainActivity.kt
@@ -1,69 +1,175 @@
package com.stripe.android.connectsdk.example
+import android.content.Intent
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.LazyItemScope
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Divider
+import androidx.compose.material.Icon
import androidx.compose.material.Text
-import com.stripe.android.connectsdk.EmbeddedComponentManager
-import com.stripe.android.connectsdk.FetchClientSecretCallback
-import com.stripe.android.connectsdk.FetchClientSecretCallback.ClientSecretResultCallback
-import com.stripe.android.connectsdk.PrivateBetaConnectSDK
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.KeyboardArrowRight
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.LineHeightStyle
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.stripe.android.connectsdk.example.ui.accountonboarding.AccountOnboardingExampleActivity
+import com.stripe.android.connectsdk.example.ui.payouts.PayoutsExampleActivity
-@OptIn(PrivateBetaConnectSDK::class)
class MainActivity : ComponentActivity() {
- private lateinit var embeddedComponentManager: EmbeddedComponentManager
+ private data class MenuItem(
+ val title: String,
+ val subtitle: String,
+ val activity: Class,
+ val isBeta: Boolean = false,
+ )
+
+ private val menuItems = listOf(
+ MenuItem(
+ title = resources.getString(R.string.account_onboarding),
+ subtitle = resources.getString(R.string.account_onboarding_menu_subtitle),
+ activity = AccountOnboardingExampleActivity::class.java,
+ isBeta = true,
+ ),
+ MenuItem(
+ title = resources.getString(R.string.payouts),
+ subtitle = resources.getString(R.string.payouts_menu_subtitle),
+ activity = PayoutsExampleActivity::class.java,
+ isBeta = true,
+ ),
+ )
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
- embeddedComponentManager = EmbeddedComponentManager(
- activity = this,
- configuration = EmbeddedComponentManager.Configuration(
- publishableKey = ""
- ),
- fetchClientSecret = object : FetchClientSecretCallback {
- override fun fetchClientSecret(resultCallback: ClientSecretResultCallback) {
- // Make a network call to fetch your client secret here
- resultCallback.onResult("")
+ setContent {
+ ConnectSdkExampleTheme {
+ MainContent(title = stringResource(R.string.connect_sdk_example)) {
+ ComponentList(menuItems)
}
}
- )
-
- setContent {
- Text("Not yet built...")
}
}
- fun launchPayouts() {
- // launch the payouts activity
- embeddedComponentManager.presentPayouts()
+ @Composable
+ private fun ComponentList(components: List