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

Refactor PipView + fix strict errors (#9604)

Browse source
This commit is contained in:
Michael Weimann 2022-11-22 07:57:38 +01:00 • committed by GitHub
parent 2393510a7f
commit 3f74ac37e8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 68 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

58
src/components/views/voip/PipView.tsx
View file

@ -25,7 +25,7 @@ import LegacyCallView from "./LegacyCallView";
import LegacyCallHandler, { LegacyCallHandlerEvent } from '../../../LegacyCallHandler';
import PersistentApp from "../elements/PersistentApp";
import { MatrixClientPeg } from '../../../MatrixClientPeg';
import PictureInPictureDragger from './PictureInPictureDragger';
import PictureInPictureDragger, { CreatePipChildren } from './PictureInPictureDragger';
import dis from '../../../dispatcher/dispatcher';
import { Action } from "../../../dispatcher/actions";
import { Container, WidgetLayoutStore } from '../../../stores/widgets/WidgetLayoutStore';
@ -129,7 +129,9 @@ function getPrimarySecondaryCallsForPip(roomId: Optional<string>): [MatrixCall |
*/
class PipView extends React.Component<IProps, IState> {
private movePersistedElement = createRef<() => void>();
// The cast is not so great, but solves the typing issue for the moment.
// Proper solution: use useRef (requires the component to be refactored to a functional component).
private movePersistedElement = createRef<() => void>() as React.MutableRefObject<() => void>;
constructor(props: IProps) {
super(props);
@ -328,9 +330,37 @@ class PipView extends React.Component<IProps, IState> {
this.setState({ showWidgetInPip, persistentWidgetId, persistentRoomId });
}
private createVoiceBroadcastPreRecordingPipContent(
voiceBroadcastPreRecording: VoiceBroadcastPreRecording,
): CreatePipChildren {
return ({ onStartMoving }) => <div onMouseDown={onStartMoving}>
<VoiceBroadcastPreRecordingPip
voiceBroadcastPreRecording={voiceBroadcastPreRecording}
/>
</div>;
}
private createVoiceBroadcastRecordingPipContent(
voiceBroadcastRecording: VoiceBroadcastRecording,
): CreatePipChildren {
return ({ onStartMoving }) => <div onMouseDown={onStartMoving}>
<VoiceBroadcastRecordingPip
recording={voiceBroadcastRecording}
/>
</div>;
}
public render() {
const pipMode = true;
let pipContent;
let pipContent: CreatePipChildren | null = null;
if (this.props.voiceBroadcastPreRecording) {
pipContent = this.createVoiceBroadcastPreRecordingPipContent(this.props.voiceBroadcastPreRecording);
}
if (this.props.voiceBroadcastRecording) {
pipContent = this.createVoiceBroadcastRecordingPipContent(this.props.voiceBroadcastRecording);
}
if (this.state.primaryCall) {
// get a ref to call inside the current scope
@ -359,7 +389,7 @@ class PipView extends React.Component<IProps, IState> {
pipContent = ({ onStartMoving }) =>
<div className={pipViewClasses}>
<LegacyCallViewHeader
onPipMouseDown={(event) => { onStartMoving(event); this.onStartMoving.bind(this)(); }}
onPipMouseDown={(event) => { onStartMoving?.(event); this.onStartMoving.bind(this)(); }}
pipMode={pipMode}
callRooms={[roomForWidget]}
onExpand={!isCall && !viewingCallRoom ? this.onExpand : undefined}
@ -375,26 +405,6 @@ class PipView extends React.Component<IProps, IState> {
</div>;
}
if (this.props.voiceBroadcastPreRecording) {
// get a ref to pre-recording inside the current scope
const preRecording = this.props.voiceBroadcastPreRecording;
pipContent = ({ onStartMoving }) => <div onMouseDown={onStartMoving}>
<VoiceBroadcastPreRecordingPip
voiceBroadcastPreRecording={preRecording}
/>
</div>;
}
if (this.props.voiceBroadcastRecording) {
// get a ref to recording inside the current scope
const recording = this.props.voiceBroadcastRecording;
pipContent = ({ onStartMoving }) => <div onMouseDown={onStartMoving}>
<VoiceBroadcastRecordingPip
recording={recording}
/>
</div>;
}
if (!!pipContent) {
return <PictureInPictureDragger
className="mx_LegacyCallPreview"