diff --git a/modules/features/profile/src/main/AndroidManifest.xml b/modules/features/profile/src/main/AndroidManifest.xml index 933c037e6d1..b5e8d8c36ae 100644 --- a/modules/features/profile/src/main/AndroidManifest.xml +++ b/modules/features/profile/src/main/AndroidManifest.xml @@ -31,6 +31,7 @@ + + viewModel.setDisplayName(displayName) + }, + onContinueClick = { + navController.navigate(NavRoutes.PREVIEW) + }, + ) + } + composable(NavRoutes.PREVIEW) { + val state by viewModel.state.collectAsStateWithLifecycle() + ShareProfilePreviewPage( + state = state, + onBackPress = { navController.popBackStack() }, + ) + } + } + } + } +} diff --git a/modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/sharing/ShareProfileNamePage.kt b/modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/sharing/ShareProfileNamePage.kt new file mode 100644 index 00000000000..eb73d9ea9e7 --- /dev/null +++ b/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 = {}, + ) + } + } +} diff --git a/modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/sharing/ShareProfilePreviewPage.kt b/modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/sharing/ShareProfilePreviewPage.kt new file mode 100644 index 00000000000..4c42928c849 --- /dev/null +++ b/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 = {}, + ) + } + } +} diff --git a/modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/sharing/ShareProfileViewModel.kt b/modules/features/profile/src/main/java/au/com/shiftyjelly/pocketcasts/profile/sharing/ShareProfileViewModel.kt new file mode 100644 index 00000000000..63b879e2dc5 --- /dev/null +++ b/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.asStateFlow() + + fun setDisplayName(name: String) { + _state.update { it.copy(displayName = name) } + } +} diff --git a/modules/services/localization/src/main/res/values/strings.xml b/modules/services/localization/src/main/res/values/strings.xml index 81f15c69b48..9a02b7bef0f 100644 --- a/modules/services/localization/src/main/res/values/strings.xml +++ b/modules/services/localization/src/main/res/values/strings.xml @@ -1226,6 +1226,11 @@ Save your podcasts in the cloud and sync your progress with other devices Set up account Share stats + Profile sharing + Display name + Your name + This is how you\'ll appear on shared profiles. You can change it later. + Preview profile @string/sign_in Sign in or create account @string/sign_out