mirror of https://github.com/vector-im/riot-web
Merge pull request #5196 from matrix-org/travis/e2e-iconography
[Release] Show verification status in the room summary cardpull/21833/head
commit
fe0eea84dd
|
@ -67,12 +67,26 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_RoomSummaryCard_e2ee_secure {
|
.mx_RoomSummaryCard_e2ee_normal {
|
||||||
background-color: #5abff2;
|
background-color: #424446;
|
||||||
&::before {
|
&::before {
|
||||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_RoomSummaryCard_e2ee_verified {
|
||||||
|
background-color: #0dbd8b;
|
||||||
|
&::before {
|
||||||
|
mask-image: url('$(res)/img/e2e/verified.svg');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_RoomSummaryCard_e2ee_warning {
|
||||||
|
background-color: #ff4b55;
|
||||||
|
&::before {
|
||||||
|
mask-image: url('$(res)/img/e2e/warning.svg');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -40,6 +40,7 @@ import TextWithTooltip from "../elements/TextWithTooltip";
|
||||||
import BaseAvatar from "../avatars/BaseAvatar";
|
import BaseAvatar from "../avatars/BaseAvatar";
|
||||||
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
|
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
|
||||||
import WidgetStore, {IApp} from "../../../stores/WidgetStore";
|
import WidgetStore, {IApp} from "../../../stores/WidgetStore";
|
||||||
|
import RoomContext from "../../../contexts/RoomContext";
|
||||||
|
|
||||||
interface IProps {
|
interface IProps {
|
||||||
room: Room;
|
room: Room;
|
||||||
|
@ -199,6 +200,8 @@ const RoomSummaryCard: React.FC<IProps> = ({ room, onClose }) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const isRoomEncrypted = useIsEncrypted(cli, room);
|
const isRoomEncrypted = useIsEncrypted(cli, room);
|
||||||
|
const roomContext = useContext(RoomContext);
|
||||||
|
const e2eStatus = roomContext['e2eStatus'];
|
||||||
|
|
||||||
const alias = room.getCanonicalAlias() || room.getAltAliases()[0] || "";
|
const alias = room.getCanonicalAlias() || room.getAltAliases()[0] || "";
|
||||||
const header = <React.Fragment>
|
const header = <React.Fragment>
|
||||||
|
@ -207,7 +210,9 @@ const RoomSummaryCard: React.FC<IProps> = ({ room, onClose }) => {
|
||||||
<TextWithTooltip
|
<TextWithTooltip
|
||||||
tooltip={isRoomEncrypted ? _t("Encrypted") : _t("Not encrypted")}
|
tooltip={isRoomEncrypted ? _t("Encrypted") : _t("Not encrypted")}
|
||||||
class={classNames("mx_RoomSummaryCard_e2ee", {
|
class={classNames("mx_RoomSummaryCard_e2ee", {
|
||||||
mx_RoomSummaryCard_e2ee_secure: isRoomEncrypted,
|
mx_RoomSummaryCard_e2ee_normal: isRoomEncrypted,
|
||||||
|
mx_RoomSummaryCard_e2ee_warning: isRoomEncrypted && e2eStatus === "warning",
|
||||||
|
mx_RoomSummaryCard_e2ee_verified: isRoomEncrypted && e2eStatus === "verified",
|
||||||
})}
|
})}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue