Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit bf286eca authored by Qinmei Du's avatar Qinmei Du
Browse files

Update more options screen according to the design 

screenshot: https://screenshot.googleplex.com/5iUFTNXofBJnEpj

Test: deployed locally

Bug: 253157211
Change-Id: Iab0308ef566c6c8292cb3d796576d537a6dc733e
parent 3ef0cc30

packages/CredentialManager/res/values/strings.xml

+6 −4
Original line number Diff line number Diff line
@@ -15,14 +15,16 @@ 
  <string name="choose_create_option_password_title">Save your password to <xliff:g id="providerInfoDisplayName">%1$s</xliff:g>?</string>

  <string name="choose_create_option_sign_in_title">Save your sign-in info to <xliff:g id="providerInfoDisplayName">%1$s</xliff:g>?</string>

  <string name="choose_sign_in_title">Use saved sign in</string>

  <string name="create_passkey_at">Create passkey at</string>

  <string name="create_passkey_in">Create passkey in</string>

  <string name="save_password_to">Save password to</string>

  <string name="save_sign_in_to">Save sign-in to</string>

  <string name="use_provider_for_all_title">Use <xliff:g id="providerInfoDisplayName">%1$s</xliff:g> for all your sign-ins?</string>

  <string name="set_as_default">Set as default</string>

  <string name="use_once">Use once</string>

  <string name="choose_create_option_description">You can use saved <xliff:g id="type">%1$s</xliff:g> on any device. It will be saved to <xliff:g id="providerInfoDisplayName">%2$s</xliff:g> for <xliff:g id="createInfoDisplayName">%3$s</xliff:g></string>

  <string name="more_options_title_multiple_options"><xliff:g id="providerInfoDisplayName">%1$s</xliff:g> for <xliff:g id="createInfoTitle">%2$s</xliff:g></string>

  <string name="more_options_title_one_option"><xliff:g id="providerInfoDisplayName">%1$s</xliff:g></string>

  <string name="more_options_usage_data"><xliff:g id="passwordsNumber">%1$s</xliff:g> passwords and <xliff:g id="passkeyssNumber">%2$s</xliff:g> passkeys saved</string>

  <string name="more_options_usage_passwords_passkeys"><xliff:g id="passwordsNumber">%1$s</xliff:g> passwords, <xliff:g id="passkeysNumber">%2$s</xliff:g> passkeys</string>

  <string name="more_options_usage_passwords"><xliff:g id="passwordsNumber">%1$s</xliff:g> passwords</string>

  <string name="more_options_usage_passkeys"><xliff:g id="passkeysNumber">%1$s</xliff:g> passkeys</string>

  <string name="passkeys">passkeys</string>

  <string name="passwords">passwords</string>

  <string name="sign_ins">sign-ins</string>

packages/CredentialManager/src/com/android/credentialmanager/createflow/CreateModel.kt

+4 −4
Original line number Diff line number Diff line
@@ -34,12 +34,12 @@ open class EntryInfo ( 
class CreateOptionInfo(

  entryKey: String,

  entrySubkey: String,

  val userProviderDisplayName: String,

  val userProviderDisplayName: String?,

  val credentialTypeIcon: Drawable,

  val profileIcon: Drawable,

  val passwordCount: Int,

  val passkeyCount: Int,

  val totalCredentialCount: Int,

  val passwordCount: Int?,

  val passkeyCount: Int?,

  val totalCredentialCount: Int?,

  val lastUsedTimeMillis: Long?,

) : EntryInfo(entryKey, entrySubkey)

packages/CredentialManager/src/com/android/credentialmanager/createflow/CreatePasskeyComponents.kt

+68 −40
Original line number Diff line number Diff line
@@ -73,6 +73,7 @@ fun CreatePasskeyScreen( 
          onMoreOptionsSelected = viewModel::onMoreOptionsSelected

        )

        CreateScreenState.MORE_OPTIONS_SELECTION -> MoreOptionsSelectionCard(

            requestDisplayInfo = uiState.requestDisplayInfo,

            providerList = uiState.providers,

            onBackButtonSelected = viewModel::onBackButtonSelected,

            onOptionSelected = viewModel::onMoreOptionsRowSelected
@@ -209,6 +210,7 @@ fun ProviderSelectionCard( 
@OptIn(ExperimentalMaterial3Api::class)

@Composable

fun MoreOptionsSelectionCard(

  requestDisplayInfo: RequestDisplayInfo,

  providerList: List<ProviderInfo>,

  onBackButtonSelected: () -> Unit,

  onOptionSelected: (ActiveEntry) -> Unit
@@ -218,7 +220,11 @@ fun MoreOptionsSelectionCard( 
      TopAppBar(

        title = {

          Text(

            text = stringResource(R.string.string_more_options),

            text = when (requestDisplayInfo.type) {

              TYPE_PUBLIC_KEY_CREDENTIAL -> stringResource(R.string.create_passkey_in)

              TYPE_PASSWORD_CREDENTIAL -> stringResource(R.string.save_password_to)

              else -> stringResource(R.string.save_sign_in_to)

            },

            style = MaterialTheme.typography.titleMedium

          )

        },
@@ -231,15 +237,9 @@ fun MoreOptionsSelectionCard( 
        }

      )

      Divider(

         thickness = 24.dp,

         thickness = 8.dp,

         color = Color.Transparent

      )

      Text(

        text = stringResource(R.string.create_passkey_at),

        style = MaterialTheme.typography.bodyLarge,

        modifier = Modifier.padding(horizontal = 28.dp),

        textAlign = TextAlign.Center

      )

      Card(

        shape = MaterialTheme.shapes.large,

        modifier = Modifier
@@ -249,7 +249,6 @@ fun MoreOptionsSelectionCard( 
        LazyColumn(

          verticalArrangement = Arrangement.spacedBy(2.dp)

        ) {

          // TODO: change the order according to usage frequency

          providerList.forEach { providerInfo ->

            providerInfo.createOptions.forEach { createOptionInfo ->

              item {
@@ -385,6 +384,7 @@ fun CreationSelectionCard( 
        style = MaterialTheme.typography.bodyMedium,

        modifier = Modifier.align(alignment = Alignment.CenterHorizontally)

      )

      if (createOptionInfo.userProviderDisplayName != null) {

        Text(

          text = stringResource(

            R.string.choose_create_option_description,
@@ -399,6 +399,7 @@ fun CreationSelectionCard( 
          style = MaterialTheme.typography.bodyLarge,

          modifier = Modifier.padding(all = 24.dp).align(alignment = Alignment.CenterHorizontally)

        )

      }

      Card(

        shape = MaterialTheme.shapes.large,

        modifier = Modifier
@@ -504,30 +505,57 @@ fun MoreOptionsInfoRow( 
        onClick = onOptionSelected,

        icon = {

            Image(modifier = Modifier.size(24.dp, 24.dp).padding(start = 10.dp),

                bitmap = createOptionInfo.profileIcon.toBitmap().asImageBitmap(),

                // painter = painterResource(R.drawable.ic_passkey),

                // TODO: add description.

                contentDescription = "")

                bitmap = createOptionInfo.credentialTypeIcon.toBitmap().asImageBitmap(),

                contentDescription = stringResource(R.string.createOptionInfo_icon_description))

        },

        shape = MaterialTheme.shapes.large,

        label = {

          Column() {

              Text(

                text =

                if (providerInfo.createOptions.size > 1)

                {stringResource(R.string.more_options_title_multiple_options,

                  providerInfo.displayName, createOptionInfo.userProviderDisplayName)} else {

                  stringResource(R.string.more_options_title_one_option,

                    providerInfo.displayName)},

                  text = providerInfo.displayName,

                  style = MaterialTheme.typography.titleLarge,

                  modifier = Modifier.padding(top = 16.dp)

              )

            if (createOptionInfo.userProviderDisplayName != null) {

              Text(

                text = stringResource(R.string.more_options_usage_data,

                  createOptionInfo.passwordCount, createOptionInfo.passkeyCount),

                text = createOptionInfo.userProviderDisplayName,

                style = MaterialTheme.typography.bodyMedium)

            }

            if (createOptionInfo.passwordCount != null && createOptionInfo.passkeyCount != null) {

              Text(

                text =

                  stringResource(

                    R.string.more_options_usage_passwords_passkeys,

                    createOptionInfo.passwordCount,

                    createOptionInfo.passkeyCount

                  ),

                style = MaterialTheme.typography.bodyMedium,

                modifier = Modifier.padding(bottom = 16.dp)

              )

            } else if (createOptionInfo.passwordCount != null) {

              Text(

                text =

                stringResource(

                  R.string.more_options_usage_passwords,

                  createOptionInfo.passwordCount

                ),

                style = MaterialTheme.typography.bodyMedium,

                modifier = Modifier.padding(bottom = 16.dp)

              )

            } else if (createOptionInfo.passkeyCount != null) {

              Text(

                text =

                stringResource(

                  R.string.more_options_usage_passkeys,

                  createOptionInfo.passkeyCount

                ),

                style = MaterialTheme.typography.bodyMedium,

                modifier = Modifier.padding(bottom = 16.dp)

              )

            } else if (createOptionInfo.totalCredentialCount != null) {

              // TODO: Handle the case when there is total count

              // but no passwords and passkeys after design is set

            }

          }

        }

    )

packages/CredentialManager/src/com/android/credentialmanager/jetpack/provider/SaveEntryUi.kt

+1 −1
Original line number Diff line number Diff line
@@ -26,7 +26,7 @@ import android.graphics.drawable.Icon 
 * TODO: move to jetpack.

 */

class SaveEntryUi(

  val userProviderAccountName: CharSequence,

  val userProviderAccountName: CharSequence?,

  val credentialTypeIcon: Icon?,

  val profileIcon: Icon?,

  val passwordCount: Int?,