diff --git a/package.json b/package.json index f41a71d89..c57edebda 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "classnames": "^2.3.1", "color-hash": "^2.0.1", "events": "^3.3.0", - "matrix-js-sdk": "github:matrix-org/matrix-js-sdk#984dd26a138411ef73903ff4e635f2752e0829f2", + "matrix-js-sdk": "github:matrix-org/matrix-js-sdk#e876482e62421bb6a1ba58078435c6b3d1210f15", "mermaid": "^8.13.8", "normalize.css": "^8.0.1", "pako": "^2.0.4", diff --git a/src/button/Button.tsx b/src/button/Button.tsx index 83e3697cc..bd7a0dd42 100644 --- a/src/button/Button.tsx +++ b/src/button/Button.tsx @@ -30,6 +30,7 @@ import { ReactComponent as SettingsIcon } from "../icons/Settings.svg"; import { ReactComponent as AddUserIcon } from "../icons/AddUser.svg"; import { ReactComponent as ArrowDownIcon } from "../icons/ArrowDown.svg"; import { TooltipTrigger } from "../Tooltip"; +import { ReactComponent as OverflowIcon } from "../icons/Overflow.svg"; export type ButtonVariant = | "default" @@ -237,3 +238,14 @@ export function InviteButton({ ); } + +export function OptionsButton(props: Omit) { + return ( + + + {() => "Options"} + + ); +} diff --git a/src/video-grid/VideoTile.jsx b/src/video-grid/VideoTile.jsx index 2dd41921c..206f8a46e 100644 --- a/src/video-grid/VideoTile.jsx +++ b/src/video-grid/VideoTile.jsx @@ -20,6 +20,7 @@ import classNames from "classnames"; import styles from "./VideoTile.module.css"; import { ReactComponent as MicMutedIcon } from "../icons/MicMuted.svg"; import { ReactComponent as VideoMutedIcon } from "../icons/VideoMuted.svg"; +import { OptionsButton } from "../button/Button"; export const VideoTile = forwardRef( ( @@ -35,6 +36,8 @@ export const VideoTile = forwardRef( name, showName, mediaRef, + onOptionsPress, + showOptions, ...rest }, ref @@ -62,13 +65,18 @@ export const VideoTile = forwardRef( ) : ( (showName || audioMuted || (videoMuted && !noVideo)) && ( -
+
{audioMuted && !(videoMuted && !noVideo) && } {videoMuted && !noVideo && } {showName && {name}}
) )} + {showOptions && ( +
+ +
+ )}