Add profile sharing name entry and empty preview page

modules/features/profile/src/main/AndroidManifest.xml

@@ -31,6 +31,7 @@
         <activity
             android:name="au.com.shiftyjelly.pocketcasts.account.AccountActivity"
             android:windowSoftInputMode="adjustResize" />
+        <activity android:name=".sharing.ShareProfileActivity" />
         <service
             android:name=".accountmanager.PocketCastsAuthenticatorService"
             android:enabled="true"

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

@@ -1,5 +1,6 @@
 package au.com.shiftyjelly.pocketcasts.profile
 
+import android.content.Intent
 import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.ViewGroup
@@ -19,6 +20,7 @@ import au.com.shiftyjelly.pocketcasts.player.view.bookmark.BookmarksContainerFra
 import au.com.shiftyjelly.pocketcasts.podcasts.view.ProfileEpisodeListFragment
 import au.com.shiftyjelly.pocketcasts.profile.blogs.BlogsFragment
 import au.com.shiftyjelly.pocketcasts.profile.cloud.CloudFilesFragment
+import au.com.shiftyjelly.pocketcasts.profile.sharing.ShareProfileActivity
 import au.com.shiftyjelly.pocketcasts.referrals.ReferralsGuestPassFragment
 import au.com.shiftyjelly.pocketcasts.referrals.ReferralsGuestPassFragment.ReferralsPageType
 import au.com.shiftyjelly.pocketcasts.referrals.ReferralsViewModel
@@ -106,6 +108,7 @@ class ProfileFragment :
             },
             onShareClick = {
                 profileViewModel.onShareClick()
+                startActivity(Intent(requireContext(), ShareProfileActivity::class.java))
             },
             onCreateFreeAccountBannerClick = {
                 profileViewModel.onCreateFreeAccountClick()

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

@@ -0,0 +1,29 @@
+package au.com.shiftyjelly.pocketcasts.profile.sharing
+
+import android.os.Bundle
+import androidx.activity.enableEdgeToEdge
+import androidx.appcompat.app.AppCompatActivity
+import au.com.shiftyjelly.pocketcasts.ui.theme.Theme
+import dagger.hilt.android.AndroidEntryPoint
+import javax.inject.Inject
+import au.com.shiftyjelly.pocketcasts.views.R as VR
+
+@AndroidEntryPoint
+class ShareProfileActivity : AppCompatActivity() {
+
+    @Inject lateinit var theme: Theme
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        theme.setupThemeForConfig(this, resources.configuration)
+        enableEdgeToEdge(navigationBarStyle = theme.getNavigationBarStyle(this))
+
+        setContentView(VR.layout.activity_blank_fragment)
+
+        if (savedInstanceState == null) {
+            supportFragmentManager.beginTransaction()
+                .replace(VR.id.container, ShareProfileFragment())
+                .commitNow()
+        }
+    }
+}

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

@@ -0,0 +1,71 @@
+package au.com.shiftyjelly.pocketcasts.profile.sharing
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.WindowInsetsSides
+import androidx.compose.foundation.layout.only
+import androidx.compose.foundation.layout.safeDrawing
+import androidx.compose.foundation.layout.windowInsetsPadding
+import androidx.compose.runtime.getValue
+import androidx.compose.ui.Modifier
+import androidx.fragment.app.viewModels
+import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import androidx.navigation.NavHostController
+import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.composable
+import androidx.navigation.compose.rememberNavController
+import au.com.shiftyjelly.pocketcasts.compose.AppThemeWithBackground
+import au.com.shiftyjelly.pocketcasts.compose.extensions.contentWithoutConsumedInsets
+import au.com.shiftyjelly.pocketcasts.views.fragments.BaseFragment
+import dagger.hilt.android.AndroidEntryPoint
+
+@AndroidEntryPoint
+class ShareProfileFragment : BaseFragment() {
+
+    private val viewModel: ShareProfileViewModel by viewModels()
+    private var navHostController: NavHostController? = null
+
+    private object NavRoutes {
+        const val DISPLAY_NAME = "display_name"
+        const val PREVIEW = "preview"
+    }
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?,
+    ) = contentWithoutConsumedInsets {
+        AppThemeWithBackground(theme.activeTheme) {
+            navHostController = rememberNavController()
+            val navController = navHostController ?: return@AppThemeWithBackground
+            NavHost(
+                navController = navController,
+                startDestination = NavRoutes.DISPLAY_NAME,
+                modifier = Modifier.windowInsetsPadding(WindowInsets.safeDrawing.only(WindowInsetsSides.Horizontal + WindowInsetsSides.Bottom)),
+            ) {
+                composable(NavRoutes.DISPLAY_NAME) {
+                    val state by viewModel.state.collectAsStateWithLifecycle()
+                    ShareProfileNamePage(
+                        state = state,
+                        onBackPress = { activity?.finish() },
+                        onDisplayNameChange = { displayName ->
+                            viewModel.setDisplayName(displayName)
+                        },
+                        onContinueClick = {
+                            navController.navigate(NavRoutes.PREVIEW)
+                        },
+                    )
+                }
+                composable(NavRoutes.PREVIEW) {
+                    val state by viewModel.state.collectAsStateWithLifecycle()
+                    ShareProfilePreviewPage(
+                        state = state,
+                        onBackPress = { navController.popBackStack() },
+                    )
+                }
+            }
+        }
+    }
+}

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

@@ -0,0 +1,124 @@
+package au.com.shiftyjelly.pocketcasts.profile.sharing
+
+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.foundation.rememberScrollState
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Surface
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import au.com.shiftyjelly.pocketcasts.compose.AppTheme
+import au.com.shiftyjelly.pocketcasts.compose.bars.NavigationButton
+import au.com.shiftyjelly.pocketcasts.compose.bars.ThemedTopAppBar
+import au.com.shiftyjelly.pocketcasts.compose.buttons.RowButton
+import au.com.shiftyjelly.pocketcasts.compose.components.FormField
+import au.com.shiftyjelly.pocketcasts.compose.components.TextH40
+import au.com.shiftyjelly.pocketcasts.compose.components.TextH50
+import au.com.shiftyjelly.pocketcasts.compose.preview.ThemePreviewParameterProvider
+import au.com.shiftyjelly.pocketcasts.compose.theme
+import au.com.shiftyjelly.pocketcasts.ui.theme.Theme
+import au.com.shiftyjelly.pocketcasts.localization.R as LR
+
+@Composable
+fun ShareProfileNamePage(
+    state: ShareProfileViewModel.State,
+    onBackPress: () -> Unit,
+    onDisplayNameChange: (String) -> Unit,
+    onContinueClick: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    ShareProfileNamePage(
+        displayName = state.displayName,
+        onDisplayNameChange = onDisplayNameChange,
+        onBackPress = onBackPress,
+        onContinueClick = onContinueClick,
+        modifier = modifier,
+    )
+}
+
+@Composable
+private fun ShareProfileNamePage(
+    displayName: String,
+    onDisplayNameChange: (String) -> Unit,
+    onBackPress: () -> Unit,
+    onContinueClick: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    val trimmedName = displayName.trim()
+
+    Column(modifier = modifier.fillMaxSize()) {
+        ThemedTopAppBar(
+            title = stringResource(LR.string.profile_sharing_title),
+            navigationButton = NavigationButton.Back,
+            onNavigationClick = onBackPress,
+        )
+
+        Column(
+            modifier = Modifier
+                .weight(1f)
+                .verticalScroll(rememberScrollState())
+                .padding(horizontal = 16.dp),
+        ) {
+            Spacer(modifier = Modifier.height(16.dp))
+            TextH40(
+                text = stringResource(LR.string.profile_sharing_display_name_label),
+                color = MaterialTheme.theme.colors.primaryText01,
+            )
+            Spacer(modifier = Modifier.height(8.dp))
+            FormField(
+                value = displayName,
+                placeholder = stringResource(LR.string.profile_sharing_display_name_placeholder),
+                onValueChange = onDisplayNameChange,
+                singleLine = true,
+                keyboardOptions = KeyboardOptions(imeAction = ImeAction.Done),
+                onImeAction = {
+                    if (trimmedName.isNotEmpty()) onContinueClick()
+                },
+            )
+            Spacer(modifier = Modifier.height(8.dp))
+            TextH50(
+                text = stringResource(LR.string.profile_sharing_display_name_helper),
+                color = MaterialTheme.theme.colors.primaryText02,
+                textAlign = TextAlign.Center,
+                fontWeight = FontWeight.W400,
+                modifier = Modifier.fillMaxWidth(),
+            )
+        }
+
+        RowButton(
+            text = stringResource(LR.string.navigation_continue),
+            enabled = trimmedName.isNotEmpty(),
+            onClick = { onContinueClick() },
+        )
+    }
+}
+
+@Preview
+@Composable
+private fun ShareProfileNamePagePreview(
+    @PreviewParameter(ThemePreviewParameterProvider::class) themeType: Theme.ThemeType,
+) {
+    AppTheme(themeType) {
+        Surface(color = MaterialTheme.colors.background) {
+            ShareProfileNamePage(
+                displayName = "Dom",
+                onDisplayNameChange = {},
+                onBackPress = {},
+                onContinueClick = {},
+            )
+        }
+    }
+}

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

@@ -0,0 +1,83 @@
+package au.com.shiftyjelly.pocketcasts.profile.sharing
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Surface
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.dp
+import au.com.shiftyjelly.pocketcasts.compose.AppTheme
+import au.com.shiftyjelly.pocketcasts.compose.bars.NavigationButton
+import au.com.shiftyjelly.pocketcasts.compose.bars.ThemedTopAppBar
+import au.com.shiftyjelly.pocketcasts.compose.components.TextH20
+import au.com.shiftyjelly.pocketcasts.compose.preview.ThemePreviewParameterProvider
+import au.com.shiftyjelly.pocketcasts.compose.theme
+import au.com.shiftyjelly.pocketcasts.ui.theme.Theme
+import au.com.shiftyjelly.pocketcasts.localization.R as LR
+
+@Composable
+fun ShareProfilePreviewPage(
+    state: ShareProfileViewModel.State,
+    onBackPress: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    ShareProfilePreviewPage(
+        displayName = state.displayName,
+        onBackPress = onBackPress,
+        modifier = modifier,
+    )
+}
+
+@Composable
+private fun ShareProfilePreviewPage(
+    displayName: String,
+    onBackPress: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    Column(modifier = modifier.fillMaxSize()) {
+        ThemedTopAppBar(
+            title = stringResource(LR.string.profile_sharing_preview_title),
+            navigationButton = NavigationButton.Back,
+            onNavigationClick = onBackPress,
+        )
+
+        Column(
+            modifier = Modifier
+                .fillMaxSize()
+                .padding(horizontal = 16.dp),
+            horizontalAlignment = Alignment.CenterHorizontally,
+            verticalArrangement = Arrangement.Center,
+        ) {
+            TextH20(
+                text = displayName,
+                color = MaterialTheme.theme.colors.primaryText01,
+                textAlign = TextAlign.Center,
+                modifier = Modifier.fillMaxWidth(),
+            )
+        }
+    }
+}
+
+@Preview
+@Composable
+private fun ShareProfilePreviewPagePreview(
+    @PreviewParameter(ThemePreviewParameterProvider::class) themeType: Theme.ThemeType,
+) {
+    AppTheme(themeType) {
+        Surface(color = MaterialTheme.colors.background) {
+            ShareProfilePreviewPage(
+                displayName = "Dom",
+                onBackPress = {},
+            )
+        }
+    }
+}

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

@@ -0,0 +1,24 @@
+package au.com.shiftyjelly.pocketcasts.profile.sharing
+
+import androidx.lifecycle.ViewModel
+import dagger.hilt.android.lifecycle.HiltViewModel
+import javax.inject.Inject
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.flow.asStateFlow
+import kotlinx.coroutines.flow.update
+
+@HiltViewModel
+class ShareProfileViewModel @Inject constructor() : ViewModel() {
+
+    data class State(
+        val displayName: String = "",
+    )
+
+    private val _state = MutableStateFlow(State())
+    val state: StateFlow<State> = _state.asStateFlow()
+
+    fun setDisplayName(name: String) {
+        _state.update { it.copy(displayName = name) }
+    }
+}

modules/services/localization/src/main/res/values/strings.xml

@@ -1226,6 +1226,11 @@
     <string name="profile_save_your_podcasts">Save your podcasts in the cloud and sync your progress with other devices</string>
     <string name="profile_set_up_account">Set up account</string>
     <string name="profile_share_stats">Share stats</string>
+    <string name="profile_sharing_title">Profile sharing</string>
+    <string name="profile_sharing_display_name_label">Display name</string>
+    <string name="profile_sharing_display_name_placeholder">Your name</string>
+    <string name="profile_sharing_display_name_helper">This is how you\'ll appear on shared profiles. You can change it later.</string>
+    <string name="profile_sharing_preview_title">Preview profile</string>
     <string name="profile_sign_in" translatable="false">@string/sign_in</string>
     <string name="profile_sign_in_or_create_account">Sign in or create account</string>
     <string name="profile_sign_out" translatable="false">@string/sign_out</string>