Add unread badges and avatar decorations to spotlight search (#7696)

This commit is contained in:
Michael Telatynski 2022-02-07 13:50:04 +00:00 committed by GitHub
parent 30e80aa87d
commit d72469663d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 6 deletions

View file

@ -146,10 +146,12 @@ limitations under the License.
text-overflow: ellipsis;
overflow: hidden;
.mx_BaseAvatar {
.mx_DecoratedRoomAvatar {
margin-right: 8px;
display: inline-block;
height: 20px;
}
.mx_NotificationBadge {
margin-left: 8px;
}
&:hover, &[aria-selected=true] {

View file

@ -34,7 +34,6 @@ import { IDialogProps } from "./IDialogProps";
import { _t } from "../../../languageHandler";
import BaseDialog from "./BaseDialog";
import { BreadcrumbsStore } from "../../../stores/BreadcrumbsStore";
import RoomAvatar from "../avatars/RoomAvatar";
import defaultDispatcher from "../../../dispatcher/dispatcher";
import {
findSiblingElement,
@ -63,6 +62,8 @@ import RoomViewStore from "../../../stores/RoomViewStore";
import { showStartChatInviteDialog } from "../../../RoomInvite";
import SettingsStore from "../../../settings/SettingsStore";
import { SettingLevel } from "../../../settings/SettingLevel";
import NotificationBadge from "../rooms/NotificationBadge";
import { RoomNotificationStateStore } from "../../../stores/notifications/RoomNotificationStateStore";
const MAX_RECENT_SEARCHES = 10;
const SECTION_LIMIT = 50; // only show 50 results per section for performance reasons
@ -244,8 +245,9 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", onFinished }) =>
viewRoom(room.roomId, true);
}}
>
<RoomAvatar room={room} width={20} height={20} />
<DecoratedRoomAvatar room={room} avatarSize={20} />
{ room.name }
<NotificationBadge notification={RoomNotificationStateStore.instance.getRoomState(room)} />
<ResultDetails room={room} />
<div className="mx_SpotlightDialog_enterPrompt"></div>
</Option>
@ -383,8 +385,9 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", onFinished }) =>
viewRoom(room.roomId, true);
}}
>
<RoomAvatar room={room} width={20} height={20} />
<DecoratedRoomAvatar room={room} avatarSize={20} />
{ room.name }
<NotificationBadge notification={RoomNotificationStateStore.instance.getRoomState(room)} />
<div className="mx_SpotlightDialog_enterPrompt"></div>
</Option>
)) }