Add data attribute to know what header is used (#11735)

* Add data attribute to know what header is used

* Simplify room header type

* update snapshot
pull/28217/head
Germain 2023-10-12 14:17:51 +01:00 committed by GitHub
parent 3bd6dd9143
commit 9ea04a539b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 6 deletions

View File

@ -2097,13 +2097,15 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
}
}
const roomHeaderType = SettingsStore.getValue("feature_new_room_decoration_ui") ? "new" : "legacy";
if (!this.state.room) {
const loading = !this.state.matrixClientIsReady || this.state.roomLoading || this.state.peekLoading;
if (loading) {
// Assume preview loading if we don't have a ready client or a room ID (still resolving the alias)
const previewLoading = !this.state.matrixClientIsReady || !this.state.roomId || this.state.peekLoading;
return (
<div className="mx_RoomView">
<div className="mx_RoomView" data-room-header={roomHeaderType}>
<ErrorBoundary>
<RoomPreviewBar
canPreview={false}
@ -2128,7 +2130,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
// We've got to this room by following a link, possibly a third party invite.
const roomAlias = this.state.roomAlias;
return (
<div className="mx_RoomView">
<div className="mx_RoomView" data-room-header={roomHeaderType}>
<ErrorBoundary>
<RoomPreviewBar
onJoinClick={this.onJoinButtonClicked}
@ -2201,7 +2203,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
// We have a regular invite for this room.
return (
<div className="mx_RoomView">
<div className="mx_RoomView" data-room-header={roomHeaderType}>
<ErrorBoundary>
<RoomPreviewBar
onJoinClick={this.onJoinButtonClicked}
@ -2222,7 +2224,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
if (this.state.canAskToJoin && ["knock", "leave"].includes(myMembership)) {
return (
<div className="mx_RoomView">
<div className="mx_RoomView" data-room-header={roomHeaderType}>
<ErrorBoundary>
<RoomPreviewBar
room={this.state.room}
@ -2326,7 +2328,11 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
/>
);
if (!this.state.canPeek && !this.state.room?.isSpaceRoom()) {
return <div className="mx_RoomView">{previewBar}</div>;
return (
<div className="mx_RoomView" data-room-header={roomHeaderType}>
{previewBar}
</div>
);
}
} else if (hiddenHighlightCount > 0) {
aux = (
@ -2571,7 +2577,12 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
return (
<RoomContext.Provider value={this.state}>
<main className={mainClasses} ref={this.roomView} onKeyDown={this.onReactKeyDown}>
<main
className={mainClasses}
ref={this.roomView}
onKeyDown={this.onReactKeyDown}
data-room-header={roomHeaderType}
>
{showChatEffects && this.roomView.current && (
<EffectsOverlay roomWidth={this.roomView.current.offsetWidth} />
)}

View File

@ -736,6 +736,7 @@ exports[`RoomView should show error view if failed to look up room alias 1`] = `
<DocumentFragment>
<div
class="mx_RoomView"
data-room-header="legacy"
>
<div
class="mx_RoomPreviewBar dark-panel mx_RoomPreviewBar_RoomNotFound mx_RoomPreviewBar_dialog"