rtc-voice-chat/frontend/src/components/LocalPlayerSet/index.tsx
2026-03-28 16:32:51 +08:00

41 lines
1.2 KiB
TypeScript

/**
* Copyright 2025 Beijing Volcano Engine Technology Co., Ltd. All Rights Reserved.
* SPDX-license-identifier: BSD-3-Clause
*/
import { useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { Popover } from '@arco-design/web-react';
import { RootState } from '@/store';
import { updateFullScreen } from '@/store/slices/room';
import SET_LOCAL_PLAYER from '@/assets/img/setLocalPlayer.svg';
import styles from './index.module.less';
function LocalPlayerSet() {
const dispatch = useDispatch();
const room = useSelector((state: RootState) => state.room);
const { isFullScreen } = room;
const [loading, setLoading] = useState(false);
const [isFull, setFull] = useState(isFullScreen);
const setLocalPlayer = () => {
setLoading(true);
setFull(!isFull);
dispatch(updateFullScreen({ isFullScreen: !isFull }));
setLoading(false);
};
return (
<div
onClick={setLocalPlayer}
className={styles.container}
style={{ cursor: loading ? 'not-allowed' : 'pointer' }}
>
<Popover content="切换屏幕">
<img src={SET_LOCAL_PLAYER} alt="fullSize" />
</Popover>
</div>
);
}
export default LocalPlayerSet;