Add winback skeleton UI (#3433)

modules/features/profile/build.gradle.kts

@@ -59,6 +59,7 @@ dependencies {
     implementation(libs.lifecycle.reactivestreams.ktx)
     implementation(libs.media3.datasource)
     implementation(libs.media3.extractor)
+    implementation(libs.navigation.compose)
     implementation(libs.play.cast)
     implementation(libs.rx2.java)
     implementation(libs.rx2.kotlin)

modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/AccountDetailsFragment.kt

@@ -24,6 +24,7 @@ import au.com.shiftyjelly.pocketcasts.analytics.AnalyticsEvent
 import au.com.shiftyjelly.pocketcasts.analytics.AnalyticsTracker
 import au.com.shiftyjelly.pocketcasts.preferences.Settings
 import au.com.shiftyjelly.pocketcasts.profile.champion.PocketCastsChampionBottomSheetDialog
+import au.com.shiftyjelly.pocketcasts.profile.winback.WinbackFragment
 import au.com.shiftyjelly.pocketcasts.repositories.playback.PlaybackManager
 import au.com.shiftyjelly.pocketcasts.repositories.playback.UpNextQueue
 import au.com.shiftyjelly.pocketcasts.repositories.podcast.EpisodeManager
@@ -41,6 +42,8 @@ import au.com.shiftyjelly.pocketcasts.ui.helper.FragmentHostListener
 import au.com.shiftyjelly.pocketcasts.utils.Gravatar
 import au.com.shiftyjelly.pocketcasts.utils.Util
 import au.com.shiftyjelly.pocketcasts.utils.extensions.pxToDp
+import au.com.shiftyjelly.pocketcasts.utils.featureflag.Feature
+import au.com.shiftyjelly.pocketcasts.utils.featureflag.FeatureFlag
 import au.com.shiftyjelly.pocketcasts.utils.log.LogBuffer
 import au.com.shiftyjelly.pocketcasts.views.dialog.ConfirmationDialog
 import au.com.shiftyjelly.pocketcasts.views.fragments.BaseFragment
@@ -148,9 +151,13 @@ class AccountDetailsFragment : BaseFragment() {
             },
             onCancelSubscription = {
                 analyticsTracker.track(AnalyticsEvent.ACCOUNT_DETAILS_CANCEL_TAPPED)
-                CancelConfirmationFragment
-                    .newInstance()
-                    .show(childFragmentManager, "cancel_subscription_confirmation_dialog")
+                if (FeatureFlag.isEnabled(Feature.WINBACK)) {
+                    WinbackFragment().show(childFragmentManager, "subscription_windback")
+                } else {
+                    CancelConfirmationFragment
+                        .newInstance()
+                        .show(childFragmentManager, "cancel_subscription_confirmation_dialog")
+                }
             },
             onChangeNewsletterSubscription = { isChecked ->
                 accountViewModel.updateNewsletter(isChecked)
@@ -224,6 +231,7 @@ class AccountDetailsFragment : BaseFragment() {
                 accountViewModel.clearDeleteAccountState()
                 performSignOut()
             }
+
             is DeleteAccountState.Failure -> {
                 accountViewModel.clearDeleteAccountState()
                 AlertDialog.Builder(requireContext())
@@ -232,6 +240,7 @@ class AccountDetailsFragment : BaseFragment() {
                     .setPositiveButton(getString(LR.string.ok)) { dialog, _ -> dialog.dismiss() }
                     .show()
             }
+
             is DeleteAccountState.Empty -> {}
         }
     }

modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/winback/AvailablePlansPage.kt

@@ -0,0 +1,55 @@
+package au.com.shiftyjelly.pocketcasts.profile.winback
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+
+@Composable
+internal fun AvailablePlansPage(
+    onGoBack: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        modifier = modifier
+            .fillMaxSize()
+            .background(Color(0xFFEACDD0))
+            .padding(16.dp),
+    ) {
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .background(Color(0xFFA3A6A3))
+                .clickable(onClick = onGoBack)
+                .padding(16.dp),
+        ) {
+            Text(
+                text = "Back",
+                color = Color.Black,
+            )
+        }
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(80.dp)
+                .fillMaxWidth(),
+        ) {
+            Text(
+                text = "Available Plans",
+                color = Color.Black,
+            )
+        }
+    }
+}

modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/winback/CancelConfirmationPage.kt

@@ -0,0 +1,74 @@
+package au.com.shiftyjelly.pocketcasts.profile.winback
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+
+@Composable
+internal fun CancelConfirmationPage(
+    onKeepSubscription: () -> Unit,
+    onCancelSubscription: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        modifier = modifier
+            .fillMaxSize()
+            .background(Color(0xFFCCE0DA))
+            .padding(16.dp),
+    ) {
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(80.dp)
+                .fillMaxWidth(),
+        ) {
+            Text(
+                text = "Cancel Confirmation",
+                color = Color.Black,
+            )
+        }
+        Spacer(
+            modifier = Modifier.weight(1f),
+        )
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(64.dp)
+                .fillMaxWidth()
+                .background(Color(0xFFF2E2E3))
+                .clickable(onClick = onKeepSubscription),
+        ) {
+            Text(
+                text = "Keep subscritpion",
+                color = Color.Black,
+            )
+        }
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(64.dp)
+                .fillMaxWidth()
+                .background(Color(0xFFEDDDD1))
+                .clickable(onClick = onCancelSubscription),
+        ) {
+            Text(
+                text = "Cancel subscription",
+                color = Color.Black,
+            )
+        }
+    }
+}

modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/winback/HelpAndFeedbackPage.kt

@@ -0,0 +1,55 @@
+package au.com.shiftyjelly.pocketcasts.profile.winback
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+
+@Composable
+internal fun HelpAndFeedbackPage(
+    onGoBack: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        modifier = modifier
+            .fillMaxSize()
+            .background(Color(0xFF9BD3CB))
+            .padding(16.dp),
+    ) {
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .background(Color(0xFF129A7D))
+                .clickable(onClick = onGoBack)
+                .padding(16.dp),
+        ) {
+            Text(
+                text = "Back",
+                color = Color.White,
+            )
+        }
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(80.dp)
+                .fillMaxWidth(),
+        ) {
+            Text(
+                text = "Help & Feedback",
+                color = Color.Black,
+            )
+        }
+    }
+}

modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/winback/OfferClaimedPage.kt

@@ -0,0 +1,60 @@
+package au.com.shiftyjelly.pocketcasts.profile.winback
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+
+@Composable
+internal fun OfferClaimedPage(
+    onConfirm: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        modifier = modifier
+            .fillMaxSize()
+            .background(Color(0xFFCA9CA9))
+            .padding(16.dp),
+    ) {
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(80.dp)
+                .fillMaxWidth(),
+        ) {
+            Text(
+                text = "Offer Claimed",
+                color = Color.Black,
+            )
+        }
+        Spacer(
+            modifier = Modifier.weight(1f),
+        )
+        Box(
+            contentAlignment = Alignment.Center,
+            modifier = Modifier
+                .height(64.dp)
+                .fillMaxWidth()
+                .background(Color(0xFFCC5079))
+                .clickable(onClick = onConfirm),
+        ) {
+            Text(
+                text = "Done",
+                color = Color.White,
+            )
+        }
+    }
+}