Matrix/element-call-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-call.git synced 2024-11-15 00:04:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

Use memoized callbacks when passing to components

Browse Source
This commit is contained in:
Daniel Abramov 2023-07-03 18:28:43 +01:00
parent caa3a7e8d0
commit 2293cbf1f0
2 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/home/CallTypeDropdown.tsx
View File

@ -42,6 +42,12 @@ interface Props {
export const CallTypeDropdown: FC<Props> = ({ callType, setCallType }) => {
const { t } = useTranslation();
const onAction = (key: React.Key) => {
setCallType(key.toString() as CallType);
};
const onClose = () => {};
return (
<PopoverMenuTrigger placement="bottom">
<Button variant="dropdown" className={commonStyles.headline}>
@ -55,11 +61,8 @@ export const CallTypeDropdown: FC<Props> = ({ callType, setCallType }) => {
<Menu
{...props}
label={t("Call type menu")}
onAction={(key) => {
const callType = key.toString();
setCallType(callType as CallType);
}}
onClose={() => {}}
onAction={onAction}
onClose={onClose}
>
<Item key={CallType.Video} textValue={t("Video call")}>
<VideoIcon />

13
src/room/GridLayoutMenu.tsx
View File

@ -38,6 +38,15 @@ export function GridLayoutMenu({ layout, setLayout }: Props) {
const { t } = useTranslation();
const tooltip = useCallback(() => t("Change layout"), [t]);
const onAction = useCallback(
(key: React.Key) => {
setLayout(key.toString() as Layout);
},
[setLayout]
);
const onClose = useCallback(() => {}, []);
return (
<PopoverMenuTrigger placement="bottom right">
<TooltipTrigger tooltip={tooltip}>
@ -49,8 +58,8 @@ export function GridLayoutMenu({ layout, setLayout }: Props) {
<Menu
{...props}
label={t("Grid layout menu")}
onAction={(key) => setLayout(key.toString() as Layout)}
onClose={() => {}}
onAction={onAction}
onClose={onClose}
>
<Item key="freedom" textValue={t("Freedom")}>
<FreedomIcon />