457 lines
13 KiB
Text
457 lines
13 KiB
Text
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`<PinnedMessagesCard /> should show the empty state when there are no pins 1`] = `
|
|
<DocumentFragment>
|
|
<div
|
|
class="mx_BaseCard mx_PinnedMessagesCard"
|
|
>
|
|
<div
|
|
class="mx_BaseCard_header"
|
|
>
|
|
<div
|
|
class="mx_BaseCard_header_title"
|
|
>
|
|
<h4
|
|
class="mx_Heading_h4 mx_BaseCard_header_title_heading"
|
|
>
|
|
Pinned message
|
|
</h4>
|
|
</div>
|
|
<button
|
|
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
|
|
data-testid="base-card-close-button"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 28px;"
|
|
tabindex="0"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<svg
|
|
fill="currentColor"
|
|
height="1em"
|
|
viewBox="0 0 24 24"
|
|
width="1em"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414Z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_AutoHideScrollbar"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_Flex mx_EmptyState"
|
|
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-4x);"
|
|
>
|
|
<svg
|
|
fill="currentColor"
|
|
height="32px"
|
|
viewBox="0 0 24 24"
|
|
width="32px"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
clip-rule="evenodd"
|
|
d="M6.119 2a.5.5 0 0 0-.35.857L7.85 4.9a.5.5 0 0 1 .15.357v4.487a.5.5 0 0 1-.15.356l-3.7 3.644A.5.5 0 0 0 4 14.1v1.4a.5.5 0 0 0 .5.5H11v6a1 1 0 1 0 2 0v-6h6.5a.5.5 0 0 0 .5-.5v-1.4a.5.5 0 0 0-.15-.356l-3.7-3.644a.5.5 0 0 1-.15-.356V5.257a.5.5 0 0 1 .15-.357l2.081-2.043a.5.5 0 0 0-.35-.857H6.119ZM10 4h4v5.744a2.5 2.5 0 0 0 .746 1.781L17.26 14H6.74l2.514-2.475A2.5 2.5 0 0 0 10 9.744V4Z"
|
|
fill-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
<p
|
|
class="_typography_yh5dq_162 _font-body-lg-semibold_yh5dq_83"
|
|
>
|
|
Pin important messages so that they can be easily discovered
|
|
</p>
|
|
<p
|
|
class="_typography_yh5dq_162 _font-body-md-regular_yh5dq_59"
|
|
>
|
|
Select a message and choose “Pin” to it include here.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</DocumentFragment>
|
|
`;
|
|
|
|
exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
|
|
<DocumentFragment>
|
|
<div
|
|
class="mx_BaseCard mx_PinnedMessagesCard"
|
|
>
|
|
<div
|
|
class="mx_BaseCard_header"
|
|
>
|
|
<div
|
|
class="mx_BaseCard_header_title"
|
|
>
|
|
<h4
|
|
class="mx_Heading_h4 mx_BaseCard_header_title_heading"
|
|
>
|
|
2 Pinned messages
|
|
</h4>
|
|
</div>
|
|
<button
|
|
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
|
|
data-testid="base-card-close-button"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 28px;"
|
|
tabindex="0"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<svg
|
|
fill="currentColor"
|
|
height="1em"
|
|
viewBox="0 0 24 24"
|
|
width="1em"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414Z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_AutoHideScrollbar"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_PinnedMessagesCard_wrapper mx_PinnedMessagesCard_wrapper_unpin_all"
|
|
role="list"
|
|
>
|
|
<div
|
|
class="mx_PinnedEventTile"
|
|
role="listitem"
|
|
>
|
|
<div>
|
|
<span
|
|
class="_avatar_mcap2_17 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_mcap2_61"
|
|
data-color="3"
|
|
data-testid="avatar-img"
|
|
data-type="round"
|
|
role="presentation"
|
|
style="--cpd-avatar-size: 32px;"
|
|
>
|
|
a
|
|
</span>
|
|
</div>
|
|
<div
|
|
class="mx_PinnedEventTile_wrapper"
|
|
>
|
|
<div
|
|
class="mx_PinnedEventTile_top"
|
|
>
|
|
<span
|
|
class="_typography_yh5dq_162 _font-body-md-semibold_yh5dq_64 mx_PinnedEventTile_sender mx_Username_color3"
|
|
>
|
|
@alice:example.org
|
|
</span>
|
|
<button
|
|
aria-disabled="false"
|
|
aria-expanded="false"
|
|
aria-haspopup="menu"
|
|
aria-label="Open menu"
|
|
class="_icon-button_bh2qc_17"
|
|
data-state="closed"
|
|
id="radix-2"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 24px;"
|
|
tabindex="0"
|
|
type="button"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<div />
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_MTextBody mx_EventTile_content"
|
|
>
|
|
<div
|
|
class="mx_EventTile_body translate"
|
|
dir="auto"
|
|
>
|
|
First pinned message
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="_separator_144s5_17 mx_PinnedMessagesCard_Separator"
|
|
data-kind="primary"
|
|
data-orientation="horizontal"
|
|
role="separator"
|
|
/>
|
|
<div
|
|
class="mx_PinnedEventTile"
|
|
role="listitem"
|
|
>
|
|
<div>
|
|
<span
|
|
class="_avatar_mcap2_17 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_mcap2_61"
|
|
data-color="3"
|
|
data-testid="avatar-img"
|
|
data-type="round"
|
|
role="presentation"
|
|
style="--cpd-avatar-size: 32px;"
|
|
>
|
|
a
|
|
</span>
|
|
</div>
|
|
<div
|
|
class="mx_PinnedEventTile_wrapper"
|
|
>
|
|
<div
|
|
class="mx_PinnedEventTile_top"
|
|
>
|
|
<span
|
|
class="_typography_yh5dq_162 _font-body-md-semibold_yh5dq_64 mx_PinnedEventTile_sender mx_Username_color3"
|
|
>
|
|
@alice:example.org
|
|
</span>
|
|
<button
|
|
aria-disabled="false"
|
|
aria-expanded="false"
|
|
aria-haspopup="menu"
|
|
aria-label="Open menu"
|
|
class="_icon-button_bh2qc_17"
|
|
data-state="closed"
|
|
id="radix-3"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 24px;"
|
|
tabindex="0"
|
|
type="button"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<div />
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_MTextBody mx_EventTile_content"
|
|
>
|
|
<div
|
|
class="mx_EventTile_body translate"
|
|
dir="auto"
|
|
>
|
|
The second one
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="mx_PinnedMessagesCard_unpin"
|
|
>
|
|
<button
|
|
class="_button_zt6rp_17"
|
|
data-kind="tertiary"
|
|
data-size="lg"
|
|
role="button"
|
|
tabindex="0"
|
|
>
|
|
Unpin all messages
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</DocumentFragment>
|
|
`;
|
|
|
|
exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
|
|
<DocumentFragment>
|
|
<div
|
|
class="mx_BaseCard mx_PinnedMessagesCard"
|
|
>
|
|
<div
|
|
class="mx_BaseCard_header"
|
|
>
|
|
<div
|
|
class="mx_BaseCard_header_title"
|
|
>
|
|
<h4
|
|
class="mx_Heading_h4 mx_BaseCard_header_title_heading"
|
|
>
|
|
2 Pinned messages
|
|
</h4>
|
|
</div>
|
|
<button
|
|
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
|
|
data-testid="base-card-close-button"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 28px;"
|
|
tabindex="0"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<svg
|
|
fill="currentColor"
|
|
height="1em"
|
|
viewBox="0 0 24 24"
|
|
width="1em"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414Z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_AutoHideScrollbar"
|
|
tabindex="-1"
|
|
>
|
|
<div
|
|
class="mx_PinnedMessagesCard_wrapper"
|
|
role="list"
|
|
>
|
|
<div
|
|
class="mx_PinnedEventTile"
|
|
role="listitem"
|
|
>
|
|
<div>
|
|
<span
|
|
class="_avatar_mcap2_17 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_mcap2_61"
|
|
data-color="3"
|
|
data-testid="avatar-img"
|
|
data-type="round"
|
|
role="presentation"
|
|
style="--cpd-avatar-size: 32px;"
|
|
>
|
|
a
|
|
</span>
|
|
</div>
|
|
<div
|
|
class="mx_PinnedEventTile_wrapper"
|
|
>
|
|
<div
|
|
class="mx_PinnedEventTile_top"
|
|
>
|
|
<span
|
|
class="_typography_yh5dq_162 _font-body-md-semibold_yh5dq_64 mx_PinnedEventTile_sender mx_Username_color3"
|
|
>
|
|
@alice:example.org
|
|
</span>
|
|
<button
|
|
aria-disabled="false"
|
|
aria-expanded="false"
|
|
aria-haspopup="menu"
|
|
aria-label="Open menu"
|
|
class="_icon-button_bh2qc_17"
|
|
data-state="closed"
|
|
id="radix-18"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 24px;"
|
|
tabindex="0"
|
|
type="button"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<div />
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_MTextBody mx_EventTile_content"
|
|
>
|
|
<div
|
|
class="mx_EventTile_body translate"
|
|
dir="auto"
|
|
>
|
|
First pinned message
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="_separator_144s5_17 mx_PinnedMessagesCard_Separator"
|
|
data-kind="primary"
|
|
data-orientation="horizontal"
|
|
role="separator"
|
|
/>
|
|
<div
|
|
class="mx_PinnedEventTile"
|
|
role="listitem"
|
|
>
|
|
<div>
|
|
<span
|
|
class="_avatar_mcap2_17 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_mcap2_61"
|
|
data-color="3"
|
|
data-testid="avatar-img"
|
|
data-type="round"
|
|
role="presentation"
|
|
style="--cpd-avatar-size: 32px;"
|
|
>
|
|
a
|
|
</span>
|
|
</div>
|
|
<div
|
|
class="mx_PinnedEventTile_wrapper"
|
|
>
|
|
<div
|
|
class="mx_PinnedEventTile_top"
|
|
>
|
|
<span
|
|
class="_typography_yh5dq_162 _font-body-md-semibold_yh5dq_64 mx_PinnedEventTile_sender mx_Username_color3"
|
|
>
|
|
@alice:example.org
|
|
</span>
|
|
<button
|
|
aria-disabled="false"
|
|
aria-expanded="false"
|
|
aria-haspopup="menu"
|
|
aria-label="Open menu"
|
|
class="_icon-button_bh2qc_17"
|
|
data-state="closed"
|
|
id="radix-19"
|
|
role="button"
|
|
style="--cpd-icon-button-size: 24px;"
|
|
tabindex="0"
|
|
type="button"
|
|
>
|
|
<div
|
|
class="_indicator-icon_133tf_26"
|
|
style="--cpd-icon-button-size: 100%;"
|
|
>
|
|
<div />
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="mx_MTextBody mx_EventTile_content"
|
|
>
|
|
<div
|
|
class="mx_EventTile_body translate"
|
|
dir="auto"
|
|
>
|
|
The second one
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</DocumentFragment>
|
|
`;
|