imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Allow adding extra icons to the room header (#11799)

Browse source 
* Allow adding extra icons to the room header

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>

* Apply PR feedback

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>

* Apply PR feedback

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>

* Apply PR feedback

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>

* Apply PR feedback

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>

* Apply PR feedback

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>

---------

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>
This commit is contained in:
Charly Nguyen 2023-11-01 13:03:10 +01:00 • committed by GitHub
parent 9496097143
commit 01e7e01153
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 210 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/components/views/rooms/RoomHeader.tsx
View file

@ -24,6 +24,7 @@ import { Icon as VerifiedIcon } from "@vector-im/compound-design-tokens/icons/ve
import { Icon as ErrorIcon } from "@vector-im/compound-design-tokens/icons/error.svg";
import { Icon as PublicIcon } from "@vector-im/compound-design-tokens/icons/public.svg";
import { EventType, JoinRule, type Room } from "matrix-js-sdk/src/matrix";
import { ViewRoomOpts } from "@matrix-org/react-sdk-module-api/lib/lifecycles/RoomViewLifecycle";
import { useRoomName } from "../../../hooks/useRoomName";
import { RightPanelPhases } from "../../../stores/right-panel/RightPanelStorePhases";
@ -63,7 +64,13 @@ function notificationColorToIndicator(color: NotificationColor): React.Component
}
}
export default function RoomHeader({ room }: { room: Room }): JSX.Element {
export default function RoomHeader({
room,
additionalButtons,
}: {
room: Room;
additionalButtons?: ViewRoomOpts["buttons"];
}): JSX.Element {
const client = useMatrixClientContext();
const roomName = useRoomName(room);
@ -169,6 +176,23 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
)}
</Box>
<Flex as="nav" align="center" gap="var(--cpd-space-2x)">
{additionalButtons?.map((props) => {
const label = props.label();
return (
<Tooltip label={label} key={props.id}>
<IconButton
aria-label={label}
onClick={(event) => {
event.stopPropagation();
props.onClick();
}}
>
{props.icon}
</IconButton>
</Tooltip>
);
})}
{!useElementCallExclusively && (
<Tooltip label={!voiceCallDisabledReason ? _t("voip|voice_call") : voiceCallDisabledReason!}>
<IconButton