Skip to content

Commit

Permalink
Merge branch 'feat/newlogin-skeleton' into epic/new-sso-login-flow
Browse files Browse the repository at this point in the history
  • Loading branch information
yamilmedina committed Jan 21, 2025
2 parents 3a09719 + d67da54 commit ffbca36
Show file tree
Hide file tree
Showing 16 changed files with 716 additions and 456 deletions.
3 changes: 2 additions & 1 deletion app/src/main/kotlin/com/wire/android/ui/WireActivity.kt
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ import com.wire.android.navigation.MainNavHost
import com.wire.android.navigation.NavigationCommand
import com.wire.android.navigation.Navigator
import com.wire.android.navigation.rememberNavigator
import com.wire.android.ui.authentication.login.LoginNavArgs
import com.wire.android.ui.calling.getIncomingCallIntent
import com.wire.android.ui.calling.getOutgoingCallIntent
import com.wire.android.ui.calling.ongoing.getOngoingCallIntent
Expand Down Expand Up @@ -521,7 +522,7 @@ class WireActivity : AppCompatActivity() {
viewModel::dismissCustomBackendDialog,
onConfirm = {
viewModel.customBackendDialogProceedButtonClicked {
navigate(NavigationCommand(WelcomeScreenDestination))
navigate(NavigationCommand(LoginScreenDestination(LoginNavArgs())))
}
},
onTryAgain = viewModel::onCustomServerConfig
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,29 +21,13 @@ package com.wire.android.ui.authentication.login
import androidx.annotation.StringRes
import androidx.compose.animation.AnimatedContent
import androidx.compose.animation.togetherWith
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.LocalOverscrollConfiguration
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.foundation.rememberScrollState
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalFocusManager
import androidx.compose.ui.platform.LocalSoftwareKeyboardController
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.AnnotatedString
import androidx.compose.ui.window.DialogProperties
Expand All @@ -59,32 +43,22 @@ import com.wire.android.ui.authentication.ServerTitle
import com.wire.android.ui.authentication.login.email.LoginEmailScreen
import com.wire.android.ui.authentication.login.email.LoginEmailVerificationCodeScreen
import com.wire.android.ui.authentication.login.email.LoginEmailViewModel
import com.wire.android.ui.authentication.login.sso.LoginSSOScreen
import com.wire.android.ui.common.TabItem
import com.wire.android.ui.common.WireDialog
import com.wire.android.ui.common.WireDialogButtonProperties
import com.wire.android.ui.common.WireDialogButtonType
import com.wire.android.ui.common.WireTabRow
import com.wire.android.ui.common.calculateCurrentTab
import com.wire.android.ui.common.dialogs.FeatureDisabledWithProxyDialogContent
import com.wire.android.ui.common.dialogs.FeatureDisabledWithProxyDialogState
import com.wire.android.ui.common.rememberTopBarElevationState
import com.wire.android.ui.common.scaffold.WireScaffold
import com.wire.android.ui.common.topappbar.NavigationIconType
import com.wire.android.ui.common.topappbar.WireCenterAlignedTopAppBar
import com.wire.android.ui.common.spacers.VerticalSpace
import com.wire.android.ui.common.visbility.rememberVisibilityState
import com.wire.android.ui.destinations.E2EIEnrollmentScreenDestination
import com.wire.android.ui.destinations.HomeScreenDestination
import com.wire.android.ui.destinations.InitialSyncScreenDestination
import com.wire.android.ui.destinations.RemoveDeviceScreenDestination
import com.wire.android.ui.theme.WireTheme
import com.wire.android.ui.theme.wireDimensions
import com.wire.android.ui.theme.wireTypography
import com.wire.android.util.deeplink.DeepLinkResult
import com.wire.android.util.dialogErrorStrings
import com.wire.android.util.ui.PreviewMultipleThemes
import com.wire.android.util.ui.UIText
import kotlinx.coroutines.launch

@RootNavGraph
@WireDestination(
Expand All @@ -96,22 +70,27 @@ fun LoginScreen(
loginNavArgs: LoginNavArgs,
loginEmailViewModel: LoginEmailViewModel = hiltViewModel()
) {
NewLoginContainer(
title = stringResource(id = R.string.enterprise_login_title),
canNavigateBack = true,
onNavigateBack = navigator::navigateBack
) {
LoginContent(
onBackPressed = navigator::navigateBack,
onSuccess = { initialSyncCompleted, isE2EIRequired ->
val destination = if (isE2EIRequired) E2EIEnrollmentScreenDestination
else if (initialSyncCompleted) HomeScreenDestination
else InitialSyncScreenDestination

LoginContent(
onBackPressed = navigator::navigateBack,
onSuccess = { initialSyncCompleted, isE2EIRequired ->
val destination = if (isE2EIRequired) E2EIEnrollmentScreenDestination
else if (initialSyncCompleted) HomeScreenDestination
else InitialSyncScreenDestination

navigator.navigate(NavigationCommand(destination, BackStackMode.CLEAR_WHOLE))
},
onRemoveDeviceNeeded = {
navigator.navigate(NavigationCommand(RemoveDeviceScreenDestination, BackStackMode.CLEAR_WHOLE))
},
loginEmailViewModel = loginEmailViewModel,
ssoLoginResult = loginNavArgs.ssoLoginResult
)
navigator.navigate(NavigationCommand(destination, BackStackMode.CLEAR_WHOLE))
},
onRemoveDeviceNeeded = {
navigator.navigate(NavigationCommand(RemoveDeviceScreenDestination, BackStackMode.CLEAR_WHOLE))
},
loginEmailViewModel = loginEmailViewModel,
ssoLoginResult = loginNavArgs.ssoLoginResult
)
}
}

@Composable
Expand All @@ -122,7 +101,11 @@ private fun LoginContent(
loginEmailViewModel: LoginEmailViewModel,
ssoLoginResult: DeepLinkResult.SSOLogin?
) {
Column(modifier = Modifier.fillMaxSize()) {
Column(
modifier = Modifier
.fillMaxHeight(0.6f)
.fillMaxWidth()
) {
/*
TODO: we can change it to be a nested navigation graph when Compose Destinations 2.0 is released,
right now it's not possible to make start destination for nested graph with mandatory arguments.
Expand All @@ -141,7 +124,7 @@ private fun LoginContent(
}
}

@OptIn(ExperimentalFoundationApi::class)
@Suppress("UnusedParameter")
@Composable
private fun MainLoginContent(
onBackPressed: () -> Unit,
Expand All @@ -151,84 +134,17 @@ private fun MainLoginContent(
ssoLoginResult: DeepLinkResult.SSOLogin?
) {

val scope = rememberCoroutineScope()
val scrollState = rememberScrollState()
val initialPageIndex = if (ssoLoginResult == null) LoginTabItem.EMAIL.ordinal else LoginTabItem.SSO.ordinal
val pagerState = rememberPagerState(
initialPage = initialPageIndex,
pageCount = { LoginTabItem.values().size }
)

val ssoDisabledWithProxyDialogState = rememberVisibilityState<FeatureDisabledWithProxyDialogState>()
FeatureDisabledWithProxyDialogContent(dialogState = ssoDisabledWithProxyDialogState)

WireScaffold(
topBar = {
WireCenterAlignedTopAppBar(
elevation = scrollState.rememberTopBarElevationState().value,
title = stringResource(R.string.login_title),
subtitleContent = {
if (loginEmailViewModel.serverConfig.isOnPremises) {
ServerTitle(
serverLinks = loginEmailViewModel.serverConfig,
style = MaterialTheme.wireTypography.body01
)
}
},
onNavigationPressed = onBackPressed,
navigationIconType = NavigationIconType.Back(R.string.content_description_login_back_btn)
) {
WireTabRow(
tabs = LoginTabItem.values().toList(),
selectedTabIndex = pagerState.calculateCurrentTab(),
onTabChange = {

if (loginEmailViewModel.serverConfig.isProxyEnabled) {
if (pagerState.currentPage != LoginTabItem.SSO.ordinal) {
ssoDisabledWithProxyDialogState.show(
ssoDisabledWithProxyDialogState.savedState ?: FeatureDisabledWithProxyDialogState(
R.string.sso_not_supported_dialog_description
)
)
}
} else {
scope.launch { pagerState.animateScrollToPage(it) }
}
},
modifier = Modifier.padding(
start = MaterialTheme.wireDimensions.spacing16x,
end = MaterialTheme.wireDimensions.spacing16x
),
)
}
},
modifier = Modifier.fillMaxHeight(),
) { internalPadding ->
var focusedTabIndex: Int by remember { mutableStateOf(initialPageIndex) }
val keyboardController = LocalSoftwareKeyboardController.current
val focusManager = LocalFocusManager.current

CompositionLocalProvider(LocalOverscrollConfiguration provides null) {
HorizontalPager(
state = pagerState,
modifier = Modifier
.fillMaxWidth()
.padding(internalPadding)
) { pageIndex ->
when (LoginTabItem.values()[pageIndex]) {
LoginTabItem.EMAIL -> LoginEmailScreen(onSuccess, onRemoveDeviceNeeded, loginEmailViewModel, scrollState)
LoginTabItem.SSO -> LoginSSOScreen(onSuccess, onRemoveDeviceNeeded, ssoLoginResult)
}
}
if (!pagerState.isScrollInProgress && focusedTabIndex != pagerState.currentPage) {
LaunchedEffect(Unit) {
keyboardController?.hide()
focusManager.clearFocus()
focusedTabIndex = pagerState.currentPage
}
}
}
if (loginEmailViewModel.serverConfig.isOnPremises) {
ServerTitle(
serverLinks = loginEmailViewModel.serverConfig,
style = MaterialTheme.wireTypography.body01
)
VerticalSpace.x8()
}
LoginEmailScreen(onSuccess, onRemoveDeviceNeeded, loginEmailViewModel)
}

@Composable
Expand Down Expand Up @@ -314,6 +230,7 @@ fun LoginErrorDialog(
onDismiss = onDialogDismiss
)
}

LoginState.Error.TextFieldError.InvalidValue,
LoginState.Error.DialogError.PasswordNeededToRegisterClient,
LoginState.Error.TooManyDevicesError -> {
Expand Down Expand Up @@ -351,12 +268,6 @@ data class LoginDialogErrorData(
val dismissOnClickOutside: Boolean = true
)

enum class LoginTabItem(@StringRes val titleResId: Int) : TabItem {
EMAIL(R.string.login_tab_email),
SSO(R.string.login_tab_sso);
override val title: UIText = UIText.StringResource(titleResId)
}

@PreviewMultipleThemes
@Composable
private fun PreviewLoginScreen() = WireTheme {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
/*
* Wire
* Copyright (C) 2024 Wire Swiss GmbH
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see http://www.gnu.org/licenses/.
*/
package com.wire.android.ui.authentication.login

import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowBack
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.text.style.TextAlign
import com.wire.android.ui.common.colorsScheme
import com.wire.android.ui.common.dimensions
import com.wire.android.ui.common.scaffold.WireScaffold
import com.wire.android.ui.common.spacers.VerticalSpace
import com.wire.android.ui.theme.WireTheme
import com.wire.android.ui.theme.wireTypography
import com.wire.android.util.ui.PreviewMultipleThemes

@Composable
fun NewLoginContainer(
title: String = "",
canNavigateBack: Boolean = false,
onNavigateBack: () -> Unit = {},
content: @Composable () -> Unit
) {
NewLoginContent(title, canNavigateBack, onNavigateBack, content)
}

@Composable
private fun NewLoginContent(
title: String = "",
canNavigateBack: Boolean,
onNavigateBack: () -> Unit,
content: @Composable () -> Unit = { }
) {
WireScaffold(
bottomBar = {
Column(
modifier = Modifier
.fillMaxWidth()
.clip(RoundedCornerShape(topEnd = dimensions().spacing8x, topStart = dimensions().spacing8x))
.background(colorsScheme().surface)
.padding(dimensions().spacing16x)
) {
Row(
modifier = Modifier.fillMaxWidth(),
verticalAlignment = Alignment.CenterVertically,
) {
if (canNavigateBack) {
Icon(
imageVector = Icons.Filled.ArrowBack,
contentDescription = "Back",
modifier = Modifier.clickable(onClick = onNavigateBack)
)
}
if (title.isBlank().not()) {
Text(
text = title,
style = MaterialTheme.wireTypography.body01,
textAlign = TextAlign.Center,
modifier = Modifier.weight(1f)
)
}
Spacer(modifier = Modifier.size(dimensions().spacing8x))
}
Column {
VerticalSpace.x16()
content()
}
}
}
) { _ ->
Column {
WireAuthBackgroundComponent()
}
}
}

@PreviewMultipleThemes
@Composable
private fun PreviewNewLoginContent() = WireTheme {
NewLoginContent("Enter your password to log in", true, {}) { Text(text = "EMPTY") }
}
Loading

0 comments on commit ffbca36

Please sign in to comment.