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

Add in-progress view to display name EditInPlace #12609

Merged
merged 7 commits into from
Jun 14, 2024
Merged

Add in-progress view to display name EditInPlace #12609

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
e556c07
Add in-progress view to display name EditInPlace
dbkr Jun 12, 2024
eccf101
Update to new compound-web
dbkr Jun 14, 2024
273a620
Merge branch 'develop' into dbkr/editinplace_inprogress
dbkr Jun 14, 2024
bebde77
Update snapshots
dbkr Jun 14, 2024
026f7c3
Update screenshots
dbkr Jun 14, 2024
716f01a
Remove margin
dbkr Jun 14, 2024
d72144b
Update screenshots
dbkr Jun 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@
"@sentry/browser": "^8.0.0",
"@testing-library/react-hooks": "^8.0.1",
"@vector-im/compound-design-tokens": "^1.2.0",
"@vector-im/compound-web": "^4.4.1",
"@vector-im/compound-web": "^4.6.0",
"@zxcvbn-ts/core": "^3.0.4",
"@zxcvbn-ts/language-common": "^3.0.4",
"@zxcvbn-ts/language-en": "^3.0.2",
Expand Down
Binary file modified playwright/snapshots/settings/general-user-settings-tab.spec.ts/general-linux.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...pshots/settings/general-user-settings-tab.spec.ts/general-smallscreen-linux.png
View file
Open in desktop
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The spacing between Display Name and Username looks HUGE, is that intentional?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah yes, the bottom margin can go now the remove link is no more

Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions res/css/views/settings/_UserProfileSettings.pcss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ limitations under the License.
.mx_UserProfileSettings_profile_displayName {
flex-grow: 1;
width: 100%;
gap: 0;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not really related but this is another thing that is specified at the dialog level and we need to override, as it's giving us extra spacing.

}
}

Expand Down
1 change: 1 addition & 0 deletions src/components/views/settings/UserProfileSettings.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -164,6 +164,7 @@ const UserProfileSettings: React.FC = () => {
saveButtonLabel={_t("common|save")}
cancelButtonLabel={_t("common|cancel")}
savedLabel={_t("common|saved")}
savingLabel={_t("common|updating")}
onChange={onDisplayNameChanged}
onCancel={onDisplayNameCancel}
onSave={onDisplayNameSave}
Expand Down
1 change: 1 addition & 0 deletions src/i18n/strings/en_EN.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -573,6 +573,7 @@
"unnamed_space": "Unnamed Space",
"unsent": "Unsent",
"unverified": "Unverified",
"updating": "Updating...",
"user": "User",
"user_avatar": "Profile picture",
"username": "Username",
Expand Down
33 changes: 18 additions & 15 deletions test/components/views/right_panel/__snapshots__/RoomSummaryCard-test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -123,10 +123,10 @@ exports[`<RoomSummaryCard /> has button to edit topic when expanded 1`] = `
data-orientation="horizontal"
role="separator"
/>
<label
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From element-hq/compound-web#178 in new compound-web

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

#12586 handles the same for those curious

<div
aria-checked="false"
class="_item_1gwvj_17 _interactive_1gwvj_36"
data-kind="primary"
for=":r3:"
role="menuitemcheckbox"
>
<div
Expand All @@ -135,11 +135,12 @@ exports[`<RoomSummaryCard /> has button to edit topic when expanded 1`] = `
height="24"
width="24"
/>
<span
<label
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
for=":r3:"
>
Favourite
</span>
</label>
<div
class="_container_ik1u1_18"
>
Expand All @@ -152,7 +153,7 @@ exports[`<RoomSummaryCard /> has button to edit topic when expanded 1`] = `
class="_ui_ik1u1_42"
/>
</div>
</label>
</div>
<button
class="_item_1gwvj_17 _interactive_1gwvj_36"
data-kind="primary"
Expand Down Expand Up @@ -520,10 +521,10 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
data-orientation="horizontal"
role="separator"
/>
<label
<div
aria-checked="false"
class="_item_1gwvj_17 _interactive_1gwvj_36"
data-kind="primary"
for=":r1:"
role="menuitemcheckbox"
>
<div
Expand All @@ -532,11 +533,12 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
height="24"
width="24"
/>
<span
<label
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
for=":r1:"
>
Favourite
</span>
</label>
<div
class="_container_ik1u1_18"
>
Expand All @@ -549,7 +551,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
class="_ui_ik1u1_42"
/>
</div>
</label>
</div>
<button
class="_item_1gwvj_17 _interactive_1gwvj_36"
data-kind="primary"
Expand Down Expand Up @@ -928,10 +930,10 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
data-orientation="horizontal"
role="separator"
/>
<label
<div
aria-checked="false"
class="_item_1gwvj_17 _interactive_1gwvj_36"
data-kind="primary"
for=":r2:"
role="menuitemcheckbox"
>
<div
Expand All @@ -940,11 +942,12 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
height="24"
width="24"
/>
<span
<label
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
for=":r2:"
>
Favourite
</span>
</label>
<div
class="_container_ik1u1_18"
>
Expand All @@ -957,7 +960,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
class="_ui_ik1u1_42"
/>
</div>
</label>
</div>
<button
class="_item_1gwvj_17 _interactive_1gwvj_36"
data-kind="primary"
Expand Down
40 changes: 7 additions & 33 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3235,10 +3235,10 @@
dependencies:
svg2vectordrawable "^2.9.1"

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

"@zxcvbn-ts/core@^3.0.4":
Expand Down Expand Up @@ -8918,16 +8917,7 @@ string-length@^4.0.1:
char-regex "^1.0.2"
strip-ansi "^6.0.0"

"string-width-cjs@npm:string-width@^4.2.0":
version "4.2.3"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
dependencies:
emoji-regex "^8.0.0"
is-fullwidth-code-point "^3.0.0"
strip-ansi "^6.0.1"

string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
Expand Down Expand Up @@ -9033,14 +9023,7 @@ string_decoder@~1.1.1:
dependencies:
safe-buffer "~5.1.0"

"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
version "6.0.1"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
dependencies:
ansi-regex "^5.0.1"

strip-ansi@^6.0.0, strip-ansi@^6.0.1:
"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
version "6.0.1"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
Expand Down Expand Up @@ -9870,7 +9853,7 @@ which@^2.0.1:
dependencies:
isexe "^2.0.0"

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

wrap-ansi@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
dependencies:
ansi-styles "^4.0.0"
string-width "^4.1.0"
strip-ansi "^6.0.0"

wrap-ansi@^8.1.0:
version "8.1.0"
resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"
Expand Down
Loading