diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/BottomSheetItem.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/BottomSheetItem.kt index 6dd39f4fd..e43f67f05 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/BottomSheetItem.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/BottomSheetItem.kt @@ -21,7 +21,9 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration import androidx.annotation.StringRes import androidx.compose.foundation.layout.* -import androidx.compose.material3.* +import androidx.compose.material3.Icon +import androidx.compose.material3.Surface +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier @@ -32,7 +34,6 @@ import androidx.compose.ui.unit.dp import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.icons.AppIcons import com.infomaniak.swisstransfer.ui.icons.app.Camera -import com.infomaniak.swisstransfer.ui.theme.CustomShapes import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @@ -40,16 +41,16 @@ private val BOTTOM_SHEET_ITEM_HEIGHT = 56.dp @Composable fun BottomSheetItem(imageVector: ImageVector, @StringRes titleRes: Int, onClick: () -> Unit) { - Button( - colors = ButtonDefaults.textButtonColors(contentColor = SwissTransferTheme.colors.primaryTextColor), + SharpRippleButton( modifier = Modifier .height(BOTTOM_SHEET_ITEM_HEIGHT) .fillMaxWidth(), - shape = CustomShapes.None, onClick = onClick, ) { Row( - modifier = Modifier.fillMaxWidth(), + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = Margin.Large), horizontalArrangement = Arrangement.Start, verticalAlignment = Alignment.CenterVertically, ) { diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/SharpRippleButton.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/SharpRippleButton.kt new file mode 100644 index 000000000..9e15dd863 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/SharpRippleButton.kt @@ -0,0 +1,41 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * 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 . + */ + +package com.infomaniak.swisstransfer.ui.components + +import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.RowScope +import androidx.compose.material3.Button +import androidx.compose.material3.ButtonDefaults +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.theme.CustomShapes +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme + +@Composable +fun SharpRippleButton(modifier: Modifier = Modifier, onClick: () -> Unit, content: @Composable RowScope.() -> Unit) { + Button( + modifier = modifier, + colors = ButtonDefaults.textButtonColors(contentColor = SwissTransferTheme.colors.primaryTextColor), + shape = CustomShapes.None, + onClick = onClick, + content = content, + contentPadding = PaddingValues(0.dp), + ) +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/Bell.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/Bell.kt new file mode 100644 index 000000000..42f81e783 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/Bell.kt @@ -0,0 +1,71 @@ +package com.infomaniak.swisstransfer.ui.icons.app + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.PathFillType.Companion.NonZero +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.graphics.vector.ImageVector.Builder +import androidx.compose.ui.graphics.vector.path +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.icons.AppIcons +import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound +import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound + +val AppIcons.Bell: ImageVector + get() { + if (_notificationBell != null) { + return _notificationBell!! + } + _notificationBell = Builder( + name = "Bell", + defaultWidth = 24.0.dp, + defaultHeight = 24.0.dp, + viewportWidth = 24.0f, + viewportHeight = 24.0f + ).apply { + path( + fill = null, + stroke = SolidColor(Color(0xFF9F9F9F)), + strokeLineWidth = 1.5f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero + ) { + moveTo(9.0f, 20.0f) + curveToRelative(0.19f, 0.866f, 0.585f, 1.626f, 1.126f, 2.167f) + reflectiveCurveTo(11.324f, 23.0f, 12.0f, 23.0f) + reflectiveCurveToRelative(1.333f, -0.292f, 1.874f, -0.833f) + curveTo(14.414f, 21.627f, 14.81f, 20.866f, 15.0f, 20.0f) + moveTo(12.0f, 4.0f) + verticalLineTo(1.0f) + moveToRelative(0.0f, 3.0f) + arcToRelative(7.5f, 7.5f, 0.0f, false, true, 7.5f, 7.5f) + curveToRelative(0.0f, 7.046f, 1.5f, 8.25f, 1.5f, 8.25f) + horizontalLineTo(3.0f) + reflectiveCurveToRelative(1.5f, -1.916f, 1.5f, -8.25f) + arcTo(7.5f, 7.5f, 0.0f, false, true, 12.0f, 4.0f) + } + }.build() + return _notificationBell!! + } + +private var _notificationBell: ImageVector? = null + +@Preview +@Composable +private fun Preview() { + Box { + Image( + imageVector = AppIcons.Bell, + contentDescription = null, + modifier = Modifier.size(AppIcons.previewSize) + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/ChevronRightSmall.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/ChevronRightSmall.kt new file mode 100644 index 000000000..8aba54eb2 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/ChevronRightSmall.kt @@ -0,0 +1,64 @@ +package com.infomaniak.swisstransfer.ui.icons.app + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.PathFillType.Companion.NonZero +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.graphics.vector.ImageVector.Builder +import androidx.compose.ui.graphics.vector.path +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.icons.AppIcons +import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound +import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound + +val AppIcons.ChevronRightSmall: ImageVector + get() { + if (_chevronRightSmall != null) { + return _chevronRightSmall!! + } + _chevronRightSmall = Builder( + name = "ChevronRightSmall", + defaultWidth = 16.0.dp, + defaultHeight = 16.0.dp, + viewportWidth = 16.0f, + viewportHeight = 16.0f + ).apply { + path( + fill = null, + stroke = SolidColor(Color(0xFF9F9F9F)), + strokeLineWidth = 2.0f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero + ) { + moveTo(4.0f, 1.0f) + lineToRelative(7.338f, 6.67f) + arcToRelative(0.5f, 0.5f, 0.0f, false, true, 0.111f, 0.151f) + arcToRelative(0.43f, 0.43f, 0.0f, false, true, -0.111f, 0.509f) + lineTo(4.0f, 15.0f) + } + }.build() + return _chevronRightSmall!! + } + +private var _chevronRightSmall: ImageVector? = null + +@Preview +@Composable +private fun Preview() { + Box { + Image( + imageVector = AppIcons.ChevronRightSmall, + contentDescription = null, + modifier = Modifier.size(AppIcons.previewSize) + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/OpenOutside.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/OpenOutside.kt new file mode 100644 index 000000000..6fee503ad --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/OpenOutside.kt @@ -0,0 +1,74 @@ +package com.infomaniak.swisstransfer.ui.icons.app + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.PathFillType.Companion.NonZero +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.graphics.vector.ImageVector.Builder +import androidx.compose.ui.graphics.vector.group +import androidx.compose.ui.graphics.vector.path +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.icons.AppIcons +import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound +import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound + +val AppIcons.OpenOutside: ImageVector + get() { + if (_openOutside != null) { + return _openOutside!! + } + _openOutside = Builder( + name = "OpenOutside", + defaultWidth = 16.0.dp, + defaultHeight = 16.0.dp, + viewportWidth = 16.0f, + viewportHeight = 16.0f + ).apply { + group { + path( + fill = null, + stroke = SolidColor(Color(0xFF9F9F9F)), + strokeLineWidth = 2.0f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero + ) { + moveTo(15.0f, 5.2f) + verticalLineTo(1.0f) + horizontalLineToRelative(-4.2f) + moveTo(15.0f, 1.0f) + lineToRelative(-9.333f, 9.333f) + moveTo(7.533f, 3.8f) + horizontalLineToRelative(-5.6f) + arcTo(0.933f, 0.933f, 0.0f, false, false, 1.0f, 4.733f) + verticalLineToRelative(9.334f) + arcTo(0.933f, 0.933f, 0.0f, false, false, 1.933f, 15.0f) + horizontalLineToRelative(9.334f) + arcToRelative(0.933f, 0.933f, 0.0f, false, false, 0.933f, -0.933f) + verticalLineToRelative(-5.6f) + } + } + }.build() + return _openOutside!! + } + +private var _openOutside: ImageVector? = null + +@Preview +@Composable +private fun Preview() { + Box { + Image( + imageVector = AppIcons.OpenOutside, + contentDescription = null, + modifier = Modifier.size(AppIcons.previewSize) + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/SpeechBubble.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/SpeechBubble.kt new file mode 100644 index 000000000..e32880f18 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/SpeechBubble.kt @@ -0,0 +1,77 @@ +package com.infomaniak.swisstransfer.ui.icons.app + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.PathFillType.Companion.NonZero +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.graphics.vector.ImageVector.Builder +import androidx.compose.ui.graphics.vector.group +import androidx.compose.ui.graphics.vector.path +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.icons.AppIcons +import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound +import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound + +val AppIcons.SpeechBubble: ImageVector + get() { + if (_speechBubble != null) { + return _speechBubble!! + } + _speechBubble = Builder( + name = "SpeechBubble", + defaultWidth = 24.0.dp, + defaultHeight = 24.0.dp, + viewportWidth = 24.0f, + viewportHeight = 24.0f + ).apply { + group { + path( + fill = null, + stroke = SolidColor(Color(0xFF9F9F9F)), + strokeLineWidth = 1.5f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero + ) { + moveTo(21.75f, 18.75f) + horizontalLineToRelative(-10.5f) + lineToRelative(-6.0f, 4.5f) + verticalLineToRelative(-4.5f) + horizontalLineToRelative(-3.0f) + arcToRelative(1.5f, 1.5f, 0.0f, false, true, -1.5f, -1.5f) + verticalLineToRelative(-15.0f) + arcToRelative(1.5f, 1.5f, 0.0f, false, true, 1.5f, -1.5f) + horizontalLineToRelative(19.5f) + arcToRelative(1.5f, 1.5f, 0.0f, false, true, 1.5f, 1.5f) + verticalLineToRelative(15.0f) + arcToRelative(1.5f, 1.5f, 0.0f, false, true, -1.5f, 1.5f) + moveTo(5.25f, 7.5f) + horizontalLineToRelative(13.5f) + moveTo(5.25f, 12.0f) + horizontalLineToRelative(10.5f) + } + } + }.build() + return _speechBubble!! + } + +private var _speechBubble: ImageVector? = null + +@Preview +@Composable +private fun Preview() { + Box { + Image( + imageVector = AppIcons.SpeechBubble, + contentDescription = null, + modifier = Modifier.size(AppIcons.previewSize) + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/SettingsScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/SettingsScreen.kt index f44a154c6..1833ca783 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/SettingsScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/SettingsScreen.kt @@ -18,6 +18,12 @@ package com.infomaniak.swisstransfer.ui.screen.main.settings +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.material3.Text @@ -26,12 +32,24 @@ import androidx.compose.material3.adaptive.WindowAdaptiveInfo import androidx.compose.material3.adaptive.currentWindowAdaptiveInfo import androidx.compose.material3.adaptive.layout.ListDetailPaneScaffoldRole import androidx.compose.runtime.Composable -import com.infomaniak.swisstransfer.ui.components.TwoPaneScaffold +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.stringResource +import com.infomaniak.swisstransfer.R +import com.infomaniak.swisstransfer.ui.components.* +import com.infomaniak.swisstransfer.ui.icons.AppIcons +import com.infomaniak.swisstransfer.ui.icons.app.Add +import com.infomaniak.swisstransfer.ui.icons.app.Bell +import com.infomaniak.swisstransfer.ui.icons.app.SpeechBubble +import com.infomaniak.swisstransfer.ui.screen.main.settings.components.EndIconType +import com.infomaniak.swisstransfer.ui.screen.main.settings.components.SettingDivider +import com.infomaniak.swisstransfer.ui.screen.main.settings.components.SettingItem +import com.infomaniak.swisstransfer.ui.screen.main.settings.components.SettingTitle +import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme import com.infomaniak.swisstransfer.ui.utils.PreviewMobile import com.infomaniak.swisstransfer.ui.utils.PreviewTablet - @OptIn(ExperimentalMaterial3AdaptiveApi::class) @Composable fun SettingsScreenWrapper( @@ -50,7 +68,9 @@ fun SettingsScreenWrapper( detailPane = { // Show the detail pane content if selected item is available if (currentDestination?.content == null) { - Text("Empty state") + Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) { + Text("Select a setting item", color = SwissTransferTheme.colors.secondaryTextColor) + } } else { Text("Show selected item") } @@ -60,7 +80,35 @@ fun SettingsScreenWrapper( @Composable private fun SettingsScreen(onItemClick: (Any) -> Unit) { - Text("Settings screen") + Column(modifier = Modifier.verticalScroll(rememberScrollState())) { + Text( + modifier = Modifier.padding(horizontal = Margin.Medium, vertical = Margin.Large), + text = stringResource(R.string.settingsTitle), + style = SwissTransferTheme.typography.h1, + ) + + SettingTitle(R.string.settingsCategoryGeneral) + // TODO: Use correct icon + SettingItem(R.string.settingsOptionTheme, AppIcons.Add, "TODO", EndIconType.CHEVRON) {} + SettingItem(R.string.settingsOptionNotifications, AppIcons.Bell, "TODO", endIcon = EndIconType.OPEN_OUTSIDE) {} + + SettingDivider() + + SettingTitle(R.string.settingsCategoryDefaultSettings) + // TODO: Use correct icon + SettingItem(R.string.settingsOptionValidityPeriod, AppIcons.Add, "TODO", endIcon = EndIconType.CHEVRON) {} + // TODO: Use correct icon + SettingItem(R.string.settingsOptionDownloadLimit, AppIcons.Add, "TODO", endIcon = EndIconType.CHEVRON) {} + SettingItem(R.string.settingsOptionEmailLanguage, AppIcons.SpeechBubble, "TODO", endIcon = EndIconType.CHEVRON) {} + + SettingDivider() + + SettingTitle(R.string.settingsCategoryAbout) + SettingItem(R.string.settingsOptionDiscoverInfomaniak, endIcon = EndIconType.OPEN_OUTSIDE) {} + SettingItem(R.string.settingsOptionShareIdeas, endIcon = EndIconType.OPEN_OUTSIDE) {} + SettingItem(R.string.settingsOptionGiveFeedback, endIcon = EndIconType.OPEN_OUTSIDE) {} + SettingItem(R.string.version, description = "0.0.1", onClick = null) + } } @PreviewMobile diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingDivider.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingDivider.kt new file mode 100644 index 000000000..d6842d02e --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingDivider.kt @@ -0,0 +1,35 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * 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 . + */ + +package com.infomaniak.swisstransfer.ui.screen.main.settings.components + +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.HorizontalDivider +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import com.infomaniak.swisstransfer.ui.theme.Dimens + +@Composable +fun SettingDivider() { + HorizontalDivider( + modifier = Modifier.padding( + horizontal = Dimens.SettingHorizontalMargin, + vertical = Dimens.SettingVerticalMargin + ) + ) +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingItem.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingItem.kt new file mode 100644 index 000000000..3865cffec --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingItem.kt @@ -0,0 +1,134 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * 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 . + */ + +package com.infomaniak.swisstransfer.ui.screen.main.settings.components + +import androidx.annotation.StringRes +import androidx.compose.foundation.layout.* +import androidx.compose.material3.Icon +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.R +import com.infomaniak.swisstransfer.ui.components.SharpRippleButton +import com.infomaniak.swisstransfer.ui.icons.AppIcons +import com.infomaniak.swisstransfer.ui.icons.app.Add +import com.infomaniak.swisstransfer.ui.icons.app.ChevronRightSmall +import com.infomaniak.swisstransfer.ui.icons.app.Folder +import com.infomaniak.swisstransfer.ui.icons.app.OpenOutside +import com.infomaniak.swisstransfer.ui.theme.Dimens +import com.infomaniak.swisstransfer.ui.theme.Margin +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme + +private val ITEM_MIN_HEIGHT = 56.dp + +@Composable +fun SettingItem( + @StringRes titleRes: Int, + icon: ImageVector? = null, + description: String? = null, + endIcon: EndIconType? = null, + onClick: (() -> Unit)?, +) { + val modifier = Modifier + .fillMaxWidth() + .heightIn(min = ITEM_MIN_HEIGHT) + + onClick?.let { + SharpRippleButton( + modifier = modifier, + onClick = it, + ) { + SettingItemContent(icon, titleRes, description, endIcon) + } + } ?: run { + Box(modifier = modifier, contentAlignment = Alignment.CenterStart) { + SettingItemContent(icon, titleRes, description, endIcon) + } + } +} + +@Composable +private fun SettingItemContent( + icon: ImageVector?, + titleRes: Int, + description: String?, + endIcon: EndIconType? +) { + Row( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = Dimens.SettingHorizontalMargin, vertical = Dimens.SettingVerticalMargin), + horizontalArrangement = Arrangement.Start, + verticalAlignment = Alignment.CenterVertically, + ) { + icon?.let { + Icon(imageVector = it, contentDescription = null, tint = SwissTransferTheme.materialColors.primary) + Spacer(modifier = Modifier.width(Margin.Medium)) + } + + Column(modifier = Modifier.weight(1f)) { + Text(text = stringResource(id = titleRes), style = SwissTransferTheme.typography.bodyRegular) + + description?.let { + Text( + text = it, + style = SwissTransferTheme.typography.bodySmallRegular, + color = SwissTransferTheme.colors.tertiaryTextColor, + ) + } + + } + + endIcon?.let { + Icon(imageVector = it.icon, contentDescription = null, tint = SwissTransferTheme.colors.iconColor) + } + } +} + +@Preview +@Composable +private fun SettingItemPreview() { + SwissTransferTheme { + Surface { + Column { + SettingTitle(R.string.appName) + SettingItem(R.string.appName, AppIcons.Add, "Clair", EndIconType.CHEVRON) {} + SettingItem(R.string.appName, AppIcons.Folder, endIcon = EndIconType.OPEN_OUTSIDE) {} + SettingItem(R.string.appName, description = "1.1.2") {} + SettingItem(R.string.appName) {} + SettingDivider() + SettingTitle(R.string.appName) + SettingItem(R.string.appName, endIcon = EndIconType.OPEN_OUTSIDE) {} + SettingItem(R.string.appName, endIcon = EndIconType.OPEN_OUTSIDE) {} + SettingItem(R.string.appName, description = "0.0.1", onClick = null) + } + } + } +} + +enum class EndIconType(val icon: ImageVector) { + CHEVRON(AppIcons.ChevronRightSmall), + OPEN_OUTSIDE(AppIcons.OpenOutside), +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingTitle.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingTitle.kt new file mode 100644 index 000000000..1c523c5bd --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/settings/components/SettingTitle.kt @@ -0,0 +1,38 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * 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 . + */ + +package com.infomaniak.swisstransfer.ui.screen.main.settings.components + +import androidx.annotation.StringRes +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.stringResource +import com.infomaniak.swisstransfer.ui.theme.Dimens +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme + +@Composable +fun SettingTitle(@StringRes titleRes: Int) { + Text( + modifier = Modifier.padding(horizontal = Dimens.SettingHorizontalMargin, vertical = Dimens.SettingVerticalMargin), + text = stringResource(id = titleRes), + style = SwissTransferTheme.typography.bodySmallRegular, + color = SwissTransferTheme.colors.secondaryTextColor, + ) +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt index ea59bca29..685d1e85a 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt @@ -39,6 +39,7 @@ private const val specific4 = 0xFFEAC35D // Extra palette private const val error = 0xFFFC8878 +private const val elephant = 0xFF666666 val DarkColorScheme = darkColorScheme( primary = Color(green_main), @@ -64,6 +65,8 @@ val DarkColorScheme = darkColorScheme( val CustomDarkColorScheme = CustomColorScheme( primaryTextColor = Color(rabbit), secondaryTextColor = Color(shark), + tertiaryTextColor = Color(elephant), + iconColor = Color(shark), navigationItemBackground = Color(dark2), tertiaryButtonBackground = Color(dark2), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt index 56e9c7dde..51f77945f 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt @@ -69,6 +69,8 @@ val LightColorScheme = lightColorScheme( val CustomLightColorScheme = CustomColorScheme( primaryTextColor = Color(orca), secondaryTextColor = Color(elephant), + tertiaryTextColor = Color(shark), + iconColor = Color(elephant), navigationItemBackground = LightColorScheme.background, tertiaryButtonBackground = Color(rabbit), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Dimens.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Dimens.kt new file mode 100644 index 000000000..ad7f623a6 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Dimens.kt @@ -0,0 +1,26 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * 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 . + */ + +package com.infomaniak.swisstransfer.ui.theme + +import androidx.compose.ui.unit.dp + +object Dimens { + val SettingHorizontalMargin = Margin.Medium + val SettingVerticalMargin = 12.dp +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt index 102351aee..832c5ec04 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt @@ -63,6 +63,8 @@ object SwissTransferTheme { data class CustomColorScheme( val primaryTextColor: Color = Color.Unspecified, val secondaryTextColor: Color = Color.Unspecified, + val tertiaryTextColor: Color = Color.Unspecified, + val iconColor: Color = Color.Unspecified, val navigationItemBackground: Color = Color.Unspecified, val tertiaryButtonBackground: Color = Color.Unspecified, ) diff --git a/app/src/main/res/values-de/strings.xml b/app/src/main/res/values-de/strings.xml index cdd2b0acf..425708a48 100644 --- a/app/src/main/res/values-de/strings.xml +++ b/app/src/main/res/values-de/strings.xml @@ -23,9 +23,21 @@ Received Our story begins here Sent + About + Default settings + Général + Discover Infomaniak + Download limit + Email language + Give your opinion + Notifications + Share your ideas + Theme + Validity period Settings Camera Browse files Photo and video gallery Upload from + Version diff --git a/app/src/main/res/values-es/strings.xml b/app/src/main/res/values-es/strings.xml index cdd2b0acf..425708a48 100644 --- a/app/src/main/res/values-es/strings.xml +++ b/app/src/main/res/values-es/strings.xml @@ -23,9 +23,21 @@ Received Our story begins here Sent + About + Default settings + Général + Discover Infomaniak + Download limit + Email language + Give your opinion + Notifications + Share your ideas + Theme + Validity period Settings Camera Browse files Photo and video gallery Upload from + Version diff --git a/app/src/main/res/values-fr/strings.xml b/app/src/main/res/values-fr/strings.xml index 059ad05e7..ac5185aee 100644 --- a/app/src/main/res/values-fr/strings.xml +++ b/app/src/main/res/values-fr/strings.xml @@ -23,9 +23,21 @@ Recu Notre histoire commence ici Envoyé + A propos + Paramètres par défaut + Général + Découvrir Infomaniak + Limite de téléchargements + Langue de l’e-mail + Donne ton avis + Notifications + Partage tes idées + Thème + Durée de validité Paramètres Appareil photo Parcourir les fichiers Galerie photos et vidéos Télécharger à partir de + Version diff --git a/app/src/main/res/values-it/strings.xml b/app/src/main/res/values-it/strings.xml index cdd2b0acf..425708a48 100644 --- a/app/src/main/res/values-it/strings.xml +++ b/app/src/main/res/values-it/strings.xml @@ -23,9 +23,21 @@ Received Our story begins here Sent + About + Default settings + Général + Discover Infomaniak + Download limit + Email language + Give your opinion + Notifications + Share your ideas + Theme + Validity period Settings Camera Browse files Photo and video gallery Upload from + Version diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index d87d627ac..11fd8a015 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -26,9 +26,21 @@ Received Our story begins here Sent + About + Default settings + Général + Discover Infomaniak + Download limit + Email language + Give your opinion + Notifications + Share your ideas + Theme + Validity period Settings Camera Browse files Photo and video gallery Upload from + Version