element-web/test/components/views/right_panel/__snapshots__/RoomSummaryCard-test.tsx.snap
Germain f96583e74a
Update RoomSummaryCard navigation links (#11812)
* Update RoomSummaryCard navigation links

* Fix tests

* remove unneeded test

* "@vector-im/compound-web": "0.8.0"

* Fix: search button no transition on hover

* Fix: disabled invite option is not reflected in UI

* test canInviteTo

* update snapshots for CW 0.8.1

* unit test inviteToRoom

* unit test tagRoom

* add member link to roomsummarycard when using legacy room header

* use onChange instead of onClick for ToggleMenuItem favourite room

* update selectors in cypress tests

* always show people menu item

* add hover style to close button

* add padding around room name

* prettier

---------

Co-authored-by: Kerry Archibald <kerrya@element.io>
2023-11-16 03:25:34 +00:00

384 lines
14 KiB
Text

// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<RoomSummaryCard /> renders the room summary 1`] = `
<div>
<div
class="mx_BaseCard mx_RoomSummaryCard"
>
<div
class="mx_AutoHideScrollbar"
tabindex="-1"
>
<header
class="mx_Flex mx_RoomSummaryCard_header"
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x);"
>
<button
aria-label="Search"
class="mx_RoomSummaryCard_searchBtn"
data-state="closed"
data-testid="summary-search"
>
<div
height="100%"
width="100%"
/>
</button>
<div
class="mx_AccessibleButton mx_BaseCard_close"
data-testid="base-card-close-button"
role="button"
tabindex="0"
title="Close"
/>
</header>
<header
class="mx_RoomSummaryCard_container"
>
<span
class="_avatar_1o69u_17 mx_BaseAvatar _avatar-imageless_1o69u_60"
data-color="7"
data-testid="avatar-img"
data-type="round"
role="presentation"
style="--cpd-avatar-size: 80px;"
>
!
</span>
<h1
class="_typography_yh5dq_162 _font-heading-md-semibold_yh5dq_121 mx_RoomSummaryCard_roomName text-primary"
title="!room:domain.org"
>
!room:domain.org
</h1>
<div
class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 mx_RoomSummaryCard_alias text-secondary"
title=""
/>
<section
class="mx_Flex mx_RoomSummaryCard_badges"
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-2x);"
>
<span
class="_typography_yh5dq_162 _font-body-sm-medium_yh5dq_50 _badge_qipht_17"
data-kind="default"
>
<div
width="1em"
/>
Not encrypted
</span>
</section>
</header>
<div
class="_separator_1uqhh_17"
data-orientation="horizontal"
role="separator"
/>
<label
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
for=":r1:"
role="menuitemcheckbox"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Favourite
</span>
<div
class="_container_ik1u1_18"
>
<input
class="_input_ik1u1_32"
id=":r1:"
type="checkbox"
/>
<div
class="_ui_ik1u1_42"
/>
</div>
</label>
<button
class="_item_zxa40_17 _interactive_zxa40_36 _disabled_zxa40_125"
data-kind="primary"
disabled=""
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Invite
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Copy link
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Settings
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<div
class="_separator_1uqhh_17"
data-orientation="horizontal"
role="separator"
/>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
People
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Files
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Poll history
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="primary"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Export Chat
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<div
class="_separator_1uqhh_17"
data-orientation="horizontal"
role="separator"
/>
<button
class="_item_zxa40_17 _interactive_zxa40_36"
data-kind="critical"
role="menuitem"
>
<div
aria-hidden="true"
class="_icon_zxa40_49"
height="24"
width="24"
/>
<span
class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_zxa40_58"
>
Leave room
</span>
<svg
aria-hidden="true"
class="_nav-hint_zxa40_65"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.70005 17.3C8.51672 17.1167 8.42505 16.8834 8.42505 16.6C8.42505 16.3167 8.51672 16.0834 8.70005 15.9L12.6 12L8.70005 8.10005C8.51672 7.91672 8.42505 7.68338 8.42505 7.40005C8.42505 7.11672 8.51672 6.88338 8.70005 6.70005C8.88338 6.51672 9.11672 6.42505 9.40005 6.42505C9.68338 6.42505 9.91672 6.51672 10.1 6.70005L14.7 11.3C14.8 11.4 14.8709 11.5084 14.9125 11.625C14.9542 11.7417 14.975 11.8667 14.975 12C14.975 12.1334 14.9542 12.2584 14.9125 12.375C14.8709 12.4917 14.8 12.6 14.7 12.7L10.1 17.3C9.91672 17.4834 9.68338 17.575 9.40005 17.575C9.11672 17.575 8.88338 17.4834 8.70005 17.3Z"
fill="currentColor"
/>
</svg>
</button>
<div
class="mx_BaseCard_Group mx_RoomSummaryCard_appsGroup"
>
<h2>
Widgets
</h2>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
role="button"
tabindex="0"
>
Add widgets, bridges & bots
</div>
</div>
</div>
</div>
</div>
`;