Skip to content

Commit

Permalink
Merge branch 'device-list-resets-after-going-to-settings-droid-194'
Browse files Browse the repository at this point in the history
  • Loading branch information
@Pururun
Pururun committed Oct 2, 2023
2 parents 76a67da + fef7d02 commit 15fa64e
Show file tree
Hide file tree
Showing 4 changed files with 61 additions and 40 deletions.
7 changes: 6 additions & 1 deletion android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/List.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,12 @@ 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.graphics.compositeOver
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import net.mullvad.mullvadvpn.R
import net.mullvad.mullvadvpn.lib.theme.AlphaDescription
import net.mullvad.mullvadvpn.lib.theme.AppTheme
import net.mullvad.mullvadvpn.lib.theme.Dimens
import net.mullvad.mullvadvpn.lib.theme.typeface.listItemSubText
Expand Down Expand Up @@ -109,7 +111,10 @@ fun ListItem(
Text(
text = subText,
style = MaterialTheme.typography.listItemSubText,
color = MaterialTheme.colorScheme.onPrimary
color =
MaterialTheme.colorScheme.onPrimary
.copy(alpha = AlphaDescription)
.compositeOver(background)
)
}
}
Expand Down
84 changes: 48 additions & 36 deletions android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/DeviceListScreen.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.Dimension
import net.mullvad.mullvadvpn.R
Expand All @@ -33,13 +32,10 @@ import net.mullvad.mullvadvpn.compose.state.DeviceListItemUiState
import net.mullvad.mullvadvpn.compose.state.DeviceListUiState
import net.mullvad.mullvadvpn.lib.common.util.capitalizeFirstCharOfEachWord
import net.mullvad.mullvadvpn.lib.common.util.parseAsDateTime
import net.mullvad.mullvadvpn.lib.theme.AlphaInactive
import net.mullvad.mullvadvpn.lib.theme.AlphaTopBar
import net.mullvad.mullvadvpn.lib.theme.AppTheme
import net.mullvad.mullvadvpn.lib.theme.Dimens
import net.mullvad.mullvadvpn.lib.theme.MullvadBlue
import net.mullvad.mullvadvpn.lib.theme.MullvadGreen
import net.mullvad.mullvadvpn.lib.theme.MullvadGreen40
import net.mullvad.mullvadvpn.lib.theme.MullvadWhite
import net.mullvad.mullvadvpn.lib.theme.MullvadWhite80
import net.mullvad.mullvadvpn.model.Device
import net.mullvad.mullvadvpn.util.formatDate

Expand Down Expand Up @@ -88,11 +84,11 @@ fun DeviceListScreen(
)
}

val topColor = MaterialTheme.colorScheme.primary
ScaffoldWithTopBar(
topBarColor = topColor,
statusBarColor = topColor,
topBarColor = MaterialTheme.colorScheme.primary,
statusBarColor = MaterialTheme.colorScheme.primary,
navigationBarColor = MaterialTheme.colorScheme.background,
iconTintColor = MaterialTheme.colorScheme.onPrimary.copy(alpha = AlphaTopBar),
onSettingsClicked = onSettingsClicked,
onAccountClicked = null,
) {
Expand All @@ -101,7 +97,7 @@ fun DeviceListScreen(
Modifier.fillMaxHeight()
.fillMaxWidth()
.padding(it)
.background(MaterialTheme.colorScheme.secondary)
.background(MaterialTheme.colorScheme.background)
) {
val (content, buttons) = createRefs()

Expand Down Expand Up @@ -131,22 +127,28 @@ fun DeviceListScreen(
contentDescription = null, // No meaningful user info or action.
modifier =
Modifier.constrainAs(icon) {
top.linkTo(parent.top, margin = 30.dp)
top.linkTo(parent.top)
start.linkTo(parent.start)
end.linkTo(parent.end)
}
.width(64.dp)
.height(64.dp)
.padding(top = Dimens.iconFailSuccessTopMargin)
.width(Dimens.iconFailSuccessSize)
.height(Dimens.iconFailSuccessSize)
)

Column(
modifier =
Modifier.constrainAs(message) {
top.linkTo(icon.bottom, margin = 16.dp)
start.linkTo(parent.start, margin = 22.dp)
end.linkTo(parent.end, margin = 22.dp)
width = Dimension.fillToConstraints
},
top.linkTo(icon.bottom)
start.linkTo(parent.start)
end.linkTo(parent.end)
width = Dimension.fillToConstraints
}
.padding(
start = Dimens.sideMargin,
end = Dimens.sideMargin,
top = Dimens.screenVerticalMargin
),
) {
Text(
text =
Expand All @@ -158,7 +160,8 @@ fun DeviceListScreen(
R.string.max_devices_resolved_title
}
),
style = MaterialTheme.typography.headlineSmall
style = MaterialTheme.typography.headlineSmall,
color = MaterialTheme.colorScheme.onBackground
)

Text(
Expand All @@ -172,20 +175,22 @@ fun DeviceListScreen(
}
),
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onBackground,
modifier =
Modifier.wrapContentHeight()
.animateContentSize()
.padding(top = 8.dp)
.padding(top = Dimens.smallPadding)
)
}

Box(
modifier =
Modifier.constrainAs(list) {
top.linkTo(message.bottom, margin = 20.dp)
height = Dimension.wrapContent
width = Dimension.matchParent
}
top.linkTo(message.bottom)
height = Dimension.wrapContent
width = Dimension.matchParent
}
.padding(top = Dimens.spacingAboveButton)
) {
Column {
state.deviceUiItems.forEach { deviceUiState ->
Expand Down Expand Up @@ -215,22 +220,29 @@ fun DeviceListScreen(
Column(
modifier =
Modifier.constrainAs(buttons) {
bottom.linkTo(parent.bottom, margin = 22.dp)
start.linkTo(parent.start, margin = 22.dp)
end.linkTo(parent.end, margin = 22.dp)
width = Dimension.fillToConstraints
}
bottom.linkTo(parent.bottom)
start.linkTo(parent.start)
end.linkTo(parent.end)
width = Dimension.fillToConstraints
}
.padding(
start = Dimens.sideMargin,
end = Dimens.sideMargin,
bottom = Dimens.screenVerticalMargin
)
) {
ActionButton(
text = stringResource(id = R.string.continue_login),
onClick = onContinueWithLogin,
isEnabled = state.hasTooManyDevices.not() && state.isLoading.not(),
colors =
ButtonDefaults.buttonColors(
containerColor = MullvadGreen,
disabledContainerColor = MullvadGreen40,
disabledContentColor = MullvadWhite80,
contentColor = MullvadWhite
containerColor = MaterialTheme.colorScheme.inversePrimary,
contentColor = MaterialTheme.colorScheme.onPrimary,
disabledContentColor =
MaterialTheme.colorScheme.onPrimary.copy(alpha = AlphaInactive),
disabledContainerColor =
MaterialTheme.colorScheme.inversePrimary.copy(alpha = AlphaInactive)
)
)

Expand All @@ -239,10 +251,10 @@ fun DeviceListScreen(
onClick = onBackClick,
colors =
ButtonDefaults.buttonColors(
containerColor = MullvadBlue,
contentColor = MullvadWhite
containerColor = MaterialTheme.colorScheme.primary,
contentColor = MaterialTheme.colorScheme.onPrimary,
),
modifier = Modifier.padding(top = 16.dp)
modifier = Modifier.padding(top = Dimens.mediumPadding)
)
}
}
Expand Down
1 change: 1 addition & 0 deletions android/app/src/main/kotlin/net/mullvad/mullvadvpn/repository/DeviceRepository.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ class DeviceRepository(
deviceListEvents
.map {
if (it is DeviceListEvent.Available) {
cachedDeviceList.value = DeviceList.Available(it.devices)
DeviceList.Available(it.devices)
} else {
DeviceList.Error
Expand Down
9 changes: 6 additions & 3 deletions android/lib/theme/src/main/kotlin/net/mullvad/mullvadvpn/lib/theme/dimensions/Dimensions.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,11 @@ data class Dimensions(
val customPortBoxMinWidth: Dp = 80.dp,
val dialogIconHeight: Dp = 44.dp,
val expandableCellChevronSize: Dp = 30.dp,
val iconFailSuccessSize: Dp = 60.dp,
val iconFailSuccessTopMargin: Dp = 30.dp,
val indentedCellStartPadding: Dp = 38.dp,
val infoButtonVerticalPadding: Dp = 13.dp,
val largePadding: Dp = 32.dp,
val listIconSize: Dp = 24.dp,
val listItemDivider: Dp = 1.dp,
val listItemHeight: Dp = 50.dp,
Expand All @@ -32,11 +35,9 @@ data class Dimensions(
val loadingSpinnerSizeMedium: Dp = 28.dp,
val loadingSpinnerStrokeWidth: Dp = 6.dp,
val loginIconContainerSize: Dp = 60.dp,
val smallPadding: Dp = 8.dp,
val mediumPadding: Dp = 16.dp,
val largePadding: Dp = 32.dp,
val notificationBannerStartPadding: Dp = 16.dp,
val notificationBannerEndPadding: Dp = 12.dp,
val notificationBannerStartPadding: Dp = 16.dp,
val notificationEndIconPadding: Dp = 4.dp,
val notificationStatusIconSize: Dp = 10.dp,
val progressIndicatorSize: Dp = 48.dp,
Expand All @@ -50,6 +51,8 @@ data class Dimensions(
val selectLocationTitlePadding: Dp = 12.dp,
val selectableCellTextMargin: Dp = 12.dp,
val sideMargin: Dp = 22.dp,
val smallPadding: Dp = 8.dp,
val spacingAboveButton: Dp = 22.dp,
val titleIconSize: Dp = 24.dp,
val topBarHeight: Dp = 64.dp,
val verticalSpace: Dp = 20.dp,
Expand Down

0 comments on commit 15fa64e

Please sign in to comment.