Skip to content

Commit be416f8

Browse files
PM-18292 - Update section headers for all items to align with V3 Design (#4729)
1 parent f0d6599 commit be416f8

File tree

5 files changed

+90
-14
lines changed

5 files changed

+90
-14
lines changed

app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditCardItems.kt

+13
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ package com.x8bit.bitwarden.ui.vault.feature.addedit
33
import androidx.compose.foundation.layout.Spacer
44
import androidx.compose.foundation.layout.fillMaxWidth
55
import androidx.compose.foundation.layout.height
6+
import androidx.compose.foundation.layout.padding
67
import androidx.compose.foundation.lazy.LazyListScope
78
import androidx.compose.runtime.getValue
89
import androidx.compose.runtime.mutableStateOf
@@ -19,6 +20,7 @@ import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin
1920
import com.x8bit.bitwarden.ui.platform.components.dropdown.BitwardenMultiSelectButton
2021
import com.x8bit.bitwarden.ui.platform.components.field.BitwardenPasswordField
2122
import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextField
23+
import com.x8bit.bitwarden.ui.platform.components.header.BitwardenListHeaderText
2224
import com.x8bit.bitwarden.ui.platform.components.model.CardStyle
2325
import com.x8bit.bitwarden.ui.vault.feature.addedit.handlers.VaultAddEditCardTypeHandlers
2426
import com.x8bit.bitwarden.ui.vault.model.VaultCardBrand
@@ -34,6 +36,17 @@ fun LazyListScope.vaultAddEditCardItems(
3436
cardState: VaultAddEditState.ViewState.Content.ItemType.Card,
3537
cardHandlers: VaultAddEditCardTypeHandlers,
3638
) {
39+
item {
40+
Spacer(modifier = Modifier.height(16.dp))
41+
BitwardenListHeaderText(
42+
label = stringResource(id = R.string.card_details),
43+
modifier = Modifier
44+
.fillMaxWidth()
45+
.standardHorizontalMargin()
46+
.padding(horizontal = 16.dp),
47+
)
48+
}
49+
3750
item {
3851
Spacer(modifier = Modifier.height(8.dp))
3952
BitwardenTextField(

app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditIdentityItems.kt

+52-6
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ package com.x8bit.bitwarden.ui.vault.feature.addedit
33
import androidx.compose.foundation.layout.Spacer
44
import androidx.compose.foundation.layout.fillMaxWidth
55
import androidx.compose.foundation.layout.height
6+
import androidx.compose.foundation.layout.padding
67
import androidx.compose.foundation.lazy.LazyListScope
78
import androidx.compose.runtime.Composable
89
import androidx.compose.ui.Modifier
@@ -14,6 +15,7 @@ import com.x8bit.bitwarden.R
1415
import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin
1516
import com.x8bit.bitwarden.ui.platform.components.dropdown.BitwardenMultiSelectButton
1617
import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextField
18+
import com.x8bit.bitwarden.ui.platform.components.header.BitwardenListHeaderText
1719
import com.x8bit.bitwarden.ui.platform.components.model.CardStyle
1820
import com.x8bit.bitwarden.ui.vault.feature.addedit.handlers.VaultAddEditIdentityTypeHandlers
1921
import com.x8bit.bitwarden.ui.vault.model.VaultIdentityTitle
@@ -27,6 +29,17 @@ fun LazyListScope.vaultAddEditIdentityItems(
2729
identityState: VaultAddEditState.ViewState.Content.ItemType.Identity,
2830
identityItemTypeHandlers: VaultAddEditIdentityTypeHandlers,
2931
) {
32+
item {
33+
Spacer(modifier = Modifier.height(16.dp))
34+
BitwardenListHeaderText(
35+
label = stringResource(id = R.string.personal_details),
36+
modifier = Modifier
37+
.fillMaxWidth()
38+
.standardHorizontalMargin()
39+
.padding(horizontal = 16.dp),
40+
)
41+
}
42+
3043
item {
3144
Spacer(modifier = Modifier.height(8.dp))
3245
TitleMultiSelectButton(
@@ -92,19 +105,30 @@ fun LazyListScope.vaultAddEditIdentityItems(
92105
value = identityState.company,
93106
onValueChange = identityItemTypeHandlers.onCompanyTextChange,
94107
textFieldTestTag = "IdentityCompanyEntry",
95-
cardStyle = CardStyle.Middle(),
108+
cardStyle = CardStyle.Bottom,
96109
modifier = Modifier
97110
.fillMaxWidth()
98111
.standardHorizontalMargin(),
99112
)
100113
}
114+
item {
115+
Spacer(modifier = Modifier.height(height = 16.dp))
116+
BitwardenListHeaderText(
117+
label = stringResource(id = R.string.identification),
118+
modifier = Modifier
119+
.fillMaxWidth()
120+
.standardHorizontalMargin()
121+
.padding(horizontal = 16.dp),
122+
)
123+
Spacer(modifier = Modifier.height(height = 8.dp))
124+
}
101125
item {
102126
BitwardenTextField(
103127
label = stringResource(id = R.string.ssn),
104128
value = identityState.ssn,
105129
onValueChange = identityItemTypeHandlers.onSsnTextChange,
106130
textFieldTestTag = "IdentitySsnEntry",
107-
cardStyle = CardStyle.Middle(),
131+
cardStyle = CardStyle.Top(),
108132
modifier = Modifier
109133
.fillMaxWidth()
110134
.standardHorizontalMargin(),
@@ -128,19 +152,30 @@ fun LazyListScope.vaultAddEditIdentityItems(
128152
value = identityState.licenseNumber,
129153
onValueChange = identityItemTypeHandlers.onLicenseNumberTextChange,
130154
textFieldTestTag = "IdentityLicenseNumberEntry",
131-
cardStyle = CardStyle.Middle(),
155+
cardStyle = CardStyle.Bottom,
132156
modifier = Modifier
133157
.fillMaxWidth()
134158
.standardHorizontalMargin(),
135159
)
136160
}
161+
item {
162+
Spacer(modifier = Modifier.height(height = 16.dp))
163+
BitwardenListHeaderText(
164+
label = stringResource(id = R.string.contact_info),
165+
modifier = Modifier
166+
.fillMaxWidth()
167+
.standardHorizontalMargin()
168+
.padding(horizontal = 16.dp),
169+
)
170+
Spacer(modifier = Modifier.height(height = 8.dp))
171+
}
137172
item {
138173
BitwardenTextField(
139174
label = stringResource(id = R.string.email),
140175
value = identityState.email,
141176
onValueChange = identityItemTypeHandlers.onEmailTextChange,
142177
textFieldTestTag = "IdentityEmailEntry",
143-
cardStyle = CardStyle.Middle(),
178+
cardStyle = CardStyle.Top(),
144179
modifier = Modifier
145180
.fillMaxWidth()
146181
.standardHorizontalMargin(),
@@ -152,19 +187,30 @@ fun LazyListScope.vaultAddEditIdentityItems(
152187
value = identityState.phone,
153188
onValueChange = identityItemTypeHandlers.onPhoneTextChange,
154189
textFieldTestTag = "IdentityPhoneEntry",
155-
cardStyle = CardStyle.Middle(),
190+
cardStyle = CardStyle.Bottom,
156191
modifier = Modifier
157192
.fillMaxWidth()
158193
.standardHorizontalMargin(),
159194
)
160195
}
196+
item {
197+
Spacer(modifier = Modifier.height(height = 16.dp))
198+
BitwardenListHeaderText(
199+
label = stringResource(id = R.string.address),
200+
modifier = Modifier
201+
.fillMaxWidth()
202+
.standardHorizontalMargin()
203+
.padding(horizontal = 16.dp),
204+
)
205+
Spacer(modifier = Modifier.height(height = 8.dp))
206+
}
161207
item {
162208
BitwardenTextField(
163209
label = stringResource(id = R.string.address1),
164210
value = identityState.address1,
165211
onValueChange = identityItemTypeHandlers.onAddress1TextChange,
166212
textFieldTestTag = "IdentityAddressOneEntry",
167-
cardStyle = CardStyle.Middle(),
213+
cardStyle = CardStyle.Top(),
168214
modifier = Modifier
169215
.fillMaxWidth()
170216
.standardHorizontalMargin(),

app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditItemContent.kt

+14-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.Spacer
55
import androidx.compose.foundation.layout.fillMaxWidth
66
import androidx.compose.foundation.layout.height
77
import androidx.compose.foundation.layout.navigationBarsPadding
8+
import androidx.compose.foundation.layout.padding
89
import androidx.compose.foundation.lazy.LazyColumn
910
import androidx.compose.foundation.lazy.LazyListState
1011
import androidx.compose.runtime.Composable
@@ -22,6 +23,7 @@ import com.x8bit.bitwarden.ui.platform.components.card.BitwardenInfoCalloutCard
2223
import com.x8bit.bitwarden.ui.platform.components.coachmark.CoachMarkScope
2324
import com.x8bit.bitwarden.ui.platform.components.dropdown.BitwardenMultiSelectButton
2425
import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextField
26+
import com.x8bit.bitwarden.ui.platform.components.header.BitwardenListHeaderText
2527
import com.x8bit.bitwarden.ui.platform.components.model.CardStyle
2628
import com.x8bit.bitwarden.ui.platform.manager.permissions.PermissionsManager
2729
import com.x8bit.bitwarden.ui.vault.components.collectionItemsSelector
@@ -106,6 +108,17 @@ fun CoachMarkScope<AddEditItemCoachMark>.VaultAddEditContent(
106108
}
107109
}
108110
if (isAddItemMode) {
111+
item {
112+
BitwardenListHeaderText(
113+
label = stringResource(id = R.string.item_details),
114+
modifier = Modifier
115+
.fillMaxWidth()
116+
.standardHorizontalMargin()
117+
.padding(horizontal = 16.dp),
118+
)
119+
Spacer(modifier = Modifier.height(8.dp))
120+
}
121+
109122
item {
110123
TypeOptionsItem(
111124
entries = typeOptions,
@@ -175,7 +188,7 @@ fun CoachMarkScope<AddEditItemCoachMark>.VaultAddEditContent(
175188
val collections = state.common.selectedOwner?.collections.orEmpty()
176189
item {
177190
BitwardenMultiSelectButton(
178-
label = stringResource(id = R.string.who_owns_this_item),
191+
label = stringResource(id = R.string.owner),
179192
options = state.common.availableOwners.map { it.name }.toImmutableList(),
180193
selectedOption = state.common.selectedOwner?.name,
181194
onOptionSelected = { selectedOwnerName ->

app/src/main/res/values/strings.xml

+5-1
Original file line numberDiff line numberDiff line change
@@ -315,6 +315,7 @@ Scanning will happen automatically.</string>
315315
<string name="april">April</string>
316316
<string name="august">August</string>
317317
<string name="brand">Brand</string>
318+
<string name="card_details">Card Details</string>
318319
<string name="cardholder_name">Cardholder name</string>
319320
<string name="city_town">City / Town</string>
320321
<string name="company">Company</string>
@@ -415,8 +416,11 @@ Scanning will happen automatically.</string>
415416
<string name="invalid_email">Invalid email address.</string>
416417
<string name="cards">Cards</string>
417418
<string name="identities">Identities</string>
419+
<string name="identification">Identification</string>
418420
<string name="logins">Logins</string>
419421
<string name="secure_notes">Secure notes</string>
422+
<string name="personal_details">Personal Details</string>
423+
<string name="contact_info">Contact Info</string>
420424
<string name="all_items">All items</string>
421425
<string name="ur_is">URIs</string>
422426
<string name="checking_password">Checking password...</string>
@@ -440,7 +444,7 @@ Scanning will happen automatically.</string>
440444
<string name="move_up">Move Up</string>
441445
<string name="miscellaneous">Miscellaneous</string>
442446
<string name="ownership">Ownership</string>
443-
<string name="who_owns_this_item">Who owns this item?</string>
447+
<string name="owner">Owner</string>
444448
<string name="no_collections_to_list">There are no collections to list.</string>
445449
<string name="moved_item_to_org">%1$s moved to %2$s.</string>
446450
<string name="item_shared">Item has been shared.</string>

app/src/test/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditScreenTest.kt

+6-6
Original file line numberDiff line numberDiff line change
@@ -2369,7 +2369,7 @@ class VaultAddEditScreenTest : BaseComposeTest() {
23692369
// Opens the menu
23702370
composeTestRule
23712371
.onNodeWithContentDescriptionAfterScroll(
2372-
label = "placeholder@email.com. Who owns this item?",
2372+
label = "placeholder@email.com. Owner",
23732373
)
23742374
.performClick()
23752375

@@ -2398,7 +2398,7 @@ class VaultAddEditScreenTest : BaseComposeTest() {
23982398
updateStateWithOwners()
23992399
composeTestRule
24002400
.onNodeWithContentDescriptionAfterScroll(
2401-
label = "placeholder@email.com. Who owns this item?",
2401+
label = "placeholder@email.com. Owner",
24022402
)
24032403
.assertIsDisplayed()
24042404

@@ -2407,7 +2407,7 @@ class VaultAddEditScreenTest : BaseComposeTest() {
24072407
}
24082408

24092409
composeTestRule
2410-
.onNodeWithContentDescriptionAfterScroll(label = "mockOwnerName-2. Who owns this item?")
2410+
.onNodeWithContentDescriptionAfterScroll(label = "mockOwnerName-2. Owner")
24112411
.assertIsDisplayed()
24122412
}
24132413

@@ -2719,7 +2719,7 @@ class VaultAddEditScreenTest : BaseComposeTest() {
27192719
// Opens the menu
27202720
composeTestRule
27212721
.onNodeWithContentDescriptionAfterScroll(
2722-
label = "placeholder@email.com. Who owns this item?",
2722+
label = "placeholder@email.com. Owner",
27232723
)
27242724
.performClick()
27252725

@@ -2750,7 +2750,7 @@ class VaultAddEditScreenTest : BaseComposeTest() {
27502750

27512751
composeTestRule
27522752
.onNodeWithContentDescriptionAfterScroll(
2753-
label = "placeholder@email.com. Who owns this item?",
2753+
label = "placeholder@email.com. Owner",
27542754
)
27552755
.assertIsDisplayed()
27562756

@@ -2760,7 +2760,7 @@ class VaultAddEditScreenTest : BaseComposeTest() {
27602760

27612761
composeTestRule
27622762
.onNodeWithContentDescriptionAfterScroll(
2763-
label = "mockOwnerName-2. Who owns this item?",
2763+
label = "mockOwnerName-2. Owner",
27642764
)
27652765
.assertIsDisplayed()
27662766
}

0 commit comments

Comments
 (0)