Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 650b9cb

Browse files
dbkrdbkr
authored
Add in-progress view to display name EditInPlace (#12609)
* Add in-progress view to display name EditInPlace Requires element-hq/compound-web#180 * Update to new compound-web for editinplace component with spinner * Update snapshots for element-hq/compound-web#178 * Update screenshots * Remove margin which isn't necessary now there's no 'Remove' link on the bottom * Update screenshots
1 parent 6fc9d76 commit 650b9cb

File tree

8 files changed

+29
-51
lines changed

8 files changed

+29
-51
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@
7777
"@sentry/browser": "^8.0.0",
7878
"@testing-library/react-hooks": "^8.0.1",
7979
"@vector-im/compound-design-tokens": "^1.2.0",
80-
"@vector-im/compound-web": "^4.4.1",
80+
"@vector-im/compound-web": "^4.6.0",
8181
"@zxcvbn-ts/core": "^3.0.4",
8282
"@zxcvbn-ts/language-common": "^3.0.4",
8383
"@zxcvbn-ts/language-en": "^3.0.2",

‎playwright/snapshots/settings/general-user-settings-tab.spec.ts/general-linux.png

-204 Bytes
Loading

‎playwright/snapshots/settings/general-user-settings-tab.spec.ts/general-smallscreen-linux.png

-2 Bytes
Loading

‎res/css/views/settings/_UserProfileSettings.pcss

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,11 @@ limitations under the License.
2121
display: flex;
2222
margin-top: var(--cpd-space-6x);
2323
gap: 16px;
24-
/* This is temporary until the 'Remove' link is replaced by a context menu. */
25-
margin-bottom: 20px;
2624

2725
.mx_UserProfileSettings_profile_displayName {
2826
flex-grow: 1;
2927
width: 100%;
28+
gap: 0;
3029
}
3130
}
3231

‎src/components/views/settings/UserProfileSettings.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -164,6 +164,7 @@ const UserProfileSettings: React.FC = () => {
164164
saveButtonLabel={_t("common|save")}
165165
cancelButtonLabel={_t("common|cancel")}
166166
savedLabel={_t("common|saved")}
167+
savingLabel={_t("common|updating")}
167168
onChange={onDisplayNameChanged}
168169
onCancel={onDisplayNameCancel}
169170
onSave={onDisplayNameSave}

‎src/i18n/strings/en_EN.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -573,6 +573,7 @@
573573
"unnamed_space": "Unnamed Space",
574574
"unsent": "Unsent",
575575
"unverified": "Unverified",
576+
"updating": "Updating...",
576577
"user": "User",
577578
"user_avatar": "Profile picture",
578579
"username": "Username",

‎test/components/views/right_panel/__snapshots__/RoomSummaryCard-test.tsx.snap

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -123,10 +123,10 @@ exports[`<RoomSummaryCard /> has button to edit topic when expanded 1`] = `
123123
data-orientation="horizontal"
124124
role="separator"
125125
/>
126-
<label
126+
<div
127+
aria-checked="false"
127128
class="_item_1gwvj_17 _interactive_1gwvj_36"
128129
data-kind="primary"
129-
for=":r3:"
130130
role="menuitemcheckbox"
131131
>
132132
<div
@@ -135,11 +135,12 @@ exports[`<RoomSummaryCard /> has button to edit topic when expanded 1`] = `
135135
height="24"
136136
width="24"
137137
/>
138-
<span
138+
<label
139139
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
140+
for=":r3:"
140141
>
141142
Favourite
142-
</span>
143+
</label>
143144
<div
144145
class="_container_ik1u1_18"
145146
>
@@ -152,7 +153,7 @@ exports[`<RoomSummaryCard /> has button to edit topic when expanded 1`] = `
152153
class="_ui_ik1u1_42"
153154
/>
154155
</div>
155-
</label>
156+
</div>
156157
<button
157158
class="_item_1gwvj_17 _interactive_1gwvj_36"
158159
data-kind="primary"
@@ -520,10 +521,10 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
520521
data-orientation="horizontal"
521522
role="separator"
522523
/>
523-
<label
524+
<div
525+
aria-checked="false"
524526
class="_item_1gwvj_17 _interactive_1gwvj_36"
525527
data-kind="primary"
526-
for=":r1:"
527528
role="menuitemcheckbox"
528529
>
529530
<div
@@ -532,11 +533,12 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
532533
height="24"
533534
width="24"
534535
/>
535-
<span
536+
<label
536537
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
538+
for=":r1:"
537539
>
538540
Favourite
539-
</span>
541+
</label>
540542
<div
541543
class="_container_ik1u1_18"
542544
>
@@ -549,7 +551,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
549551
class="_ui_ik1u1_42"
550552
/>
551553
</div>
552-
</label>
554+
</div>
553555
<button
554556
class="_item_1gwvj_17 _interactive_1gwvj_36"
555557
data-kind="primary"
@@ -928,10 +930,10 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
928930
data-orientation="horizontal"
929931
role="separator"
930932
/>
931-
<label
933+
<div
934+
aria-checked="false"
932935
class="_item_1gwvj_17 _interactive_1gwvj_36"
933936
data-kind="primary"
934-
for=":r2:"
935937
role="menuitemcheckbox"
936938
>
937939
<div
@@ -940,11 +942,12 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
940942
height="24"
941943
width="24"
942944
/>
943-
<span
945+
<label
944946
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
947+
for=":r2:"
945948
>
946949
Favourite
947-
</span>
950+
</label>
948951
<div
949952
class="_container_ik1u1_18"
950953
>
@@ -957,7 +960,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
957960
class="_ui_ik1u1_42"
958961
/>
959962
</div>
960-
</label>
963+
</div>
961964
<button
962965
class="_item_1gwvj_17 _interactive_1gwvj_36"
963966
data-kind="primary"

‎yarn.lock

Lines changed: 7 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -3235,10 +3235,10 @@
32353235
dependencies:
32363236
svg2vectordrawable "^2.9.1"
32373237

3238-
"@vector-im/compound-web@^4.4.1":
3239-
version "4.4.1"
3240-
resolved "https://registry.yarnpkg.com/@vector-im/compound-web/-/compound-web-4.4.1.tgz#378c6874888becd4b6dd3541904f63300b9ba09a"
3241-
integrity sha512-KLYSU8GxR8EBuz+gKSoLLs4+s5xV4stUDbqJu5GG52OmO3YQlvmz/e5/uHYvzfbqBBU5dMmZhz5bdJJ38qxHPQ==
3238+
"@vector-im/compound-web@^4.6.0":
3239+
version "4.6.0"
3240+
resolved "https://registry.yarnpkg.com/@vector-im/compound-web/-/compound-web-4.6.0.tgz#3fcdbf11f911580aa90c56fd2894cfc3e3848844"
3241+
integrity sha512-N/Q6FX1v1P7EWHQB8lj8tdBgLIDy7xkz8hnNschW/q5PrasT4kzHlBy0rvcqfcYUBu1puwQCBpVEz8IuTv452g==
32423242
dependencies:
32433243
"@floating-ui/react" "^0.26.9"
32443244
"@floating-ui/react-dom" "^2.0.8"
@@ -3250,7 +3250,6 @@
32503250
"@radix-ui/react-tooltip" "^1.0.6"
32513251
"@storybook/manager-api" "^8.1.1"
32523252
classnames "^2.3.2"
3253-
graphemer "^1.4.0"
32543253
vaul "^0.7.0"
32553254

32563255
"@zxcvbn-ts/core@^3.0.4":
@@ -8918,16 +8917,7 @@ string-length@^4.0.1:
89188917
char-regex "^1.0.2"
89198918
strip-ansi "^6.0.0"
89208919

8921-
"string-width-cjs@npm:string-width@^4.2.0":
8922-
version "4.2.3"
8923-
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
8924-
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
8925-
dependencies:
8926-
emoji-regex "^8.0.0"
8927-
is-fullwidth-code-point "^3.0.0"
8928-
strip-ansi "^6.0.1"
8929-
8930-
string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
8920+
"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
89318921
version "4.2.3"
89328922
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
89338923
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -9033,14 +9023,7 @@ string_decoder@~1.1.1:
90339023
dependencies:
90349024
safe-buffer "~5.1.0"
90359025

9036-
"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
9037-
version "6.0.1"
9038-
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
9039-
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
9040-
dependencies:
9041-
ansi-regex "^5.0.1"
9042-
9043-
strip-ansi@^6.0.0, strip-ansi@^6.0.1:
9026+
"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
90449027
version "6.0.1"
90459028
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
90469029
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -9870,7 +9853,7 @@ which@^2.0.1:
98709853
dependencies:
98719854
isexe "^2.0.0"
98729855

9873-
"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
9856+
"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
98749857
version "7.0.0"
98759858
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
98769859
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -9888,15 +9871,6 @@ wrap-ansi@^6.2.0:
98889871
string-width "^4.1.0"
98899872
strip-ansi "^6.0.0"
98909873

9891-
wrap-ansi@^7.0.0:
9892-
version "7.0.0"
9893-
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
9894-
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
9895-
dependencies:
9896-
ansi-styles "^4.0.0"
9897-
string-width "^4.1.0"
9898-
strip-ansi "^6.0.0"
9899-
99009874
wrap-ansi@^8.1.0:
99019875
version "8.1.0"
99029876
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"

0 commit comments

Comments
 (0)