element-web-Github/test/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<DeviceItem /> ambiguous display name 1`] = `
<div>
  <div
    aria-label="my display name (deviceId)"
    class="mx_AccessibleButton mx_UserInfo_device mx_UserInfo_device_unverified"
    role="button"
    tabindex="0"
  >
    <div
      class="mx_E2EIcon mx_E2EIcon_normal"
    />
    <div
      class="mx_UserInfo_device_name"
    >
      my display name (deviceId)
    </div>
    <div
      class="mx_UserInfo_device_trusted"
    />
  </div>
</div>
`;

exports[`<DeviceItem /> with display name 1`] = `
<div>
  <div
    aria-label="deviceName"
    class="mx_AccessibleButton mx_UserInfo_device mx_UserInfo_device_unverified"
    role="button"
    tabindex="0"
  >
    <div
      class="mx_E2EIcon mx_E2EIcon_normal"
    />
    <div
      class="mx_UserInfo_device_name"
    >
      deviceName
    </div>
    <div
      class="mx_UserInfo_device_trusted"
    />
  </div>
</div>
`;

exports[`<DeviceItem /> without display name 1`] = `
<div>
  <div
    aria-label="deviceId"
    class="mx_AccessibleButton mx_UserInfo_device mx_UserInfo_device_unverified"
    role="button"
    tabindex="0"
  >
    <div
      class="mx_E2EIcon mx_E2EIcon_normal"
    />
    <div
      class="mx_UserInfo_device_name"
    >
      deviceId
    </div>
    <div
      class="mx_UserInfo_device_trusted"
    />
  </div>
</div>
`;

exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
<div>
  <div
    class="mx_BaseCard mx_UserInfo"
  >
    <div
      class="mx_BaseCard_header"
    >
      <p
        class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 mx_BaseCard_header_title"
      >
        Profile
      </p>
      <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%;"
        >
          <div />
        </div>
      </button>
    </div>
    <div
      class="mx_AutoHideScrollbar"
      tabindex="-1"
    >
      <div
        class="mx_UserInfo_avatar"
      >
        <div
          class="mx_UserInfo_avatar_transition"
        >
          <div
            class="mx_UserInfo_avatar_transition_child"
          >
            <button
              aria-label="Profile picture"
              aria-live="off"
              class="_avatar_mcap2_17 mx_BaseAvatar _avatar-imageless_mcap2_61"
              data-color="3"
              data-testid="avatar-img"
              data-type="round"
              role="button"
              style="--cpd-avatar-size: 120px;"
            >
              u
            </button>
          </div>
        </div>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <div
          class="mx_Flex mx_UserInfo_profile"
          style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0;"
        >
          <h1
            class="_typography_yh5dq_162 _font-heading-sm-semibold_yh5dq_102"
            dir="auto"
          >
            <div
              class="mx_Flex"
              style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0;"
            >
              @user:example.com
            </div>
          </h1>
          <div
            class="mx_PresenceLabel mx_UserInfo_profileStatus"
          >
            Unknown
          </div>
          <p
            class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 mx_UserInfo_profile_mxid"
          >
            <div
              class="mx_CopyableText"
            >
              customUserIdentifier
              <div
                aria-label="Copy"
                class="mx_AccessibleButton mx_CopyableText_copyButton"
                role="button"
                tabindex="0"
              />
            </div>
          </p>
        </div>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <h2>
          Security
        </h2>
        <p>
          Messages in this room are not end-to-end encrypted.
        </p>
        <div
          class="mx_UserInfo_container_verifyButton"
        >
          <div
            class="mx_AccessibleButton mx_UserInfo_field mx_UserInfo_verifyButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
            role="button"
            tabindex="0"
          >
            Verify
          </div>
        </div>
        <div
          class="mx_UserInfo_devices"
        >
          <div />
          <div>
            <div
              class="mx_AccessibleButton mx_UserInfo_expand mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
              role="button"
              tabindex="0"
            >
              <div
                class="mx_E2EIcon mx_E2EIcon_normal"
              />
              <div>
                1 session
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Send message
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Share profile
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="critical"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Ignore
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
      </div>
    </div>
  </div>
</div>
`;

exports[`<UserInfo /> with crypto enabled should render a deactivate button for users of the same server if we are a server admin 1`] = `
<div>
  <div
    class="mx_BaseCard mx_UserInfo"
  >
    <div
      class="mx_BaseCard_header"
    >
      <p
        class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 mx_BaseCard_header_title"
      >
        Profile
      </p>
      <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%;"
        >
          <div />
        </div>
      </button>
    </div>
    <div
      class="mx_AutoHideScrollbar"
      tabindex="-1"
    >
      <div
        class="mx_UserInfo_avatar"
      >
        <div
          class="mx_UserInfo_avatar_transition"
        >
          <div
            class="mx_UserInfo_avatar_transition_child"
          >
            <button
              aria-label="Profile picture"
              aria-live="off"
              class="_avatar_mcap2_17 mx_BaseAvatar _avatar-imageless_mcap2_61"
              data-color="3"
              data-testid="avatar-img"
              data-type="round"
              role="button"
              style="--cpd-avatar-size: 120px;"
            >
              u
            </button>
          </div>
        </div>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <div
          class="mx_Flex mx_UserInfo_profile"
          style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0;"
        >
          <h1
            class="_typography_yh5dq_162 _font-heading-sm-semibold_yh5dq_102"
            dir="auto"
          >
            <div
              class="mx_Flex"
              style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0;"
            >
              @user:example.com
            </div>
          </h1>
          <div
            class="mx_PresenceLabel mx_UserInfo_profileStatus"
          >
            Unknown
          </div>
          <p
            class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 mx_UserInfo_profile_mxid"
          >
            <div
              class="mx_CopyableText"
            >
              customUserIdentifier
              <div
                aria-label="Copy"
                class="mx_AccessibleButton mx_CopyableText_copyButton"
                role="button"
                tabindex="0"
              />
            </div>
          </p>
        </div>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <h2>
          Security
        </h2>
        <p>
          Messages in this room are not end-to-end encrypted.
        </p>
        <div
          class="mx_UserInfo_container_verifyButton"
        >
          <div
            class="mx_AccessibleButton mx_UserInfo_field mx_UserInfo_verifyButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
            role="button"
            tabindex="0"
          >
            Verify
          </div>
        </div>
        <div
          class="mx_UserInfo_devices"
        >
          <div />
          <div>
            <div
              class="mx_AccessibleButton mx_UserInfo_expand mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
              role="button"
              tabindex="0"
            >
              <div
                class="mx_E2EIcon mx_E2EIcon_normal"
              />
              <div>
                1 session
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Send message
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Share profile
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="critical"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Deactivate user
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
      </div>
      <div
        class="mx_UserInfo_container"
      >
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="critical"
          role="button"
        >
          <div
            aria-hidden="true"
            class="_icon_1gwvj_44"
            height="24"
            width="24"
          />
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
            Ignore
          </span>
          <svg
            aria-hidden="true"
            class="_nav-hint_1gwvj_60"
            fill="currentColor"
            height="24"
            viewBox="8 0 8 24"
            width="8"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
            />
          </svg>
        </button>
      </div>
    </div>
  </div>
</div>
`;