wbrawner/thunderbird-android
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add EmailAddressInput molecule

Browse source
This commit is contained in:
Wolf-Martell Montwé 2023-05-10 16:49:57 +02:00
parent d86210aedc
commit 8d0139d6ae
No known key found for this signature in database
GPG key ID: 6D45B21512ACBF72
3 changed files with 97 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/MoleculeItems.kt
View file

@ -4,15 +4,18 @@ import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.lazy.grid.LazyGridScope
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import app.k9mail.core.ui.compose.designsystem.atom.text.TextSubtitle1
import app.k9mail.core.ui.compose.designsystem.molecule.EmailAddressInput
import app.k9mail.core.ui.compose.designsystem.molecule.ErrorView
import app.k9mail.core.ui.compose.designsystem.molecule.LoadingView
import app.k9mail.core.ui.compose.theme.MainTheme
import app.k9mail.ui.catalog.helper.WithRememberedState
fun LazyGridScope.moleculeItems() {
sectionHeaderItem(text = "Molecules")
@ -37,6 +40,28 @@ fun LazyGridScope.moleculeItems() {
)
}
}
item {
MoleculeWrapper(title = "EmailAddressInput") {
WithRememberedState(input = "") { state ->
EmailAddressInput(
emailAddress = state.value,
onEmailAddressChange = { state.value = it },
)
}
}
}
item {
MoleculeWrapper(title = "EmailAddressInput with error") {
WithRememberedState(input = "wrong email address") { state ->
EmailAddressInput(
emailAddress = state.value,
onEmailAddressChange = { state.value = it },
errorMessage = "Invalid email address",
)
}
}
}
}
@Composable
@ -49,7 +74,9 @@ private fun MoleculeWrapper(
) {
TextSubtitle1(text = title)
Box(
modifier = Modifier.border(1.dp, Color.Gray),
modifier = Modifier
.border(1.dp, Color.Gray)
.fillMaxWidth(),
) {
content()
}

68
core/ui/compose/designsystem/src/main/kotlin/app/k9mail/core/ui/compose/designsystem/molecule/EmailAddressInput.kt Normal file
View file

@ -0,0 +1,68 @@
package app.k9mail.core.ui.compose.designsystem.molecule
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
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.tooling.preview.Preview
import app.k9mail.core.ui.compose.designsystem.R
import app.k9mail.core.ui.compose.designsystem.atom.text.TextCaption
import app.k9mail.core.ui.compose.designsystem.atom.textfield.TextFieldOutlinedEmailAddress
import app.k9mail.core.ui.compose.theme.MainTheme
import app.k9mail.core.ui.compose.theme.PreviewWithThemes
@Composable
fun EmailAddressInput(
onEmailAddressChange: (String) -> Unit,
modifier: Modifier = Modifier,
emailAddress: String = "",
errorMessage: String? = null,
) {
Column(
modifier = Modifier
.padding(
horizontal = MainTheme.spacings.double,
vertical = MainTheme.spacings.default,
)
.then(modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
TextFieldOutlinedEmailAddress(
value = emailAddress,
onValueChange = onEmailAddressChange,
label = stringResource(id = R.string.designsystem_molecule_email_address_input_label),
isError = errorMessage != null,
)
AnimatedVisibility(visible = errorMessage != null) {
TextCaption(
text = errorMessage ?: "",
modifier = Modifier.padding(top = MainTheme.spacings.default),
color = MainTheme.colors.error,
)
}
}
}
@Preview(showBackground = true)
@Composable
internal fun EmailAddressInputPreview() {
PreviewWithThemes {
EmailAddressInput(
onEmailAddressChange = {},
)
}
}
@Preview(showBackground = true)
@Composable
internal fun EmailAddressInputWithErrorPreview() {
PreviewWithThemes {
EmailAddressInput(
onEmailAddressChange = {},
errorMessage = "Email address error",
)
}
}

1
core/ui/compose/designsystem/src/main/res/values/strings.xml
View file

@ -2,5 +2,6 @@
<resources>
<string name="designsystem_atom_password_textfield_hide_password">Hide password</string>
<string name="designsystem_atom_password_textfield_show_password">Show password</string>
<string name="designsystem_molecule_email_address_input_label">Email address</string>
<string name="designsystem_molecule_error_view_button_retry">Retry</string>
</resources>