PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

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

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

8
res/css/views/dialogs/_SpotlightDialog.scss
View file

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

9
src/components/views/dialogs/SpotlightDialog.tsx
View file

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