Improve session recovery screens (#2657)
* Improve enter recovery key screen UI * Add instructions to reset the encryption of the logged in account. * Update screenshots * Fix maestro flow --------- Co-authored-by: ElementBot <benoitm+elementbot@element.io>
This commit is contained in:
Jorge Martin Espinosa
GitHub
parent
d0f26777da
commit
cf072fa1e1
164 changed files with 765 additions and 358 deletions
|
|
@ -0,0 +1,188 @@
|
|||
/*
|
||||
* Copyright (c) 2024 New Vector Ltd
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
package io.element.android.libraries.designsystem.modifiers
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.runtime.Stable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.layout.LayoutModifier
|
||||
import androidx.compose.ui.layout.Measurable
|
||||
import androidx.compose.ui.layout.MeasureResult
|
||||
import androidx.compose.ui.layout.MeasureScope
|
||||
import androidx.compose.ui.platform.InspectorInfo
|
||||
import androidx.compose.ui.platform.InspectorValueInfo
|
||||
import androidx.compose.ui.platform.debugInspectorInfo
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.Constraints
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreview
|
||||
import kotlin.math.max
|
||||
import kotlin.math.min
|
||||
|
||||
/**
|
||||
* Makes the content square in size.
|
||||
*
|
||||
* This is achieved by cropping incoming max constraints to the largest possible square size
|
||||
* and measuring the content using resulting constraints.
|
||||
* Next the size of layout is decided based on largest dimension of the measured content.
|
||||
* Finally the content is placed inside the square layout according to specified [position].
|
||||
*
|
||||
* If no square exists that falls within the size range of the incoming constraints,
|
||||
* the content will be laid out as usual, as if the modifier was not applied.
|
||||
*
|
||||
* @param position The fraction of the content's position inside its square layout.
|
||||
* It determines the point on the axis that was extended to make a square.
|
||||
* Typically you'd want to use values between `0` and `1`, inclusive, where `0`
|
||||
* will place the content at the "start" of the square, `0.5` in the middle, and `1` at the "end".
|
||||
*/
|
||||
@Stable
|
||||
fun Modifier.squareSize(
|
||||
position: Float = 0.5f,
|
||||
): Modifier =
|
||||
this.then(
|
||||
when {
|
||||
position == 0.5f -> SquareSizeCenter
|
||||
else -> createSquareSizeModifier(position = position)
|
||||
}
|
||||
)
|
||||
|
||||
private val SquareSizeCenter = createSquareSizeModifier(position = 0.5f)
|
||||
|
||||
private class SquareSizeModifier(
|
||||
private val position: Float,
|
||||
inspectorInfo: InspectorInfo.() -> Unit,
|
||||
) : LayoutModifier, InspectorValueInfo(inspectorInfo) {
|
||||
override fun MeasureScope.measure(
|
||||
measurable: Measurable,
|
||||
constraints: Constraints,
|
||||
): MeasureResult {
|
||||
val maxSquare = min(constraints.maxWidth, constraints.maxHeight)
|
||||
val minSquare = max(constraints.minWidth, constraints.minHeight)
|
||||
val squareExists = minSquare <= maxSquare
|
||||
|
||||
val resolvedConstraints = constraints
|
||||
.takeUnless { squareExists }
|
||||
?: constraints.copy(maxWidth = maxSquare, maxHeight = maxSquare)
|
||||
|
||||
val placeable = measurable.measure(resolvedConstraints)
|
||||
|
||||
return if (squareExists) {
|
||||
val size = max(placeable.width, placeable.height)
|
||||
layout(size, size) {
|
||||
val x = ((size - placeable.width) * position).toInt()
|
||||
val y = ((size - placeable.height) * position).toInt()
|
||||
placeable.placeRelative(x, y)
|
||||
}
|
||||
} else {
|
||||
layout(placeable.width, placeable.height) {
|
||||
placeable.placeRelative(0, 0)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
override fun equals(other: Any?): Boolean {
|
||||
if (this === other) return true
|
||||
if (javaClass != other?.javaClass) return false
|
||||
if (other !is SquareSizeModifier) return false
|
||||
|
||||
if (position != other.position) return false
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
override fun hashCode(): Int {
|
||||
return position.hashCode()
|
||||
}
|
||||
}
|
||||
|
||||
@Suppress("ModifierFactoryExtensionFunction", "ModifierFactoryReturnType")
|
||||
private fun createSquareSizeModifier(
|
||||
position: Float,
|
||||
) =
|
||||
SquareSizeModifier(
|
||||
position = position,
|
||||
inspectorInfo = debugInspectorInfo {
|
||||
name = "squareSize"
|
||||
properties["position"] = position
|
||||
},
|
||||
)
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
internal fun SquareSizeModifierLargeWidthPreview() {
|
||||
ElementPreview {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.padding(32.dp)
|
||||
.background(Color.Gray)
|
||||
.squareSize(position = 0.25f)
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.background(Color.Black)
|
||||
.size(100.dp, 10.dp)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
internal fun SquareSizeModifierLargeHeightPreview() {
|
||||
ElementPreview {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.padding(32.dp)
|
||||
.background(Color.Gray)
|
||||
.squareSize(position = 0.75f)
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.background(Color.Black)
|
||||
.size(10.dp, 100.dp)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
internal fun SquareSizeModifierInsideSquarePreview() {
|
||||
ElementPreview {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.padding(32.dp)
|
||||
.size(120.dp)
|
||||
.background(Color.Gray),
|
||||
contentAlignment = Alignment.Center,
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.background(Color.Black)
|
||||
.width(100.dp)
|
||||
.squareSize(position = 0.75f)
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -202,7 +202,7 @@
|
|||
<string name="common_server_not_supported">"Сервер не падтрымліваецца"</string>
|
||||
<string name="common_server_url">"URL-адрас сервера"</string>
|
||||
<string name="common_settings">"Налады"</string>
|
||||
<string name="common_shared_location">"Абагуліць месцазнаходжанне"</string>
|
||||
<string name="common_shared_location">"Абагуленае месцазнаходжанне"</string>
|
||||
<string name="common_signing_out">"Выхад"</string>
|
||||
<string name="common_starting_chat">"Пачатак чата…"</string>
|
||||
<string name="common_sticker">"Стыкер"</string>
|
||||
|
|
@ -249,13 +249,6 @@
|
|||
<string name="invite_friends_text">"Гэй, пагавары са мной у %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Паведаміць аб памылцы з дапамогай Rageshake"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Адкрыйце Element на настольнай прыладзе"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Увайдзіце ў свой уліковы запіс яшчэ раз"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Калі будзе прапанавана пацвердзіць вашу прыладу, выберыце %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"“Скінуць усе”"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Выконвайце інструкцыі, каб стварыць новы ключ аднаўлення"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">"Захавайце новы ключ аднаўлення ў ме́неджэры пароляў або ў зашыфраванай нататке"</string>
|
||||
<string name="screen_create_new_recovery_key_title">"Скіньце шыфраванне для вашага ўліковага запісу з дапамогай іншай прылады"</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Не ўдалося выбраць носьбіт, паўтарыце спробу."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Не атрымалася апрацаваць медыяфайл для загрузкі, паспрабуйце яшчэ раз."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Не атрымалася загрузіць медыяфайлы, паспрабуйце яшчэ раз."</string>
|
||||
|
|
|
|||
|
|
@ -249,13 +249,6 @@
|
|||
<string name="invite_friends_text">"Ahoj, ozvi se mi na %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Zatřeste zařízením pro nahlášení chyby"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Otevřít Element na stolním počítači"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Znovu se přihlaste ke svému účtu"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Když budete vyzváni k ověření vašeho zařízení, vyberte %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"\"Resetovat vše\""</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Postupujte podle pokynů k vytvoření nového obnovovacího klíče"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">"Uložte nový klíč pro obnovení do správce hesel nebo do zašifrované poznámky"</string>
|
||||
<string name="screen_create_new_recovery_key_title">"Obnovte šifrování účtu pomocí jiného zařízení"</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Výběr média se nezdařil, zkuste to prosím znovu."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Nahrání média se nezdařilo, zkuste to prosím znovu."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Nahrání média se nezdařilo, zkuste to prosím znovu."</string>
|
||||
|
|
|
|||
|
|
@ -247,26 +247,6 @@
|
|||
<string name="invite_friends_text">"Hey, sprich mit mir auf %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Schüttel heftig zum Melden von Fehlern"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">
|
||||
"Öffne "
|
||||
<b>"Element"</b>
|
||||
" auf einem "
|
||||
<b>"Desktop-Gerät"</b>
|
||||
</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Melde dich erneut bei deinem Konto an"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Wenn du aufgefordert wirst dein Gerät zu verifizieren, wähle \"%1$s\"."</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"Alles zurücksetzen"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Folge den Anweisungen, um einen neuen Wiederherstellungsschlüssel zu erstellen"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">
|
||||
"Speichere deinen neuen "
|
||||
<b>"Wiederherstellungsschlüssel"</b>
|
||||
" in einem Passwortmanager oder einer verschlüsselten Notiz"
|
||||
</string>
|
||||
<string name="screen_create_new_recovery_key_title">
|
||||
"Erstelle einen neuen "
|
||||
<b>"Wiederherstellungsschlüssel"</b>
|
||||
" mit einem anderen Gerät"
|
||||
</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Medienauswahl fehlgeschlagen, bitte versuche es erneut."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Fehler beim Verarbeiten des hochgeladenen Mediums. Bitte versuche es erneut."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Das Hochladen der Medien ist fehlgeschlagen. Bitte versuche es erneut."</string>
|
||||
|
|
|
|||
|
|
@ -245,13 +245,6 @@
|
|||
<string name="invite_friends_text">"Beszélgessünk itt: %1$s, %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Az eszköz rázása a hibajelentéshez"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Nyissa meg az Elementet egy asztali eszközön"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Jelentkezzen be újra a fiókjába"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Amikor az eszköz ellenőrzését kéri, válassza ezt a lehetőséget: %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"„Minden visszaállítása”"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Kövesse az utasításokat egy új helyreállítási kulcs létrehozásához"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">"Mentse az új helyreállítási kulcsot egy jelszókezelőbe vagy egy titkosított jegyzetbe."</string>
|
||||
<string name="screen_create_new_recovery_key_title">"A fiók titkosításának visszaállítása egy másik eszköz használatával"</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Nem sikerült kiválasztani a médiát, próbálja újra."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Nem sikerült feldolgozni a feltöltendő médiát, próbálja újra."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Nem sikerült a média feltöltése, próbálja újra."</string>
|
||||
|
|
|
|||
|
|
@ -241,13 +241,6 @@
|
|||
<string name="invite_friends_text">"Hai, bicaralah dengan saya di %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Rageshake untuk melaporkan kutu"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Buka Element di perangkat desktop"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Masuk ke akun Anda lagi"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Saat diminta untuk memverifikasi perangkat Anda, pilih %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"“Atur ulang semua”"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Ikuti petunjuk untuk membuat kunci pemulihan baru"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">"Simpan kunci pemulihan baru Anda dalam pengelola kata sandi atau catatan terenkripsi"</string>
|
||||
<string name="screen_create_new_recovery_key_title">"Atur ulang enkripsi untuk akun Anda menggunakan perangkat lain"</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Gagal memilih media, silakan coba lagi."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Gagal memproses media untuk diunggah, silakan coba lagi."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Gagal mengunggah media, silakan coba lagi."</string>
|
||||
|
|
|
|||
|
|
@ -251,17 +251,6 @@
|
|||
<string name="invite_friends_text">"Привет, поговори со мной по %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Встряхните устройство, чтобы сообщить об ошибке"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Откройте Element на настольном устройстве"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Войдите в свой аккаунт еще раз"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Когда вас попросят подтвердить устройство, выберите %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"“Сбросить все”"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Следуйте инструкциям, чтобы создать новый ключ восстановления"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">
|
||||
"Сохраните новый "
|
||||
<b>"ключ восстановления"</b>
|
||||
" в менеджере паролей или зашифрованной заметке"
|
||||
</string>
|
||||
<string name="screen_create_new_recovery_key_title">"Сбросьте шифрование вашей учетной записи с помощью другого устройства."</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Не удалось выбрать носитель, попробуйте еще раз."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Не удалось обработать медиафайл для загрузки, попробуйте еще раз."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Не удалось загрузить медиафайлы, попробуйте еще раз."</string>
|
||||
|
|
|
|||
|
|
@ -248,13 +248,6 @@
|
|||
<string name="invite_friends_text">"Ahoj, porozprávajte sa so mnou na %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Zúrivo potriasť pre nahlásenie chyby"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Otvoriť Element v stolnom počítači"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Znova sa prihláste do svojho účtu"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"Keď sa zobrazí výzva na overenie vášho zariadenia, vyberte %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"\"Obnoviť všetko\""</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Postupujte podľa pokynov na vytvorenie nového kľúča na obnovenie"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">"Uložte si nový kľúč na obnovenie do správcu hesiel alebo do zašifrovanej poznámky"</string>
|
||||
<string name="screen_create_new_recovery_key_title">"Obnovte šifrovanie vášho účtu pomocou iného zariadenia"</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Nepodarilo sa vybrať médium, skúste to prosím znova."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Nepodarilo sa spracovať médiá na odoslanie, skúste to prosím znova."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Nepodarilo sa nahrať médiá, skúste to prosím znova."</string>
|
||||
|
|
|
|||
|
|
@ -245,13 +245,6 @@
|
|||
<string name="invite_friends_text">"Hey, talk to me on %1$s: %2$s"</string>
|
||||
<string name="login_initial_device_name_android">"%1$s Android"</string>
|
||||
<string name="preference_rageshake">"Rageshake to report bug"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_1">"Open Element in a desktop device"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_2">"Sign into your account again"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3">"When asked to verify your device, select %1$s"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_3_reset_all">"“Reset all”"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_4">"Follow the instructions to create a new recovery key"</string>
|
||||
<string name="screen_create_new_recovery_key_list_item_5">"Save your new recovery key in a password manager or encrypted note"</string>
|
||||
<string name="screen_create_new_recovery_key_title">"Reset the encryption for your account using another device"</string>
|
||||
<string name="screen_media_picker_error_failed_selection">"Failed selecting media, please try again."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_processing">"Failed processing media to upload, please try again."</string>
|
||||
<string name="screen_media_upload_preview_error_failed_sending">"Failed uploading media, please try again."</string>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue