rzerres/element-call
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Upgrade eslint-plugin-matrix-org to 1.2.1

Browse Source 
This upgrade came with a number of new lints that needed to be fixed across the code base. Primarily: explicit return types on functions, and explicit visibility modifiers on class members.
This commit is contained in:
Robin
2023-09-22 18:05:13 -04:00
parent 444a37224b
commit a7624806b2
88 changed files with 735 additions and 433 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/room/CallEndedView.tsx
View File

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import { FC, FormEventHandler, useCallback, useState } from "react";
import { FC, FormEventHandler, ReactNode, useCallback, useState } from "react";
import { MatrixClient } from "matrix-js-sdk/src/client";
import { Trans, useTranslation } from "react-i18next";
import { useHistory } from "react-router-dom";
@@ -148,7 +148,7 @@ export const CallEndedView: FC<Props> = ({
</div>
);
const renderBody = () => {
const renderBody = (): ReactNode => {
if (leaveError) {
return (
<>

55
src/room/GroupCallInspector.tsx
View File

@@ -28,7 +28,8 @@ import {
useContext,
Dispatch,
SetStateAction,
ReactNode,
FC,
PropsWithChildren,
} from "react";
import ReactJson, { CollapsedFieldProps } from "react-json-view";
import mermaid from "mermaid";
@@ -72,11 +73,11 @@ const defaultCollapsedFields = [
"content",
];
function shouldCollapse({ name }: CollapsedFieldProps) {
function shouldCollapse({ name }: CollapsedFieldProps): boolean {
return name ? defaultCollapsedFields.includes(name) : false;
}
function getUserName(userId: string) {
function getUserName(userId: string): string {
const match = userId.match(/@([^:]+):/);
return match && match.length > 0
@@ -84,7 +85,7 @@ function getUserName(userId: string) {
: userId.replace(/\W/g, "");
}
function formatContent(type: string, content: CallEventContent) {
function formatContent(type: string, content: CallEventContent): string {
if (type === "m.call.hangup") {
return `callId: ${content.call_id.slice(-4)} reason: ${
content.reason
@@ -123,7 +124,7 @@ const dateFormatter = new Intl.DateTimeFormat([], {
fractionalSecondDigits: 3,
});
function formatTimestamp(timestamp: number | Date) {
function formatTimestamp(timestamp: number | Date): string {
return dateFormatter.format(timestamp);
}
@@ -145,11 +146,9 @@ export const InspectorContext =
[InspectorContextState, Dispatch<SetStateAction<InspectorContextState>>]
>(undefined);
export function InspectorContextProvider({
export const InspectorContextProvider: FC<PropsWithChildren<{}>> = ({
children,
}: {
children: ReactNode;
}) {
}) => {
// We take the tuple of [currentState, setter] and stick
// it straight into the context for other things to call
// the setState method... this feels like a fairly severe
@@ -161,7 +160,7 @@ export function InspectorContextProvider({
{children}
</InspectorContext.Provider>
);
}
};
type CallEventContent = {
["m.calls"]: {
@@ -192,13 +191,13 @@ interface SequenceDiagramViewerProps {
events: SequenceDiagramMatrixEvent[];
}
export function SequenceDiagramViewer({
export const SequenceDiagramViewer: FC<SequenceDiagramViewerProps> = ({
localUserId,
remoteUserIds,
selectedUserId,
onSelectUserId,
events,
}: SequenceDiagramViewerProps) {
}) => {
const mermaidElRef = useRef<HTMLDivElement>(null);
useEffect(() => {
@@ -232,7 +231,7 @@ export function SequenceDiagramViewer({
className={styles.selectInput}
label="Remote User"
selectedKey={selectedUserId}
onSelectionChange={(key) => onSelectUserId(key.toString())}
onSelectionChange={(key): void => onSelectUserId(key.toString())}
>
{remoteUserIds.map((userId) => (
<Item key={userId}>{userId}</Item>
@@ -243,7 +242,7 @@ export function SequenceDiagramViewer({
</div>
</div>
);
}
};
function reducer(
state: InspectorContextState,
@@ -254,7 +253,7 @@ function reducer(
callStateEvent?: MatrixEvent;
memberStateEvents?: MatrixEvent[];
}
) {
): InspectorContextState {
switch (action.type) {
case RoomStateEvent.Events: {
const { event, callStateEvent, memberStateEvents } = action;
@@ -380,7 +379,7 @@ function useGroupCallState(
});
useEffect(() => {
function onUpdateRoomState(event?: MatrixEvent) {
function onUpdateRoomState(event?: MatrixEvent): void {
const callStateEvent = groupCall.room.currentState.getStateEvents(
"org.matrix.msc3401.call",
groupCall.groupCallId
@@ -400,13 +399,13 @@ function useGroupCallState(
otelGroupCallMembership?.onUpdateRoomState(event);
}
function onReceivedVoipEvent(event: MatrixEvent) {
function onReceivedVoipEvent(event: MatrixEvent): void {
dispatch({ type: ClientEvent.ReceivedVoipEvent, event });
otelGroupCallMembership?.onReceivedVoipEvent(event);
}
function onSendVoipEvent(event: VoipEvent, call: MatrixCall) {
function onSendVoipEvent(event: VoipEvent, call: MatrixCall): void {
dispatch({ type: CallEvent.SendVoipEvent, rawEvent: event });
otelGroupCallMembership?.onSendEvent(call, event);
@@ -416,19 +415,19 @@ function useGroupCallState(
newState: CallState,
_: CallState,
call: MatrixCall
) {
): void {
otelGroupCallMembership?.onCallStateChange(call, newState);
}
function onCallError(error: CallError, call: MatrixCall) {
function onCallError(error: CallError, call: MatrixCall): void {
otelGroupCallMembership.onCallError(error, call);
}
function onGroupCallError(error: GroupCallError) {
function onGroupCallError(error: GroupCallError): void {
otelGroupCallMembership.onGroupCallError(error);
}
function onUndecryptableToDevice(event: MatrixEvent) {
function onUndecryptableToDevice(event: MatrixEvent): void {
dispatch({ type: ClientEvent.ReceivedVoipEvent, event });
Sentry.captureMessage("Undecryptable to-device Event");
@@ -478,12 +477,12 @@ interface GroupCallInspectorProps {
show: boolean;
}
export function GroupCallInspector({
export const GroupCallInspector: FC<GroupCallInspectorProps> = ({
client,
groupCall,
otelGroupCallMembership,
show,
}: GroupCallInspectorProps) {
}) => {
const [currentTab, setCurrentTab] = useState("sequence-diagrams");
const [selectedUserId, setSelectedUserId] = useState<string>();
const state = useGroupCallState(client, groupCall, otelGroupCallMembership);
@@ -506,10 +505,12 @@ export function GroupCallInspector({
className={styles.inspector}
>
<div className={styles.toolbar}>
<button onClick={() => setCurrentTab("sequence-diagrams")}>
<button onClick={(): void => setCurrentTab("sequence-diagrams")}>
Sequence Diagrams
</button>
<button onClick={() => setCurrentTab("inspector")}>Inspector</button>
<button onClick={(): void => setCurrentTab("inspector")}>
Inspector
</button>
</div>
{currentTab === "sequence-diagrams" &&
state.localUserId &&
@@ -539,4 +540,4 @@ export function GroupCallInspector({
)}
</Resizable>
);
}
};

20
src/room/GroupCallView.tsx
View File

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { FC, useCallback, useEffect, useMemo, useRef, useState } from "react";
import { useHistory } from "react-router-dom";
import { MatrixClient } from "matrix-js-sdk/src/client";
import { Room, isE2EESupported } from "livekit-client";
@@ -64,14 +64,14 @@ interface Props {
rtcSession: MatrixRTCSession;
}
export function GroupCallView({
export const GroupCallView: FC<Props> = ({
client,
isPasswordlessUser,
confineToRoom,
preload,
hideHeader,
rtcSession,
}: Props) {
}) => {
const memberships = useMatrixRTCSessionMemberships(rtcSession);
const isJoined = useMatrixRTCSessionJoinState(rtcSession);
@@ -135,7 +135,9 @@ export function GroupCallView({
useEffect(() => {
if (widget && preload) {
// In preload mode, wait for a join action before entering
const onJoin = async (ev: CustomEvent<IWidgetApiRequest>) => {
const onJoin = async (
ev: CustomEvent<IWidgetApiRequest>
): Promise<void> => {
// XXX: I think this is broken currently - LiveKit *won't* request
// permissions and give you device names unless you specify a kind, but
// here we want all kinds of devices. This needs a fix in livekit-client
@@ -247,9 +249,11 @@ export function GroupCallView({
useEffect(() => {
if (widget && isJoined) {
const onHangup = async (ev: CustomEvent<IWidgetApiRequest>) => {
const onHangup = async (
ev: CustomEvent<IWidgetApiRequest>
): Promise<void> => {
leaveRTCSession(rtcSession);
await widget!.api.transport.reply(ev.detail, {});
widget!.api.transport.reply(ev.detail, {});
widget!.api.setAlwaysOnScreen(false);
};
widget.lazyActions.once(ElementWidgetActions.HangupCall, onHangup);
@@ -388,7 +392,7 @@ export function GroupCallView({
client={client}
matrixInfo={matrixInfo}
muteStates={muteStates}
onEnter={() => enterRTCSession(rtcSession)}
onEnter={(): void => enterRTCSession(rtcSession)}
confineToRoom={confineToRoom}
hideHeader={hideHeader}
participatingMembers={participatingMembers}
@@ -397,4 +401,4 @@ export function GroupCallView({
</>
);
}
}
};

31
src/room/InCallView.tsx
View File

@@ -27,7 +27,16 @@ import { ConnectionState, Room, Track } from "livekit-client";
import { MatrixClient } from "matrix-js-sdk/src/client";
import { RoomMember } from "matrix-js-sdk/src/models/room-member";
import { Room as MatrixRoom } from "matrix-js-sdk/src/models/room";
import { Ref, useCallback, useEffect, useMemo, useRef, useState } from "react";
import {
FC,
ReactNode,
Ref,
useCallback,
useEffect,
useMemo,
useRef,
useState,
} from "react";
import { useTranslation } from "react-i18next";
import useMeasure from "react-use-measure";
import { logger } from "matrix-js-sdk/src/logger";
@@ -91,7 +100,7 @@ export interface ActiveCallProps
e2eeConfig?: E2EEConfig;
}
export function ActiveCall(props: ActiveCallProps) {
export const ActiveCall: FC<ActiveCallProps> = (props) => {
const sfuConfig = useOpenIDSFU(props.client, props.rtcSession);
const { livekitRoom, connState } = useLiveKit(
props.muteStates,
@@ -112,7 +121,7 @@ export function ActiveCall(props: ActiveCallProps) {
<InCallView {...props} livekitRoom={livekitRoom} connState={connState} />
</RoomContext.Provider>
);
}
};
export interface InCallViewProps {
client: MatrixClient;
@@ -128,7 +137,7 @@ export interface InCallViewProps {
onShareClick: (() => void) | null;
}
export function InCallView({
export const InCallView: FC<InCallViewProps> = ({
client,
matrixInfo,
rtcSession,
@@ -140,7 +149,7 @@ export function InCallView({
otelGroupCallMembership,
connState,
onShareClick,
}: InCallViewProps) {
}) => {
const { t } = useTranslation();
usePreventScroll();
useWakeLock();
@@ -211,13 +220,13 @@ export function InCallView({
useEffect(() => {
if (widget) {
const onTileLayout = async (ev: CustomEvent<IWidgetApiRequest>) => {
const onTileLayout = (ev: CustomEvent<IWidgetApiRequest>): void => {
setLayout("grid");
await widget!.api.transport.reply(ev.detail, {});
widget!.api.transport.reply(ev.detail, {});
};
const onSpotlightLayout = async (ev: CustomEvent<IWidgetApiRequest>) => {
const onSpotlightLayout = (ev: CustomEvent<IWidgetApiRequest>): void => {
setLayout("spotlight");
await widget!.api.transport.reply(ev.detail, {});
widget!.api.transport.reply(ev.detail, {});
};
widget.lazyActions.on(ElementWidgetActions.TileLayout, onTileLayout);
@@ -296,7 +305,7 @@ export function InCallView({
disableAnimations={prefersReducedMotion || isSafari}
layoutStates={layoutStates}
>
{(props) => (
{(props): ReactNode => (
<VideoTile
maximised={false}
fullscreen={false}
@@ -444,7 +453,7 @@ export function InCallView({
/>
</div>
);
}
};
function findMatrixMember(
room: MatrixRoom,

6
src/room/RageshakeRequestModal.tsx
View File

@@ -17,7 +17,7 @@ limitations under the License.
import { FC, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { Modal, ModalProps } from "../Modal";
import { Modal, Props as ModalProps } from "../Modal";
import { Button } from "../button";
import { FieldRow, ErrorMessage } from "../input/Input";
import { useSubmitRageshake } from "../settings/submit-rageshake";
@@ -52,8 +52,8 @@ export const RageshakeRequestModal: FC<Props> = ({
</Body>
<FieldRow>
<Button
onPress={() =>
submitRageshake({
onPress={(): void =>
void submitRageshake({
sendLogs: true,
rageshakeRequestId,
roomId,

6
src/room/RoomAuthView.tsx
View File

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import { useCallback, useState } from "react";
import { FC, useCallback, useState } from "react";
import { useLocation } from "react-router-dom";
import { Trans, useTranslation } from "react-i18next";
@@ -28,7 +28,7 @@ import { UserMenuContainer } from "../UserMenuContainer";
import { useRegisterPasswordlessUser } from "../auth/useRegisterPasswordlessUser";
import { Config } from "../config/Config";
export function RoomAuthView() {
export const RoomAuthView: FC = () => {
const [loading, setLoading] = useState(false);
const [error, setError] = useState<Error>();
@@ -121,4 +121,4 @@ export function RoomAuthView() {
</div>
</>
);
}
};

8
src/room/useFullscreen.ts
View File

@@ -22,11 +22,11 @@ import { TileDescriptor } from "../video-grid/VideoGrid";
import { useReactiveState } from "../useReactiveState";
import { useEventTarget } from "../useEvents";
const isFullscreen = () =>
const isFullscreen = (): boolean =>
Boolean(document.fullscreenElement) ||
Boolean(document.webkitFullscreenElement);
function enterFullscreen() {
function enterFullscreen(): void {
if (document.body.requestFullscreen) {
document.body.requestFullscreen();
} else if (document.body.webkitRequestFullscreen) {
@@ -36,7 +36,7 @@ function enterFullscreen() {
}
}
function exitFullscreen() {
function exitFullscreen(): void {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
@@ -46,7 +46,7 @@ function exitFullscreen() {
}
}
function useFullscreenChange(onFullscreenChange: () => void) {
function useFullscreenChange(onFullscreenChange: () => void): void {
useEventTarget(document.body, "fullscreenchange", onFullscreenChange);
useEventTarget(document.body, "webkitfullscreenchange", onFullscreenChange);
}

6
src/room/useJoinRule.ts
View File

@@ -15,12 +15,14 @@ limitations under the License.
*/
import { useCallback } from "react";
import { JoinRule } from "matrix-js-sdk/src/matrix";
import type { Room } from "matrix-js-sdk/src/models/room";
import { useRoomState } from "./useRoomState";
export const useJoinRule = (room: Room) =>
useRoomState(
export function useJoinRule(room: Room): JoinRule {
return useRoomState(
room,
useCallback((state) => state.getJoinRule(), [])
);
}

4
src/room/useLoadGroupCall.ts
View File

@@ -107,13 +107,13 @@ export const useLoadGroupCall = (
return rtcSession;
};
const waitForClientSyncing = async () => {
const waitForClientSyncing = async (): Promise<void> => {
if (client.getSyncState() !== SyncState.Syncing) {
logger.debug(
"useLoadGroupCall: waiting for client to start syncing..."
);
await new Promise<void>((resolve) => {
const onSync = () => {
const onSync = (): void => {
if (client.getSyncState() === SyncState.Syncing) {
client.off(ClientEvent.Sync, onSync);
return resolve();

4
src/room/usePageUnload.ts
View File

@@ -18,11 +18,11 @@ import { useEffect } from "react";
import { platform } from "../Platform";
export function usePageUnload(callback: () => void) {
export function usePageUnload(callback: () => void): void {
useEffect(() => {
let pageVisibilityTimeout: ReturnType<typeof setTimeout>;
function onBeforeUnload(event: PageTransitionEvent) {
function onBeforeUnload(event: PageTransitionEvent): void {
if (event.type === "visibilitychange") {
if (document.visibilityState === "visible") {
clearTimeout(pageVisibilityTimeout);

5
src/room/useRoomAvatar.ts
View File

@@ -19,8 +19,9 @@ import { Room } from "matrix-js-sdk/src/models/room";
import { useRoomState } from "./useRoomState";
export const useRoomAvatar = (room: Room) =>
useRoomState(
export function useRoomAvatar(room: Room): string | null {
return useRoomState(
room,
useCallback(() => room.getMxcAvatarUrl(), [room])
);
}