From a7624806b29b70115f0cc34b1151ebb2801d15d7 Mon Sep 17 00:00:00 2001 From: Robin Date: Fri, 22 Sep 2023 18:05:13 -0400 Subject: [PATCH 01/14] Upgrade eslint-plugin-matrix-org to 1.2.1 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. --- .eslintrc.cjs | 44 +++++----- package.json | 5 +- src/App.tsx | 8 +- src/Banner.tsx | 4 +- src/ClientContext.tsx | 10 ++- src/DisconnectedBanner.tsx | 10 +-- src/E2EEBanner.tsx | 3 +- src/Facepile.tsx | 8 +- src/FullScreenView.tsx | 21 +++-- src/Header.tsx | 20 ++--- src/ListBox.tsx | 12 ++- src/Menu.tsx | 11 ++- src/Modal.tsx | 10 +-- src/SequenceDiagramViewerPage.tsx | 6 +- src/TranslatedError.ts | 6 +- src/UrlParams.ts | 8 +- src/UserMenu.tsx | 12 +-- src/UserMenuContainer.tsx | 6 +- src/analytics/AnalyticsNotice.tsx | 16 ++++ src/analytics/PosthogAnalytics.ts | 22 +++-- src/analytics/PosthogEvents.ts | 32 +++---- src/analytics/PosthogSpanProcessor.ts | 8 +- src/analytics/RageshakeSpanProcessor.ts | 42 ++++++++-- src/auth/RegisterPage.tsx | 6 +- src/auth/useInteractiveLogin.ts | 14 ++-- src/auth/useInteractiveRegistration.ts | 4 +- src/auth/useRecaptcha.ts | 14 ++-- src/button/Button.tsx | 58 +++++-------- src/button/CopyButton.tsx | 8 +- src/button/LinkButton.tsx | 8 +- src/home/CallList.tsx | 11 ++- src/home/HomePage.tsx | 5 +- src/home/JoinExistingCallModal.tsx | 9 +- src/home/RegisteredView.tsx | 8 +- src/home/UnauthenticatedView.tsx | 2 +- src/home/useGroupCallRooms.ts | 4 +- src/initializer.tsx | 14 ++-- src/input/AvatarInputField.tsx | 4 +- src/input/StarRatingInput.tsx | 6 +- src/livekit/MediaDevicesContext.tsx | 10 ++- src/livekit/openIDSFU.ts | 4 +- src/livekit/options.ts | 16 ++++ src/livekit/useECConnectionState.ts | 2 +- src/livekit/useLiveKit.ts | 2 +- src/main.tsx | 2 +- src/matrix-utils.ts | 12 +-- src/otel/OTelCall.ts | 4 +- src/otel/OTelCallAbstractMediaStreamSpan.ts | 22 ++++- src/otel/OTelCallFeedMediaStreamSpan.ts | 22 ++++- src/otel/OTelCallMediaStreamTrackSpan.ts | 20 ++++- .../OTelCallTransceiverMediaStreamSpan.ts | 22 ++++- src/otel/OTelGroupCallMembership.ts | 52 +++++++----- src/otel/ObjectFlattener.ts | 4 +- src/otel/otel.ts | 6 +- src/profile/useProfile.ts | 8 +- src/room/CallEndedView.tsx | 4 +- src/room/GroupCallInspector.tsx | 55 ++++++------ src/room/GroupCallView.tsx | 20 +++-- src/room/InCallView.tsx | 31 ++++--- src/room/RageshakeRequestModal.tsx | 6 +- src/room/RoomAuthView.tsx | 6 +- src/room/useFullscreen.ts | 8 +- src/room/useJoinRule.ts | 6 +- src/room/useLoadGroupCall.ts | 4 +- src/room/usePageUnload.ts | 4 +- src/room/useRoomAvatar.ts | 5 +- src/rtcSessionHelpers.ts | 4 +- src/settings/FeedbackSettingsTab.tsx | 6 +- src/settings/ProfileSettingsTab.tsx | 6 +- src/settings/RageshakeButton.tsx | 4 +- src/settings/SettingsModal.tsx | 21 +++-- src/settings/rageshake.ts | 30 +++---- src/settings/submit-rageshake.ts | 2 +- src/settings/useSetting.ts | 19 +++-- src/useCallViewKeyboardShortcuts.ts | 2 +- src/useEvents.ts | 18 ++-- src/useMediaQuery.ts | 4 +- src/usePrefersReducedMotion.ts | 2 +- src/useWakeLock.ts | 6 +- src/video-grid/BigGrid.tsx | 22 +++-- src/video-grid/Layout.tsx | 27 ++++-- src/video-grid/NewVideoGrid.tsx | 12 +-- src/video-grid/VideoGrid.tsx | 19 +++-- src/video-grid/VideoTile.tsx | 4 +- src/video-grid/VideoTileSettingsModal.tsx | 12 ++- src/widget.ts | 4 +- tsconfig.json | 4 +- yarn.lock | 84 +++++++++++++++++-- 88 files changed, 735 insertions(+), 433 deletions(-) diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 173d8dca..064a20db 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -1,13 +1,31 @@ +const COPYRIGHT_HEADER = `/* +Copyright %%CURRENT_YEAR%% New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +`; + module.exports = { plugins: ["matrix-org"], extends: [ - "prettier", "plugin:matrix-org/react", "plugin:matrix-org/a11y", "plugin:matrix-org/typescript", + "prettier", ], parserOptions: { - ecmaVersion: 2018, + ecmaVersion: "latest", sourceType: "module", project: ["./tsconfig.json"], }, @@ -15,27 +33,11 @@ module.exports = { browser: true, node: true, }, - parserOptions: { - ecmaVersion: "latest", - sourceType: "module", - }, rules: { - "jsx-a11y/media-has-caption": ["off"], + "matrix-org/require-copyright-header": ["error", COPYRIGHT_HEADER], + "jsx-a11y/media-has-caption": "off", + "deprecate/import": "off", // Disabled because it crashes the linter }, - overrides: [ - { - files: ["src/**/*.{ts,tsx}", "test/**/*.{ts,tsx}"], - extends: [ - "plugin:matrix-org/typescript", - "plugin:matrix-org/react", - "prettier", - ], - rules: { - // We're aiming to convert this code to strict mode - "@typescript-eslint/no-non-null-assertion": "off", - }, - }, - ], settings: { react: { version: "detect", diff --git a/package.json b/package.json index 007bd32f..957464c4 100644 --- a/package.json +++ b/package.json @@ -104,11 +104,13 @@ "eslint": "^8.14.0", "eslint-config-google": "^0.14.0", "eslint-config-prettier": "^9.0.0", + "eslint-plugin-deprecate": "^0.8.2", "eslint-plugin-import": "^2.26.0", "eslint-plugin-jsx-a11y": "^6.5.1", - "eslint-plugin-matrix-org": "^0.4.0", + "eslint-plugin-matrix-org": "^1.2.1", "eslint-plugin-react": "^7.29.4", "eslint-plugin-react-hooks": "^4.5.0", + "eslint-plugin-unicorn": "^48.0.1", "i18next-parser": "^6.6.0", "identity-obj-proxy": "^3.0.0", "jest": "^29.2.2", @@ -118,6 +120,7 @@ "sass": "^1.42.1", "storybook-builder-vite": "^0.1.12", "typescript": "^5.1.6", + "typescript-eslint-language-service": "^5.0.5", "vite": "^4.2.0", "vite-plugin-html-template": "^1.1.0", "vite-plugin-svgr": "^3.2.0" diff --git a/src/App.tsx b/src/App.tsx index 00890f31..6708beb1 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { Suspense, useEffect, useState } from "react"; +import { FC, Suspense, useEffect, useState } from "react"; import { BrowserRouter as Router, Switch, @@ -43,7 +43,7 @@ interface BackgroundProviderProps { children: JSX.Element; } -const BackgroundProvider = ({ children }: BackgroundProviderProps) => { +const BackgroundProvider: FC = ({ children }) => { const { pathname } = useLocation(); useEffect(() => { @@ -63,7 +63,7 @@ interface AppProps { history: History; } -export default function App({ history }: AppProps) { +export const App: FC = ({ history }) => { const [loaded, setLoaded] = useState(false); useEffect(() => { @@ -116,4 +116,4 @@ export default function App({ history }: AppProps) { ); -} +}; diff --git a/src/Banner.tsx b/src/Banner.tsx index fcc68a3b..87ce8a96 100644 --- a/src/Banner.tsx +++ b/src/Banner.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { ReactNode } from "react"; +import { FC, ReactNode } from "react"; import styles from "./Banner.module.css"; @@ -22,6 +22,6 @@ interface Props { children: ReactNode; } -export const Banner = ({ children }: Props) => { +export const Banner: FC = ({ children }) => { return
{children}
; }; diff --git a/src/ClientContext.tsx b/src/ClientContext.tsx index f7ceea9f..c1ee6338 100644 --- a/src/ClientContext.tsx +++ b/src/ClientContext.tsx @@ -82,7 +82,8 @@ export type SetClientParams = { const ClientContext = createContext(undefined); -export const useClientState = () => useContext(ClientContext); +export const useClientState = (): ClientState | undefined => + useContext(ClientContext); export function useClient(): { client?: MatrixClient; @@ -408,8 +409,8 @@ export interface Session { tempPassword?: string; } -const clearSession = () => localStorage.removeItem("matrix-auth-store"); -const saveSession = (s: Session) => +const clearSession = (): void => localStorage.removeItem("matrix-auth-store"); +const saveSession = (s: Session): void => localStorage.setItem("matrix-auth-store", JSON.stringify(s)); const loadSession = (): Session | undefined => { const data = localStorage.getItem("matrix-auth-store"); @@ -423,4 +424,5 @@ const loadSession = (): Session | undefined => { const clientIsDisconnected = ( syncState: SyncState, syncData?: ISyncStateData -) => syncState === "ERROR" && syncData?.error?.name === "ConnectionError"; +): boolean => + syncState === "ERROR" && syncData?.error?.name === "ConnectionError"; diff --git a/src/DisconnectedBanner.tsx b/src/DisconnectedBanner.tsx index 6ec5d5ac..06369cc5 100644 --- a/src/DisconnectedBanner.tsx +++ b/src/DisconnectedBanner.tsx @@ -15,22 +15,22 @@ limitations under the License. */ import classNames from "classnames"; -import { HTMLAttributes, ReactNode } from "react"; +import { FC, HTMLAttributes, ReactNode } from "react"; import { useTranslation } from "react-i18next"; import styles from "./DisconnectedBanner.module.css"; import { ValidClientState, useClientState } from "./ClientContext"; -interface DisconnectedBannerProps extends HTMLAttributes { +interface Props extends HTMLAttributes { children?: ReactNode; className?: string; } -export function DisconnectedBanner({ +export const DisconnectedBanner: FC = ({ children, className, ...rest -}: DisconnectedBannerProps) { +}) => { const { t } = useTranslation(); const clientState = useClientState(); let shouldShowBanner = false; @@ -50,4 +50,4 @@ export function DisconnectedBanner({ )} ); -} +}; diff --git a/src/E2EEBanner.tsx b/src/E2EEBanner.tsx index 774f3582..7b173605 100644 --- a/src/E2EEBanner.tsx +++ b/src/E2EEBanner.tsx @@ -15,13 +15,14 @@ limitations under the License. */ import { Trans } from "react-i18next"; +import { FC } from "react"; import { Banner } from "./Banner"; import styles from "./E2EEBanner.module.css"; import { ReactComponent as LockOffIcon } from "./icons/LockOff.svg"; import { useEnableE2EE } from "./settings/useSetting"; -export const E2EEBanner = () => { +export const E2EEBanner: FC = () => { const [e2eeEnabled] = useEnableE2EE(); if (e2eeEnabled) return null; diff --git a/src/Facepile.tsx b/src/Facepile.tsx index 7ed995ce..08b460a9 100644 --- a/src/Facepile.tsx +++ b/src/Facepile.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { HTMLAttributes } from "react"; +import { FC, HTMLAttributes } from "react"; import { MatrixClient } from "matrix-js-sdk/src/client"; import { RoomMember } from "matrix-js-sdk/src/models/room-member"; import { useTranslation } from "react-i18next"; @@ -30,14 +30,14 @@ interface Props extends HTMLAttributes { size?: Size | number; } -export function Facepile({ +export const Facepile: FC = ({ className, client, members, max = 3, size = Size.XS, ...rest -}: Props) { +}) => { const { t } = useTranslation(); const displayedMembers = members.slice(0, max); @@ -63,4 +63,4 @@ export function Facepile({ })} ); -} +}; diff --git a/src/FullScreenView.tsx b/src/FullScreenView.tsx index 6ac134b8..10fe01f4 100644 --- a/src/FullScreenView.tsx +++ b/src/FullScreenView.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { ReactNode, useCallback, useEffect } from "react"; +import { FC, ReactNode, useCallback, useEffect } from "react"; import { useLocation } from "react-router-dom"; import classNames from "classnames"; import { Trans, useTranslation } from "react-i18next"; @@ -32,7 +32,10 @@ interface FullScreenViewProps { children: ReactNode; } -export function FullScreenView({ className, children }: FullScreenViewProps) { +export const FullScreenView: FC = ({ + className, + children, +}) => { return (
@@ -46,13 +49,13 @@ export function FullScreenView({ className, children }: FullScreenViewProps) {
); -} +}; interface ErrorViewProps { error: Error; } -export function ErrorView({ error }: ErrorViewProps) { +export const ErrorView: FC = ({ error }) => { const location = useLocation(); const { t } = useTranslation(); @@ -95,9 +98,9 @@ export function ErrorView({ error }: ErrorViewProps) { )} ); -} +}; -export function CrashView() { +export const CrashView: FC = () => { const { t } = useTranslation(); const onReload = useCallback(() => { @@ -126,9 +129,9 @@ export function CrashView() { ); -} +}; -export function LoadingView() { +export const LoadingView: FC = () => { const { t } = useTranslation(); return ( @@ -136,4 +139,4 @@ export function LoadingView() {

{t("Loading…")}

); -} +}; diff --git a/src/Header.tsx b/src/Header.tsx index aea3da71..b080bec0 100644 --- a/src/Header.tsx +++ b/src/Header.tsx @@ -33,13 +33,13 @@ interface HeaderProps extends HTMLAttributes { className?: string; } -export function Header({ children, className, ...rest }: HeaderProps) { +export const Header: FC = ({ children, className, ...rest }) => { return (
{children}
); -} +}; interface LeftNavProps extends HTMLAttributes { children: ReactNode; @@ -47,12 +47,12 @@ interface LeftNavProps extends HTMLAttributes { hideMobile?: boolean; } -export function LeftNav({ +export const LeftNav: FC = ({ children, className, hideMobile, ...rest -}: LeftNavProps) { +}) => { return (
); -} +}; interface RightNavProps extends HTMLAttributes { children?: ReactNode; @@ -74,12 +74,12 @@ interface RightNavProps extends HTMLAttributes { hideMobile?: boolean; } -export function RightNav({ +export const RightNav: FC = ({ children, className, hideMobile, ...rest -}: RightNavProps) { +}) => { return (
); -} +}; interface HeaderLogoProps { className?: string; } -export function HeaderLogo({ className }: HeaderLogoProps) { +export const HeaderLogo: FC = ({ className }) => { const { t } = useTranslation(); return ( @@ -111,7 +111,7 @@ export function HeaderLogo({ className }: HeaderLogoProps) { ); -} +}; interface RoomHeaderInfoProps { id: string; diff --git a/src/ListBox.tsx b/src/ListBox.tsx index b7ec7c72..b025f483 100644 --- a/src/ListBox.tsx +++ b/src/ListBox.tsx @@ -14,7 +14,13 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { MutableRefObject, PointerEvent, useCallback, useRef } from "react"; +import { + MutableRefObject, + PointerEvent, + ReactNode, + useCallback, + useRef, +} from "react"; import { useListBox, useOption, AriaListBoxOptions } from "@react-aria/listbox"; import { ListState } from "@react-stately/list"; import { Node } from "@react-types/shared"; @@ -35,7 +41,7 @@ export function ListBox({ className, listBoxRef, ...rest -}: ListBoxProps) { +}: ListBoxProps): ReactNode { const ref = useRef(null); const listRef = listBoxRef ?? ref; @@ -66,7 +72,7 @@ interface OptionProps { item: Node; } -function Option({ item, state, className }: OptionProps) { +function Option({ item, state, className }: OptionProps): ReactNode { const ref = useRef(null); const { optionProps, isSelected, isFocused, isDisabled } = useOption( { key: item.key }, diff --git a/src/Menu.tsx b/src/Menu.tsx index c1e8e40b..932c19d4 100644 --- a/src/Menu.tsx +++ b/src/Menu.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { Key, useRef, useState } from "react"; +import { Key, ReactNode, useRef, useState } from "react"; import { AriaMenuOptions, useMenu, useMenuItem } from "@react-aria/menu"; import { TreeState, useTreeState } from "@react-stately/tree"; import { mergeProps } from "@react-aria/utils"; @@ -37,7 +37,7 @@ export function Menu({ onClose, label, ...rest -}: MenuProps) { +}: MenuProps): ReactNode { const state = useTreeState({ ...rest, selectionMode: "none" }); const menuRef = useRef(null); const { menuProps } = useMenu(rest, state, menuRef); @@ -68,7 +68,12 @@ interface MenuItemProps { onClose: () => void; } -function MenuItem({ item, state, onAction, onClose }: MenuItemProps) { +function MenuItem({ + item, + state, + onAction, + onClose, +}: MenuItemProps): ReactNode { const ref = useRef(null); const { menuItemProps } = useMenuItem( { diff --git a/src/Modal.tsx b/src/Modal.tsx index b644abe4..9fdd53b9 100644 --- a/src/Modal.tsx +++ b/src/Modal.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { ReactNode, useCallback } from "react"; +import { FC, ReactNode, useCallback } from "react"; import { AriaDialogProps } from "@react-types/dialog"; import { useTranslation } from "react-i18next"; import { @@ -36,7 +36,7 @@ import { useMediaQuery } from "./useMediaQuery"; import { Glass } from "./Glass"; // TODO: Support tabs -export interface ModalProps extends AriaDialogProps { +export interface Props extends AriaDialogProps { title: string; children: ReactNode; className?: string; @@ -58,14 +58,14 @@ export interface ModalProps extends AriaDialogProps { * A modal, taking the form of a drawer / bottom sheet on touchscreen devices, * and a dialog box on desktop. */ -export function Modal({ +export const Modal: FC = ({ title, children, className, open, onDismiss, ...rest -}: ModalProps) { +}) => { const { t } = useTranslation(); // Empirically, Chrome on Android can end up not matching (hover: none), but // still matching (pointer: coarse) :/ @@ -140,4 +140,4 @@ export function Modal({ ); } -} +}; diff --git a/src/SequenceDiagramViewerPage.tsx b/src/SequenceDiagramViewerPage.tsx index 9fb66f94..defa1809 100644 --- a/src/SequenceDiagramViewerPage.tsx +++ b/src/SequenceDiagramViewerPage.tsx @@ -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 { useTranslation } from "react-i18next"; import { @@ -30,7 +30,7 @@ interface DebugLog { remoteUserIds: string[]; } -export function SequenceDiagramViewerPage() { +export const SequenceDiagramViewerPage: FC = () => { const { t } = useTranslation(); usePageTitle(t("Inspector")); @@ -69,4 +69,4 @@ export function SequenceDiagramViewerPage() { )}
); -} +}; diff --git a/src/TranslatedError.ts b/src/TranslatedError.ts index 62960f04..595672cc 100644 --- a/src/TranslatedError.ts +++ b/src/TranslatedError.ts @@ -37,5 +37,7 @@ class TranslatedErrorImpl extends TranslatedError {} // i18next-parser can't detect calls to a constructor, so we expose a bare // function instead -export const translatedError = (messageKey: string, t: typeof i18n.t) => - new TranslatedErrorImpl(messageKey, t); +export const translatedError = ( + messageKey: string, + t: typeof i18n.t +): TranslatedError => new TranslatedErrorImpl(messageKey, t); diff --git a/src/UrlParams.ts b/src/UrlParams.ts index 90713c3b..0b230ae8 100644 --- a/src/UrlParams.ts +++ b/src/UrlParams.ts @@ -134,7 +134,7 @@ class ParamParser { private fragmentParams: URLSearchParams; private queryParams: URLSearchParams; - constructor(search: string, hash: string) { + public constructor(search: string, hash: string) { this.queryParams = new URLSearchParams(search); const fragmentQueryStart = hash.indexOf("?"); @@ -146,18 +146,18 @@ class ParamParser { // Normally, URL params should be encoded in the fragment so as to avoid // leaking them to the server. However, we also check the normal query // string for backwards compatibility with versions that only used that. - getParam(name: string): string | null { + public getParam(name: string): string | null { return this.fragmentParams.get(name) ?? this.queryParams.get(name); } - getAllParams(name: string): string[] { + public getAllParams(name: string): string[] { return [ ...this.fragmentParams.getAll(name), ...this.queryParams.getAll(name), ]; } - getFlagParam(name: string, defaultValue = false): boolean { + public getFlagParam(name: string, defaultValue = false): boolean { const param = this.getParam(name); return param === null ? defaultValue : param !== "false"; } diff --git a/src/UserMenu.tsx b/src/UserMenu.tsx index 515e71f0..44427287 100644 --- a/src/UserMenu.tsx +++ b/src/UserMenu.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { useCallback, useMemo } from "react"; +import { FC, ReactNode, useCallback, useMemo } from "react"; import { Item } from "@react-stately/collections"; import { useLocation } from "react-router-dom"; import { useTranslation } from "react-i18next"; @@ -31,7 +31,7 @@ import { ReactComponent as LogoutIcon } from "./icons/Logout.svg"; import { Body } from "./typography/Typography"; import styles from "./UserMenu.module.css"; -interface UserMenuProps { +interface Props { preventNavigation: boolean; isAuthenticated: boolean; isPasswordlessUser: boolean; @@ -41,7 +41,7 @@ interface UserMenuProps { onAction: (value: string) => void; } -export function UserMenu({ +export const UserMenu: FC = ({ preventNavigation, isAuthenticated, isPasswordlessUser, @@ -49,7 +49,7 @@ export function UserMenu({ displayName, avatarUrl, onAction, -}: UserMenuProps) { +}) => { const { t } = useTranslation(); const location = useLocation(); @@ -123,7 +123,7 @@ export function UserMenu({ { // eslint-disable-next-line @typescript-eslint/no-explicit-any - (props: any) => ( + (props: any): ReactNode => ( {items.map(({ key, icon: Icon, label, dataTestid }) => ( @@ -141,4 +141,4 @@ export function UserMenu({ } ); -} +}; diff --git a/src/UserMenuContainer.tsx b/src/UserMenuContainer.tsx index 359f75f6..c629ecea 100644 --- a/src/UserMenuContainer.tsx +++ b/src/UserMenuContainer.tsx @@ -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 { useHistory, useLocation } from "react-router-dom"; import { useClientLegacy } from "./ClientContext"; @@ -26,7 +26,7 @@ interface Props { preventNavigation?: boolean; } -export function UserMenuContainer({ preventNavigation = false }: Props) { +export const UserMenuContainer: FC = ({ preventNavigation = false }) => { const location = useLocation(); const history = useHistory(); const { client, logout, authenticated, passwordlessUser } = useClientLegacy(); @@ -83,4 +83,4 @@ export function UserMenuContainer({ preventNavigation = false }: Props) { )} ); -} +}; diff --git a/src/analytics/AnalyticsNotice.tsx b/src/analytics/AnalyticsNotice.tsx index 544de61a..7b1d3fb5 100644 --- a/src/analytics/AnalyticsNotice.tsx +++ b/src/analytics/AnalyticsNotice.tsx @@ -1,3 +1,19 @@ +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + import { FC } from "react"; import { Trans } from "react-i18next"; diff --git a/src/analytics/PosthogAnalytics.ts b/src/analytics/PosthogAnalytics.ts index 9d4f3f5c..a0316736 100644 --- a/src/analytics/PosthogAnalytics.ts +++ b/src/analytics/PosthogAnalytics.ts @@ -117,7 +117,7 @@ export class PosthogAnalytics { return this.internalInstance; } - constructor(private readonly posthog: PostHog) { + private constructor(private readonly posthog: PostHog) { const posthogConfig: PosthogSettings = { project_api_key: Config.get().posthog?.api_key, api_host: Config.get().posthog?.api_host, @@ -183,7 +183,7 @@ export class PosthogAnalytics { return properties; }; - private registerSuperProperties(properties: Properties) { + private registerSuperProperties(properties: Properties): void { if (this.enabled) { this.posthog.register(properties); } @@ -202,7 +202,7 @@ export class PosthogAnalytics { eventName: string, properties: Properties, options?: CaptureOptions - ) { + ): void { if (!this.enabled) { return; } @@ -213,7 +213,7 @@ export class PosthogAnalytics { return this.enabled; } - setAnonymity(anonymity: Anonymity): void { + private setAnonymity(anonymity: Anonymity): void { // Update this.anonymity. // To update the anonymity typically you want to call updateAnonymityFromSettings // to ensure this value is in step with the user's settings. @@ -236,7 +236,9 @@ export class PosthogAnalytics { .join(""); } - private async identifyUser(analyticsIdGenerator: () => string) { + private async identifyUser( + analyticsIdGenerator: () => string + ): Promise { if (this.anonymity == Anonymity.Pseudonymous && this.enabled) { // Check the user's account_data for an analytics ID to use. Storing the ID in account_data allows // different devices to send the same ID. @@ -271,7 +273,7 @@ export class PosthogAnalytics { } } - async getAnalyticsId() { + private async getAnalyticsId(): Promise { const client: MatrixClient = window.matrixclient; let accountAnalyticsId; if (widget) { @@ -291,7 +293,9 @@ export class PosthogAnalytics { return null; } - async hashedEcAnalyticsId(accountAnalyticsId: string): Promise { + private async hashedEcAnalyticsId( + accountAnalyticsId: string + ): Promise { const client: MatrixClient = window.matrixclient; const posthogIdMaterial = "ec" + accountAnalyticsId + client.getUserId(); const bufferForPosthogId = await crypto.subtle.digest( @@ -304,7 +308,7 @@ export class PosthogAnalytics { .join(""); } - async setAccountAnalyticsId(analyticsID: string) { + private async setAccountAnalyticsId(analyticsID: string): Promise { if (!widget) { const client = window.matrixclient; @@ -335,7 +339,7 @@ export class PosthogAnalytics { this.updateAnonymityAndIdentifyUser(optInAnalytics); } - private updateSuperProperties() { + private updateSuperProperties(): void { // Update super properties in posthog with our platform (app version, platform). // These properties will be subsequently passed in every event. // diff --git a/src/analytics/PosthogEvents.ts b/src/analytics/PosthogEvents.ts index 97e25b6f..89c1ee50 100644 --- a/src/analytics/PosthogEvents.ts +++ b/src/analytics/PosthogEvents.ts @@ -36,18 +36,22 @@ export class CallEndedTracker { maxParticipantsCount: 0, }; - cacheStartCall(time: Date) { + public cacheStartCall(time: Date): void { this.cache.startTime = time; } - cacheParticipantCountChanged(count: number) { + public cacheParticipantCountChanged(count: number): void { this.cache.maxParticipantsCount = Math.max( count, this.cache.maxParticipantsCount ); } - track(callId: string, callParticipantsNow: number, sendInstantly: boolean) { + public track( + callId: string, + callParticipantsNow: number, + sendInstantly: boolean + ): void { PosthogAnalytics.instance.trackEvent( { eventName: "CallEnded", @@ -67,7 +71,7 @@ interface CallStarted extends IPosthogEvent { } export class CallStartedTracker { - track(callId: string) { + public track(callId: string): void { PosthogAnalytics.instance.trackEvent({ eventName: "CallStarted", callId: callId, @@ -86,19 +90,19 @@ export class SignupTracker { signupEnd: new Date(0), }; - cacheSignupStart(time: Date) { + public cacheSignupStart(time: Date): void { this.cache.signupStart = time; } - getSignupEndTime() { + public getSignupEndTime(): Date { return this.cache.signupEnd; } - cacheSignupEnd(time: Date) { + public cacheSignupEnd(time: Date): void { this.cache.signupEnd = time; } - track() { + public track(): void { PosthogAnalytics.instance.trackEvent({ eventName: "Signup", signupDuration: Date.now() - this.cache.signupStart.getTime(), @@ -112,7 +116,7 @@ interface Login extends IPosthogEvent { } export class LoginTracker { - track() { + public track(): void { PosthogAnalytics.instance.trackEvent({ eventName: "Login", }); @@ -127,7 +131,7 @@ interface MuteMicrophone { } export class MuteMicrophoneTracker { - track(targetIsMute: boolean, callId: string) { + public track(targetIsMute: boolean, callId: string): void { PosthogAnalytics.instance.trackEvent({ eventName: "MuteMicrophone", targetMuteState: targetIsMute ? "mute" : "unmute", @@ -143,7 +147,7 @@ interface MuteCamera { } export class MuteCameraTracker { - track(targetIsMute: boolean, callId: string) { + public track(targetIsMute: boolean, callId: string): void { PosthogAnalytics.instance.trackEvent({ eventName: "MuteCamera", targetMuteState: targetIsMute ? "mute" : "unmute", @@ -158,7 +162,7 @@ interface UndecryptableToDeviceEvent { } export class UndecryptableToDeviceEventTracker { - track(callId: string) { + public track(callId: string): void { PosthogAnalytics.instance.trackEvent({ eventName: "UndecryptableToDeviceEvent", callId, @@ -174,7 +178,7 @@ interface QualitySurveyEvent { } export class QualitySurveyEventTracker { - track(callId: string, feedbackText: string, stars: number) { + public track(callId: string, feedbackText: string, stars: number): void { PosthogAnalytics.instance.trackEvent({ eventName: "QualitySurvey", callId, @@ -190,7 +194,7 @@ interface CallDisconnectedEvent { } export class CallDisconnectedEventTracker { - track(reason?: DisconnectReason) { + public track(reason?: DisconnectReason): void { PosthogAnalytics.instance.trackEvent({ eventName: "CallDisconnected", reason, diff --git a/src/analytics/PosthogSpanProcessor.ts b/src/analytics/PosthogSpanProcessor.ts index effa6436..98a6dbbc 100644 --- a/src/analytics/PosthogSpanProcessor.ts +++ b/src/analytics/PosthogSpanProcessor.ts @@ -39,9 +39,9 @@ const maxRejoinMs = 2 * 60 * 1000; // 2 minutes * Span processor that extracts certain metrics from spans to send to PostHog */ export class PosthogSpanProcessor implements SpanProcessor { - async forceFlush(): Promise {} + public async forceFlush(): Promise {} - onStart(span: Span): void { + public onStart(span: Span): void { // Hack: Yield to allow attributes to be set before processing Promise.resolve().then(() => { switch (span.name) { @@ -55,7 +55,7 @@ export class PosthogSpanProcessor implements SpanProcessor { }); } - onEnd(span: ReadableSpan): void { + public onEnd(span: ReadableSpan): void { switch (span.name) { case "matrix.groupCallMembership": this.onGroupCallMembershipEnd(span); @@ -157,7 +157,7 @@ export class PosthogSpanProcessor implements SpanProcessor { /** * Shutdown the processor. */ - shutdown(): Promise { + public shutdown(): Promise { return Promise.resolve(); } } diff --git a/src/analytics/RageshakeSpanProcessor.ts b/src/analytics/RageshakeSpanProcessor.ts index b5b055f2..670a77c3 100644 --- a/src/analytics/RageshakeSpanProcessor.ts +++ b/src/analytics/RageshakeSpanProcessor.ts @@ -1,4 +1,20 @@ -import { Attributes } from "@opentelemetry/api"; +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { AttributeValue, Attributes } from "@opentelemetry/api"; import { hrTimeToMicroseconds } from "@opentelemetry/core"; import { SpanProcessor, @@ -6,7 +22,21 @@ import { Span, } from "@opentelemetry/sdk-trace-base"; -const dumpAttributes = (attr: Attributes) => +const dumpAttributes = ( + attr: Attributes +): { + key: string; + type: + | "string" + | "number" + | "bigint" + | "boolean" + | "symbol" + | "undefined" + | "object" + | "function"; + value: AttributeValue | undefined; +}[] => Object.entries(attr).map(([key, value]) => ({ key, type: typeof value, @@ -20,13 +50,13 @@ const dumpAttributes = (attr: Attributes) => export class RageshakeSpanProcessor implements SpanProcessor { private readonly spans: ReadableSpan[] = []; - async forceFlush(): Promise {} + public async forceFlush(): Promise {} - onStart(span: Span): void { + public onStart(span: Span): void { this.spans.push(span); } - onEnd(): void {} + public onEnd(): void {} /** * Dumps the spans collected so far as Jaeger-compatible JSON. @@ -110,5 +140,5 @@ export class RageshakeSpanProcessor implements SpanProcessor { }); } - async shutdown(): Promise {} + public async shutdown(): Promise {} } diff --git a/src/auth/RegisterPage.tsx b/src/auth/RegisterPage.tsx index c49d9b43..807fdbdd 100644 --- a/src/auth/RegisterPage.tsx +++ b/src/auth/RegisterPage.tsx @@ -68,7 +68,7 @@ export const RegisterPage: FC = () => { if (password !== passwordConfirmation) return; - const submit = async () => { + const submit = async (): Promise => { setRegistering(true); const recaptchaResponse = await execute(); @@ -183,7 +183,7 @@ export const RegisterPage: FC = () => { required name="password" type="password" - onChange={(e: ChangeEvent) => + onChange={(e: ChangeEvent): void => setPassword(e.target.value) } value={password} @@ -197,7 +197,7 @@ export const RegisterPage: FC = () => { required type="password" name="passwordConfirmation" - onChange={(e: ChangeEvent) => + onChange={(e: ChangeEvent): void => setPasswordConfirmation(e.target.value) } value={passwordConfirmation} diff --git a/src/auth/useInteractiveLogin.ts b/src/auth/useInteractiveLogin.ts index 07dec12d..28288fee 100644 --- a/src/auth/useInteractiveLogin.ts +++ b/src/auth/useInteractiveLogin.ts @@ -21,8 +21,12 @@ import { createClient, MatrixClient } from "matrix-js-sdk/src/matrix"; import { initClient } from "../matrix-utils"; import { Session } from "../ClientContext"; -export const useInteractiveLogin = () => - useCallback< +export function useInteractiveLogin(): ( + homeserver: string, + username: string, + password: string +) => Promise<[MatrixClient, Session]> { + return useCallback< ( homeserver: string, username: string, @@ -41,8 +45,8 @@ export const useInteractiveLogin = () => }, password, }), - stateUpdated: (...args) => {}, - requestEmailToken: (...args): Promise<{ sid: string }> => { + stateUpdated: (): void => {}, + requestEmailToken: (): Promise<{ sid: string }> => { return Promise.resolve({ sid: "" }); }, }); @@ -69,6 +73,6 @@ export const useInteractiveLogin = () => false ); /* eslint-enable camelcase */ - return [client, session]; }, []); +} diff --git a/src/auth/useInteractiveRegistration.ts b/src/auth/useInteractiveRegistration.ts index a4863671..70ce0c2f 100644 --- a/src/auth/useInteractiveRegistration.ts +++ b/src/auth/useInteractiveRegistration.ts @@ -72,7 +72,7 @@ export const useInteractiveRegistration = (): { password, auth: auth || undefined, }), - stateUpdated: (nextStage, status) => { + stateUpdated: (nextStage, status): void => { if (status.error) { throw new Error(status.error); } @@ -88,7 +88,7 @@ export const useInteractiveRegistration = (): { }); } }, - requestEmailToken: (...args) => { + requestEmailToken: (): Promise<{ sid: string }> => { return Promise.resolve({ sid: "dummy" }); }, }); diff --git a/src/auth/useRecaptcha.ts b/src/auth/useRecaptcha.ts index 647370da..a77d41ee 100644 --- a/src/auth/useRecaptcha.ts +++ b/src/auth/useRecaptcha.ts @@ -34,7 +34,11 @@ interface RecaptchaPromiseRef { reject: (error: Error) => void; } -export const useRecaptcha = (sitekey?: string) => { +export function useRecaptcha(sitekey?: string): { + execute: () => Promise; + reset: () => void; + recaptchaId: string; +} { const { t } = useTranslation(); const [recaptchaId] = useState(() => randomString(16)); const promiseRef = useRef(); @@ -42,7 +46,7 @@ export const useRecaptcha = (sitekey?: string) => { useEffect(() => { if (!sitekey) return; - const onRecaptchaLoaded = () => { + const onRecaptchaLoaded = (): void => { if (!document.getElementById(recaptchaId)) return; window.grecaptcha.render(recaptchaId, { @@ -90,11 +94,11 @@ export const useRecaptcha = (sitekey?: string) => { }); promiseRef.current = { - resolve: (value) => { + resolve: (value): void => { resolve(value); observer.disconnect(); }, - reject: (error) => { + reject: (error): void => { reject(error); observer.disconnect(); }, @@ -119,4 +123,4 @@ export const useRecaptcha = (sitekey?: string) => { }, []); return { execute, reset, recaptchaId }; -}; +} diff --git a/src/button/Button.tsx b/src/button/Button.tsx index 3d269dc2..d1476dbf 100644 --- a/src/button/Button.tsx +++ b/src/button/Button.tsx @@ -13,7 +13,7 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. */ -import { forwardRef } from "react"; +import { FC, forwardRef } from "react"; import { PressEvent } from "@react-types/shared"; import classNames from "classnames"; import { useButton } from "@react-aria/button"; @@ -135,14 +135,11 @@ export const Button = forwardRef( } ); -export function MicButton({ - muted, - ...rest -}: { +export const MicButton: FC<{ muted: boolean; // TODO: add all props for ); -} +}; -export function VideoButton({ - muted, - ...rest -}: { +export const VideoButton: FC<{ muted: boolean; // TODO: add all props for ); -} +}; -export function ScreenshareButton({ - enabled, - className, - ...rest -}: { +export const ScreenshareButton: FC<{ enabled: boolean; className?: string; // TODO: add all props for ); -} +}; -export function HangupButton({ - className, - ...rest -}: { +export const HangupButton: FC<{ className?: string; // TODO: add all props for ); -} +}; -export function SettingsButton({ - className, - ...rest -}: { +export const SettingsButton: FC<{ className?: string; // TODO: add all props for ); -} +}; interface AudioButtonProps extends Omit { /** @@ -248,7 +232,7 @@ interface AudioButtonProps extends Omit { volume: number; } -export function AudioButton({ volume, ...rest }: AudioButtonProps) { +export const AudioButton: FC = ({ volume, ...rest }) => { const { t } = useTranslation(); return ( @@ -258,16 +242,16 @@ export function AudioButton({ volume, ...rest }: AudioButtonProps) { ); -} +}; interface FullscreenButtonProps extends Omit { fullscreen?: boolean; } -export function FullscreenButton({ +export const FullscreenButton: FC = ({ fullscreen, ...rest -}: FullscreenButtonProps) { +}) => { const { t } = useTranslation(); const Icon = fullscreen ? FullscreenExit : Fullscreen; const label = fullscreen ? t("Exit full screen") : t("Full screen"); @@ -279,4 +263,4 @@ export function FullscreenButton({ ); -} +}; diff --git a/src/button/CopyButton.tsx b/src/button/CopyButton.tsx index 91c8e750..b44b919d 100644 --- a/src/button/CopyButton.tsx +++ b/src/button/CopyButton.tsx @@ -16,6 +16,7 @@ limitations under the License. import { useTranslation } from "react-i18next"; import useClipboard from "react-use-clipboard"; +import { FC } from "react"; import { ReactComponent as CheckIcon } from "../icons/Check.svg"; import { ReactComponent as CopyIcon } from "../icons/Copy.svg"; @@ -28,14 +29,15 @@ interface Props { variant?: ButtonVariant; copiedMessage?: string; } -export function CopyButton({ + +export const CopyButton: FC = ({ value, children, className, variant, copiedMessage, ...rest -}: Props) { +}) => { const { t } = useTranslation(); const [isCopied, setCopied] = useClipboard(value, { successDuration: 3000 }); @@ -62,4 +64,4 @@ export function CopyButton({ )} ); -} +}; diff --git a/src/button/LinkButton.tsx b/src/button/LinkButton.tsx index 3392935d..2a94b150 100644 --- a/src/button/LinkButton.tsx +++ b/src/button/LinkButton.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { HTMLAttributes } from "react"; +import { FC, HTMLAttributes } from "react"; import { Link } from "react-router-dom"; import classNames from "classnames"; import * as H from "history"; @@ -34,14 +34,14 @@ interface Props extends HTMLAttributes { className?: string; } -export function LinkButton({ +export const LinkButton: FC = ({ children, to, size, variant, className, ...rest -}: Props) { +}) => { return ( ); -} +}; diff --git a/src/home/CallList.tsx b/src/home/CallList.tsx index ac501e41..ef1722ca 100644 --- a/src/home/CallList.tsx +++ b/src/home/CallList.tsx @@ -18,6 +18,7 @@ import { Link } from "react-router-dom"; import { MatrixClient } from "matrix-js-sdk/src/client"; import { RoomMember } from "matrix-js-sdk/src/models/room-member"; import { Room } from "matrix-js-sdk/src/models/room"; +import { FC } from "react"; import { CopyButton } from "../button"; import { Avatar, Size } from "../Avatar"; @@ -31,7 +32,8 @@ interface CallListProps { rooms: GroupCallRoom[]; client: MatrixClient; } -export function CallList({ rooms, client }: CallListProps) { + +export const CallList: FC = ({ rooms, client }) => { return ( <>
@@ -54,7 +56,7 @@ export function CallList({ rooms, client }: CallListProps) {
); -} +}; interface CallTileProps { name: string; avatarUrl: string; @@ -62,7 +64,8 @@ interface CallTileProps { participants: RoomMember[]; client: MatrixClient; } -function CallTile({ name, avatarUrl, room }: CallTileProps) { + +const CallTile: FC = ({ name, avatarUrl, room }) => { const roomSharedKey = useRoomSharedKey(room.roomId); return ( @@ -92,4 +95,4 @@ function CallTile({ name, avatarUrl, room }: CallTileProps) { />
); -} +}; diff --git a/src/home/HomePage.tsx b/src/home/HomePage.tsx index a78cb8bd..779a7168 100644 --- a/src/home/HomePage.tsx +++ b/src/home/HomePage.tsx @@ -15,6 +15,7 @@ limitations under the License. */ import { useTranslation } from "react-i18next"; +import { FC } from "react"; import { useClientState } from "../ClientContext"; import { ErrorView, LoadingView } from "../FullScreenView"; @@ -22,7 +23,7 @@ import { UnauthenticatedView } from "./UnauthenticatedView"; import { RegisteredView } from "./RegisteredView"; import { usePageTitle } from "../usePageTitle"; -export function HomePage() { +export const HomePage: FC = () => { const { t } = useTranslation(); usePageTitle(t("Home")); @@ -39,4 +40,4 @@ export function HomePage() { ); } -} +}; diff --git a/src/home/JoinExistingCallModal.tsx b/src/home/JoinExistingCallModal.tsx index 35672295..d8ed9fce 100644 --- a/src/home/JoinExistingCallModal.tsx +++ b/src/home/JoinExistingCallModal.tsx @@ -16,6 +16,7 @@ limitations under the License. import { PressEvent } from "@react-types/shared"; import { useTranslation } from "react-i18next"; +import { FC } from "react"; import { Modal } from "../Modal"; import { Button } from "../button"; @@ -28,7 +29,11 @@ interface Props { onJoin: (e: PressEvent) => void; } -export function JoinExistingCallModal({ onJoin, open, onDismiss }: Props) { +export const JoinExistingCallModal: FC = ({ + onJoin, + open, + onDismiss, +}) => { const { t } = useTranslation(); return ( @@ -42,4 +47,4 @@ export function JoinExistingCallModal({ onJoin, open, onDismiss }: Props) { ); -} +}; diff --git a/src/home/RegisteredView.tsx b/src/home/RegisteredView.tsx index 5552eda3..219060e3 100644 --- a/src/home/RegisteredView.tsx +++ b/src/home/RegisteredView.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { useState, useCallback, FormEvent, FormEventHandler } from "react"; +import { useState, useCallback, FormEvent, FormEventHandler, FC } from "react"; import { useHistory } from "react-router-dom"; import { MatrixClient } from "matrix-js-sdk/src/client"; import { randomString } from "matrix-js-sdk/src/randomstring"; @@ -48,7 +48,7 @@ interface Props { client: MatrixClient; } -export function RegisteredView({ client }: Props) { +export const RegisteredView: FC = ({ client }) => { const [loading, setLoading] = useState(false); const [error, setError] = useState(); const [optInAnalytics] = useOptInAnalytics(); @@ -72,7 +72,7 @@ export function RegisteredView({ client }: Props) { ? sanitiseRoomNameInput(roomNameData) : ""; - async function submit() { + async function submit(): Promise { setError(undefined); setLoading(true); @@ -176,4 +176,4 @@ export function RegisteredView({ client }: Props) { /> ); -} +}; diff --git a/src/home/UnauthenticatedView.tsx b/src/home/UnauthenticatedView.tsx index 8cd64c14..8f78e26a 100644 --- a/src/home/UnauthenticatedView.tsx +++ b/src/home/UnauthenticatedView.tsx @@ -73,7 +73,7 @@ export const UnauthenticatedView: FC = () => { const roomName = sanitiseRoomNameInput(data.get("callName") as string); const displayName = data.get("displayName") as string; - async function submit() { + async function submit(): Promise { setError(undefined); setLoading(true); const recaptchaResponse = await execute(); diff --git a/src/home/useGroupCallRooms.ts b/src/home/useGroupCallRooms.ts index 51633d8e..6e50dda0 100644 --- a/src/home/useGroupCallRooms.ts +++ b/src/home/useGroupCallRooms.ts @@ -31,7 +31,7 @@ export interface GroupCallRoom { } const tsCache: { [index: string]: number } = {}; -function getLastTs(client: MatrixClient, r: Room) { +function getLastTs(client: MatrixClient, r: Room): number { if (tsCache[r.roomId]) { return tsCache[r.roomId]; } @@ -82,7 +82,7 @@ export function useGroupCallRooms(client: MatrixClient): GroupCallRoom[] { const [rooms, setRooms] = useState([]); useEffect(() => { - function updateRooms() { + function updateRooms(): void { if (!client.groupCallEventHandler) { return; } diff --git a/src/initializer.tsx b/src/initializer.tsx index 9a8152dd..d2bbb076 100644 --- a/src/initializer.tsx +++ b/src/initializer.tsx @@ -35,11 +35,11 @@ enum LoadState { class DependencyLoadStates { // TODO: decide where olm should be initialized (see TODO comment below) // olm: LoadState = LoadState.None; - config: LoadState = LoadState.None; - sentry: LoadState = LoadState.None; - openTelemetry: LoadState = LoadState.None; + public config: LoadState = LoadState.None; + public sentry: LoadState = LoadState.None; + public openTelemetry: LoadState = LoadState.None; - allDepsAreLoaded() { + public allDepsAreLoaded(): boolean { return !Object.values(this).some((s) => s !== LoadState.Loaded); } } @@ -52,7 +52,7 @@ export class Initializer { return Initializer.internalInstance?.isInitialized; } - public static initBeforeReact() { + public static initBeforeReact(): void { // this maybe also needs to return a promise in the future, // if we have to do async inits before showing the loading screen // but this should be avioded if possible @@ -126,9 +126,9 @@ export class Initializer { return Initializer.internalInstance.initPromise; } - loadStates = new DependencyLoadStates(); + private loadStates = new DependencyLoadStates(); - initStep(resolve: (value: void | PromiseLike) => void) { + private initStep(resolve: (value: void | PromiseLike) => void): void { // TODO: Olm is initialized with the client currently (see `initClient()` and `olm.ts`) // we need to decide if we want to init it here or keep it in initClient // if (this.loadStates.olm === LoadState.None) { diff --git a/src/input/AvatarInputField.tsx b/src/input/AvatarInputField.tsx index 8a069718..4a561f6d 100644 --- a/src/input/AvatarInputField.tsx +++ b/src/input/AvatarInputField.tsx @@ -64,7 +64,7 @@ export const AvatarInputField = forwardRef( useEffect(() => { const currentInput = fileInputRef.current; - const onChange = (e: Event) => { + const onChange = (e: Event): void => { const inputEvent = e as unknown as ChangeEvent; if (inputEvent.target.files && inputEvent.target.files.length > 0) { setObjUrl(URL.createObjectURL(inputEvent.target.files[0])); @@ -76,7 +76,7 @@ export const AvatarInputField = forwardRef( currentInput.addEventListener("change", onChange); - return () => { + return (): void => { currentInput?.removeEventListener("change", onChange); }; }); diff --git a/src/input/StarRatingInput.tsx b/src/input/StarRatingInput.tsx index 3017a117..14000859 100644 --- a/src/input/StarRatingInput.tsx +++ b/src/input/StarRatingInput.tsx @@ -41,8 +41,8 @@ export function StarRatingInput({ return (
setHover(index)} - onMouseLeave={() => setHover(rating)} + onMouseEnter={(): void => setHover(index)} + onMouseLeave={(): void => setHover(rating)} key={index} > { + onChange={(_ev): void => { setRating(index); onChange(index); }} diff --git a/src/livekit/MediaDevicesContext.tsx b/src/livekit/MediaDevicesContext.tsx index 1605edf3..ddd23b9d 100644 --- a/src/livekit/MediaDevicesContext.tsx +++ b/src/livekit/MediaDevicesContext.tsx @@ -52,7 +52,7 @@ export interface MediaDevices { function useObservableState( observable: Observable | undefined, startWith: T -) { +): T { const [state, setState] = useState(startWith); useEffect(() => { // observable state doesn't run in SSR @@ -207,7 +207,8 @@ export const MediaDevicesProvider: FC = ({ children }) => { ); }; -export const useMediaDevices = () => useContext(MediaDevicesContext); +export const useMediaDevices = (): MediaDevices => + useContext(MediaDevicesContext); /** * React hook that requests for the media devices context to be populated with @@ -215,7 +216,10 @@ export const useMediaDevices = () => useContext(MediaDevicesContext); * default because it may involve requesting additional permissions from the * user. */ -export const useMediaDeviceNames = (context: MediaDevices, enabled = true) => +export const useMediaDeviceNames = ( + context: MediaDevices, + enabled = true +): void => useEffect(() => { if (enabled) { context.startUsingDeviceNames(); diff --git a/src/livekit/openIDSFU.ts b/src/livekit/openIDSFU.ts index d10f56fb..3e6779f5 100644 --- a/src/livekit/openIDSFU.ts +++ b/src/livekit/openIDSFU.ts @@ -43,13 +43,13 @@ export type OpenIDClientParts = Pick< export function useOpenIDSFU( client: OpenIDClientParts, rtcSession: MatrixRTCSession -) { +): SFUConfig | undefined { const [sfuConfig, setSFUConfig] = useState(undefined); const activeFocus = useActiveFocus(rtcSession); useEffect(() => { - (async () => { + (async (): Promise => { const sfuConfig = activeFocus ? await getSFUConfigWithOpenID(client, activeFocus) : undefined; diff --git a/src/livekit/options.ts b/src/livekit/options.ts index 7f9695f1..00f19b12 100644 --- a/src/livekit/options.ts +++ b/src/livekit/options.ts @@ -1,3 +1,19 @@ +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + import { AudioPresets, DefaultReconnectPolicy, diff --git a/src/livekit/useECConnectionState.ts b/src/livekit/useECConnectionState.ts index e9298eb7..8e0d44ac 100644 --- a/src/livekit/useECConnectionState.ts +++ b/src/livekit/useECConnectionState.ts @@ -119,7 +119,7 @@ export function useECConnectionState( `SFU config changed! URL was ${currentSFUConfig.current?.url} now ${sfuConfig?.url}` ); - (async () => { + (async (): Promise => { setSwitchingFocus(true); await livekitRoom?.disconnect(); setIsInDoConnect(true); diff --git a/src/livekit/useLiveKit.ts b/src/livekit/useLiveKit.ts index d6d8394b..361f08c2 100644 --- a/src/livekit/useLiveKit.ts +++ b/src/livekit/useLiveKit.ts @@ -156,7 +156,7 @@ export function useLiveKit( useEffect(() => { // Sync the requested devices with LiveKit's devices if (room !== undefined && connectionState === ConnectionState.Connected) { - const syncDevice = (kind: MediaDeviceKind, device: MediaDevice) => { + const syncDevice = (kind: MediaDeviceKind, device: MediaDevice): void => { const id = device.selectedId; if (id !== undefined && room.getActiveDevice(kind) !== id) { room diff --git a/src/main.tsx b/src/main.tsx index 0ec2bfae..452935c1 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -26,7 +26,7 @@ import { createBrowserHistory } from "history"; import "./index.css"; import { setLogLevel as setLKLogLevel } from "livekit-client"; -import App from "./App"; +import { App } from "./App"; import { init as initRageshake } from "./settings/rageshake"; import { Initializer } from "./initializer"; diff --git a/src/matrix-utils.ts b/src/matrix-utils.ts index a03b4bc4..2bb1734a 100644 --- a/src/matrix-utils.ts +++ b/src/matrix-utils.ts @@ -40,7 +40,7 @@ export const fallbackICEServerAllowed = import.meta.env.VITE_FALLBACK_STUN_ALLOWED === "true"; export class CryptoStoreIntegrityError extends Error { - constructor() { + public constructor() { super("Crypto store data was expected, but none was found"); } } @@ -52,13 +52,13 @@ const SYNC_STORE_NAME = "element-call-sync"; // (It's a good opportunity to make the database names consistent.) const CRYPTO_STORE_NAME = "element-call-crypto"; -function waitForSync(client: MatrixClient) { +function waitForSync(client: MatrixClient): Promise { return new Promise((resolve, reject) => { const onSync = ( state: SyncState, _old: SyncState | null, data?: ISyncStateData - ) => { + ): void => { if (state === "PREPARED") { client.removeListener(ClientEvent.Sync, onSync); resolve(); @@ -108,7 +108,7 @@ export async function initClient( // Chrome supports it. (It bundles them fine in production mode.) workerFactory: import.meta.env.DEV ? undefined - : () => new IndexedDBWorker(), + : (): Worker => new IndexedDBWorker(), }); } else if (localStorage) { baseOpts.store = new MemoryStore({ localStorage }); @@ -307,7 +307,7 @@ export async function createRoom( // Wait for the room to arrive await new Promise((resolve, reject) => { - const onRoom = async (room: Room) => { + const onRoom = async (room: Room): Promise => { if (room.roomId === (await createPromise).room_id) { resolve(); cleanUp(); @@ -318,7 +318,7 @@ export async function createRoom( cleanUp(); }); - const cleanUp = () => { + const cleanUp = (): void => { client.off(ClientEvent.Room, onRoom); }; client.on(ClientEvent.Room, onRoom); diff --git a/src/otel/OTelCall.ts b/src/otel/OTelCall.ts index c7a7fb1a..c050116e 100644 --- a/src/otel/OTelCall.ts +++ b/src/otel/OTelCall.ts @@ -44,7 +44,7 @@ export class OTelCall { OTelCallAbstractMediaStreamSpan >(); - constructor( + public constructor( public userId: string, public deviceId: string, public call: MatrixCall, @@ -60,7 +60,7 @@ export class OTelCall { } } - public dispose() { + public dispose(): void { this.call.peerConn?.removeEventListener( "connectionstatechange", this.onCallConnectionStateChanged diff --git a/src/otel/OTelCallAbstractMediaStreamSpan.ts b/src/otel/OTelCallAbstractMediaStreamSpan.ts index aa77051d..66d9d7af 100644 --- a/src/otel/OTelCallAbstractMediaStreamSpan.ts +++ b/src/otel/OTelCallAbstractMediaStreamSpan.ts @@ -1,3 +1,19 @@ +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + import opentelemetry, { Span } from "@opentelemetry/api"; import { TrackStats } from "matrix-js-sdk/src/webrtc/stats/statsReport"; @@ -14,8 +30,8 @@ export abstract class OTelCallAbstractMediaStreamSpan { public readonly span; public constructor( - readonly oTel: ElementCallOpenTelemetry, - readonly callSpan: Span, + protected readonly oTel: ElementCallOpenTelemetry, + protected readonly callSpan: Span, protected readonly type: string ) { const ctx = opentelemetry.trace.setSpan( @@ -32,7 +48,7 @@ export abstract class OTelCallAbstractMediaStreamSpan { this.span = oTel.tracer.startSpan(this.type, options, ctx); } - protected upsertTrackSpans(tracks: TrackStats[]) { + protected upsertTrackSpans(tracks: TrackStats[]): void { let prvTracks: TrackId[] = [...this.trackSpans.keys()]; tracks.forEach((t) => { if (!this.trackSpans.has(t.id)) { diff --git a/src/otel/OTelCallFeedMediaStreamSpan.ts b/src/otel/OTelCallFeedMediaStreamSpan.ts index 6023fa65..e3f0a2f7 100644 --- a/src/otel/OTelCallFeedMediaStreamSpan.ts +++ b/src/otel/OTelCallFeedMediaStreamSpan.ts @@ -1,3 +1,19 @@ +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + import { Span } from "@opentelemetry/api"; import { CallFeedStats, @@ -10,9 +26,9 @@ import { OTelCallAbstractMediaStreamSpan } from "./OTelCallAbstractMediaStreamSp export class OTelCallFeedMediaStreamSpan extends OTelCallAbstractMediaStreamSpan { private readonly prev: { isAudioMuted: boolean; isVideoMuted: boolean }; - constructor( - readonly oTel: ElementCallOpenTelemetry, - readonly callSpan: Span, + public constructor( + protected readonly oTel: ElementCallOpenTelemetry, + protected readonly callSpan: Span, callFeed: CallFeedStats ) { const postFix = diff --git a/src/otel/OTelCallMediaStreamTrackSpan.ts b/src/otel/OTelCallMediaStreamTrackSpan.ts index 935e22fc..9351f723 100644 --- a/src/otel/OTelCallMediaStreamTrackSpan.ts +++ b/src/otel/OTelCallMediaStreamTrackSpan.ts @@ -1,3 +1,19 @@ +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + import { TrackStats } from "matrix-js-sdk/src/webrtc/stats/statsReport"; import opentelemetry, { Span } from "@opentelemetry/api"; @@ -8,8 +24,8 @@ export class OTelCallMediaStreamTrackSpan { private prev: TrackStats; public constructor( - readonly oTel: ElementCallOpenTelemetry, - readonly streamSpan: Span, + protected readonly oTel: ElementCallOpenTelemetry, + protected readonly streamSpan: Span, data: TrackStats ) { const ctx = opentelemetry.trace.setSpan( diff --git a/src/otel/OTelCallTransceiverMediaStreamSpan.ts b/src/otel/OTelCallTransceiverMediaStreamSpan.ts index 97006cd8..7aeb3d6e 100644 --- a/src/otel/OTelCallTransceiverMediaStreamSpan.ts +++ b/src/otel/OTelCallTransceiverMediaStreamSpan.ts @@ -1,3 +1,19 @@ +/* +Copyright 2023 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + import { Span } from "@opentelemetry/api"; import { TrackStats, @@ -13,9 +29,9 @@ export class OTelCallTransceiverMediaStreamSpan extends OTelCallAbstractMediaStr currentDirection: string; }; - constructor( - readonly oTel: ElementCallOpenTelemetry, - readonly callSpan: Span, + public constructor( + protected readonly oTel: ElementCallOpenTelemetry, + protected readonly callSpan: Span, stats: TransceiverStats ) { super(oTel, callSpan, `matrix.call.transceiver.${stats.mid}`); diff --git a/src/otel/OTelGroupCallMembership.ts b/src/otel/OTelGroupCallMembership.ts index b60d5aa9..777aa5f6 100644 --- a/src/otel/OTelGroupCallMembership.ts +++ b/src/otel/OTelGroupCallMembership.ts @@ -62,7 +62,7 @@ export class OTelGroupCallMembership { }; private readonly speakingSpans = new Map>(); - constructor(private groupCall: GroupCall, client: MatrixClient) { + public constructor(private groupCall: GroupCall, client: MatrixClient) { const clientId = client.getUserId(); if (clientId) { this.myUserId = clientId; @@ -76,14 +76,14 @@ export class OTelGroupCallMembership { this.groupCall.on(GroupCallEvent.CallsChanged, this.onCallsChanged); } - dispose() { + public dispose(): void { this.groupCall.removeListener( GroupCallEvent.CallsChanged, this.onCallsChanged ); } - public onJoinCall() { + public onJoinCall(): void { if (!ElementCallOpenTelemetry.instance) return; if (this.callMembershipSpan !== undefined) { logger.warn("Call membership span is already started"); @@ -114,7 +114,7 @@ export class OTelGroupCallMembership { this.callMembershipSpan?.addEvent("matrix.joinCall"); } - public onLeaveCall() { + public onLeaveCall(): void { if (this.callMembershipSpan === undefined) { logger.warn("Call membership span is already ended"); return; @@ -127,7 +127,7 @@ export class OTelGroupCallMembership { this.groupCallContext = undefined; } - public onUpdateRoomState(event: MatrixEvent) { + public onUpdateRoomState(event: MatrixEvent): void { if ( !event || (!event.getType().startsWith("m.call") && @@ -142,7 +142,7 @@ export class OTelGroupCallMembership { ); } - public onCallsChanged = (calls: CallsByUserAndDevice) => { + public onCallsChanged(calls: CallsByUserAndDevice): void { for (const [userId, userCalls] of calls.entries()) { for (const [deviceId, call] of userCalls.entries()) { if (!this.callsByCallId.has(call.callId)) { @@ -179,9 +179,9 @@ export class OTelGroupCallMembership { this.callsByCallId.delete(callTrackingInfo.call.callId); } } - }; + } - public onCallStateChange(call: MatrixCall, newState: CallState) { + public onCallStateChange(call: MatrixCall, newState: CallState): void { const callTrackingInfo = this.callsByCallId.get(call.callId); if (!callTrackingInfo) { logger.error(`Got call state change for unknown call ID ${call.callId}`); @@ -193,7 +193,7 @@ export class OTelGroupCallMembership { }); } - public onSendEvent(call: MatrixCall, event: VoipEvent) { + public onSendEvent(call: MatrixCall, event: VoipEvent): void { const eventType = event.eventType as string; if ( !eventType.startsWith("m.call") && @@ -220,7 +220,7 @@ export class OTelGroupCallMembership { } } - public onReceivedVoipEvent(event: MatrixEvent) { + public onReceivedVoipEvent(event: MatrixEvent): void { // These come straight from CallEventHandler so don't have // a call already associated (in principle we could receive // events for calls we don't know about). @@ -251,37 +251,41 @@ export class OTelGroupCallMembership { }); } - public onToggleMicrophoneMuted(newValue: boolean) { + public onToggleMicrophoneMuted(newValue: boolean): void { this.callMembershipSpan?.addEvent("matrix.toggleMicMuted", { "matrix.microphone.muted": newValue, }); } - public onSetMicrophoneMuted(setMuted: boolean) { + public onSetMicrophoneMuted(setMuted: boolean): void { this.callMembershipSpan?.addEvent("matrix.setMicMuted", { "matrix.microphone.muted": setMuted, }); } - public onToggleLocalVideoMuted(newValue: boolean) { + public onToggleLocalVideoMuted(newValue: boolean): void { this.callMembershipSpan?.addEvent("matrix.toggleVidMuted", { "matrix.video.muted": newValue, }); } - public onSetLocalVideoMuted(setMuted: boolean) { + public onSetLocalVideoMuted(setMuted: boolean): void { this.callMembershipSpan?.addEvent("matrix.setVidMuted", { "matrix.video.muted": setMuted, }); } - public onToggleScreensharing(newValue: boolean) { + public onToggleScreensharing(newValue: boolean): void { this.callMembershipSpan?.addEvent("matrix.setVidMuted", { "matrix.screensharing.enabled": newValue, }); } - public onSpeaking(member: RoomMember, deviceId: string, speaking: boolean) { + public onSpeaking( + member: RoomMember, + deviceId: string, + speaking: boolean + ): void { if (speaking) { // Ensure that there's an audio activity span for this speaker let deviceMap = this.speakingSpans.get(member); @@ -311,7 +315,7 @@ export class OTelGroupCallMembership { } } - public onCallError(error: CallError, call: MatrixCall) { + public onCallError(error: CallError, call: MatrixCall): void { const callTrackingInfo = this.callsByCallId.get(call.callId); if (!callTrackingInfo) { logger.error(`Got error for unknown call ID ${call.callId}`); @@ -321,17 +325,19 @@ export class OTelGroupCallMembership { callTrackingInfo.span.recordException(error); } - public onGroupCallError(error: GroupCallError) { + public onGroupCallError(error: GroupCallError): void { this.callMembershipSpan?.recordException(error); } - public onUndecryptableToDevice(event: MatrixEvent) { + public onUndecryptableToDevice(event: MatrixEvent): void { this.callMembershipSpan?.addEvent("matrix.toDevice.undecryptable", { "sender.userId": event.getSender(), }); } - public onCallFeedStatsReport(report: GroupCallStatsReport) { + public onCallFeedStatsReport( + report: GroupCallStatsReport + ): void { if (!ElementCallOpenTelemetry.instance) return; let call: OTelCall | undefined; const callId = report.report?.callId; @@ -362,7 +368,7 @@ export class OTelGroupCallMembership { public onConnectionStatsReport( statsReport: GroupCallStatsReport - ) { + ): void { this.buildCallStatsSpan( OTelStatsReportType.ConnectionReport, statsReport.report @@ -371,7 +377,7 @@ export class OTelGroupCallMembership { public onByteSentStatsReport( statsReport: GroupCallStatsReport - ) { + ): void { this.buildCallStatsSpan( OTelStatsReportType.ByteSentReport, statsReport.report @@ -431,7 +437,7 @@ export class OTelGroupCallMembership { public onSummaryStatsReport( statsReport: GroupCallStatsReport - ) { + ): void { if (!ElementCallOpenTelemetry.instance) return; const type = OTelStatsReportType.SummaryReport; diff --git a/src/otel/ObjectFlattener.ts b/src/otel/ObjectFlattener.ts index 652f9056..715517d2 100644 --- a/src/otel/ObjectFlattener.ts +++ b/src/otel/ObjectFlattener.ts @@ -45,9 +45,9 @@ export class ObjectFlattener { return flatObject; } - static flattenSummaryStatsReportObject( + public static flattenSummaryStatsReportObject( statsReport: GroupCallStatsReport - ) { + ): Attributes { const flatObject = {}; ObjectFlattener.flattenObjectRecursive( statsReport.report, diff --git a/src/otel/otel.ts b/src/otel/otel.ts index d4629591..c6a1b971 100644 --- a/src/otel/otel.ts +++ b/src/otel/otel.ts @@ -36,7 +36,7 @@ export class ElementCallOpenTelemetry { private otlpExporter?: OTLPTraceExporter; public readonly rageshakeProcessor?: RageshakeSpanProcessor; - static globalInit(): void { + public static globalInit(): void { const config = Config.get(); // we always enable opentelemetry in general. We only enable the OTLP // collector if a URL is defined (and in future if another setting is defined) @@ -55,11 +55,11 @@ export class ElementCallOpenTelemetry { } } - static get instance(): ElementCallOpenTelemetry { + public static get instance(): ElementCallOpenTelemetry { return sharedInstance; } - constructor( + private constructor( collectorUrl: string | undefined, rageshakeUrl: string | undefined ) { diff --git a/src/profile/useProfile.ts b/src/profile/useProfile.ts index 2281bb1e..571c3835 100644 --- a/src/profile/useProfile.ts +++ b/src/profile/useProfile.ts @@ -38,7 +38,11 @@ type ProfileSaveCallback = ({ removeAvatar: boolean; }) => Promise; -export function useProfile(client: MatrixClient | undefined) { +interface UseProfile extends ProfileLoadState { + saveProfile: ProfileSaveCallback; +} + +export function useProfile(client: MatrixClient | undefined): UseProfile { const [{ success, loading, displayName, avatarUrl, error }, setState] = useState(() => { let user: User | undefined = undefined; @@ -59,7 +63,7 @@ export function useProfile(client: MatrixClient | undefined) { const onChangeUser = ( _event: MatrixEvent | undefined, { displayName, avatarUrl }: User - ) => { + ): void => { setState({ success: false, loading: false, diff --git a/src/room/CallEndedView.tsx b/src/room/CallEndedView.tsx index 6050b9e9..72567618 100644 --- a/src/room/CallEndedView.tsx +++ b/src/room/CallEndedView.tsx @@ -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 = ({
); - const renderBody = () => { + const renderBody = (): ReactNode => { if (leaveError) { return ( <> diff --git a/src/room/GroupCallInspector.tsx b/src/room/GroupCallInspector.tsx index d3df2c5b..68f27add 100644 --- a/src/room/GroupCallInspector.tsx +++ b/src/room/GroupCallInspector.tsx @@ -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>] >(undefined); -export function InspectorContextProvider({ +export const InspectorContextProvider: FC> = ({ 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} ); -} +}; type CallEventContent = { ["m.calls"]: { @@ -192,13 +191,13 @@ interface SequenceDiagramViewerProps { events: SequenceDiagramMatrixEvent[]; } -export function SequenceDiagramViewer({ +export const SequenceDiagramViewer: FC = ({ localUserId, remoteUserIds, selectedUserId, onSelectUserId, events, -}: SequenceDiagramViewerProps) { +}) => { const mermaidElRef = useRef(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) => ( {userId} @@ -243,7 +242,7 @@ export function SequenceDiagramViewer({ ); -} +}; 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 = ({ client, groupCall, otelGroupCallMembership, show, -}: GroupCallInspectorProps) { +}) => { const [currentTab, setCurrentTab] = useState("sequence-diagrams"); const [selectedUserId, setSelectedUserId] = useState(); const state = useGroupCallState(client, groupCall, otelGroupCallMembership); @@ -506,10 +505,12 @@ export function GroupCallInspector({ className={styles.inspector} >
- - +
{currentTab === "sequence-diagrams" && state.localUserId && @@ -539,4 +540,4 @@ export function GroupCallInspector({ )} ); -} +}; diff --git a/src/room/GroupCallView.tsx b/src/room/GroupCallView.tsx index ab96926a..2c409e5f 100644 --- a/src/room/GroupCallView.tsx +++ b/src/room/GroupCallView.tsx @@ -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 = ({ 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) => { + const onJoin = async ( + ev: CustomEvent + ): Promise => { // 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) => { + const onHangup = async ( + ev: CustomEvent + ): Promise => { 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({ ); } -} +}; diff --git a/src/room/InCallView.tsx b/src/room/InCallView.tsx index 707eb5d8..979aa2e6 100644 --- a/src/room/InCallView.tsx +++ b/src/room/InCallView.tsx @@ -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 = (props) => { const sfuConfig = useOpenIDSFU(props.client, props.rtcSession); const { livekitRoom, connState } = useLiveKit( props.muteStates, @@ -112,7 +121,7 @@ export function ActiveCall(props: ActiveCallProps) { ); -} +}; export interface InCallViewProps { client: MatrixClient; @@ -128,7 +137,7 @@ export interface InCallViewProps { onShareClick: (() => void) | null; } -export function InCallView({ +export const InCallView: FC = ({ 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) => { + const onTileLayout = (ev: CustomEvent): void => { setLayout("grid"); - await widget!.api.transport.reply(ev.detail, {}); + widget!.api.transport.reply(ev.detail, {}); }; - const onSpotlightLayout = async (ev: CustomEvent) => { + const onSpotlightLayout = (ev: CustomEvent): 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 => ( ); -} +}; function findMatrixMember( room: MatrixRoom, diff --git a/src/room/RageshakeRequestModal.tsx b/src/room/RageshakeRequestModal.tsx index ed9acbcb..74debd34 100644 --- a/src/room/RageshakeRequestModal.tsx +++ b/src/room/RageshakeRequestModal.tsx @@ -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 = ({ ); - } + }, ); export const MicButton: FC<{ diff --git a/src/button/LinkButton.tsx b/src/button/LinkButton.tsx index 2a94b150..eb30441c 100644 --- a/src/button/LinkButton.tsx +++ b/src/button/LinkButton.tsx @@ -47,7 +47,7 @@ export const LinkButton: FC = ({ className={classNames( variantToClassName[variant || "secondary"], size ? sizeToClassName[size] : [], - className + className, )} to={to} {...rest} diff --git a/src/config/Config.ts b/src/config/Config.ts index f414c58b..0930af49 100644 --- a/src/config/Config.ts +++ b/src/config/Config.ts @@ -57,7 +57,7 @@ export class Config { } async function downloadConfig( - configJsonFilename: string + configJsonFilename: string, ): Promise { const url = new URL(configJsonFilename, window.location.href); url.searchParams.set("cachebuster", Date.now().toString()); diff --git a/src/e2ee/sharedKeyManagement.ts b/src/e2ee/sharedKeyManagement.ts index 06183878..21c54481 100644 --- a/src/e2ee/sharedKeyManagement.ts +++ b/src/e2ee/sharedKeyManagement.ts @@ -26,7 +26,7 @@ export const getRoomSharedKeyLocalStorageKey = (roomId: string): string => `room-shared-key-${roomId}`; const useInternalRoomSharedKey = ( - roomId: string + roomId: string, ): [string | null, (value: string) => void] => { const key = useMemo(() => getRoomSharedKeyLocalStorageKey(roomId), [roomId]); const [e2eeEnabled] = useEnableE2EE(); @@ -68,6 +68,6 @@ export const useIsRoomE2EE = (roomId: string): boolean | null => { // should inspect the e2eEnabled URL parameter here? return useMemo( () => widget === null && (room === null || !room.getCanonicalAlias()), - [room] + [room], ); }; diff --git a/src/form/Form.tsx b/src/form/Form.tsx index 54961791..1f66ac1a 100644 --- a/src/form/Form.tsx +++ b/src/form/Form.tsx @@ -36,5 +36,5 @@ export const Form = forwardRef( {children} ); - } + }, ); diff --git a/src/home/CallList.tsx b/src/home/CallList.tsx index 227ea535..187228b9 100644 --- a/src/home/CallList.tsx +++ b/src/home/CallList.tsx @@ -74,7 +74,7 @@ const CallTile: FC = ({ name, avatarUrl, room }) => { to={getRelativeRoomUrl( room.roomId, room.name, - roomSharedKey ?? undefined + roomSharedKey ?? undefined, )} className={styles.callTileLink} > @@ -92,7 +92,7 @@ const CallTile: FC = ({ name, avatarUrl, room }) => { value={getAbsoluteRoomUrl( room.roomId, room.name, - roomSharedKey ?? undefined + roomSharedKey ?? undefined, )} /> diff --git a/src/home/RegisteredView.tsx b/src/home/RegisteredView.tsx index d4ada1e4..4a130899 100644 --- a/src/home/RegisteredView.tsx +++ b/src/home/RegisteredView.tsx @@ -56,7 +56,7 @@ export const RegisteredView: FC = ({ client }) => { useState(false); const onDismissJoinExistingCallModal = useCallback( () => setJoinExistingCallModalOpen(false), - [setJoinExistingCallModalOpen] + [setJoinExistingCallModalOpen], ); const [e2eeEnabled] = useEnableE2EE(); @@ -77,15 +77,15 @@ export const RegisteredView: FC = ({ client }) => { const createRoomResult = await createRoom( client, roomName, - e2eeEnabled ?? false + e2eeEnabled ?? false, ); history.push( getRelativeRoomUrl( createRoomResult.roomId, roomName, - createRoomResult.password - ) + createRoomResult.password, + ), ); } @@ -102,7 +102,7 @@ export const RegisteredView: FC = ({ client }) => { } }); }, - [client, history, setJoinExistingCallModalOpen, e2eeEnabled] + [client, history, setJoinExistingCallModalOpen, e2eeEnabled], ); const recentRooms = useGroupCallRooms(client); diff --git a/src/home/UnauthenticatedView.tsx b/src/home/UnauthenticatedView.tsx index a0914ca7..beb419db 100644 --- a/src/home/UnauthenticatedView.tsx +++ b/src/home/UnauthenticatedView.tsx @@ -57,7 +57,7 @@ export const UnauthenticatedView: FC = () => { useState(false); const onDismissJoinExistingCallModal = useCallback( () => setJoinExistingCallModalOpen(false), - [setJoinExistingCallModalOpen] + [setJoinExistingCallModalOpen], ); const [onFinished, setOnFinished] = useState<() => void>(); const history = useHistory(); @@ -82,7 +82,7 @@ export const UnauthenticatedView: FC = () => { randomString(16), displayName, recaptchaResponse, - true + true, ); let createRoomResult; @@ -90,7 +90,7 @@ export const UnauthenticatedView: FC = () => { createRoomResult = await createRoom( client, roomName, - e2eeEnabled ?? false + e2eeEnabled ?? false, ); } catch (error) { if (!setClient) { @@ -124,8 +124,8 @@ export const UnauthenticatedView: FC = () => { getRelativeRoomUrl( createRoomResult.roomId, roomName, - createRoomResult.password - ) + createRoomResult.password, + ), ); } @@ -144,7 +144,7 @@ export const UnauthenticatedView: FC = () => { setJoinExistingCallModalOpen, setClient, e2eeEnabled, - ] + ], ); return ( diff --git a/src/home/useGroupCallRooms.ts b/src/home/useGroupCallRooms.ts index 6e50dda0..77572ad6 100644 --- a/src/home/useGroupCallRooms.ts +++ b/src/home/useGroupCallRooms.ts @@ -47,7 +47,7 @@ function getLastTs(client: MatrixClient, r: Room): number { if (r.getMyMembership() !== "join") { const membershipEvent = r.currentState.getStateEvents( "m.room.member", - myUserId + myUserId, ); if (membershipEvent && !Array.isArray(membershipEvent)) { @@ -115,7 +115,7 @@ export function useGroupCallRooms(client: MatrixClient): GroupCallRoom[] { client.removeListener(GroupCallEventHandlerEvent.Incoming, updateRooms); client.removeListener( GroupCallEventHandlerEvent.Participants, - updateRooms + updateRooms, ); }; }, [client]); diff --git a/src/index.css b/src/index.css index d9f7d052..f647e87c 100644 --- a/src/index.css +++ b/src/index.css @@ -68,7 +68,8 @@ limitations under the License. font-weight: 400; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-Regular.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-Regular.woff2") format("woff2"), url("/fonts/Inter/Inter-Regular.woff") format("woff"); } @@ -78,7 +79,8 @@ limitations under the License. font-weight: 400; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-Italic.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-Italic.woff2") format("woff2"), url("/fonts/Inter/Inter-Italic.woff") format("woff"); } @@ -88,7 +90,8 @@ limitations under the License. font-weight: 500; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-Medium.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-Medium.woff2") format("woff2"), url("/fonts/Inter/Inter-Medium.woff") format("woff"); } @@ -98,7 +101,8 @@ limitations under the License. font-weight: 500; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-MediumItalic.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-MediumItalic.woff2") format("woff2"), url("/fonts/Inter/Inter-MediumItalic.woff") format("woff"); } @@ -108,7 +112,8 @@ limitations under the License. font-weight: 600; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-SemiBold.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-SemiBold.woff2") format("woff2"), url("/fonts/Inter/Inter-SemiBold.woff") format("woff"); } @@ -118,7 +123,8 @@ limitations under the License. font-weight: 600; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-SemiBoldItalic.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-SemiBoldItalic.woff2") format("woff2"), url("/fonts/Inter/Inter-SemiBoldItalic.woff") format("woff"); } @@ -128,7 +134,8 @@ limitations under the License. font-weight: 700; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-Bold.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-Bold.woff2") format("woff2"), url("/fonts/Inter/Inter-Bold.woff") format("woff"); } @@ -138,7 +145,8 @@ limitations under the License. font-weight: 700; font-display: swap; unicode-range: var(--inter-unicode-range); - src: url("/fonts/Inter/Inter-BoldItalic.woff2") format("woff2"), + src: + url("/fonts/Inter/Inter-BoldItalic.woff2") format("woff2"), url("/fonts/Inter/Inter-BoldItalic.woff") format("woff"); } diff --git a/src/initializer.tsx b/src/initializer.tsx index d2bbb076..57000936 100644 --- a/src/initializer.tsx +++ b/src/initializer.tsx @@ -99,13 +99,13 @@ export class Initializer { if (fontScale !== null) { document.documentElement.style.setProperty( "--font-scale", - fontScale.toString() + fontScale.toString(), ); } if (fonts.length > 0) { document.documentElement.style.setProperty( "--font-family", - fonts.map((f) => `"${f}"`).join(", ") + fonts.map((f) => `"${f}"`).join(", "), ); } diff --git a/src/input/AvatarInputField.tsx b/src/input/AvatarInputField.tsx index 5e6198d4..266f2717 100644 --- a/src/input/AvatarInputField.tsx +++ b/src/input/AvatarInputField.tsx @@ -52,7 +52,7 @@ export const AvatarInputField = forwardRef( onRemoveAvatar, ...rest }, - ref + ref, ) => { const { t } = useTranslation(); @@ -120,5 +120,5 @@ export const AvatarInputField = forwardRef( )} ); - } + }, ); diff --git a/src/input/Input.module.css b/src/input/Input.module.css index dc1bde19..b81a903f 100644 --- a/src/input/Input.module.css +++ b/src/input/Input.module.css @@ -85,8 +85,11 @@ limitations under the License. } .inputField label { - transition: font-size 0.25s ease-out 0.1s, color 0.25s ease-out 0.1s, - top 0.25s ease-out 0.1s, background-color 0.25s ease-out 0.1s; + transition: + font-size 0.25s ease-out 0.1s, + color 0.25s ease-out 0.1s, + top 0.25s ease-out 0.1s, + background-color 0.25s ease-out 0.1s; color: var(--cpd-color-text-secondary); background-color: transparent; font-size: var(--font-size-body); @@ -118,8 +121,11 @@ limitations under the License. .inputField textarea:not(:placeholder-shown) + label, .inputField.prefix textarea + label { background-color: var(--cpd-color-bg-canvas-default); - transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s, - top 0.25s ease-out 0s, background-color 0.25s ease-out 0s; + transition: + font-size 0.25s ease-out 0s, + color 0.25s ease-out 0s, + top 0.25s ease-out 0s, + background-color 0.25s ease-out 0s; font-size: var(--font-size-micro); top: -13px; padding: 0 2px; diff --git a/src/input/Input.tsx b/src/input/Input.tsx index b6826681..24bea83f 100644 --- a/src/input/Input.tsx +++ b/src/input/Input.tsx @@ -44,7 +44,7 @@ export function FieldRow({ className={classNames( styles.fieldRow, { [styles.rightAlign]: rightAlign }, - className + className, )} > {children} @@ -102,7 +102,7 @@ export const InputField = forwardRef< disabled, ...rest }, - ref + ref, ) => { const descriptionId = useId(); @@ -114,7 +114,7 @@ export const InputField = forwardRef< [styles.prefix]: !!prefix, [styles.disabled]: disabled, }, - className + className, )} > {prefix && {prefix}} @@ -163,7 +163,7 @@ export const InputField = forwardRef< )} ); - } + }, ); interface ErrorMessageProps { diff --git a/src/input/SelectInput.tsx b/src/input/SelectInput.tsx index 0feb346e..f0817582 100644 --- a/src/input/SelectInput.tsx +++ b/src/input/SelectInput.tsx @@ -38,7 +38,7 @@ export function SelectInput(props: Props): JSX.Element { const { labelProps, triggerProps, valueProps, menuProps } = useSelect( props, state, - ref + ref, ); const { buttonProps } = useButton(triggerProps, ref); diff --git a/src/livekit/MediaDevicesContext.tsx b/src/livekit/MediaDevicesContext.tsx index ddd23b9d..df5b3fd9 100644 --- a/src/livekit/MediaDevicesContext.tsx +++ b/src/livekit/MediaDevicesContext.tsx @@ -51,7 +51,7 @@ export interface MediaDevices { // Cargo-culted from @livekit/components-react function useObservableState( observable: Observable | undefined, - startWith: T + startWith: T, ): T { const [state, setState] = useState(startWith); useEffect(() => { @@ -67,7 +67,7 @@ function useMediaDevice( kind: MediaDeviceKind, fallbackDevice: string | undefined, usingNames: boolean, - alwaysDefault: boolean = false + alwaysDefault: boolean = false, ): MediaDevice { // Make sure we don't needlessly reset to a device observer without names, // once permissions are already given @@ -83,7 +83,7 @@ function useMediaDevice( // kind, which then results in multiple permissions requests. const deviceObserver = useMemo( () => createMediaDeviceObserver(kind, requestPermissions), - [kind, requestPermissions] + [kind, requestPermissions], ); const available = useObservableState(deviceObserver, []); const [selectedId, select] = useState(fallbackDevice); @@ -143,18 +143,18 @@ export const MediaDevicesProvider: FC = ({ children }) => { const audioInput = useMediaDevice( "audioinput", audioInputSetting, - usingNames + usingNames, ); const audioOutput = useMediaDevice( "audiooutput", audioOutputSetting, useOutputNames, - alwaysUseDefaultAudio + alwaysUseDefaultAudio, ); const videoInput = useMediaDevice( "videoinput", videoInputSetting, - usingNames + usingNames, ); useEffect(() => { @@ -176,11 +176,11 @@ export const MediaDevicesProvider: FC = ({ children }) => { const startUsingDeviceNames = useCallback( () => setNumCallersUsingNames((n) => n + 1), - [setNumCallersUsingNames] + [setNumCallersUsingNames], ); const stopUsingDeviceNames = useCallback( () => setNumCallersUsingNames((n) => n - 1), - [setNumCallersUsingNames] + [setNumCallersUsingNames], ); const context: MediaDevices = useMemo( @@ -197,7 +197,7 @@ export const MediaDevicesProvider: FC = ({ children }) => { videoInput, startUsingDeviceNames, stopUsingDeviceNames, - ] + ], ); return ( @@ -218,7 +218,7 @@ export const useMediaDevices = (): MediaDevices => */ export const useMediaDeviceNames = ( context: MediaDevices, - enabled = true + enabled = true, ): void => useEffect(() => { if (enabled) { diff --git a/src/livekit/openIDSFU.ts b/src/livekit/openIDSFU.ts index 3e6779f5..8b447485 100644 --- a/src/livekit/openIDSFU.ts +++ b/src/livekit/openIDSFU.ts @@ -42,7 +42,7 @@ export type OpenIDClientParts = Pick< export function useOpenIDSFU( client: OpenIDClientParts, - rtcSession: MatrixRTCSession + rtcSession: MatrixRTCSession, ): SFUConfig | undefined { const [sfuConfig, setSFUConfig] = useState(undefined); @@ -62,20 +62,20 @@ export function useOpenIDSFU( export async function getSFUConfigWithOpenID( client: OpenIDClientParts, - activeFocus: LivekitFocus + activeFocus: LivekitFocus, ): Promise { const openIdToken = await client.getOpenIdToken(); logger.debug("Got openID token", openIdToken); try { logger.info( - `Trying to get JWT from call's active focus URL of ${activeFocus.livekit_service_url}...` + `Trying to get JWT from call's active focus URL of ${activeFocus.livekit_service_url}...`, ); const sfuConfig = await getLiveKitJWT( client, activeFocus.livekit_service_url, activeFocus.livekit_alias, - openIdToken + openIdToken, ); logger.info(`Got JWT from call's active focus URL.`); @@ -83,7 +83,7 @@ export async function getSFUConfigWithOpenID( } catch (e) { logger.warn( `Failed to get JWT from RTC session's active focus URL of ${activeFocus.livekit_service_url}.`, - e + e, ); return undefined; } @@ -93,7 +93,7 @@ async function getLiveKitJWT( client: OpenIDClientParts, livekitServiceURL: string, roomName: string, - openIDToken: IOpenIDToken + openIDToken: IOpenIDToken, ): Promise { try { const res = await fetch(livekitServiceURL + "/sfu/get", { diff --git a/src/livekit/useECConnectionState.ts b/src/livekit/useECConnectionState.ts index 8e0d44ac..0b18cd10 100644 --- a/src/livekit/useECConnectionState.ts +++ b/src/livekit/useECConnectionState.ts @@ -51,7 +51,7 @@ async function doConnect( livekitRoom: Room, sfuConfig: SFUConfig, audioEnabled: boolean, - audioOptions: AudioCaptureOptions + audioOptions: AudioCaptureOptions, ): Promise { await livekitRoom!.connect(sfuConfig!.url, sfuConfig!.jwt); @@ -76,12 +76,12 @@ export function useECConnectionState( initialAudioOptions: AudioCaptureOptions, initialAudioEnabled: boolean, livekitRoom?: Room, - sfuConfig?: SFUConfig + sfuConfig?: SFUConfig, ): ECConnectionState { const [connState, setConnState] = useState( sfuConfig && livekitRoom ? livekitRoom.state - : ECAddonConnectionState.ECWaiting + : ECAddonConnectionState.ECWaiting, ); const [isSwitchingFocus, setSwitchingFocus] = useState(false); @@ -116,7 +116,7 @@ export function useECConnectionState( !sfuConfigEquals(currentSFUConfig.current, sfuConfig) ) { logger.info( - `SFU config changed! URL was ${currentSFUConfig.current?.url} now ${sfuConfig?.url}` + `SFU config changed! URL was ${currentSFUConfig.current?.url} now ${sfuConfig?.url}`, ); (async (): Promise => { @@ -128,7 +128,7 @@ export function useECConnectionState( livekitRoom!, sfuConfig!, initialAudioEnabled, - initialAudioOptions + initialAudioOptions, ); } finally { setIsInDoConnect(false); @@ -149,7 +149,7 @@ export function useECConnectionState( livekitRoom!, sfuConfig!, initialAudioEnabled, - initialAudioOptions + initialAudioOptions, ).finally(() => setIsInDoConnect(false)); } diff --git a/src/livekit/useLiveKit.ts b/src/livekit/useLiveKit.ts index 7c2812d8..c8a5e401 100644 --- a/src/livekit/useLiveKit.ts +++ b/src/livekit/useLiveKit.ts @@ -52,7 +52,7 @@ interface UseLivekitResult { export function useLiveKit( muteStates: MuteStates, sfuConfig?: SFUConfig, - e2eeConfig?: E2EEConfig + e2eeConfig?: E2EEConfig, ): UseLivekitResult { const e2eeOptions = useMemo(() => { if (!e2eeConfig?.sharedKey) return undefined; @@ -67,7 +67,7 @@ export function useLiveKit( if (!e2eeConfig?.sharedKey || !e2eeOptions) return; (e2eeOptions.keyProvider as ExternalE2EEKeyProvider).setKey( - e2eeConfig?.sharedKey + e2eeConfig?.sharedKey, ); }, [e2eeOptions, e2eeConfig?.sharedKey]); @@ -93,7 +93,7 @@ export function useLiveKit( }, e2ee: e2eeOptions, }), - [e2eeOptions] + [e2eeOptions], ); // useECConnectionState creates and publishes an audio track by hand. To keep @@ -131,7 +131,7 @@ export function useLiveKit( }, initialMuteStates.current.audio.enabled, room, - sfuConfig + sfuConfig, ); // Unblock audio once the connection is finished @@ -215,11 +215,11 @@ export function useLiveKit( room.options.audioCaptureDefaults?.deviceId === "default" ) { const activeMicTrack = Array.from( - room.localParticipant.audioTracks.values() + room.localParticipant.audioTracks.values(), ).find((d) => d.source === Track.Source.Microphone)?.track; const defaultDevice = device.available.find( - (d) => d.deviceId === "default" + (d) => d.deviceId === "default", ); if ( defaultDevice && @@ -245,7 +245,7 @@ export function useLiveKit( room .switchActiveDevice(kind, id) .catch((e) => - logger.error(`Failed to sync ${kind} device with LiveKit`, e) + logger.error(`Failed to sync ${kind} device with LiveKit`, e), ); } } diff --git a/src/main.tsx b/src/main.tsx index e7ef9776..ed64a09c 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -48,7 +48,7 @@ if (!window.isSecureContext) { fatalError = new Error( "This app cannot run in an insecure context. To fix this, access the app " + "via a local loopback address, or serve it over HTTPS.\n" + - "https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts" + "https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts", ); } else if (!navigator.mediaDevices) { fatalError = new Error("Your browser does not support WebRTC."); @@ -66,5 +66,5 @@ const history = createBrowserHistory(); root.render( - + , ); diff --git a/src/matrix-utils.ts b/src/matrix-utils.ts index 48aa8b7a..52c55959 100644 --- a/src/matrix-utils.ts +++ b/src/matrix-utils.ts @@ -59,7 +59,7 @@ function waitForSync(client: MatrixClient): Promise { const onSync = ( state: SyncState, _old: SyncState | null, - data?: ISyncStateData + data?: ISyncStateData, ): void => { if (state === "PREPARED") { client.removeListener(ClientEvent.Sync, onSync); @@ -83,7 +83,7 @@ function secureRandomString(entropyBytes: number): string { // yet) so just use the built-in one and convert, replace the chars and strip the // padding from the end (otherwise we'd need to pull in another dependency). return btoa( - key.reduce((acc, current) => acc + String.fromCharCode(current), "") + key.reduce((acc, current) => acc + String.fromCharCode(current), ""), ) .replace("+", "-") .replace("/", "_") @@ -101,7 +101,7 @@ function secureRandomString(entropyBytes: number): string { */ export async function initClient( clientOptions: ICreateClientOpts, - restore: boolean + restore: boolean, ): Promise { await loadOlm(); @@ -148,7 +148,7 @@ export async function initClient( if (indexedDB) { const cryptoStoreExists = await IndexedDBCryptoStore.exists( indexedDB, - CRYPTO_STORE_NAME + CRYPTO_STORE_NAME, ); if (!cryptoStoreExists) throw new CryptoStoreIntegrityError(); } else if (localStorage) { @@ -164,7 +164,7 @@ export async function initClient( if (indexedDB) { baseOpts.cryptoStore = new IndexedDBCryptoStore( indexedDB, - CRYPTO_STORE_NAME + CRYPTO_STORE_NAME, ); } else if (localStorage) { baseOpts.cryptoStore = new LocalStorageCryptoStore(localStorage); @@ -198,7 +198,7 @@ export async function initClient( } catch (error) { logger.error( "Error starting matrix client store. Falling back to memory store.", - error + error, ); client.store = new MemoryStore({ localStorage }); await client.store.startup(); @@ -268,7 +268,7 @@ export function roomNameFromRoomId(roomId: string): string { .substring(1) .split("-") .map((part) => - part.length > 0 ? part.charAt(0).toUpperCase() + part.slice(1) : part + part.length > 0 ? part.charAt(0).toUpperCase() + part.slice(1) : part, ) .join(" ") .toLowerCase(); @@ -297,7 +297,7 @@ interface CreateRoomResult { export async function createRoom( client: MatrixClient, name: string, - e2ee: boolean + e2ee: boolean, ): Promise { logger.log(`Creating room for group call`); const createPromise = client.createRoom({ @@ -358,7 +358,7 @@ export async function createRoom( GroupCallType.Video, false, GroupCallIntent.Room, - true + true, ); let password; @@ -366,7 +366,7 @@ export async function createRoom( password = secureRandomString(16); setLocalStorageItem( getRoomSharedKeyLocalStorageKey(result.room_id), - password + password, ); } @@ -386,7 +386,7 @@ export async function createRoom( export function getAbsoluteRoomUrl( roomId: string, roomName?: string, - password?: string + password?: string, ): string { return `${window.location.protocol}//${ window.location.host @@ -402,7 +402,7 @@ export function getAbsoluteRoomUrl( export function getRelativeRoomUrl( roomId: string, roomName?: string, - password?: string + password?: string, ): string { // The password shouldn't need URL encoding here (we generate URL-safe ones) but encode // it in case it came from another client that generated a non url-safe one @@ -419,7 +419,7 @@ export function getRelativeRoomUrl( export function getAvatarUrl( client: MatrixClient, mxcUrl: string, - avatarSize = 96 + avatarSize = 96, ): string { const width = Math.floor(avatarSize * window.devicePixelRatio); const height = Math.floor(avatarSize * window.devicePixelRatio); diff --git a/src/media-utils.ts b/src/media-utils.ts index ec829c76..74e5ca33 100644 --- a/src/media-utils.ts +++ b/src/media-utils.ts @@ -23,10 +23,10 @@ limitations under the License. export async function findDeviceByName( deviceName: string, kind: MediaDeviceKind, - devices: MediaDeviceInfo[] + devices: MediaDeviceInfo[], ): Promise { const deviceInfo = devices.find( - (d) => d.kind === kind && d.label === deviceName + (d) => d.kind === kind && d.label === deviceName, ); return deviceInfo?.deviceId; } diff --git a/src/otel/OTelCall.ts b/src/otel/OTelCall.ts index c050116e..13157763 100644 --- a/src/otel/OTelCall.ts +++ b/src/otel/OTelCall.ts @@ -48,14 +48,14 @@ export class OTelCall { public userId: string, public deviceId: string, public call: MatrixCall, - public span: Span + public span: Span, ) { if (call.peerConn) { this.addCallPeerConnListeners(); } else { this.call.once( CallEvent.PeerConnectionCreated, - this.addCallPeerConnListeners + this.addCallPeerConnListeners, ); } } @@ -63,46 +63,46 @@ export class OTelCall { public dispose(): void { this.call.peerConn?.removeEventListener( "connectionstatechange", - this.onCallConnectionStateChanged + this.onCallConnectionStateChanged, ); this.call.peerConn?.removeEventListener( "signalingstatechange", - this.onCallSignalingStateChanged + this.onCallSignalingStateChanged, ); this.call.peerConn?.removeEventListener( "iceconnectionstatechange", - this.onIceConnectionStateChanged + this.onIceConnectionStateChanged, ); this.call.peerConn?.removeEventListener( "icegatheringstatechange", - this.onIceGatheringStateChanged + this.onIceGatheringStateChanged, ); this.call.peerConn?.removeEventListener( "icecandidateerror", - this.onIceCandidateError + this.onIceCandidateError, ); } private addCallPeerConnListeners = (): void => { this.call.peerConn?.addEventListener( "connectionstatechange", - this.onCallConnectionStateChanged + this.onCallConnectionStateChanged, ); this.call.peerConn?.addEventListener( "signalingstatechange", - this.onCallSignalingStateChanged + this.onCallSignalingStateChanged, ); this.call.peerConn?.addEventListener( "iceconnectionstatechange", - this.onIceConnectionStateChanged + this.onIceConnectionStateChanged, ); this.call.peerConn?.addEventListener( "icegatheringstatechange", - this.onIceGatheringStateChanged + this.onIceGatheringStateChanged, ); this.call.peerConn?.addEventListener( "icecandidateerror", - this.onIceCandidateError + this.onIceCandidateError, ); }; @@ -147,8 +147,8 @@ export class OTelCall { new OTelCallFeedMediaStreamSpan( ElementCallOpenTelemetry.instance, this.span, - feed - ) + feed, + ), ); } this.trackFeedSpan.get(feed.stream)?.update(feed); @@ -171,13 +171,13 @@ export class OTelCall { new OTelCallTransceiverMediaStreamSpan( ElementCallOpenTelemetry.instance, this.span, - transStats - ) + transStats, + ), ); } this.trackTransceiverSpan.get(transStats.mid)?.update(transStats); prvTransSpan = prvTransSpan.filter( - (prvStreamId) => prvStreamId !== transStats.mid + (prvStreamId) => prvStreamId !== transStats.mid, ); }); @@ -190,7 +190,7 @@ export class OTelCall { public end(): void { this.trackFeedSpan.forEach((feedSpan) => feedSpan.end()); this.trackTransceiverSpan.forEach((transceiverSpan) => - transceiverSpan.end() + transceiverSpan.end(), ); this.span.end(); } diff --git a/src/otel/OTelCallAbstractMediaStreamSpan.ts b/src/otel/OTelCallAbstractMediaStreamSpan.ts index 66d9d7af..c34f963c 100644 --- a/src/otel/OTelCallAbstractMediaStreamSpan.ts +++ b/src/otel/OTelCallAbstractMediaStreamSpan.ts @@ -32,11 +32,11 @@ export abstract class OTelCallAbstractMediaStreamSpan { public constructor( protected readonly oTel: ElementCallOpenTelemetry, protected readonly callSpan: Span, - protected readonly type: string + protected readonly type: string, ) { const ctx = opentelemetry.trace.setSpan( opentelemetry.context.active(), - callSpan + callSpan, ); const options = { links: [ @@ -54,7 +54,7 @@ export abstract class OTelCallAbstractMediaStreamSpan { if (!this.trackSpans.has(t.id)) { this.trackSpans.set( t.id, - new OTelCallMediaStreamTrackSpan(this.oTel, this.span, t) + new OTelCallMediaStreamTrackSpan(this.oTel, this.span, t), ); } this.trackSpans.get(t.id)?.update(t); diff --git a/src/otel/OTelCallFeedMediaStreamSpan.ts b/src/otel/OTelCallFeedMediaStreamSpan.ts index e3f0a2f7..02dd2f86 100644 --- a/src/otel/OTelCallFeedMediaStreamSpan.ts +++ b/src/otel/OTelCallFeedMediaStreamSpan.ts @@ -29,7 +29,7 @@ export class OTelCallFeedMediaStreamSpan extends OTelCallAbstractMediaStreamSpan public constructor( protected readonly oTel: ElementCallOpenTelemetry, protected readonly callSpan: Span, - callFeed: CallFeedStats + callFeed: CallFeedStats, ) { const postFix = callFeed.type === "local" && callFeed.prefix === "from-call-feed" diff --git a/src/otel/OTelCallMediaStreamTrackSpan.ts b/src/otel/OTelCallMediaStreamTrackSpan.ts index 9351f723..72fee9b4 100644 --- a/src/otel/OTelCallMediaStreamTrackSpan.ts +++ b/src/otel/OTelCallMediaStreamTrackSpan.ts @@ -26,11 +26,11 @@ export class OTelCallMediaStreamTrackSpan { public constructor( protected readonly oTel: ElementCallOpenTelemetry, protected readonly streamSpan: Span, - data: TrackStats + data: TrackStats, ) { const ctx = opentelemetry.trace.setSpan( opentelemetry.context.active(), - streamSpan + streamSpan, ); const options = { links: [ diff --git a/src/otel/OTelCallTransceiverMediaStreamSpan.ts b/src/otel/OTelCallTransceiverMediaStreamSpan.ts index 7aeb3d6e..2be5dbe6 100644 --- a/src/otel/OTelCallTransceiverMediaStreamSpan.ts +++ b/src/otel/OTelCallTransceiverMediaStreamSpan.ts @@ -32,7 +32,7 @@ export class OTelCallTransceiverMediaStreamSpan extends OTelCallAbstractMediaStr public constructor( protected readonly oTel: ElementCallOpenTelemetry, protected readonly callSpan: Span, - stats: TransceiverStats + stats: TransceiverStats, ) { super(oTel, callSpan, `matrix.call.transceiver.${stats.mid}`); this.span.setAttribute("transceiver.mid", stats.mid); diff --git a/src/otel/OTelGroupCallMembership.ts b/src/otel/OTelGroupCallMembership.ts index 777aa5f6..b700e2bc 100644 --- a/src/otel/OTelGroupCallMembership.ts +++ b/src/otel/OTelGroupCallMembership.ts @@ -62,7 +62,10 @@ export class OTelGroupCallMembership { }; private readonly speakingSpans = new Map>(); - public constructor(private groupCall: GroupCall, client: MatrixClient) { + public constructor( + private groupCall: GroupCall, + client: MatrixClient, + ) { const clientId = client.getUserId(); if (clientId) { this.myUserId = clientId; @@ -79,7 +82,7 @@ export class OTelGroupCallMembership { public dispose(): void { this.groupCall.removeListener( GroupCallEvent.CallsChanged, - this.onCallsChanged + this.onCallsChanged, ); } @@ -93,22 +96,22 @@ export class OTelGroupCallMembership { // Create the main span that tracks the time we intend to be in the call this.callMembershipSpan = ElementCallOpenTelemetry.instance.tracer.startSpan( - "matrix.groupCallMembership" + "matrix.groupCallMembership", ); this.callMembershipSpan.setAttribute( "matrix.confId", - this.groupCall.groupCallId + this.groupCall.groupCallId, ); this.callMembershipSpan.setAttribute("matrix.userId", this.myUserId); this.callMembershipSpan.setAttribute("matrix.deviceId", this.myDeviceId); this.callMembershipSpan.setAttribute( "matrix.displayName", - this.myMember ? this.myMember.name : "unknown-name" + this.myMember ? this.myMember.name : "unknown-name", ); this.groupCallContext = opentelemetry.trace.setSpan( opentelemetry.context.active(), - this.callMembershipSpan + this.callMembershipSpan, ); this.callMembershipSpan?.addEvent("matrix.joinCall"); @@ -138,7 +141,7 @@ export class OTelGroupCallMembership { this.callMembershipSpan?.addEvent( `matrix.roomStateEvent_${event.getType()}`, - ObjectFlattener.flattenVoipEvent(event.getContent()) + ObjectFlattener.flattenVoipEvent(event.getContent()), ); } @@ -150,7 +153,7 @@ export class OTelGroupCallMembership { const span = ElementCallOpenTelemetry.instance.tracer.startSpan( `matrix.call`, undefined, - this.groupCallContext + this.groupCallContext, ); // XXX: anonymity span.setAttribute("matrix.call.target.userId", userId); @@ -160,7 +163,7 @@ export class OTelGroupCallMembership { span.setAttribute("matrix.call.target.displayName", displayName); this.callsByCallId.set( call.callId, - new OTelCall(userId, deviceId, call, span) + new OTelCall(userId, deviceId, call, span), ); } } @@ -210,12 +213,12 @@ export class OTelGroupCallMembership { if (event.type === "toDevice") { callTrackingInfo.span.addEvent( `matrix.sendToDeviceEvent_${event.eventType}`, - ObjectFlattener.flattenVoipEvent(event) + ObjectFlattener.flattenVoipEvent(event), ); } else if (event.type === "sendEvent") { callTrackingInfo.span.addEvent( `matrix.sendToRoomEvent_${event.eventType}`, - ObjectFlattener.flattenVoipEvent(event) + ObjectFlattener.flattenVoipEvent(event), ); } } @@ -239,7 +242,7 @@ export class OTelGroupCallMembership { "matrix.receive_voip_event_unknown_callid", { "sender.userId": event.getSender(), - } + }, ); logger.error("Received call event for unknown call ID " + callId); return; @@ -284,7 +287,7 @@ export class OTelGroupCallMembership { public onSpeaking( member: RoomMember, deviceId: string, - speaking: boolean + speaking: boolean, ): void { if (speaking) { // Ensure that there's an audio activity span for this speaker @@ -298,7 +301,7 @@ export class OTelGroupCallMembership { const span = ElementCallOpenTelemetry.instance.tracer.startSpan( "matrix.audioActivity", undefined, - this.groupCallContext + this.groupCallContext, ); span.setAttribute("matrix.userId", member.userId); span.setAttribute("matrix.displayName", member.rawDisplayName); @@ -336,7 +339,7 @@ export class OTelGroupCallMembership { } public onCallFeedStatsReport( - report: GroupCallStatsReport + report: GroupCallStatsReport, ): void { if (!ElementCallOpenTelemetry.instance) return; let call: OTelCall | undefined; @@ -354,10 +357,10 @@ export class OTelGroupCallMembership { "call.opponentMemberId": report.report?.opponentMemberId ? report.report?.opponentMemberId : "unknown", - } + }, ); logger.error( - `Received ${OTelStatsReportType.CallFeedReport} with unknown call ID: ${callId}` + `Received ${OTelStatsReportType.CallFeedReport} with unknown call ID: ${callId}`, ); return; } else { @@ -367,26 +370,26 @@ export class OTelGroupCallMembership { } public onConnectionStatsReport( - statsReport: GroupCallStatsReport + statsReport: GroupCallStatsReport, ): void { this.buildCallStatsSpan( OTelStatsReportType.ConnectionReport, - statsReport.report + statsReport.report, ); } public onByteSentStatsReport( - statsReport: GroupCallStatsReport + statsReport: GroupCallStatsReport, ): void { this.buildCallStatsSpan( OTelStatsReportType.ByteSentReport, - statsReport.report + statsReport.report, ); } public buildCallStatsSpan( type: OTelStatsReportType, - report: ByteSentStatsReport | ConnectionStatsReport + report: ByteSentStatsReport | ConnectionStatsReport, ): void { if (!ElementCallOpenTelemetry.instance) return; let call: OTelCall | undefined; @@ -409,7 +412,7 @@ export class OTelGroupCallMembership { const data = ObjectFlattener.flattenReportObject(type, report); const ctx = opentelemetry.trace.setSpan( opentelemetry.context.active(), - call.span + call.span, ); const options = { @@ -423,20 +426,20 @@ export class OTelGroupCallMembership { const span = ElementCallOpenTelemetry.instance.tracer.startSpan( type, options, - ctx + ctx, ); span.setAttribute("matrix.callId", callId ?? "unknown"); span.setAttribute( "matrix.opponentMemberId", - report.opponentMemberId ? report.opponentMemberId : "unknown" + report.opponentMemberId ? report.opponentMemberId : "unknown", ); span.addEvent("matrix.call.connection_stats_event", data); span.end(); } public onSummaryStatsReport( - statsReport: GroupCallStatsReport + statsReport: GroupCallStatsReport, ): void { if (!ElementCallOpenTelemetry.instance) return; @@ -445,12 +448,12 @@ export class OTelGroupCallMembership { if (this.statsReportSpan.span === undefined && this.callMembershipSpan) { const ctx = setSpan( opentelemetry.context.active(), - this.callMembershipSpan + this.callMembershipSpan, ); const span = ElementCallOpenTelemetry.instance?.tracer.startSpan( "matrix.groupCallMembership.summaryReport", undefined, - ctx + ctx, ); if (span === undefined) { return; @@ -459,7 +462,7 @@ export class OTelGroupCallMembership { span.setAttribute("matrix.userId", this.myUserId); span.setAttribute( "matrix.displayName", - this.myMember ? this.myMember.name : "unknown-name" + this.myMember ? this.myMember.name : "unknown-name", ); span.addEvent(type, data); span.end(); diff --git a/src/otel/ObjectFlattener.ts b/src/otel/ObjectFlattener.ts index 715517d2..76de9e3a 100644 --- a/src/otel/ObjectFlattener.ts +++ b/src/otel/ObjectFlattener.ts @@ -25,7 +25,7 @@ import { export class ObjectFlattener { public static flattenReportObject( prefix: string, - report: ConnectionStatsReport | ByteSentStatsReport + report: ConnectionStatsReport | ByteSentStatsReport, ): Attributes { const flatObject = {}; ObjectFlattener.flattenObjectRecursive(report, flatObject, `${prefix}.`, 0); @@ -33,27 +33,27 @@ export class ObjectFlattener { } public static flattenByteSentStatsReportObject( - statsReport: GroupCallStatsReport + statsReport: GroupCallStatsReport, ): Attributes { const flatObject = {}; ObjectFlattener.flattenObjectRecursive( statsReport.report, flatObject, "matrix.stats.bytesSent.", - 0 + 0, ); return flatObject; } public static flattenSummaryStatsReportObject( - statsReport: GroupCallStatsReport + statsReport: GroupCallStatsReport, ): Attributes { const flatObject = {}; ObjectFlattener.flattenObjectRecursive( statsReport.report, flatObject, "matrix.stats.summary.", - 0 + 0, ); return flatObject; } @@ -67,7 +67,7 @@ export class ObjectFlattener { event as unknown as Record, // XXX Types flatObject, "matrix.event.", - 0 + 0, ); return flatObject; @@ -77,12 +77,12 @@ export class ObjectFlattener { obj: Object, flatObject: Attributes, prefix: string, - depth: number + depth: number, ): void { if (depth > 10) throw new Error( "Depth limit exceeded: aborting VoipEvent recursion. Prefix is " + - prefix + prefix, ); let entries; if (obj instanceof Map) { @@ -101,7 +101,7 @@ export class ObjectFlattener { v, flatObject, prefix + k + ".", - depth + 1 + depth + 1, ); } } diff --git a/src/otel/otel.ts b/src/otel/otel.ts index c6a1b971..14c22cb6 100644 --- a/src/otel/otel.ts +++ b/src/otel/otel.ts @@ -50,7 +50,7 @@ export class ElementCallOpenTelemetry { sharedInstance = new ElementCallOpenTelemetry( config.opentelemetry?.collector_url, - config.rageshake?.submit_url + config.rageshake?.submit_url, ); } } @@ -61,7 +61,7 @@ export class ElementCallOpenTelemetry { private constructor( collectorUrl: string | undefined, - rageshakeUrl: string | undefined + rageshakeUrl: string | undefined, ) { // This is how we can make Jaeger show a reasonable service in the dropdown on the left. const providerConfig = { @@ -77,7 +77,7 @@ export class ElementCallOpenTelemetry { url: collectorUrl, }); this._provider.addSpanProcessor( - new SimpleSpanProcessor(this.otlpExporter) + new SimpleSpanProcessor(this.otlpExporter), ); } else { logger.info("OTLP collector disabled"); @@ -93,7 +93,7 @@ export class ElementCallOpenTelemetry { this._tracer = opentelemetry.trace.getTracer( // This is not the serviceName shown in jaeger - "my-element-call-otl-tracer" + "my-element-call-otl-tracer", ); } diff --git a/src/popover/Popover.tsx b/src/popover/Popover.tsx index 02662eb5..36a4ac4a 100644 --- a/src/popover/Popover.tsx +++ b/src/popover/Popover.tsx @@ -40,7 +40,7 @@ export const Popover = forwardRef( shouldCloseOnBlur: true, isDismissable: true, }, - popoverRef + popoverRef, ); return ( @@ -56,5 +56,5 @@ export const Popover = forwardRef( ); - } + }, ); diff --git a/src/popover/PopoverMenu.tsx b/src/popover/PopoverMenu.tsx index faf7fd71..dc38c6d0 100644 --- a/src/popover/PopoverMenu.tsx +++ b/src/popover/PopoverMenu.tsx @@ -43,7 +43,7 @@ export const PopoverMenuTrigger = forwardRef< const { menuTriggerProps, menuProps } = useMenuTrigger( {}, popoverMenuState, - buttonRef + buttonRef, ); const popoverRef = useRef(null); @@ -62,7 +62,7 @@ export const PopoverMenuTrigger = forwardRef< typeof children[1] !== "function" ) { throw new Error( - "PopoverMenu must have two props. The first being a button and the second being a render prop." + "PopoverMenu must have two props. The first being a button and the second being a render prop.", ); } diff --git a/src/profile/useProfile.ts b/src/profile/useProfile.ts index c88547fa..eba0420f 100644 --- a/src/profile/useProfile.ts +++ b/src/profile/useProfile.ts @@ -63,7 +63,7 @@ export function useProfile(client: MatrixClient | undefined): UseProfile { useEffect(() => { const onChangeUser = ( _event: MatrixEvent | undefined, - { displayName, avatarUrl }: User + { displayName, avatarUrl }: User, ): void => { setState({ success: false, @@ -108,9 +108,8 @@ export function useProfile(client: MatrixClient | undefined): UseProfile { if (removeAvatar) { await client.setAvatarUrl(""); } else if (avatar) { - ({ content_uri: mxcAvatarUrl } = await client.uploadContent( - avatar - )); + ({ content_uri: mxcAvatarUrl } = + await client.uploadContent(avatar)); await client.setAvatarUrl(mxcAvatarUrl); } @@ -135,7 +134,7 @@ export function useProfile(client: MatrixClient | undefined): UseProfile { logger.error("Client not initialized before calling saveProfile"); } }, - [client] + [client], ); return { diff --git a/src/room/AppSelectionModal.tsx b/src/room/AppSelectionModal.tsx index 8220ffbc..8affa12e 100644 --- a/src/room/AppSelectionModal.tsx +++ b/src/room/AppSelectionModal.tsx @@ -40,14 +40,14 @@ export const AppSelectionModal: FC = ({ roomId }) => { e.stopPropagation(); setOpen(false); }, - [setOpen] + [setOpen], ); const roomSharedKey = useRoomSharedKey(roomId ?? ""); const roomIsEncrypted = useIsRoomE2EE(roomId ?? ""); if (roomIsEncrypted && roomSharedKey === undefined) { logger.error( - "Generating app redirect URL for encrypted room but don't have key available!" + "Generating app redirect URL for encrypted room but don't have key available!", ); } @@ -60,7 +60,7 @@ export const AppSelectionModal: FC = ({ roomId }) => { const url = new URL( roomId === null ? window.location.href - : getAbsoluteRoomUrl(roomId, undefined, roomSharedKey ?? undefined) + : getAbsoluteRoomUrl(roomId, undefined, roomSharedKey ?? undefined), ); // Edit the URL to prevent the app selection prompt from appearing a second // time within the app, and to keep the user confined to the current room diff --git a/src/room/CallEndedView.tsx b/src/room/CallEndedView.tsx index 72567618..32b27568 100644 --- a/src/room/CallEndedView.tsx +++ b/src/room/CallEndedView.tsx @@ -64,7 +64,7 @@ export const CallEndedView: FC = ({ PosthogAnalytics.instance.eventQualitySurvey.track( endedCallId, feedbackText, - starRating + starRating, ); setSubmitting(true); @@ -83,7 +83,7 @@ export const CallEndedView: FC = ({ }, 1000); }, 1000); }, - [endedCallId, history, isPasswordlessUser, confineToRoom, starRating] + [endedCallId, history, isPasswordlessUser, confineToRoom, starRating], ); const createAccountDialog = isPasswordlessUser && ( diff --git a/src/room/GroupCallLoader.tsx b/src/room/GroupCallLoader.tsx index c61f4ca4..720b6487 100644 --- a/src/room/GroupCallLoader.tsx +++ b/src/room/GroupCallLoader.tsx @@ -47,7 +47,7 @@ export function GroupCallLoader({ ev.preventDefault(); history.push("/"); }, - [history] + [history], ); switch (groupCallState.kind) { @@ -66,7 +66,7 @@ export function GroupCallLoader({ {t("Call not found")} {t( - "Calls are now end-to-end encrypted and need to be created from the home page. This helps make sure everyone's using the same encryption key." + "Calls are now end-to-end encrypted and need to be created from the home page. This helps make sure everyone's using the same encryption key.", )} {/* XXX: A 'create it for me' button would be the obvious UX here. Two screens already have diff --git a/src/room/GroupCallView.tsx b/src/room/GroupCallView.tsx index 90dfff31..c629a5dc 100644 --- a/src/room/GroupCallView.tsx +++ b/src/room/GroupCallView.tsx @@ -111,7 +111,7 @@ export const GroupCallView: FC = ({ // Count each member only once, regardless of how many devices they use const participantCount = useMemo( () => new Set(memberships.map((m) => m.sender!)).size, - [memberships] + [memberships], ); const deviceContext = useMediaDevices(); @@ -126,7 +126,7 @@ export const GroupCallView: FC = ({ if (widget && preload) { // In preload mode, wait for a join action before entering const onJoin = async ( - ev: CustomEvent + ev: CustomEvent, ): Promise => { // XXX: I think this is broken currently - LiveKit *won't* request // permissions and give you device names unless you specify a kind, but @@ -143,14 +143,14 @@ export const GroupCallView: FC = ({ const deviceId = await findDeviceByName( audioInput, "audioinput", - devices + devices, ); if (!deviceId) { logger.warn("Unknown audio input: " + audioInput); latestMuteStates.current!.audio.setEnabled?.(false); } else { logger.debug( - `Found audio input ID ${deviceId} for name ${audioInput}` + `Found audio input ID ${deviceId} for name ${audioInput}`, ); latestDevices.current!.audioInput.select(deviceId); latestMuteStates.current!.audio.setEnabled?.(true); @@ -163,14 +163,14 @@ export const GroupCallView: FC = ({ const deviceId = await findDeviceByName( videoInput, "videoinput", - devices + devices, ); if (!deviceId) { logger.warn("Unknown video input: " + videoInput); latestMuteStates.current!.video.setEnabled?.(false); } else { logger.debug( - `Found video input ID ${deviceId} for name ${videoInput}` + `Found video input ID ${deviceId} for name ${videoInput}`, ); latestDevices.current!.videoInput.select(deviceId); latestMuteStates.current!.video.setEnabled?.(true); @@ -182,7 +182,7 @@ export const GroupCallView: FC = ({ PosthogAnalytics.instance.eventCallEnded.cacheStartCall(new Date()); // we only have room sessions right now, so call ID is the emprty string - we use the room ID PosthogAnalytics.instance.eventCallStarted.track( - rtcSession.room.roomId + rtcSession.room.roomId, ); await Promise.all([ @@ -213,7 +213,7 @@ export const GroupCallView: FC = ({ PosthogAnalytics.instance.eventCallEnded.track( rtcSession.room.roomId, rtcSession.memberships.length, - sendInstantly + sendInstantly, ); await leaveRTCSession(rtcSession); @@ -237,13 +237,13 @@ export const GroupCallView: FC = ({ history.push("/"); } }, - [rtcSession, isPasswordlessUser, confineToRoom, history] + [rtcSession, isPasswordlessUser, confineToRoom, history], ); useEffect(() => { if (widget && isJoined) { const onHangup = async ( - ev: CustomEvent + ev: CustomEvent, ): Promise => { leaveRTCSession(rtcSession); widget!.api.transport.reply(ev.detail, {}); @@ -260,7 +260,7 @@ export const GroupCallView: FC = ({ const e2eeConfig = useMemo( () => (e2eeSharedKey ? { sharedKey: e2eeSharedKey } : undefined), - [e2eeSharedKey] + [e2eeSharedKey], ); const onReconnect = useCallback(() => { @@ -274,12 +274,12 @@ export const GroupCallView: FC = ({ const [shareModalOpen, setInviteModalOpen] = useState(false); const onDismissInviteModal = useCallback( () => setInviteModalOpen(false), - [setInviteModalOpen] + [setInviteModalOpen], ); const onShareClickFn = useCallback( () => setInviteModalOpen(true), - [setInviteModalOpen] + [setInviteModalOpen], ); const onShareClick = joinRule === JoinRule.Public ? onShareClickFn : null; @@ -288,7 +288,7 @@ export const GroupCallView: FC = ({ ev.preventDefault(); history.push("/"); }, - [history] + [history], ); const { t } = useTranslation(); @@ -298,7 +298,7 @@ export const GroupCallView: FC = ({ @@ -309,7 +309,7 @@ export const GroupCallView: FC = ({ Incompatible Browser {t( - "Your web browser does not support media end-to-end encryption. Supported Browsers are Chrome, Safari, Firefox >=117" + "Your web browser does not support media end-to-end encryption. Supported Browsers are Chrome, Safari, Firefox >=117", )} diff --git a/src/room/InCallView.tsx b/src/room/InCallView.tsx index d0b54f8d..9dc124f9 100644 --- a/src/room/InCallView.tsx +++ b/src/room/InCallView.tsx @@ -105,7 +105,7 @@ export const ActiveCall: FC = (props) => { const { livekitRoom, connState } = useLiveKit( props.muteStates, sfuConfig, - props.e2eeConfig + props.e2eeConfig, ); if (!livekitRoom) { @@ -172,10 +172,10 @@ export const InCallView: FC = ({ [{ source: Track.Source.ScreenShare, withPlaceholder: false }], { room: livekitRoom, - } + }, ); const { layout, setLayout } = useVideoGridLayout( - screenSharingTracks.length > 0 + screenSharingTracks.length > 0, ); const [showConnectionStats] = useShowConnectionStats(); @@ -188,11 +188,11 @@ export const InCallView: FC = ({ const toggleMicrophone = useCallback( () => muteStates.audio.setEnabled?.((e) => !e), - [muteStates] + [muteStates], ); const toggleCamera = useCallback( () => muteStates.video.setEnabled?.((e) => !e), - [muteStates] + [muteStates], ); // This function incorrectly assumes that there is a camera and microphone, which is not always the case. @@ -201,7 +201,7 @@ export const InCallView: FC = ({ containerRef1, toggleMicrophone, toggleCamera, - (muted) => muteStates.audio.setEnabled?.(!muted) + (muted) => muteStates.audio.setEnabled?.(!muted), ); const onLeavePress = useCallback(() => { @@ -213,7 +213,7 @@ export const InCallView: FC = ({ layout === "grid" ? ElementWidgetActions.TileLayout : ElementWidgetActions.SpotlightLayout, - {} + {}, ); }, [layout]); @@ -231,14 +231,14 @@ export const InCallView: FC = ({ widget.lazyActions.on(ElementWidgetActions.TileLayout, onTileLayout); widget.lazyActions.on( ElementWidgetActions.SpotlightLayout, - onSpotlightLayout + onSpotlightLayout, ); return () => { widget!.lazyActions.off(ElementWidgetActions.TileLayout, onTileLayout); widget!.lazyActions.off( ElementWidgetActions.SpotlightLayout, - onSpotlightLayout + onSpotlightLayout, ); }; } @@ -261,7 +261,7 @@ export const InCallView: FC = ({ (noControls ? items.find((item) => item.isSpeaker) ?? items.at(0) ?? null : null), - [fullscreenItem, noControls, items] + [fullscreenItem, noControls, items], ); const Grid = @@ -320,18 +320,18 @@ export const InCallView: FC = ({ }; const rageshakeRequestModalProps = useRageshakeRequestModal( - rtcSession.room.roomId + rtcSession.room.roomId, ); const [settingsModalOpen, setSettingsModalOpen] = useState(false); const openSettings = useCallback( () => setSettingsModalOpen(true), - [setSettingsModalOpen] + [setSettingsModalOpen], ); const closeSettings = useCallback( () => setSettingsModalOpen(false), - [setSettingsModalOpen] + [setSettingsModalOpen], ); const toggleScreensharing = useCallback(async () => { @@ -365,7 +365,7 @@ export const InCallView: FC = ({ onPress={toggleCamera} disabled={muteStates.video.setEnabled === null} data-testid="incall_videomute" - /> + />, ); if (!reducedControls) { @@ -376,14 +376,18 @@ export const InCallView: FC = ({ enabled={isScreenShareEnabled} onPress={toggleScreensharing} data-testid="incall_screenshare" - /> + />, ); } buttons.push(); } buttons.push( - + , ); footer = (
@@ -447,7 +451,7 @@ export const InCallView: FC = ({ function findMatrixMember( room: MatrixRoom, - id: string + id: string, ): RoomMember | undefined { if (!id) return undefined; @@ -455,7 +459,7 @@ function findMatrixMember( // must be at least 3 parts because we know the first part is a userId which must necessarily contain a colon if (parts.length < 3) { logger.warn( - "Livekit participants ID doesn't look like a userId:deviceId combination" + "Livekit participants ID doesn't look like a userId:deviceId combination", ); return undefined; } @@ -469,7 +473,7 @@ function findMatrixMember( function useParticipantTiles( livekitRoom: Room, matrixRoom: MatrixRoom, - connState: ECConnectionState + connState: ECConnectionState, ): TileDescriptor[] { const previousTiles = useRef[]>([]); @@ -498,7 +502,7 @@ function useParticipantTiles( // connected, this is fine and we'll be in "all ghosts" mode. if (id !== "" && member === undefined) { logger.warn( - `Ruh, roh! No matrix member found for SFU participant '${id}': creating g-g-g-ghost!` + `Ruh, roh! No matrix member found for SFU participant '${id}': creating g-g-g-ghost!`, ); } allGhosts &&= member === undefined; @@ -542,11 +546,11 @@ function useParticipantTiles( return screenShareTile ? [userMediaTile, screenShareTile] : [userMediaTile]; - } + }, ); PosthogAnalytics.instance.eventCallEnded.cacheParticipantCountChanged( - tiles.length + tiles.length, ); // If every item is a ghost, that probably means we're still connecting and diff --git a/src/room/InviteModal.tsx b/src/room/InviteModal.tsx index 33d6ef97..f9d02f2b 100644 --- a/src/room/InviteModal.tsx +++ b/src/room/InviteModal.tsx @@ -40,7 +40,7 @@ export const InviteModal: FC = ({ room, open, onDismiss }) => { const url = useMemo( () => getAbsoluteRoomUrl(room.roomId, room.name, roomSharedKey ?? undefined), - [room, roomSharedKey] + [room, roomSharedKey], ); const [, setCopied] = useClipboard(url); const [toastOpen, setToastOpen] = useState(false); @@ -53,7 +53,7 @@ export const InviteModal: FC = ({ room, open, onDismiss }) => { onDismiss(); setToastOpen(true); }, - [setCopied, onDismiss] + [setCopied, onDismiss], ); return ( diff --git a/src/room/LayoutToggle.tsx b/src/room/LayoutToggle.tsx index 88d9aef7..01738f73 100644 --- a/src/room/LayoutToggle.tsx +++ b/src/room/LayoutToggle.tsx @@ -36,7 +36,7 @@ export const LayoutToggle: FC = ({ layout, setLayout, className }) => { const onChange = useCallback( (e: ChangeEvent) => setLayout(e.target.value as Layout), - [setLayout] + [setLayout], ); const spotlightId = useId(); diff --git a/src/room/LobbyView.tsx b/src/room/LobbyView.tsx index e49b70cf..7116e74c 100644 --- a/src/room/LobbyView.tsx +++ b/src/room/LobbyView.tsx @@ -63,22 +63,22 @@ export const LobbyView: FC = ({ const onAudioPress = useCallback( () => muteStates.audio.setEnabled?.((e) => !e), - [muteStates] + [muteStates], ); const onVideoPress = useCallback( () => muteStates.video.setEnabled?.((e) => !e), - [muteStates] + [muteStates], ); const [settingsModalOpen, setSettingsModalOpen] = useState(false); const openSettings = useCallback( () => setSettingsModalOpen(true), - [setSettingsModalOpen] + [setSettingsModalOpen], ); const closeSettings = useCallback( () => setSettingsModalOpen(false), - [setSettingsModalOpen] + [setSettingsModalOpen], ); const history = useHistory(); diff --git a/src/room/MuteStates.ts b/src/room/MuteStates.ts index 8bdc6420..db1fb22a 100644 --- a/src/room/MuteStates.ts +++ b/src/room/MuteStates.ts @@ -49,18 +49,18 @@ export interface MuteStates { function useMuteState( device: MediaDevice, - enabledByDefault: () => boolean + enabledByDefault: () => boolean, ): MuteState { const [enabled, setEnabled] = useReactiveState( (prev) => device.available.length > 0 && (prev ?? enabledByDefault()), - [device] + [device], ); return useMemo( () => device.available.length === 0 ? deviceUnavailable : { enabled, setEnabled }, - [device, enabled, setEnabled] + [device, enabled, setEnabled], ); } @@ -69,7 +69,7 @@ export function useMuteStates(participantCount: number): MuteStates { const audio = useMuteState( devices.audioInput, - () => participantCount <= MUTE_PARTICIPANT_COUNT + () => participantCount <= MUTE_PARTICIPANT_COUNT, ); const video = useMuteState(devices.videoInput, () => true); diff --git a/src/room/RageshakeRequestModal.tsx b/src/room/RageshakeRequestModal.tsx index 74debd34..9bc60cdb 100644 --- a/src/room/RageshakeRequestModal.tsx +++ b/src/room/RageshakeRequestModal.tsx @@ -47,7 +47,7 @@ export const RageshakeRequestModal: FC = ({ {t( - "Another user on this call is having an issue. In order to better diagnose these issues we'd like to collect a debug log." + "Another user on this call is having an issue. In order to better diagnose these issues we'd like to collect a debug log.", )} diff --git a/src/room/RoomAuthView.tsx b/src/room/RoomAuthView.tsx index ab988d3b..a52a0e8e 100644 --- a/src/room/RoomAuthView.tsx +++ b/src/room/RoomAuthView.tsx @@ -52,7 +52,7 @@ export const RoomAuthView: FC = () => { setError(error); }); }, - [registerPasswordlessUser] + [registerPasswordlessUser], ); const { t } = useTranslation(); diff --git a/src/room/RoomPage.tsx b/src/room/RoomPage.tsx index ffc9562a..9bcb8a81 100644 --- a/src/room/RoomPage.tsx +++ b/src/room/RoomPage.tsx @@ -81,7 +81,7 @@ export const RoomPage: FC = () => { hideHeader={hideHeader} /> ), - [client, passwordlessUser, confineToRoom, preload, hideHeader] + [client, passwordlessUser, confineToRoom, preload, hideHeader], ); let content: ReactNode; diff --git a/src/room/VideoPreview.tsx b/src/room/VideoPreview.tsx index 36323ba9..df4d1480 100644 --- a/src/room/VideoPreview.tsx +++ b/src/room/VideoPreview.tsx @@ -82,14 +82,14 @@ export const VideoPreview: FC = ({ }, (error) => { logger.error("Error while creating preview Tracks:", error); - } + }, ); const videoTrack = useMemo( () => tracks?.find((t) => t.kind === Track.Kind.Video) as | LocalVideoTrack | undefined, - [tracks] + [tracks], ); const videoEl = useRef(null); diff --git a/src/room/useActiveFocus.ts b/src/room/useActiveFocus.ts index a62ffafd..022b25ac 100644 --- a/src/room/useActiveFocus.ts +++ b/src/room/useActiveFocus.ts @@ -24,7 +24,7 @@ import { deepCompare } from "matrix-js-sdk/src/utils"; import { LivekitFocus } from "../livekit/LivekitFocus"; function getActiveFocus( - rtcSession: MatrixRTCSession + rtcSession: MatrixRTCSession, ): LivekitFocus | undefined { const oldestMembership = rtcSession.getOldestMembership(); return oldestMembership?.getActiveFoci()[0] as LivekitFocus; @@ -36,10 +36,10 @@ function getActiveFocus( * and the same focus. */ export function useActiveFocus( - rtcSession: MatrixRTCSession + rtcSession: MatrixRTCSession, ): LivekitFocus | undefined { const [activeFocus, setActiveFocus] = useState(() => - getActiveFocus(rtcSession) + getActiveFocus(rtcSession), ); const onMembershipsChanged = useCallback(() => { @@ -53,13 +53,13 @@ export function useActiveFocus( useEffect(() => { rtcSession.on( MatrixRTCSessionEvent.MembershipsChanged, - onMembershipsChanged + onMembershipsChanged, ); return () => { rtcSession.off( MatrixRTCSessionEvent.MembershipsChanged, - onMembershipsChanged + onMembershipsChanged, ); }; }); diff --git a/src/room/useFullscreen.ts b/src/room/useFullscreen.ts index 684ee9bc..38469808 100644 --- a/src/room/useFullscreen.ts +++ b/src/room/useFullscreen.ts @@ -66,7 +66,7 @@ export function useFullscreen(items: TileDescriptor[]): { prevItem == null ? null : items.find((i) => i.id === prevItem.id) ?? null, - [items] + [items], ); const latestItems = useRef[]>(items); @@ -80,15 +80,15 @@ export function useFullscreen(items: TileDescriptor[]): { setFullscreenItem( latestFullscreenItem.current === null ? latestItems.current.find((i) => i.id === itemId) ?? null - : null + : null, ); }, - [setFullscreenItem] + [setFullscreenItem], ); const exitFullscreenCallback = useCallback( () => setFullscreenItem(null), - [setFullscreenItem] + [setFullscreenItem], ); useLayoutEffect(() => { @@ -103,7 +103,7 @@ export function useFullscreen(items: TileDescriptor[]): { useFullscreenChange( useCallback(() => { if (!isFullscreen()) setFullscreenItem(null); - }, [setFullscreenItem]) + }, [setFullscreenItem]), ); return { diff --git a/src/room/useJoinRule.ts b/src/room/useJoinRule.ts index 2fb854e7..798999e4 100644 --- a/src/room/useJoinRule.ts +++ b/src/room/useJoinRule.ts @@ -23,6 +23,6 @@ import { useRoomState } from "./useRoomState"; export function useJoinRule(room: Room): JoinRule { return useRoomState( room, - useCallback((state) => state.getJoinRule(), []) + useCallback((state) => state.getJoinRule(), []), ); } diff --git a/src/room/useLoadGroupCall.ts b/src/room/useLoadGroupCall.ts index ec9e1d94..423706ec 100644 --- a/src/room/useLoadGroupCall.ts +++ b/src/room/useLoadGroupCall.ts @@ -52,7 +52,7 @@ export interface GroupCallLoadState { export const useLoadGroupCall = ( client: MatrixClient, roomIdOrAlias: string, - viaServers: string[] + viaServers: string[], ): GroupCallStatus => { const { t } = useTranslation(); const [state, setState] = useState({ kind: "loading" }); @@ -70,7 +70,7 @@ export const useLoadGroupCall = ( // join anyway but the js-sdk recreates the room if you pass the alias for a // room you're already joined to (which it probably ought not to). const lookupResult = await client.getRoomIdForAlias( - roomIdOrAlias.toLowerCase() + roomIdOrAlias.toLowerCase(), ); logger.info(`${roomIdOrAlias} resolved to ${lookupResult.room_id}`); room = client.getRoom(lookupResult.room_id); @@ -81,7 +81,7 @@ export const useLoadGroupCall = ( }); } else { logger.info( - `Already in room ${lookupResult.room_id}, not rejoining.` + `Already in room ${lookupResult.room_id}, not rejoining.`, ); } } else { @@ -92,7 +92,7 @@ export const useLoadGroupCall = ( } logger.info( - `Joined ${roomIdOrAlias}, waiting room to be ready for group calls` + `Joined ${roomIdOrAlias}, waiting room to be ready for group calls`, ); await client.waitUntilRoomReadyForGroupCalls(room.roomId); logger.info(`${roomIdOrAlias}, is ready for group calls`); @@ -110,7 +110,7 @@ export const useLoadGroupCall = ( const waitForClientSyncing = async (): Promise => { if (client.getSyncState() !== SyncState.Syncing) { logger.debug( - "useLoadGroupCall: waiting for client to start syncing..." + "useLoadGroupCall: waiting for client to start syncing...", ); await new Promise((resolve) => { const onSync = (): void => { diff --git a/src/room/useRoomAvatar.ts b/src/room/useRoomAvatar.ts index 8eb31b20..b00597e7 100644 --- a/src/room/useRoomAvatar.ts +++ b/src/room/useRoomAvatar.ts @@ -22,6 +22,6 @@ import { useRoomState } from "./useRoomState"; export function useRoomAvatar(room: Room): string | null { return useRoomState( room, - useCallback(() => room.getMxcAvatarUrl(), [room]) + useCallback(() => room.getMxcAvatarUrl(), [room]), ); } diff --git a/src/room/useRoomState.ts b/src/room/useRoomState.ts index 2fa4d0b7..6e069b67 100644 --- a/src/room/useRoomState.ts +++ b/src/room/useRoomState.ts @@ -31,7 +31,7 @@ export const useRoomState = (room: Room, f: (state: RoomState) => T): T => { useTypedEventEmitter( room, RoomStateEvent.Update, - useCallback(() => setNumUpdates((n) => n + 1), [setNumUpdates]) + useCallback(() => setNumUpdates((n) => n + 1), [setNumUpdates]), ); // We want any change to the update counter to trigger an update here // eslint-disable-next-line react-hooks/exhaustive-deps diff --git a/src/rtcSessionHelpers.ts b/src/rtcSessionHelpers.ts index 8d8053fd..1ea00160 100644 --- a/src/rtcSessionHelpers.ts +++ b/src/rtcSessionHelpers.ts @@ -48,7 +48,7 @@ export function enterRTCSession(rtcSession: MatrixRTCSession): void { } export async function leaveRTCSession( - rtcSession: MatrixRTCSession + rtcSession: MatrixRTCSession, ): Promise { //groupCallOTelMembership?.onLeaveCall(); await rtcSession.leaveRoomSession(); diff --git a/src/settings/FeedbackSettingsTab.tsx b/src/settings/FeedbackSettingsTab.tsx index 6fda0194..af45b42c 100644 --- a/src/settings/FeedbackSettingsTab.tsx +++ b/src/settings/FeedbackSettingsTab.tsx @@ -57,7 +57,7 @@ export const FeedbackSettingsTab: FC = ({ roomId }) => { sendRageshakeRequest(roomId, rageshakeRequestId); } }, - [submitRageshake, roomId, sendRageshakeRequest] + [submitRageshake, roomId, sendRageshakeRequest], ); return ( @@ -65,7 +65,7 @@ export const FeedbackSettingsTab: FC = ({ roomId }) => {

{t("Submit feedback")}

{t( - "If you are experiencing issues or simply would like to provide some feedback, please send us a short description below." + "If you are experiencing issues or simply would like to provide some feedback, please send us a short description below.", )}
diff --git a/src/settings/SettingsModal.tsx b/src/settings/SettingsModal.tsx index 62dee06a..fe183d59 100644 --- a/src/settings/SettingsModal.tsx +++ b/src/settings/SettingsModal.tsx @@ -69,7 +69,7 @@ export const SettingsModal: FC = (props) => { // Generate a `SelectInput` with a list of devices for a given device kind. const generateDeviceSelection = ( devices: MediaDevice, - caption: string + caption: string, ): ReactNode => { if (devices.available.length == 0) return null; @@ -100,7 +100,7 @@ export const SettingsModal: FC = (props) => { (tab: Key) => { setSelectedTab(tab.toString()); }, - [setSelectedTab] + [setSelectedTab], ); const optInDescription = ( diff --git a/src/settings/rageshake.ts b/src/settings/rageshake.ts index 699ac07c..0b0365a7 100644 --- a/src/settings/rageshake.ts +++ b/src/settings/rageshake.ts @@ -133,7 +133,7 @@ class IndexedDBLogStore { public constructor( private indexedDB: IDBFactory, - private loggerInstance: ConsoleLogger + private loggerInstance: ConsoleLogger, ) { this.id = "instance-" + randomString(16); @@ -177,7 +177,7 @@ class IndexedDBLogStore { logObjStore.createIndex("id", "id", { unique: false }); logObjStore.add( - this.generateLogEntry(new Date() + " ::: Log database was created.") + this.generateLogEntry(new Date() + " ::: Log database was created."), ); // This records the last time each instance ID generated a log message, such @@ -208,7 +208,7 @@ class IndexedDBLogStore { { leading: false, trailing: true, - } + }, ); /** @@ -366,8 +366,8 @@ class IndexedDBLogStore { txn.onerror = (): void => { reject( new Error( - "Failed to delete logs for " + `'${id}' : ${txn?.error?.message}` - ) + "Failed to delete logs for " + `'${id}' : ${txn?.error?.message}`, + ), ); }; // delete last modified entries @@ -410,7 +410,7 @@ class IndexedDBLogStore { }, (err) => { logger.error(err); - } + }, ); } return logs; @@ -445,7 +445,7 @@ class IndexedDBLogStore { function selectQuery( store: IDBObjectStore, keyRange: IDBKeyRange | undefined, - resultMapper: (cursor: IDBCursorWithValue) => T + resultMapper: (cursor: IDBCursorWithValue) => T, ): Promise { const query = store.openCursor(keyRange); return new Promise((resolve, reject) => { @@ -510,7 +510,7 @@ function tryInitStorage(): Promise { if (indexedDB) { global.mx_rage_store = new IndexedDBLogStore( indexedDB, - global.mx_rage_logger + global.mx_rage_logger, ); global.mx_rage_initStoragePromise = global.mx_rage_store.connect(); return global.mx_rage_initStoragePromise; @@ -547,7 +547,7 @@ export async function getLogsForReport(): Promise { type StringifyReplacer = ( this: unknown, key: string, - value: unknown + value: unknown, ) => unknown; // From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Cyclic_object_value#circular_references @@ -600,7 +600,7 @@ export function setLogExtension(extension: LogExtensionFunc): void { logger.methodFactory = function ( methodName, configLevel, - loggerName + loggerName, ): LoggingMethod { const rawMethod = originalFactory(methodName, configLevel, loggerName); diff --git a/src/settings/submit-rageshake.ts b/src/settings/submit-rageshake.ts index 33d53ce5..16c036e2 100644 --- a/src/settings/submit-rageshake.ts +++ b/src/settings/submit-rageshake.ts @@ -95,12 +95,12 @@ export function useSubmitRageshake(): { const body = new FormData(); body.append( "text", - description ?? "User did not supply any additional text." + description ?? "User did not supply any additional text.", ); body.append("app", "matrix-video-chat"); body.append( "version", - (import.meta.env.VITE_APP_VERSION as string) || "dev" + (import.meta.env.VITE_APP_VERSION as string) || "dev", ); body.append("user_agent", userAgent); body.append("installed_pwa", "false"); @@ -132,22 +132,22 @@ export function useSubmitRageshake(): { body.append( "cross_signing_ready", - String(await client.isCrossSigningReady()) + String(await client.isCrossSigningReady()), ); body.append( "cross_signing_supported_by_hs", String( await client.doesServerSupportUnstableFeature( - "org.matrix.e2e_cross_signing" - ) - ) + "org.matrix.e2e_cross_signing", + ), + ), ); body.append("cross_signing_key", crossSigning.getId()!); body.append( "cross_signing_privkey_in_secret_storage", String( - !!(await crossSigning.isStoredInSecretStorage(secretStorage)) - ) + !!(await crossSigning.isStoredInSecretStorage(secretStorage)), + ), ); const pkCache = client.getCrossSigningCacheCallbacks(); @@ -157,8 +157,8 @@ export function useSubmitRageshake(): { !!( pkCache?.getCrossSigningKeyCache && (await pkCache.getCrossSigningKeyCache("master")) - ) - ) + ), + ), ); body.append( "cross_signing_self_signing_privkey_cached", @@ -166,8 +166,8 @@ export function useSubmitRageshake(): { !!( pkCache?.getCrossSigningKeyCache && (await pkCache.getCrossSigningKeyCache("self_signing")) - ) - ) + ), + ), ); body.append( "cross_signing_user_signing_privkey_cached", @@ -175,32 +175,32 @@ export function useSubmitRageshake(): { !!( pkCache?.getCrossSigningKeyCache && (await pkCache.getCrossSigningKeyCache("user_signing")) - ) - ) + ), + ), ); body.append( "secret_storage_ready", - String(await client.isSecretStorageReady()) + String(await client.isSecretStorageReady()), ); body.append( "secret_storage_key_in_account", - String(!!(await secretStorage.hasKey())) + String(!!(await secretStorage.hasKey())), ); body.append( "session_backup_key_in_secret_storage", - String(!!(await client.isKeyBackupKeyStored())) + String(!!(await client.isKeyBackupKeyStored())), ); const sessionBackupKeyFromCache = await client.crypto!.getSessionBackupPrivateKey(); body.append( "session_backup_key_cached", - String(!!sessionBackupKeyFromCache) + String(!!sessionBackupKeyFromCache), ); body.append( "session_backup_key_well_formed", - String(sessionBackupKeyFromCache instanceof Uint8Array) + String(sessionBackupKeyFromCache instanceof Uint8Array), ); } } @@ -214,7 +214,7 @@ export function useSubmitRageshake(): { try { body.append( "storageManager_persisted", - String(await navigator.storage.persisted()) + String(await navigator.storage.persisted()), ); } catch (e) {} } else if (document.hasStorageAccess) { @@ -222,7 +222,7 @@ export function useSubmitRageshake(): { try { body.append( "storageManager_persisted", - String(await document.hasStorageAccess()) + String(await document.hasStorageAccess()), ); } catch (e) {} } @@ -240,7 +240,7 @@ export function useSubmitRageshake(): { Object.keys(estimate.usageDetails).forEach((k) => { body.append( `storageManager_usage_${k}`, - String(estimate.usageDetails![k]) + String(estimate.usageDetails![k]), ); }); } @@ -257,14 +257,14 @@ export function useSubmitRageshake(): { body.append( "file", gzip(ElementCallOpenTelemetry.instance.rageshakeProcessor!.dump()), - "traces.json.gz" + "traces.json.gz", ); } if (opts.rageshakeRequestId) { body.append( "group_call_rageshake_request_id", - opts.rageshakeRequestId + opts.rageshakeRequestId, ); } @@ -279,7 +279,7 @@ export function useSubmitRageshake(): { logger.error(error); } }, - [client, sending] + [client, sending], ); return { @@ -292,7 +292,7 @@ export function useSubmitRageshake(): { export function useRageshakeRequest(): ( roomId: string, - rageshakeRequestId: string + rageshakeRequestId: string, ) => void { const { client } = useClient(); @@ -302,14 +302,14 @@ export function useRageshakeRequest(): ( request_id: rageshakeRequestId, }); }, - [client] + [client], ); return sendRageshakeRequest; } export function useRageshakeRequestModal( - roomId: string + roomId: string, ): ComponentProps { const [open, setOpen] = useState(false); const onDismiss = useCallback(() => setOpen(false), [setOpen]); diff --git a/src/settings/useSetting.ts b/src/settings/useSetting.ts index 86b1183d..399ed356 100644 --- a/src/settings/useSetting.ts +++ b/src/settings/useSetting.ts @@ -38,13 +38,13 @@ export const useSetting = (name: string, defaultValue: T): Setting => { const value = useMemo( () => (item == null ? defaultValue : JSON.parse(item)), - [item, defaultValue] + [item, defaultValue], ); const setValue = useCallback( (value: T) => { setItem(JSON.stringify(value)); }, - [setItem] + [setItem], ); return [value, setValue]; @@ -94,7 +94,7 @@ export const useOptInAnalytics = (): DisableableSetting => { export const useEnableE2EE = (): DisableableSetting => { const settingVal = useSetting( "enable-end-to-end-encryption", - true + true, ); if (isE2EESupported()) return settingVal; diff --git a/src/tabs/Tabs.tsx b/src/tabs/Tabs.tsx index 5ed75a05..953edd15 100644 --- a/src/tabs/Tabs.tsx +++ b/src/tabs/Tabs.tsx @@ -29,7 +29,7 @@ interface TabContainerProps extends TabListProps { } export function TabContainer( - props: TabContainerProps + props: TabContainerProps, ): JSX.Element { const state = useTabListState(props); const ref = useRef(null); diff --git a/src/typography/Typography.tsx b/src/typography/Typography.tsx index 2c3687ae..ce55fc96 100644 --- a/src/typography/Typography.tsx +++ b/src/typography/Typography.tsx @@ -39,7 +39,7 @@ export const Headline = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { return createElement( Component, @@ -48,13 +48,13 @@ export const Headline = forwardRef( className: classNames( styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref, }, - children + children, ); - } + }, ); export const Title = forwardRef( @@ -67,7 +67,7 @@ export const Title = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { return createElement( Component, @@ -76,13 +76,13 @@ export const Title = forwardRef( className: classNames( styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref, }, - children + children, ); - } + }, ); export const Subtitle = forwardRef( @@ -95,7 +95,7 @@ export const Subtitle = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { return createElement( Component, @@ -104,13 +104,13 @@ export const Subtitle = forwardRef( className: classNames( styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref, }, - children + children, ); - } + }, ); export const Body = forwardRef( @@ -123,7 +123,7 @@ export const Body = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { return createElement( Component, @@ -132,13 +132,13 @@ export const Body = forwardRef( className: classNames( styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref, }, - children + children, ); - } + }, ); export const Caption = forwardRef( @@ -151,7 +151,7 @@ export const Caption = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { return createElement( Component, @@ -161,13 +161,13 @@ export const Caption = forwardRef( styles.caption, styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref, }, - children + children, ); - } + }, ); export const Micro = forwardRef( @@ -180,7 +180,7 @@ export const Micro = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { return createElement( Component, @@ -190,13 +190,13 @@ export const Micro = forwardRef( styles.micro, styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref, }, - children + children, ); - } + }, ); interface LinkProps extends TypographyProps { @@ -217,7 +217,7 @@ export const Link = forwardRef( overflowEllipsis, ...rest }, - ref + ref, ) => { // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore @@ -246,11 +246,11 @@ export const Link = forwardRef( styles[color], styles[fontWeight ?? ""], { [styles.overflowEllipsis]: overflowEllipsis }, - className + className, ), ref: ref, }, - children + children, ); - } + }, ); diff --git a/src/useCallViewKeyboardShortcuts.ts b/src/useCallViewKeyboardShortcuts.ts index c2cc17ad..9f4ba558 100644 --- a/src/useCallViewKeyboardShortcuts.ts +++ b/src/useCallViewKeyboardShortcuts.ts @@ -34,7 +34,7 @@ export function useCallViewKeyboardShortcuts( focusElement: RefObject, toggleMicrophoneMuted: () => void, toggleLocalVideoMuted: () => void, - setMicrophoneMuted: (muted: boolean) => void + setMicrophoneMuted: (muted: boolean) => void, ): void { const spacebarHeld = useRef(false); @@ -63,8 +63,8 @@ export function useCallViewKeyboardShortcuts( toggleLocalVideoMuted, toggleMicrophoneMuted, setMicrophoneMuted, - ] - ) + ], + ), ); useEventTarget( @@ -80,8 +80,8 @@ export function useCallViewKeyboardShortcuts( setMicrophoneMuted(true); } }, - [focusElement, setMicrophoneMuted] - ) + [focusElement, setMicrophoneMuted], + ), ); useEventTarget( @@ -92,6 +92,6 @@ export function useCallViewKeyboardShortcuts( spacebarHeld.current = false; setMicrophoneMuted(true); } - }, [setMicrophoneMuted, spacebarHeld]) + }, [setMicrophoneMuted, spacebarHeld]), ); } diff --git a/src/useEvents.ts b/src/useEvents.ts index b35d6fac..a116a050 100644 --- a/src/useEvents.ts +++ b/src/useEvents.ts @@ -28,7 +28,7 @@ export function useEventTarget( target: EventTarget | null | undefined, eventType: string, listener: (event: T) => void, - options?: AddEventListenerOptions + options?: AddEventListenerOptions, ): void { useEffect(() => { if (target) { @@ -37,7 +37,7 @@ export function useEventTarget( target.removeEventListener( eventType, listener as EventListener, - options + options, ); } }, [target, eventType, listener, options]); @@ -47,11 +47,11 @@ export function useEventTarget( export function useTypedEventEmitter< Events extends string, Arguments extends ListenerMap, - T extends Events + T extends Events, >( emitter: TypedEventEmitter, eventType: T, - listener: Listener + listener: Listener, ): void { useEffect(() => { emitter.on(eventType, listener); @@ -64,11 +64,11 @@ export function useTypedEventEmitter< // Shortcut for registering a listener on an eventemitter3 EventEmitter (ie. what the LiveKit SDK uses) export function useEventEmitterThree< EventType extends keyof T, - T extends EventMap + T extends EventMap, >( emitter: EventEmitter, eventType: EventType, - listener: T[EventType] + listener: T[EventType], ): void { useEffect(() => { emitter.on(eventType, listener); diff --git a/src/useLocalStorage.ts b/src/useLocalStorage.ts index e7fe51ef..07d487ea 100644 --- a/src/useLocalStorage.ts +++ b/src/useLocalStorage.ts @@ -24,10 +24,10 @@ export const localStorageBus = new EventEmitter(); // Like useState, but reads from and persists the value to localStorage export const useLocalStorage = ( - key: string + key: string, ): [LocalStorageItem, (value: string) => void] => { const [value, setValue] = useState(() => - localStorage.getItem(key) + localStorage.getItem(key), ); useEffect(() => { @@ -45,7 +45,7 @@ export const useLocalStorage = ( localStorage.setItem(key, newValue); localStorageBus.emit(key, newValue); }, - [key, setValue] + [key, setValue], ), ]; }; diff --git a/src/useMatrixRTCSessionJoinState.ts b/src/useMatrixRTCSessionJoinState.ts index c7c54563..7aac4e83 100644 --- a/src/useMatrixRTCSessionJoinState.ts +++ b/src/useMatrixRTCSessionJoinState.ts @@ -22,7 +22,7 @@ import { import { useCallback, useEffect, useState } from "react"; export function useMatrixRTCSessionJoinState( - rtcSession: MatrixRTCSession + rtcSession: MatrixRTCSession, ): boolean { const [isJoined, setJoined] = useState(rtcSession.isJoined()); @@ -30,7 +30,7 @@ export function useMatrixRTCSessionJoinState( logger.info( `Session in room ${rtcSession.room.roomId} changed to ${ rtcSession.isJoined() ? "joined" : "left" - }` + }`, ); setJoined(rtcSession.isJoined()); }, [rtcSession]); @@ -41,7 +41,7 @@ export function useMatrixRTCSessionJoinState( return () => { rtcSession.off( MatrixRTCSessionEvent.JoinStateChanged, - onJoinStateChanged + onJoinStateChanged, ); }; }, [rtcSession, onJoinStateChanged]); diff --git a/src/useMatrixRTCSessionMemberships.ts b/src/useMatrixRTCSessionMemberships.ts index a0d5a513..3873b7a2 100644 --- a/src/useMatrixRTCSessionMemberships.ts +++ b/src/useMatrixRTCSessionMemberships.ts @@ -23,13 +23,13 @@ import { import { useCallback, useEffect, useState } from "react"; export function useMatrixRTCSessionMemberships( - rtcSession: MatrixRTCSession + rtcSession: MatrixRTCSession, ): CallMembership[] { const [memberships, setMemberships] = useState(rtcSession.memberships); const onMembershipsChanged = useCallback(() => { logger.info( - `Memberships changed for call in room ${rtcSession.room.roomId} (${rtcSession.memberships.length} members)` + `Memberships changed for call in room ${rtcSession.room.roomId} (${rtcSession.memberships.length} members)`, ); setMemberships(rtcSession.memberships); }, [rtcSession]); @@ -37,13 +37,13 @@ export function useMatrixRTCSessionMemberships( useEffect(() => { rtcSession.on( MatrixRTCSessionEvent.MembershipsChanged, - onMembershipsChanged + onMembershipsChanged, ); return () => { rtcSession.off( MatrixRTCSessionEvent.MembershipsChanged, - onMembershipsChanged + onMembershipsChanged, ); }; }, [rtcSession, onMembershipsChanged]); diff --git a/src/useMediaQuery.ts b/src/useMediaQuery.ts index ab80f4c3..3927a64a 100644 --- a/src/useMediaQuery.ts +++ b/src/useMediaQuery.ts @@ -28,7 +28,7 @@ export function useMediaQuery(query: string): boolean { useEventTarget( mediaQuery, "change", - useCallback(() => setNumChanges((n) => n + 1), [setNumChanges]) + useCallback(() => setNumChanges((n) => n + 1), [setNumChanges]), ); // We want any change to the update counter to trigger an update here diff --git a/src/useMergedRefs.ts b/src/useMergedRefs.ts index 8139c154..5adfdf72 100644 --- a/src/useMergedRefs.ts +++ b/src/useMergedRefs.ts @@ -35,5 +35,5 @@ export const useMergedRefs = ( // Since this isn't an array literal, we can't use the static dependency // checker, but that's okay // eslint-disable-next-line react-hooks/exhaustive-deps - refs + refs, ); diff --git a/src/useReactiveState.ts b/src/useReactiveState.ts index 5693be54..f5daa1fe 100644 --- a/src/useReactiveState.ts +++ b/src/useReactiveState.ts @@ -30,7 +30,7 @@ import { */ export const useReactiveState = ( updateFn: (prevState?: T) => T, - deps: DependencyList + deps: DependencyList, ): [T, Dispatch>] => { const state = useRef(); if (state.current === undefined) state.current = updateFn(); @@ -61,7 +61,7 @@ export const useReactiveState = ( } setNumUpdates((n) => n + 1); // Force an update }, - [setNumUpdates] + [setNumUpdates], ), ]; }; diff --git a/src/video-grid/BigGrid.tsx b/src/video-grid/BigGrid.tsx index 9d75bc4d..39b6d82d 100644 --- a/src/video-grid/BigGrid.tsx +++ b/src/video-grid/BigGrid.tsx @@ -78,7 +78,7 @@ export interface SparseGrid { export function getPaths( g: SparseGrid, dest: number, - avoid: (cell: number) => boolean = (): boolean => false + avoid: (cell: number) => boolean = (): boolean => false, ): (number | null)[] { const destRow = row(dest, g); const destColumn = column(dest, g); @@ -145,7 +145,7 @@ function inArea( index: number, start: number, end: number, - g: SparseGrid + g: SparseGrid, ): boolean { const indexColumn = column(index, g); const indexRow = row(index, g); @@ -160,7 +160,7 @@ function inArea( function* cellsInArea( start: number, end: number, - g: SparseGrid + g: SparseGrid, ): Generator { const startColumn = column(start, g); const endColumn = column(end, g); @@ -179,7 +179,7 @@ export function forEachCellInArea( start: number, end: number, g: G, - fn: (c: G["cells"][0], i: number) => void + fn: (c: G["cells"][0], i: number) => void, ): void { for (const i of cellsInArea(start, end, g)) fn(g.cells[i], i); } @@ -188,7 +188,7 @@ function allCellsInArea( start: number, end: number, g: G, - fn: (c: G["cells"][0], i: number) => boolean + fn: (c: G["cells"][0], i: number) => boolean, ): boolean { for (const i of cellsInArea(start, end, g)) { if (!fn(g.cells[i], i)) return false; @@ -204,7 +204,7 @@ function countCellsInArea( start: number, end: number, g: G, - predicate: (c: G["cells"][0], i: number) => boolean + predicate: (c: G["cells"][0], i: number) => boolean, ): number { let count = 0; for (const i of cellsInArea(start, end, g)) { @@ -217,7 +217,7 @@ const areaEnd = ( start: number, columns: number, rows: number, - g: SparseGrid + g: SparseGrid, ): number => start + columns - 1 + g.columns * (rows - 1); const cloneGrid = (g: G): G => ({ @@ -231,7 +231,7 @@ const cloneGrid = (g: G): G => ({ */ function getNextGap( g: SparseGrid, - ignoreGap: (cell: number) => boolean + ignoreGap: (cell: number) => boolean, ): number | null { const last1By1Index = findLast1By1Index(g); if (last1By1Index === null) return null; @@ -278,13 +278,13 @@ function moveTileUnchecked(g: SparseGrid, from: number, to: number): void { to, toEnd, g, - (_c, i) => (g.cells[i] = movingCells.shift()) + (_c, i) => (g.cells[i] = movingCells.shift()), ); forEachCellInArea( from, fromEnd, g, - (_c, i) => (g.cells[i] ??= displacedTiles.shift()) + (_c, i) => (g.cells[i] ??= displacedTiles.shift()), ); } @@ -294,7 +294,7 @@ function moveTileUnchecked(g: SparseGrid, from: number, to: number): void { export function moveTile( g: G, from: number, - to: number + to: number, ): G { const tile = g.cells[from]!; @@ -333,7 +333,7 @@ function pushTileUp( g: SparseGrid, from: number, rows: number, - avoid: (cell: number) => boolean = (): boolean => false + avoid: (cell: number) => boolean = (): boolean => false, ): number { const tile = g.cells[from]!; @@ -347,7 +347,7 @@ function pushTileUp( to, Math.min(from - g.columns + tile.columns - 1, toEnd), g, - (c, i) => (c === undefined || is1By1(c)) && !avoid(i) + (c, i) => (c === undefined || is1By1(c)) && !avoid(i), ); if (cellsAboveAreDisplacable) { @@ -376,7 +376,7 @@ function canVacateArea(g: SparseGrid, start: number, end: number): boolean { start, end - newFullRows * g.columns, g, - (c) => c === undefined || is1By1(c) + (c) => c === undefined || is1By1(c), ); } @@ -391,7 +391,7 @@ function vacateArea(g: SparseGrid, start: number, end: number): SparseGrid { start, end, g, - (c, i) => c !== undefined || i >= g.cells.length + (c, i) => c !== undefined || i >= g.cells.length, ); const newFullRows = Math.floor(newCellCount / g.columns); const endRow = row(end, g); @@ -452,7 +452,7 @@ function vacateArea(g: SparseGrid, start: number, end: number): SparseGrid { const inputStructure = fillGaps( outputStructure, false, - (i) => inArea(i, start, end, g) && g.cells[i] === undefined + (i) => inArea(i, start, end, g) && g.cells[i] === undefined, ); // We exploit the fact that g and inputStructure have the same structure to @@ -464,7 +464,7 @@ function vacateArea(g: SparseGrid, start: number, end: number): SparseGrid { return { columns: g.columns, cells: outputStructure.cells.map((placeholder) => - structureMapping.get(placeholder) + structureMapping.get(placeholder), ), }; } @@ -475,21 +475,21 @@ function vacateArea(g: SparseGrid, start: number, end: number): SparseGrid { export function fillGaps( g: SparseGrid, packLargeTiles?: true, - ignoreGap?: () => false + ignoreGap?: () => false, ): Grid; export function fillGaps( g: SparseGrid, packLargeTiles?: boolean, - ignoreGap?: (cell: number) => boolean + ignoreGap?: (cell: number) => boolean, ): SparseGrid; export function fillGaps( g: SparseGrid, packLargeTiles = true, - ignoreGap: (cell: number) => boolean = (): boolean => false + ignoreGap: (cell: number) => boolean = (): boolean => false, ): SparseGrid { const lastGap = findLastIndex( g.cells, - (c, i) => c === undefined && !ignoreGap(i) + (c, i) => c === undefined && !ignoreGap(i), ); if (lastGap === null) return g; // There are no gaps to fill const lastGapRow = row(lastGap, g); @@ -500,10 +500,10 @@ export function fillGaps( // allowed to pack the large tiles into the rest of the grid as necessary) let idealLength = count( result.cells, - (c, i) => c !== undefined || ignoreGap(i) + (c, i) => c !== undefined || ignoreGap(i), ); const fullRowsRemoved = Math.floor( - (g.cells.length - idealLength) / g.columns + (g.cells.length - idealLength) / g.columns, ); // Step 1: Push all large tiles below the last gap upwards, so that they move @@ -620,7 +620,7 @@ function createRows(g: SparseGrid, count: number, atRow: number): SparseGrid { g, (c, i) => { result.cells[i + offset] = c; - } + }, ); } }); @@ -633,7 +633,7 @@ function createRows(g: SparseGrid, count: number, atRow: number): SparseGrid { */ export function addItems( items: TileDescriptor[], - g: SparseGrid + g: SparseGrid, ): SparseGrid { let result: SparseGrid = cloneGrid(g); @@ -655,7 +655,7 @@ export function addItems( // This item wants to be placed near another; let's put it on a row // directly below the related tile const placeNear = result.cells.findIndex( - (c) => c?.item.id === item.placeNear + (c) => c?.item.id === item.placeNear, ); if (placeNear === -1) { // Can't find the related tile, so let's give up and place it at the end @@ -666,7 +666,7 @@ export function addItems( placeNear, placeNearCell.columns, placeNearCell.rows, - result + result, ); result = createRows(result, 1, row(placeNearEnd, result) + 1); @@ -699,7 +699,7 @@ const extraLargeTileDimensions = (g: SparseGrid): [number, number] => export function cycleTileSize( g: G, - tile: TileDescriptor + tile: TileDescriptor, ): G { const from = g.cells.findIndex((c) => c?.item === tile); if (from === -1) return g; // Tile removed, no change @@ -727,7 +727,7 @@ function findNearestCell( g: G, nearestTo: number, shouldScan: (index: number) => boolean, - predicate: (cell: G["cells"][0], index: number) => boolean + predicate: (cell: G["cells"][0], index: number) => boolean, ): number | null { const scanLocations = new Set([nearestTo]); @@ -758,7 +758,7 @@ export function setTileSize( g: G, from: number, toWidth: number, - toHeight: number + toHeight: number, ): G { const fromCell = g.cells[from]!; const fromWidth = fromCell.columns; @@ -771,12 +771,12 @@ export function setTileSize( 0, Math.min( g.columns - toWidth, - column(from, g) + Math.trunc((fromWidth - toWidth) / 2) - ) + column(from, g) + Math.trunc((fromWidth - toWidth) / 2), + ), ); const toRow = Math.max( 0, - row(from, g) + Math.trunc((fromHeight - toHeight) / 2) + row(from, g) + Math.trunc((fromHeight - toHeight) / 2), ); const targetDest = toColumn + toRow * g.columns; @@ -788,7 +788,7 @@ export function setTileSize( const placeTile = ( to: number, toEnd: number, - grid: Grid | SparseGrid + grid: Grid | SparseGrid, ): void => { forEachCellInArea(to, toEnd, grid, (_c, i) => { grid.cells[i] = { @@ -824,7 +824,7 @@ export function setTileSize( (_c, i) => { const end = areaEnd(i, toWidth, toHeight, g); return end < newGridSize && canVacateArea(gridWithoutTile, i, end); - } + }, ); if (to !== null) { @@ -848,7 +848,7 @@ export function setTileSize( (_c, i) => { const end = areaEnd(i, toWidth, toHeight, g); return end < newGridSize && canVacateArea(packedGridWithoutTile, i, end); - } + }, ); if (to === null) return g; // There's no space anywhere; give up @@ -949,7 +949,7 @@ function updateTiles(g: Grid, tiles: TileDescriptor[]): Grid { // Step 2: Add new tiles const existingItemIds = new Set( - grid1.cells.filter((c) => c !== undefined).map((c) => c!.item.id) + grid1.cells.filter((c) => c !== undefined).map((c) => c!.item.id), ); const newItems = tiles.filter((i) => !existingItemIds.has(i.id)); const grid2 = addItems(newItems, grid1); @@ -967,7 +967,7 @@ function updateBounds(g: Grid, bounds: RectReadOnly): Grid { const Slots: FC<{ s: Grid }> = memo(({ s: g }) => { const areas = new Array<(number | null)[]>( - Math.ceil(g.cells.length / g.columns) + Math.ceil(g.cells.length / g.columns), ); for (let i = 0; i < areas.length; i++) areas[i] = new Array(g.columns).fill(null); @@ -981,7 +981,7 @@ const Slots: FC<{ s: Grid }> = memo(({ s: g }) => { i, slotEnd, g, - (_c, j) => (areas[row(j, g)][column(j, g)] = slotCount) + (_c, j) => (areas[row(j, g)][column(j, g)] = slotCount), ); slotCount++; } @@ -993,7 +993,7 @@ const Slots: FC<{ s: Grid }> = memo(({ s: g }) => { (row) => `'${row .map((slotId) => (slotId === null ? "." : `s${slotId}`)) - .join(" ")}'` + .join(" ")}'`, ) .join(" "), gridTemplateColumns: `repeat(${g.columns}, 1fr)`, @@ -1019,7 +1019,7 @@ function positionOnTileToCell( g: SparseGrid, tileOriginIndex: number, xPositionOnTile: number, - yPositionOnTile: number + yPositionOnTile: number, ): number { const tileOrigin = g.cells[tileOriginIndex]!; const columnOnTile = Math.floor(xPositionOnTile * tileOrigin.columns); @@ -1034,7 +1034,7 @@ function dragTile( xPositionOnFrom: number, yPositionOnFrom: number, xPositionOnTo: number, - yPositionOnTo: number + yPositionOnTo: number, ): Grid { const fromOrigin = g.cells.findIndex((c) => c.item === from); const toOrigin = g.cells.findIndex((c) => c.item === to); @@ -1042,13 +1042,13 @@ function dragTile( g, fromOrigin, xPositionOnFrom, - yPositionOnFrom + yPositionOnFrom, ); const toCell = positionOnTileToCell( g, toOrigin, xPositionOnTo, - yPositionOnTo + yPositionOnTo, ); return moveTile(g, fromOrigin, fromOrigin + toCell - fromCell); diff --git a/src/video-grid/Layout.tsx b/src/video-grid/Layout.tsx index 5294aeb6..fe8f2ec7 100644 --- a/src/video-grid/Layout.tsx +++ b/src/video-grid/Layout.tsx @@ -61,7 +61,7 @@ export interface Layout { xPositionOnFrom: number, yPositionOnFrom: number, xPositionOnTo: number, - yPositionOnTo: number + yPositionOnTo: number, ) => State; /** * Toggles the focus of the given tile (if this layout has the concept of @@ -109,7 +109,7 @@ interface UseLayout { xPositionOnFrom: number, yPositionOnFrom: number, xPositionOnTo: number, - yPositionOnTo: number + yPositionOnTo: number, ) => void; toggleFocus: ((tile: TileDescriptor) => void) | undefined; slots: ReactNode; @@ -123,7 +123,7 @@ export function useLayout( layout: Layout, items: TileDescriptor[], bounds: RectReadOnly, - layoutStates: LayoutStatesMap + layoutStates: LayoutStatesMap, ): UseLayout { const prevLayout = useRef>(); const prevState = layoutStates.get(layout); @@ -159,7 +159,7 @@ export function useLayout( generation: generation.current, canDragTile: useCallback( (tile: TileDescriptor) => layout.canDragTile(state, tile), - [layout, state] + [layout, state], ), dragTile: useCallback( ( @@ -168,7 +168,7 @@ export function useLayout( xPositionOnFrom: number, yPositionOnFrom: number, xPositionOnTo: number, - yPositionOnTo: number + yPositionOnTo: number, ) => setState((s) => layout.dragTile( @@ -178,17 +178,17 @@ export function useLayout( xPositionOnFrom, yPositionOnFrom, xPositionOnTo, - yPositionOnTo - ) + yPositionOnTo, + ), ), - [layout, setState] + [layout, setState], ), toggleFocus: useMemo( () => layout.toggleFocus && ((tile: TileDescriptor): void => setState((s) => layout.toggleFocus!(s, tile))), - [layout, setState] + [layout, setState], ), slots: , }; diff --git a/src/video-grid/NewVideoGrid.tsx b/src/video-grid/NewVideoGrid.tsx index 905a8a0c..8b32045c 100644 --- a/src/video-grid/NewVideoGrid.tsx +++ b/src/video-grid/NewVideoGrid.tsx @@ -98,13 +98,13 @@ export function NewVideoGrid({ useEffect(() => { if (slotsRoot !== null) { setRenderedGeneration( - parseInt(slotsRoot.getAttribute("data-generation")!) + parseInt(slotsRoot.getAttribute("data-generation")!), ); const observer = new MutationObserver((mutations) => { if (mutations.some((m) => m.type === "attributes")) { setRenderedGeneration( - parseInt(slotsRoot.getAttribute("data-generation")!) + parseInt(slotsRoot.getAttribute("data-generation")!), ); } }); @@ -158,13 +158,13 @@ export function NewVideoGrid({ if (renderedGeneration !== generation) return prevTiles ?? []; const tileRects = new Map( - zip(orderedItems, slotRects) as [TileDescriptor, Rect][] + zip(orderedItems, slotRects) as [TileDescriptor, Rect][], ); // In order to not break drag gestures, it's critical that we render tiles // in a stable order (that of 'items') return items.map((item) => ({ ...tileRects.get(item)!, item })); }, - [slotRects, grid, renderedGeneration] + [slotRects, grid, renderedGeneration], ); // Drag state is stored in a ref rather than component state, because we use @@ -200,7 +200,7 @@ export function NewVideoGrid({ }, leave: { opacity: 0, scale: 0, immediate: disableAnimations }, config: { mass: 0.7, tension: 252, friction: 25 }, - }) + }), // react-spring's types are bugged and can't infer the spring type ) as unknown as [TransitionFn, TileSpring>, SpringRef]; @@ -242,7 +242,7 @@ export function NewVideoGrid({ disableAnimations || ((key): boolean => key === "zIndex" || key === "x" || key === "y"), - } + }, ); const overTile = tiles.find( @@ -250,7 +250,7 @@ export function NewVideoGrid({ cursorX >= t.x && cursorX < t.x + t.width && cursorY >= t.y && - cursorY < t.y + t.height + cursorY < t.y + t.height, ); if (overTile !== undefined) @@ -260,7 +260,7 @@ export function NewVideoGrid({ (cursorX - tileX) / tile.width, (cursorY - tileY) / tile.height, (cursorX - overTile.x) / overTile.width, - (cursorY - overTile.y) / overTile.height + (cursorY - overTile.y) / overTile.height, ); }; @@ -287,7 +287,7 @@ export function NewVideoGrid({ // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore last, - }: Parameters>[0] + }: Parameters>[0], ): void => { if (tap) { const now = Date.now(); @@ -303,7 +303,7 @@ export function NewVideoGrid({ } } else { const tileController = springRef.current.find( - (c) => (c.item as Tile).item.id === tileId + (c) => (c.item as Tile).item.id === tileId, )!; if (canDragTile((tileController.item as Tile).item)) { @@ -347,7 +347,7 @@ export function NewVideoGrid({ animateDraggedTile(false); } }, - { target: gridRef2 } + { target: gridRef2 }, ); // Render nothing if the grid has yet to be generated diff --git a/src/video-grid/TileWrapper.tsx b/src/video-grid/TileWrapper.tsx index d1712ce5..2d37a3cd 100644 --- a/src/video-grid/TileWrapper.tsx +++ b/src/video-grid/TileWrapper.tsx @@ -25,7 +25,7 @@ interface Props { onDragRef: RefObject< ( tileId: string, - state: Parameters>[0] + state: Parameters>[0], ) => void >; targetWidth: number; @@ -87,7 +87,7 @@ export const TileWrapper = memo( height, boxShadow: to( [shadow, shadowSpread], - (s, ss) => `rgba(0, 0, 0, 0.5) 0px ${s}px ${2 * s}px ${ss}px` + (s, ss) => `rgba(0, 0, 0, 0.5) 0px ${s}px ${2 * s}px ${ss}px`, ), }, targetWidth, @@ -96,7 +96,7 @@ export const TileWrapper = memo( })} ); - } + }, // We pretend this component is a simple function rather than a // NamedExoticComponent, because that's the only way we can fit in a type // parameter diff --git a/src/video-grid/VideoGrid.tsx b/src/video-grid/VideoGrid.tsx index c65350c2..59cf78a7 100644 --- a/src/video-grid/VideoGrid.tsx +++ b/src/video-grid/VideoGrid.tsx @@ -151,7 +151,7 @@ function getTilePositions( gridHeight: number, pipXRatio: number, pipYRatio: number, - layout: Layout + layout: Layout, ): TilePosition[] { if (layout === "grid") { if (tileCount === 2 && focusedTileCount === 0) { @@ -159,7 +159,7 @@ function getTilePositions( gridWidth, gridHeight, pipXRatio, - pipYRatio + pipYRatio, ); } @@ -167,7 +167,7 @@ function getTilePositions( tileCount, focusedTileCount, gridWidth, - gridHeight + gridHeight, ); } else { return getSpotlightLayoutTilePositions(tileCount, gridWidth, gridHeight); @@ -178,13 +178,13 @@ function getOneOnOneLayoutTilePositions( gridWidth: number, gridHeight: number, pipXRatio: number, - pipYRatio: number + pipYRatio: number, ): TilePosition[] { const [remotePosition] = getFreedomLayoutTilePositions( 1, 0, gridWidth, - gridHeight + gridHeight, ); const gridAspectRatio = gridWidth / gridHeight; @@ -196,7 +196,7 @@ function getOneOnOneLayoutTilePositions( const pipScaleFactor = Math.min( 1, remotePosition.width / 3 / maxPipWidth, - remotePosition.height / 3 / maxPipHeight + remotePosition.height / 3 / maxPipHeight, ); const pipWidth = maxPipWidth * pipScaleFactor; const pipHeight = maxPipHeight * pipScaleFactor; @@ -223,7 +223,7 @@ function getOneOnOneLayoutTilePositions( function getSpotlightLayoutTilePositions( tileCount: number, gridWidth: number, - gridHeight: number + gridHeight: number, ): TilePosition[] { const tilePositions: TilePosition[] = []; @@ -293,7 +293,7 @@ function getFreedomLayoutTilePositions( tileCount: number, focusedTileCount: number, gridWidth: number, - gridHeight: number + gridHeight: number, ): TilePosition[] { if (tileCount === 0) { return []; @@ -307,7 +307,7 @@ function getFreedomLayoutTilePositions( tileCount, focusedTileCount, gridWidth, - gridHeight + gridHeight, ); let itemGridWidth; @@ -335,7 +335,7 @@ function getFreedomLayoutTilePositions( itemRowCount, itemTileAspectRatio, itemGridWidth, - itemGridHeight + itemGridHeight, ); const itemGridBounds = getSubGridBoundingBox(itemGridPositions); @@ -367,7 +367,7 @@ function getFreedomLayoutTilePositions( focusedRowCount, focusedTileAspectRatio, focusedGridWidth, - focusedGridHeight + focusedGridHeight, ); const tilePositions = [...focusedGridPositions, ...itemGridPositions]; @@ -380,7 +380,7 @@ function getFreedomLayoutTilePositions( gridWidth, gridHeight - focusedGridHeight, 0, - focusedGridHeight + focusedGridHeight, ); } else { centerTiles( @@ -388,7 +388,7 @@ function getFreedomLayoutTilePositions( gridWidth - focusedGridWidth, gridHeight, focusedGridWidth, - 0 + 0, ); } @@ -454,7 +454,7 @@ function getGridLayout( tileCount: number, focusedTileCount: number, gridWidth: number, - gridHeight: number + gridHeight: number, ): { itemGridRatio: number; layoutDirection: LayoutDirection } { let layoutDirection: LayoutDirection = "horizontal"; let itemGridRatio = 1; @@ -479,7 +479,7 @@ function centerTiles( gridWidth: number, gridHeight: number, offsetLeft: number, - offsetTop: number + offsetTop: number, ): TilePosition[] { const bounds = getSubGridBoundingBox(positions); @@ -494,7 +494,7 @@ function centerTiles( function applyTileOffsets( positions: TilePosition[], leftOffset: number, - topOffset: number + topOffset: number, ): TilePosition[] { for (const position of positions) { position.x += leftOffset; @@ -507,7 +507,7 @@ function applyTileOffsets( function getSubGridLayout( tileCount: number, gridWidth: number, - gridHeight: number + gridHeight: number, ): { columnCount: number; rowCount: number; tileAspectRatio: number } { const gridAspectRatio = gridWidth / gridHeight; @@ -624,7 +624,7 @@ function getSubGridPositions( rowCount: number, tileAspectRatio: number, gridWidth: number, - gridHeight: number + gridHeight: number, ): TilePosition[] { if (tileCount === 0) { return []; @@ -633,7 +633,7 @@ function getSubGridPositions( const newTilePositions: TilePosition[] = []; const boxWidth = Math.round( - (gridWidth - GAP * (columnCount + 1)) / columnCount + (gridWidth - GAP * (columnCount + 1)) / columnCount, ); const boxHeight = Math.round((gridHeight - GAP * (rowCount + 1)) / rowCount); @@ -675,7 +675,7 @@ function getSubGridPositions( const subgridWidth = tileWidth * columnCount + (GAP * columnCount - 1); centeringPadding = Math.round( (subgridWidth - (tileWidth * rowItemCount + (GAP * rowItemCount - 1))) / - 2 + 2, ); } @@ -699,7 +699,7 @@ function displayedTileCount( layout: Layout, tileCount: number, gridWidth: number, - gridHeight: number + gridHeight: number, ): number { let displayedTile = -1; if (layout === "grid") { @@ -731,7 +731,7 @@ function displayedTileCount( function reorderTiles( tiles: Tile[], layout: Layout, - displayedTile = -1 + displayedTile = -1, ): void { // We use a special layout for 1:1 to always put the local tile first. // We only do this if there are two tiles (obviously) and exactly one @@ -919,7 +919,7 @@ export function VideoGrid({ for (const item of items) { const existingTileIndex = newTiles.findIndex( - ({ key }) => item.id === key + ({ key }) => item.id === key, ); const existingTile = newTiles[existingTileIndex]; @@ -956,7 +956,7 @@ export function VideoGrid({ layout, newTiles.length, gridBounds.width, - gridBounds.height + gridBounds.height, ); } @@ -976,7 +976,7 @@ export function VideoGrid({ const focusedTileCount = newTiles.reduce( (count, tile) => count + (tile.focused ? 1 : 0), - 0 + 0, ); return { @@ -989,7 +989,7 @@ export function VideoGrid({ gridBounds.height, pipXRatio, pipYRatio, - layout + layout, ), }; }); @@ -998,7 +998,7 @@ export function VideoGrid({ const focusedTileCount = newTiles.reduce( (count, tile) => count + (tile.focused ? 1 : 0), - 0 + 0, ); lastLayoutRef.current = layout; @@ -1013,7 +1013,7 @@ export function VideoGrid({ gridBounds.height, pipXRatio, pipYRatio, - layout + layout, ), }; }); @@ -1066,7 +1066,7 @@ export function VideoGrid({ } else { const isMobile = isMobileBreakpoint( gridBounds.width, - gridBounds.height + gridBounds.height, ); const x = @@ -1127,7 +1127,7 @@ export function VideoGrid({ } }; }, - [tilePositions, disableAnimations, scrollPosition, layout, gridBounds] + [tilePositions, disableAnimations, scrollPosition, layout, gridBounds], ); const [springs, api] = useSprings(tiles.length, animate(tiles), [ @@ -1179,12 +1179,12 @@ export function VideoGrid({ gridBounds.height, pipXRatio, pipYRatio, - layout + layout, ), }; }); }, - [tiles, layout, gridBounds.width, gridBounds.height, pipXRatio, pipYRatio] + [tiles, layout, gridBounds.width, gridBounds.height, pipXRatio, pipYRatio], ); // Callback for useDrag. We could call useDrag here, but the default @@ -1213,7 +1213,7 @@ export function VideoGrid({ // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore event, - }: Parameters>[0] + }: Parameters>[0], ): void => { event.preventDefault(); @@ -1243,7 +1243,7 @@ export function VideoGrid({ const pipGap = getPipGap( gridBounds.width / gridBounds.height, - gridBounds.width + gridBounds.width, ); const pipMinX = remotePosition.x + pipGap; const pipMinY = remotePosition.y + pipGap; @@ -1270,7 +1270,7 @@ export function VideoGrid({ const hoverTile = tiles.find( (tile) => tile.key !== tileId && - isInside(cursorPosition, tilePositions[tile.order]) + isInside(cursorPosition, tilePositions[tile.order]), ); if (hoverTile) { @@ -1331,7 +1331,7 @@ export function VideoGrid({ e: | Omit, "event"> | Omit, "event">, - isWheel: boolean + isWheel: boolean, ) => { if (layout !== "spotlight") { return; @@ -1355,10 +1355,10 @@ export function VideoGrid({ } setScrollPosition((scrollPosition) => - Math.min(Math.max(movement + scrollPosition, min), 0) + Math.min(Math.max(movement + scrollPosition, min), 0), ); }, - [layout, gridBounds, tilePositions] + [layout, gridBounds, tilePositions], ); const bindGrid = useGesture( @@ -1370,7 +1370,7 @@ export function VideoGrid({ // @ts-ignore onDrag: (e) => onGridGesture(e, false), }, - {} + {}, ); return ( diff --git a/src/video-grid/VideoTile.module.css b/src/video-grid/VideoTile.module.css index 3b0238d8..cfd699c6 100644 --- a/src/video-grid/VideoTile.module.css +++ b/src/video-grid/VideoTile.module.css @@ -24,7 +24,9 @@ limitations under the License. overflow: hidden; cursor: pointer; outline: 2px solid rgba(0, 0, 0, 0); - transition: outline-radius ease 0.15s, outline-color ease 0.15s; + transition: + outline-radius ease 0.15s, + outline-color ease 0.15s; } .videoTile * { diff --git a/src/video-grid/VideoTile.tsx b/src/video-grid/VideoTile.tsx index 01101b0e..6192baab 100644 --- a/src/video-grid/VideoTile.tsx +++ b/src/video-grid/VideoTile.tsx @@ -84,7 +84,7 @@ export const VideoTile = forwardRef( showSpeakingIndicator, showConnectionStats, }, - tileRef + tileRef, ) => { const { t } = useTranslation(); @@ -93,7 +93,7 @@ export const VideoTile = forwardRef( // Handle display name changes. const [displayName, setDisplayName] = useReactiveState( () => member?.rawDisplayName ?? "[đź‘»]", - [member] + [member], ); useEffect(() => { if (member) { @@ -113,7 +113,7 @@ export const VideoTile = forwardRef( content === TileContent.UserMedia ? Track.Source.Microphone : Track.Source.ScreenShareAudio, - sfuParticipant + sfuParticipant, ).isMuted !== false; const MicIcon = muted ? MicOffSolidIcon : MicOnSolidIcon; @@ -126,11 +126,11 @@ export const VideoTile = forwardRef( useState(false); const openVideoTileSettingsModal = useCallback( () => setVideoTileSettingsModalOpen(true), - [setVideoTileSettingsModalOpen] + [setVideoTileSettingsModalOpen], ); const closeVideoTileSettingsModal = useCallback( () => setVideoTileSettingsModalOpen(false), - [setVideoTileSettingsModalOpen] + [setVideoTileSettingsModalOpen], ); const toolbarButtons: JSX.Element[] = []; @@ -141,7 +141,7 @@ export const VideoTile = forwardRef( className={styles.button} volume={(sfuParticipant as RemoteParticipant).getVolume() ?? 0} onPress={openVideoTileSettingsModal} - /> + />, ); if (content === TileContent.ScreenShare) { @@ -151,7 +151,7 @@ export const VideoTile = forwardRef( className={styles.button} fullscreen={fullscreen} onPress={onFullscreen} - /> + />, ); } } @@ -228,5 +228,5 @@ export const VideoTile = forwardRef( )} ); - } + }, ); diff --git a/src/video-grid/VideoTileSettingsModal.tsx b/src/video-grid/VideoTileSettingsModal.tsx index d3abaea6..2d69b220 100644 --- a/src/video-grid/VideoTileSettingsModal.tsx +++ b/src/video-grid/VideoTileSettingsModal.tsx @@ -39,7 +39,7 @@ const LocalVolume: FC = ({ : Track.Source.ScreenShareAudio; const [localVolume, setLocalVolume] = useState( - participant.getVolume(source) ?? 0 + participant.getVolume(source) ?? 0, ); const onLocalVolumeChanged = (event: ChangeEvent): void => { diff --git a/src/widget.ts b/src/widget.ts index 62576755..e0a0d340 100644 --- a/src/widget.ts +++ b/src/widget.ts @@ -155,7 +155,7 @@ export const widget = ((): WidgetHelpers | null => { timelineSupport: true, useE2eForGroupCall: e2eEnabled, fallbackICEServerAllowed: allowIceFallback, - } + }, ); const clientPromise = new Promise((resolve) => { diff --git a/test/Toast-test.tsx b/test/Toast-test.tsx index 605feaea..88cfbf4b 100644 --- a/test/Toast-test.tsx +++ b/test/Toast-test.tsx @@ -23,13 +23,13 @@ test("Toast renders", () => { render( {}}> Hello world! - + , ); expect(screen.queryByRole("dialog")).toBe(null); render( {}}> Hello world! - + , ); expect(screen.getByRole("dialog")).toMatchSnapshot(); }); @@ -39,7 +39,7 @@ test("Toast dismisses when clicked", async () => { render( Hello world! - + , ); await userEvent.click(screen.getByRole("dialog")); expect(onDismiss).toHaveBeenCalled(); @@ -51,7 +51,7 @@ test("Toast dismisses itself after the specified timeout", async () => { render( Hello world! - + , ); jest.advanceTimersByTime(2000); expect(onDismiss).toHaveBeenCalled(); diff --git a/test/UrlParams-test.ts b/test/UrlParams-test.ts index 8580868e..e0eb7c29 100644 --- a/test/UrlParams-test.ts +++ b/test/UrlParams-test.ts @@ -34,28 +34,28 @@ describe("UrlParams", () => { describe("handles URL with /room/", () => { it("and nothing else", () => { expect( - getRoomIdentifierFromUrl(`/room/${ROOM_NAME}`, "", "").roomAlias + getRoomIdentifierFromUrl(`/room/${ROOM_NAME}`, "", "").roomAlias, ).toBe(`#${ROOM_NAME}:${HOMESERVER}`); }); it("and #", () => { expect( getRoomIdentifierFromUrl("", `${ORIGIN}/room/`, `#${ROOM_NAME}`) - .roomAlias + .roomAlias, ).toBe(`#${ROOM_NAME}:${HOMESERVER}`); }); it("and # and server part", () => { expect( getRoomIdentifierFromUrl("", `/room/`, `#${ROOM_NAME}:${HOMESERVER}`) - .roomAlias + .roomAlias, ).toBe(`#${ROOM_NAME}:${HOMESERVER}`); }); it("and server part", () => { expect( getRoomIdentifierFromUrl(`/room/${ROOM_NAME}:${HOMESERVER}`, "", "") - .roomAlias + .roomAlias, ).toBe(`#${ROOM_NAME}:${HOMESERVER}`); }); }); @@ -63,27 +63,27 @@ describe("UrlParams", () => { describe("handles URL without /room/", () => { it("and nothing else", () => { expect(getRoomIdentifierFromUrl(`/${ROOM_NAME}`, "", "").roomAlias).toBe( - `#${ROOM_NAME}:${HOMESERVER}` + `#${ROOM_NAME}:${HOMESERVER}`, ); }); it("and with #", () => { expect(getRoomIdentifierFromUrl("", "", `#${ROOM_NAME}`).roomAlias).toBe( - `#${ROOM_NAME}:${HOMESERVER}` + `#${ROOM_NAME}:${HOMESERVER}`, ); }); it("and with # and server part", () => { expect( getRoomIdentifierFromUrl("", "", `#${ROOM_NAME}:${HOMESERVER}`) - .roomAlias + .roomAlias, ).toBe(`#${ROOM_NAME}:${HOMESERVER}`); }); it("and with server part", () => { expect( getRoomIdentifierFromUrl(`/${ROOM_NAME}:${HOMESERVER}`, "", "") - .roomAlias + .roomAlias, ).toBe(`#${ROOM_NAME}:${HOMESERVER}`); }); }); @@ -91,7 +91,7 @@ describe("UrlParams", () => { describe("handles search params", () => { it("(roomId)", () => { expect( - getRoomIdentifierFromUrl("", `?roomId=${ROOM_ID}`, "").roomId + getRoomIdentifierFromUrl("", `?roomId=${ROOM_ID}`, "").roomId, ).toBe(ROOM_ID); }); }); @@ -99,7 +99,7 @@ describe("UrlParams", () => { it("ignores room alias", () => { expect( getRoomIdentifierFromUrl("", `/room/${ROOM_NAME}:${HOMESERVER}`, "") - .roomAlias + .roomAlias, ).toBeFalsy(); }); }); diff --git a/test/home/CallList-test.tsx b/test/home/CallList-test.tsx index b2a1e5ec..3920be89 100644 --- a/test/home/CallList-test.tsx +++ b/test/home/CallList-test.tsx @@ -28,7 +28,7 @@ describe("CallList", () => { - + , ); }; diff --git a/test/initializer-test.ts b/test/initializer-test.ts index b31f6a87..33cb6854 100644 --- a/test/initializer-test.ts +++ b/test/initializer-test.ts @@ -20,7 +20,9 @@ test("initBeforeReact sets font family from URL param", () => { window.location.hash = "#?font=DejaVu Sans"; Initializer.initBeforeReact(); expect( - getComputedStyle(document.documentElement).getPropertyValue("--font-family") + getComputedStyle(document.documentElement).getPropertyValue( + "--font-family", + ), ).toBe('"DejaVu Sans"'); }); @@ -28,6 +30,6 @@ test("initBeforeReact sets font scale from URL param", () => { window.location.hash = "#?fontScale=1.2"; Initializer.initBeforeReact(); expect( - getComputedStyle(document.documentElement).getPropertyValue("--font-scale") + getComputedStyle(document.documentElement).getPropertyValue("--font-scale"), ).toBe("1.2"); }); diff --git a/test/otel/ObjectFlattener-test.ts b/test/otel/ObjectFlattener-test.ts index bbaf1146..bee81a6e 100644 --- a/test/otel/ObjectFlattener-test.ts +++ b/test/otel/ObjectFlattener-test.ts @@ -120,7 +120,7 @@ describe("ObjectFlattener", () => { statsReport.report.resolution, flatObject, "matrix.call.stats.connection.resolution.", - 0 + 0, ); expect(flatObject).toEqual({ "matrix.call.stats.connection.resolution.local.LOCAL_AUDIO_TRACK_ID.height": @@ -146,7 +146,7 @@ describe("ObjectFlattener", () => { statsReport.report.transport, flatObject, "matrix.call.stats.connection.transport.", - 0 + 0, ); expect(flatObject).toEqual({ "matrix.call.stats.connection.transport.0.ip": @@ -177,8 +177,8 @@ describe("ObjectFlattener", () => { expect( ObjectFlattener.flattenReportObject( "matrix.call.stats.connection", - statsReport.report - ) + statsReport.report, + ), ).toEqual({ "matrix.call.stats.connection.callId": "callId", "matrix.call.stats.connection.opponentMemberId": "opponentMemberId", @@ -259,8 +259,8 @@ describe("ObjectFlattener", () => { expect( ObjectFlattener.flattenReportObject( "matrix.call.stats.bytesSend", - byteSentStatsReport - ) + byteSentStatsReport, + ), ).toEqual({ "matrix.call.stats.bytesSend.4aa92608-04c6-428e-8312-93e17602a959": 132093, "matrix.call.stats.bytesSend.a08e4237-ee30-4015-a932-b676aec894b1": 913448, diff --git a/test/room/checkForParallelCalls-test.ts b/test/room/checkForParallelCalls-test.ts index 0a1344df..49f5753d 100644 --- a/test/room/checkForParallelCalls-test.ts +++ b/test/room/checkForParallelCalls-test.ts @@ -21,7 +21,7 @@ import { checkForParallelCalls } from "../../src/room/checkForParallelCalls"; import { withFakeTimers } from "../utils"; const withMockedPosthog = ( - continuation: (posthog: Mocked) => void + continuation: (posthog: Mocked) => void, ) => { const posthog = mocked({ trackEvent: jest.fn(), @@ -37,7 +37,7 @@ const withMockedPosthog = ( }; const mockRoomState = ( - groupCallMemberContents: Record[] + groupCallMemberContents: Record[], ): RoomState => { const stateEvents = groupCallMemberContents.map((content) => ({ getContent: () => content, diff --git a/test/video-grid/BigGrid-test.ts b/test/video-grid/BigGrid-test.ts index 7bc20a95..06e73dac 100644 --- a/test/video-grid/BigGrid-test.ts +++ b/test/video-grid/BigGrid-test.ts @@ -81,7 +81,7 @@ testFillGaps( ` `, ` -` +`, ); testFillGaps( @@ -93,7 +93,7 @@ ef`, ` ab cd -ef` +ef`, ); testFillGaps( @@ -104,7 +104,7 @@ cde f`, ` cab -fde` +fde`, ); testFillGaps( @@ -117,7 +117,7 @@ mno`, ` aebch difgl -mjnok` +mjnok`, ); testFillGaps( @@ -130,7 +130,7 @@ ijkl`, ` abcd ehkf -glji` +glji`, ); testFillGaps( @@ -141,7 +141,7 @@ aa bc`, ` aa -cb` +cb`, ); testFillGaps( @@ -156,7 +156,7 @@ k`, abce dddf dddj -kghi` +kghi`, ); testFillGaps( @@ -169,7 +169,7 @@ i`, ` afbc dddd -iegh` +iegh`, ); testFillGaps( @@ -183,7 +183,7 @@ ii`, ` abcd iigh -iief` +iief`, ); testFillGaps( @@ -198,7 +198,7 @@ hh ` abcd hhfg -hhie` +hhie`, ); testFillGaps( @@ -213,14 +213,14 @@ ghij`, aadf aaji bcch -eccg` +eccg`, ); function testCycleTileSize( title: string, tileId: string, input: string, - output: string + output: string, ): void { test(`cycleTileSize ${title}`, () => { const grid = mkGrid(input); @@ -240,7 +240,7 @@ ghi`, acc dcc gbe -ifh` +ifh`, ); testCycleTileSize( @@ -253,7 +253,7 @@ efgh`, acdh bggg fggg -e` +e`, ); testCycleTileSize( @@ -267,7 +267,7 @@ jk`, ` abhc djge -fik` +fik`, ); testCycleTileSize( @@ -287,7 +287,7 @@ dde ddf ccm cch -lik` +lik`, ); testCycleTileSize( @@ -302,7 +302,7 @@ ddf`, abb cbb dde -ddf` +ddf`, ); test("cycleTileSize is its own inverse", () => { @@ -337,18 +337,18 @@ function testAddItems( title: string, items: TileDescriptor[], input: string, - output: string + output: string, ): void { test(`addItems ${title}`, () => { expect(showGrid(addItems(items, mkGrid(input) as SparseGrid) as Grid)).toBe( - output + output, ); }); } testAddItems( "appends 1Ă—1 tiles", - ["e", "f"].map((i) => ({ id: i } as unknown as TileDescriptor)), + ["e", "f"].map((i) => ({ id: i }) as unknown as TileDescriptor), ` aab aac @@ -356,7 +356,7 @@ d`, ` aab aac -def` +def`, ); testAddItems( @@ -368,7 +368,7 @@ def`, ` abc g -def` +def`, ); testAddItems( @@ -381,7 +381,7 @@ def`, abc ggf gge -d` +d`, ); function testMoveTile( @@ -389,7 +389,7 @@ function testMoveTile( from: number, to: number, input: string, - output: string + output: string, ): void { test(`moveTile ${title}`, () => { expect(showGrid(moveTile(mkGrid(input), from, to))).toBe(output); @@ -403,7 +403,7 @@ testMoveTile( ` abc`, ` -abc` +abc`, ); testMoveTile( @@ -413,7 +413,7 @@ testMoveTile( ` abc`, ` -abc` +abc`, ); testMoveTile( @@ -427,7 +427,7 @@ cce`, ` acc bcc -d e` +d e`, ); testMoveTile( @@ -441,14 +441,14 @@ cce`, ` abb ccd -cce` +cce`, ); function testResize( title: string, columns: number, input: string, - output: string + output: string, ): void { test(`resize ${title}`, () => { expect(showGrid(resize(mkGrid(input), columns))).toBe(output); @@ -471,7 +471,7 @@ bb dd dd ch -eg` +eg`, ); testResize( @@ -489,5 +489,5 @@ eg`, afcd bbbg bbbe -h` +h`, ); diff --git a/vite.config.js b/vite.config.js index 634d34b4..46a00d72 100644 --- a/vite.config.js +++ b/vite.config.js @@ -52,7 +52,7 @@ export default defineConfig(({ mode }) => { sentryVitePlugin({ include: "./dist", release: process.env.VITE_APP_VERSION, - }) + }), ); } From bc109a417d2f6f12ab59abbf82afaa802b8fb2c1 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Wed, 11 Oct 2023 14:45:49 +0000 Subject: [PATCH 13/14] Update dependency postcss-preset-env to v9.2.0 --- yarn.lock | 298 ++++++++++++++++++++++++++---------------------------- 1 file changed, 144 insertions(+), 154 deletions(-) diff --git a/yarn.lock b/yarn.lock index 167628da..abeca2a9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1116,7 +1116,7 @@ resolved "https://registry.yarnpkg.com/@bufbuild/protobuf/-/protobuf-1.3.1.tgz#c4de66bacbe7ac97fe054e68314aeba6f45177f9" integrity sha512-BUyJWutgP2S8K/1NphOJokuwDckXS4qI2T1pGZAlkFdZchWae3jm6fCdkcGbLlM1QLOcNFFePd+7Feo4BYGrJQ== -"@csstools/cascade-layer-name-parser@^1.0.4", "@csstools/cascade-layer-name-parser@^1.0.5": +"@csstools/cascade-layer-name-parser@^1.0.5": version "1.0.5" resolved "https://registry.yarnpkg.com/@csstools/cascade-layer-name-parser/-/cascade-layer-name-parser-1.0.5.tgz#c4d276e32787651df0007af22c9fa70d9c9ca3c2" integrity sha512-v/5ODKNBMfBl0us/WQjlfsvSlYxfZLhNMVIsuCPib2ulTwGKYbKJbwqw671+qH9Y4wvWVnu7LBChvml/wBKjFg== @@ -1131,25 +1131,25 @@ resolved "https://registry.yarnpkg.com/@csstools/css-calc/-/css-calc-1.1.4.tgz#70bf4c5b379cdc256d3936bf4a21e3a3454a3d68" integrity sha512-ZV1TSmToiNcQL1P3hfzlzZzA02mmVkVmXGaUDUqpYUG84PmLhVSZpKX+KfxAuOcK7de04UXSQPBrAvaya6iiGg== -"@csstools/css-color-parser@^1.3.2": - version "1.3.2" - resolved "https://registry.yarnpkg.com/@csstools/css-color-parser/-/css-color-parser-1.3.2.tgz#ec6ac35e24a34e1f37eb3d366a2ea637bcc7c7e5" - integrity sha512-YLCWI+nm18qr5nj7QhRMGuIi4ddFe0SKEtPQliLf1+pmyHFxoHYd0+Hg+bRnbnVbdyCTTlCqBiUvCeNJfd903g== +"@csstools/css-color-parser@^1.4.0": + version "1.4.0" + resolved "https://registry.yarnpkg.com/@csstools/css-color-parser/-/css-color-parser-1.4.0.tgz#c8517457dcb6ad080848b1583aa029ab61221ce8" + integrity sha512-SlGd8E6ron24JYQPQAIzu5tvmWi1H4sDKTdA7UDnwF45oJv7AVESbOlOO1YjfBhrQFuvLWUgKiOY9DwGoAxwTA== dependencies: "@csstools/color-helpers" "^3.0.2" "@csstools/css-calc" "^1.1.4" -"@csstools/css-parser-algorithms@^2.3.1", "@csstools/css-parser-algorithms@^2.3.2": +"@csstools/css-parser-algorithms@2.3.2", "@csstools/css-parser-algorithms@^2.3.2": version "2.3.2" resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.3.2.tgz#1e0d581dbf4518cb3e939c3b863cb7180c8cedad" integrity sha512-sLYGdAdEY2x7TSw9FtmdaTrh2wFtRJO5VMbBrA8tEqEod7GEggFmxTSK9XqExib3yMuYNcvcTdCZIP6ukdjAIA== -"@csstools/css-tokenizer@^2.2.0", "@csstools/css-tokenizer@^2.2.1": +"@csstools/css-tokenizer@^2.2.1": version "2.2.1" resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-2.2.1.tgz#9dc431c9a5f61087af626e41ac2a79cce7bb253d" integrity sha512-Zmsf2f/CaEPWEVgw29odOj+WEVoiJy9s9NOv5GgNY9mZ1CZ7394By6wONrONrTsnNDv6F9hR02nvFihrGVGHBg== -"@csstools/media-query-list-parser@^2.1.4", "@csstools/media-query-list-parser@^2.1.5": +"@csstools/media-query-list-parser@^2.1.5": version "2.1.5" resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.5.tgz#94bc8b3c3fd7112a40b7bf0b483e91eba0654a0f" integrity sha512-IxVBdYzR8pYe89JiyXQuYk4aVVoCPhMJkz6ElRwlVysjwURTsTk/bmY/z4FfeRE+CRBMlykPwXEVUg8lThv7AQ== @@ -1162,27 +1162,27 @@ "@csstools/selector-specificity" "^3.0.0" postcss-selector-parser "^6.0.13" -"@csstools/postcss-color-function@^3.0.4": - version "3.0.5" - resolved "https://registry.yarnpkg.com/@csstools/postcss-color-function/-/postcss-color-function-3.0.5.tgz#4f50b7e71869fcd4499d4235e23127b579da73b1" - integrity sha512-q9E7oJwf1Z8nJqQbob9DmFxrte3RQc+pwV+5WlWw6Ei9XaObaNJlPAQ1HfOpcEg/fxrRf/Yf6fgO8Q01r7u17A== +"@csstools/postcss-color-function@^3.0.7": + version "3.0.7" + resolved "https://registry.yarnpkg.com/@csstools/postcss-color-function/-/postcss-color-function-3.0.7.tgz#646b0c3e3805e4bb9c1e240bce807f1cc6ccdfea" + integrity sha512-/PIB20G1TPCXmQlaJLWIYzTZRZpj6csT4ijgnshIj/kcmniIRroAfDa0xSWnfuO1eNo0NptIaPU7jzUukWn55Q== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" -"@csstools/postcss-color-mix-function@^2.0.4": - version "2.0.5" - resolved "https://registry.yarnpkg.com/@csstools/postcss-color-mix-function/-/postcss-color-mix-function-2.0.5.tgz#589fea3346fc985cdfa49a1fdc12c28125def985" - integrity sha512-0MDBTG0FPDjNlAYMImNjnQ9lrldiFRCmsBx4dZB1ikbFwt6aYJRWDjgXoZY+1CmQ6m1qPeBJO762i6AKwQDlQQ== +"@csstools/postcss-color-mix-function@^2.0.7": + version "2.0.7" + resolved "https://registry.yarnpkg.com/@csstools/postcss-color-mix-function/-/postcss-color-mix-function-2.0.7.tgz#0fc9b638bd6b9578a52a50e3af66109ae52dc2b6" + integrity sha512-57/g8aGo5eKFjEeJMiRKh8Qq43K2rCyk5ZZTvJ34TNl4zUtYU5DvLkIkOnhCtL8/a4z9oMA42aOnFPddRrScUQ== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" -"@csstools/postcss-exponential-functions@^1.0.0": +"@csstools/postcss-exponential-functions@^1.0.1": version "1.0.1" resolved "https://registry.yarnpkg.com/@csstools/postcss-exponential-functions/-/postcss-exponential-functions-1.0.1.tgz#0d938f58ba5ac5c362e09ad22b5768b04ee82650" integrity sha512-ZLK2iSK4DUxeypGce2PnQSdYugUqDTwxnhNiq1o6OyKMNYgYs4eKbvEhFG8JKr1sJWbeqBi5jRr0017l2EWVvg== @@ -1198,31 +1198,40 @@ dependencies: postcss-value-parser "^4.2.0" -"@csstools/postcss-gradients-interpolation-method@^4.0.4": - version "4.0.5" - resolved "https://registry.yarnpkg.com/@csstools/postcss-gradients-interpolation-method/-/postcss-gradients-interpolation-method-4.0.5.tgz#aeb9cb87df28247aeda706ac7d650335e24294b2" - integrity sha512-ABDOADpKrTvNb+cUBj9ciocCgFvE832eENKVuONca1u2bkFL4jM9430XFmi/GOgzt0agg5Q8FFJHXgYyKbgOFQ== +"@csstools/postcss-gamut-mapping@^1.0.0": + version "1.0.0" + resolved "https://registry.yarnpkg.com/@csstools/postcss-gamut-mapping/-/postcss-gamut-mapping-1.0.0.tgz#a23d2c4bd2bd89b2ed3c5d2e062c069ad18745e0" + integrity sha512-6UQyK8l9YaG5Ao5rBDcCnKHrLsHiQ1E0zeFQuqDJqEtinVzAPb/MwSw3TenZXL1Rnd7th3tb+4CBFHBXdW5tbQ== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" + "@csstools/css-parser-algorithms" "2.3.2" + "@csstools/css-tokenizer" "^2.2.1" + +"@csstools/postcss-gradients-interpolation-method@^4.0.7": + version "4.0.7" + resolved "https://registry.yarnpkg.com/@csstools/postcss-gradients-interpolation-method/-/postcss-gradients-interpolation-method-4.0.7.tgz#e5c2628157fb9dea9aa8cd9c84fdcc2a842af91b" + integrity sha512-GT1CzE/Tyr/ei4j5BwKESkHAgg+Gzys/0mAY7W+UiR+XrcYk5hDbOrE/YJIx1rflfO/7La1bDoZtA0YnLl4qNA== + dependencies: + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" -"@csstools/postcss-hwb-function@^3.0.3": - version "3.0.4" - resolved "https://registry.yarnpkg.com/@csstools/postcss-hwb-function/-/postcss-hwb-function-3.0.4.tgz#431d2fe3af0956a5f0f52b71126a872e04bb39df" - integrity sha512-HxyOVYowL0wsz7BjlAyGu3ydPGliXHgVnXP4pOWFktkAaBvjks8S51NqMbR6AkBQHB9W4nt9KW2qB6Qt2PJ80A== +"@csstools/postcss-hwb-function@^3.0.6": + version "3.0.6" + resolved "https://registry.yarnpkg.com/@csstools/postcss-hwb-function/-/postcss-hwb-function-3.0.6.tgz#7d56583c6c8607352718a802f87e51edf4f9365e" + integrity sha512-uQgWt2Ho2yy2S6qthWY7mD5v57NKxi6dD1NB8nAybU5bJSsm+hLXRGm3/zbOH4xNrqO3Cl60DFSNlSrUME3Xjg== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" -"@csstools/postcss-ic-unit@^3.0.1": - version "3.0.1" - resolved "https://registry.yarnpkg.com/@csstools/postcss-ic-unit/-/postcss-ic-unit-3.0.1.tgz#9d4964fe9da11f51463e0a141b3184ee3a23acb8" - integrity sha512-OkKZV0XZQixChA6r68O9UfGNFv06cPVcuT+MjpzfEuoCfbNWCj+b0dhsmdz776giQ+DymPmFDlTD+QJEFPI7rw== +"@csstools/postcss-ic-unit@^3.0.2": + version "3.0.2" + resolved "https://registry.yarnpkg.com/@csstools/postcss-ic-unit/-/postcss-ic-unit-3.0.2.tgz#08b62de51a3636ba40ba8e77cef4619a6e636aac" + integrity sha512-n28Er7W9qc48zNjJnvTKuVHY26/+6YlA9WzJRksIHiAWOMxSH5IksXkw7FpkIOd+jLi59BMrX/BWrZMgjkLBHg== dependencies: - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" postcss-value-parser "^4.2.0" "@csstools/postcss-initial@^1.0.0": @@ -1230,10 +1239,10 @@ resolved "https://registry.yarnpkg.com/@csstools/postcss-initial/-/postcss-initial-1.0.0.tgz#e35ec12143a654b384fb81623970deeacedb0769" integrity sha512-1l7iHHjIl5qmVeGItugr4ZOlCREDP71mNKqoEyxlosIoiu3Os1nPWMHpuCvDLCLiWI/ONTOg3nzJh7gwHOrqUA== -"@csstools/postcss-is-pseudo-class@^4.0.2": - version "4.0.2" - resolved "https://registry.yarnpkg.com/@csstools/postcss-is-pseudo-class/-/postcss-is-pseudo-class-4.0.2.tgz#c896e25baf0a5249eb5c5e8cce78dfc0cc11380e" - integrity sha512-LeAJozyZTY3c1SaHMbwF4p8Ego/2HHprYusmmdmUH7wP6lRF1w3s7IO2iNwQ6fHBrSOfkPUFaUtRUGZLBE23Eg== +"@csstools/postcss-is-pseudo-class@^4.0.3": + version "4.0.3" + resolved "https://registry.yarnpkg.com/@csstools/postcss-is-pseudo-class/-/postcss-is-pseudo-class-4.0.3.tgz#d8b04ff5eefb1a9bc8f1ab99b8f3b6b04b704480" + integrity sha512-/dt5M9Ty/x3Yiq0Nm/5PJJzwkVFchJgdjKVnryBPtoMCb9ohb/nDIJOwr/Wr3hK3FDs1EA1GE6PyRYsUmQPS8Q== dependencies: "@csstools/selector-specificity" "^3.0.0" postcss-selector-parser "^6.0.13" @@ -1250,14 +1259,14 @@ dependencies: postcss-value-parser "^4.2.0" -"@csstools/postcss-logical-viewport-units@^2.0.2": +"@csstools/postcss-logical-viewport-units@^2.0.3": version "2.0.3" resolved "https://registry.yarnpkg.com/@csstools/postcss-logical-viewport-units/-/postcss-logical-viewport-units-2.0.3.tgz#95e7195660bb8b05cd46f13d0495fe427e2db988" integrity sha512-xeVxqND5rlQyqLGdH7rX34sIm/JbbQKxpKQP8oD1YQqUHHCLQR9NUS57WqJKajxKN6AcNAMWJhb5LUH5RfPcyA== dependencies: "@csstools/css-tokenizer" "^2.2.1" -"@csstools/postcss-media-minmax@^1.0.7": +"@csstools/postcss-media-minmax@^1.1.0": version "1.1.0" resolved "https://registry.yarnpkg.com/@csstools/postcss-media-minmax/-/postcss-media-minmax-1.1.0.tgz#8d46317b6686cd49e05870ae3c8993e49a54149c" integrity sha512-t5Li/DPC5QmW/6VFLfUvsw/4dNYYseWR0tOXDeJg/9EKUodBgNawz5tuk5vYKtNvoj+Q08odMuXcpS5YJj0AFA== @@ -1267,7 +1276,7 @@ "@csstools/css-tokenizer" "^2.2.1" "@csstools/media-query-list-parser" "^2.1.5" -"@csstools/postcss-media-queries-aspect-ratio-number-values@^2.0.2": +"@csstools/postcss-media-queries-aspect-ratio-number-values@^2.0.3": version "2.0.3" resolved "https://registry.yarnpkg.com/@csstools/postcss-media-queries-aspect-ratio-number-values/-/postcss-media-queries-aspect-ratio-number-values-2.0.3.tgz#a74355c828a13ede8e8390bcf2701a34a60696b3" integrity sha512-IPL8AvnwMYW+cWtp+j8cW3MFN0RyXNT4hLOvs6Rf2N+NcbvXhSyKxZuE3W9Cv4KjaNoNoGx1d0UhT6tktq6tUw== @@ -1290,32 +1299,32 @@ dependencies: postcss-value-parser "^4.2.0" -"@csstools/postcss-oklab-function@^3.0.4": - version "3.0.5" - resolved "https://registry.yarnpkg.com/@csstools/postcss-oklab-function/-/postcss-oklab-function-3.0.5.tgz#8a299198a2c3b6698677b1b9b19cde4f85b95e0e" - integrity sha512-tFjYaBbAvoks5yvE9uA3b3xsqVKkZJ2sXwPMw1bxlv2ydrmdiojuoRAskRfvMbZQkzp47DzBP1V9GhDLOyFVYA== +"@csstools/postcss-oklab-function@^3.0.7": + version "3.0.7" + resolved "https://registry.yarnpkg.com/@csstools/postcss-oklab-function/-/postcss-oklab-function-3.0.7.tgz#4daff9e85b7f68ea744f2898f73e81d6fe47c0d7" + integrity sha512-vBFTQD3CARB3u/XIGO44wWbcO7xG/4GsYqJlcPuUGRSK8mtxes6n4vvNFlIByyAZy2k4d4RY63nyvTbMpeNTaQ== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" -"@csstools/postcss-progressive-custom-properties@^3.0.1": - version "3.0.1" - resolved "https://registry.yarnpkg.com/@csstools/postcss-progressive-custom-properties/-/postcss-progressive-custom-properties-3.0.1.tgz#15251d880d60850df42deeb7702aab6c50ab74e7" - integrity sha512-yfdEk8o3CWPTusoInmGpOVCcMg1FikcKZyYB5ApULg9mES4FTGNuHK3MESscmm64yladcLNkPlz26O7tk3LMbA== +"@csstools/postcss-progressive-custom-properties@^3.0.2": + version "3.0.2" + resolved "https://registry.yarnpkg.com/@csstools/postcss-progressive-custom-properties/-/postcss-progressive-custom-properties-3.0.2.tgz#0c18152160a425950cb69a12a9add55af4f688e7" + integrity sha512-YEvTozk1SxnV/PGL5DllBVDuLQ+jiQhyCSQiZJ6CwBMU5JQ9hFde3i1qqzZHuclZfptjrU0JjlX4ePsOhxNzHw== dependencies: postcss-value-parser "^4.2.0" -"@csstools/postcss-relative-color-syntax@^2.0.4": - version "2.0.5" - resolved "https://registry.yarnpkg.com/@csstools/postcss-relative-color-syntax/-/postcss-relative-color-syntax-2.0.5.tgz#6ab9f87e6a748ac66e7e6adea179486222c685d5" - integrity sha512-wK8IX6X2+kLKxTTTq5yd7mH2U+GPcTMTpP2rM8ig0/rgxuid7vgTOxup6heZUk1IUA409eak3bYGOtDDYCpxbQ== +"@csstools/postcss-relative-color-syntax@^2.0.7": + version "2.0.7" + resolved "https://registry.yarnpkg.com/@csstools/postcss-relative-color-syntax/-/postcss-relative-color-syntax-2.0.7.tgz#1d017aa25e3cda513cf00401a91899e9d3b83659" + integrity sha512-2AiFbJSVF4EyymLxme4JzSrbXykHolx8DdZECHjYKMhoulhKLltx5ccYgtrK3BmXGd3v3nJrWFCc8JM8bjuiOg== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" "@csstools/postcss-scope-pseudo-class@^3.0.0": version "3.0.0" @@ -1324,7 +1333,7 @@ dependencies: postcss-selector-parser "^6.0.13" -"@csstools/postcss-stepped-value-functions@^3.0.1": +"@csstools/postcss-stepped-value-functions@^3.0.2": version "3.0.2" resolved "https://registry.yarnpkg.com/@csstools/postcss-stepped-value-functions/-/postcss-stepped-value-functions-3.0.2.tgz#a902395efbf9c5c30a6d902a7c65549fb3f49309" integrity sha512-I3wX44MZVv+tDuWfrd3BTvRB/YRIM2F5v1MBtTI89sxpFn47mNpTwpPYUOGPVCgKlRDfZSlxIUYhUQmqRQZZFQ== @@ -1341,7 +1350,7 @@ "@csstools/color-helpers" "^3.0.2" postcss-value-parser "^4.2.0" -"@csstools/postcss-trigonometric-functions@^3.0.1": +"@csstools/postcss-trigonometric-functions@^3.0.2": version "3.0.2" resolved "https://registry.yarnpkg.com/@csstools/postcss-trigonometric-functions/-/postcss-trigonometric-functions-3.0.2.tgz#b03d045015fc6e16d81e36e5783c545b5590a2f2" integrity sha512-AwzNhF4QOKaLOKvMljwwFkeYXwufhRO15G+kKohHkyoNOL75xWkN+W2Y9ik9tSeAyDv+cYNlYaF+o/a79WjVjg== @@ -4072,7 +4081,7 @@ asynckit@^0.4.0: resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" integrity sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q== -autoprefixer@^10.4.15: +autoprefixer@^10.4.16: version "10.4.16" resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.4.16.tgz#fad1411024d8670880bdece3970aa72e3572feb8" integrity sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ== @@ -4280,17 +4289,7 @@ broccoli-plugin@^4.0.7: rimraf "^3.0.2" symlink-or-copy "^1.3.1" -browserslist@^4.21.10: - version "4.21.10" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.10.tgz#dbbac576628c13d3b2231332cb2ec5a46e015bb0" - integrity sha512-bipEBdZfVH5/pwrvqc+Ub0kUPVfGUhlKxbvfD+z1BDnPEO/X98ruXGA1WP5ASpAFKan7Qr6j736IacbZQuAlKQ== - dependencies: - caniuse-lite "^1.0.30001517" - electron-to-chromium "^1.4.477" - node-releases "^2.0.13" - update-browserslist-db "^1.0.11" - -browserslist@^4.21.9: +browserslist@^4.21.10, browserslist@^4.21.9, browserslist@^4.22.1: version "4.22.1" resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.22.1.tgz#ba91958d1a59b87dab6fed8dfbcb3da5e2e9c619" integrity sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ== @@ -4370,15 +4369,10 @@ camelcase@^6.2.0: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a" integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA== -caniuse-lite@^1.0.30001517: - version "1.0.30001539" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001539.tgz#325a387ab1ed236df2c12dc6cd43a4fff9903a44" - integrity sha512-hfS5tE8bnNiNvEOEkm8HElUHroYwlqMMENEzELymy77+tJ6m+gA2krtHl5hxJaj71OlpC2cHZbdSMX1/YEqEkA== - caniuse-lite@^1.0.30001538, caniuse-lite@^1.0.30001541: - version "1.0.30001541" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001541.tgz#b1aef0fadd87fb72db4dcb55d220eae17b81cdb1" - integrity sha512-bLOsqxDgTqUBkzxbNlSBt8annkDpQB9NdzdTbO2ooJ+eC/IQcvDspDc058g84ejCelF7vHUx57KIOjEecOHXaw== + version "1.0.30001547" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001547.tgz#d4f92efc488aab3c7f92c738d3977c2a3180472b" + integrity sha512-W7CrtIModMAxobGhz8iXmDfuJiiKg1WADMO/9x7/CLNin5cpSbuBjooyoIUVB5eyCc36QuTVlkVa1iB2S5+/eA== chalk@^2.4.1, chalk@^2.4.2: version "2.4.2" @@ -4734,10 +4728,10 @@ css.escape@^1.5.1: resolved "https://registry.yarnpkg.com/css.escape/-/css.escape-1.5.1.tgz#42e27d4fa04ae32f931a4b4d4191fa9cddee97cb" integrity sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg== -cssdb@^7.7.2: - version "7.7.2" - resolved "https://registry.yarnpkg.com/cssdb/-/cssdb-7.7.2.tgz#fbebd90edfc6af129fda4fd986f9dd604a209094" - integrity sha512-pQPYP7/kch4QlkTcLuUNiNL2v/E+O+VIdotT+ug62/+2B2/jkzs5fMM6RHCzGCZ9C82pODEMSIzRRUzJOrl78g== +cssdb@^7.8.0: + version "7.8.0" + resolved "https://registry.yarnpkg.com/cssdb/-/cssdb-7.8.0.tgz#ac41fa025371b74eb2ccfe3d41f5c4dbd444fbe3" + integrity sha512-SkeezZOQr5AHt9MgJgSFNyiuJwg1p8AwoVln6JwaQJsyxduRW9QJ+HP/gAQzbsz8SIqINtYvpJKjxTRI67zxLg== cssesc@^3.0.0: version "3.0.0" @@ -5029,15 +5023,10 @@ duplexify@^3.6.0: readable-stream "^2.0.0" stream-shift "^1.0.0" -electron-to-chromium@^1.4.477: - version "1.4.529" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.529.tgz#8c3377a05e5737f899770d14524dd8e2e4cb2351" - integrity sha512-6uyPyXTo8lkv8SWAmjKFbG42U073TXlzD4R8rW3EzuznhFS2olCIAfjjQtV2dV2ar/vRF55KUd3zQYnCB0dd3A== - electron-to-chromium@^1.4.535: - version "1.4.537" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.537.tgz#aac4101db53066be1e49baedd000a26bc754adc9" - integrity sha512-W1+g9qs9hviII0HAwOdehGYkr+zt7KKdmCcJcjH0mYg6oL8+ioT3Skjmt7BLoAQqXhjf40AXd+HlR4oAWMlXjA== + version "1.4.549" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.549.tgz#ab223f5d85c55a9def358db163bc8cacba72df69" + integrity sha512-gpXfJslSi4hYDkA0mTLEpYKRv9siAgSUgZ+UWyk+J5Cttpd1ThCVwdclzIwQSclz3hYn049+M2fgrP1WpvF8xg== email-regex@^5.0.0: version "5.0.0" @@ -7903,12 +7892,12 @@ postcss-clamp@^4.1.0: dependencies: postcss-value-parser "^4.2.0" -postcss-color-functional-notation@^6.0.1: - version "6.0.1" - resolved "https://registry.yarnpkg.com/postcss-color-functional-notation/-/postcss-color-functional-notation-6.0.1.tgz#b67d7c71fa1c82b09c130e02a37f0b6ceacbef63" - integrity sha512-IouVx77fASIjOChWxkvOjYGnYNKq286cSiKFJwWNICV9NP2xZWVOS9WOriR/8uIB2zt/44bzQyw4GteCLpP2SA== +postcss-color-functional-notation@^6.0.2: + version "6.0.2" + resolved "https://registry.yarnpkg.com/postcss-color-functional-notation/-/postcss-color-functional-notation-6.0.2.tgz#5fa38d36cd0e2ea9db7fd6f2f2a1ffb2c0796a8d" + integrity sha512-FsjSmlSufuiFBsIqQ++VxFmvX7zKndZpBkHmfXr4wqhvzM92FTEkAh703iqWTl1U3faTgqioIqCbfqdWiFVwtw== dependencies: - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" postcss-value-parser "^4.2.0" postcss-color-hex-alpha@^9.0.2: @@ -7925,17 +7914,17 @@ postcss-color-rebeccapurple@^9.0.1: dependencies: postcss-value-parser "^4.2.0" -postcss-custom-media@^10.0.1: - version "10.0.1" - resolved "https://registry.yarnpkg.com/postcss-custom-media/-/postcss-custom-media-10.0.1.tgz#48a4597451a69b1098e6eb11eb1166202171f9ed" - integrity sha512-fil7cosvzlIAYmZJPtNFcTH0Er7a3GveEK4q5Y/L24eWQHmiw8Fv/E5DMkVpdbNjkGzJxrvowOSt/Il9HZ06VQ== +postcss-custom-media@^10.0.2: + version "10.0.2" + resolved "https://registry.yarnpkg.com/postcss-custom-media/-/postcss-custom-media-10.0.2.tgz#70a244bbc59fc953ab6573e4e2c9624639aef08a" + integrity sha512-zcEFNRmDm2fZvTPdI1pIW3W//UruMcLosmMiCdpQnrCsTRzWlKQPYMa1ud9auL0BmrryKK1+JjIGn19K0UjO/w== dependencies: - "@csstools/cascade-layer-name-parser" "^1.0.4" - "@csstools/css-parser-algorithms" "^2.3.1" - "@csstools/css-tokenizer" "^2.2.0" - "@csstools/media-query-list-parser" "^2.1.4" + "@csstools/cascade-layer-name-parser" "^1.0.5" + "@csstools/css-parser-algorithms" "^2.3.2" + "@csstools/css-tokenizer" "^2.2.1" + "@csstools/media-query-list-parser" "^2.1.5" -postcss-custom-properties@^13.3.1: +postcss-custom-properties@^13.3.2: version "13.3.2" resolved "https://registry.yarnpkg.com/postcss-custom-properties/-/postcss-custom-properties-13.3.2.tgz#88952f883003d897ade5c836e1e005b09a12f02b" integrity sha512-2Coszybpo8lpLY24vy2CYv9AasiZ39/bs8Imv0pWMq55Gl8NWzfc24OAo3zIX7rc6uUJAqESnVOMZ6V6lpMjJA== @@ -7945,14 +7934,14 @@ postcss-custom-properties@^13.3.1: "@csstools/css-tokenizer" "^2.2.1" postcss-value-parser "^4.2.0" -postcss-custom-selectors@^7.1.5: - version "7.1.5" - resolved "https://registry.yarnpkg.com/postcss-custom-selectors/-/postcss-custom-selectors-7.1.5.tgz#74e99ef5d7a3f84aaab246ba086975e8279b686e" - integrity sha512-0UYtz7GG10bZrRiUdZ/2Flt+hp5p/WP0T7JgAPZ/Xhgb0wFjW/p7QOjE+M58S9Z3x11P9YaNPcrsoOGewWYkcw== +postcss-custom-selectors@^7.1.6: + version "7.1.6" + resolved "https://registry.yarnpkg.com/postcss-custom-selectors/-/postcss-custom-selectors-7.1.6.tgz#6d28812998dcd48f61a6a538141fc16cf2c42123" + integrity sha512-svsjWRaxqL3vAzv71dV0/65P24/FB8TbPX+lWyyf9SZ7aZm4S4NhCn7N3Bg+Z5sZunG3FS8xQ80LrCU9hb37cw== dependencies: - "@csstools/cascade-layer-name-parser" "^1.0.4" - "@csstools/css-parser-algorithms" "^2.3.1" - "@csstools/css-tokenizer" "^2.2.0" + "@csstools/cascade-layer-name-parser" "^1.0.5" + "@csstools/css-parser-algorithms" "^2.3.2" + "@csstools/css-tokenizer" "^2.2.1" postcss-selector-parser "^6.0.13" postcss-dir-pseudo-class@^8.0.0: @@ -7962,12 +7951,12 @@ postcss-dir-pseudo-class@^8.0.0: dependencies: postcss-selector-parser "^6.0.13" -postcss-double-position-gradients@^5.0.1: - version "5.0.1" - resolved "https://registry.yarnpkg.com/postcss-double-position-gradients/-/postcss-double-position-gradients-5.0.1.tgz#5f28489f5b33ce5e1e97bf1ea6b62cd7a5f9c0c2" - integrity sha512-ogcHzfC5q4nfySyZyNF7crvK3/MRDTh+akzE+l7bgJUjVkhgfahBuI+ZAm/5EeaVSVKnCOgqtC6wTyUFgLVLTw== +postcss-double-position-gradients@^5.0.2: + version "5.0.2" + resolved "https://registry.yarnpkg.com/postcss-double-position-gradients/-/postcss-double-position-gradients-5.0.2.tgz#a55ed4d6a395f324aa5535ea8c42c74e8ace2651" + integrity sha512-KTbvdOOy8z8zb0BTkEg4/1vqlRlApdvjw8/pFoehgQl0WVO+fezDGlvo0B8xRA+XccA7ohkQCULKNsiNOx70Cw== dependencies: - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" postcss-value-parser "^4.2.0" postcss-focus-visible@^9.0.0: @@ -8001,15 +7990,15 @@ postcss-image-set-function@^6.0.1: dependencies: postcss-value-parser "^4.2.0" -postcss-lab-function@^6.0.4: - version "6.0.5" - resolved "https://registry.yarnpkg.com/postcss-lab-function/-/postcss-lab-function-6.0.5.tgz#de6b12fb29b591193d53bccf09eba304952224db" - integrity sha512-v1NG08v7tN9n76rA5j5HQ4sRu/kqXBuOFNAYhfHqbyDQ1WbsGKfPNN9VnJSSI3V0KIlShodYQPf3ORjMSo1w9g== +postcss-lab-function@^6.0.7: + version "6.0.7" + resolved "https://registry.yarnpkg.com/postcss-lab-function/-/postcss-lab-function-6.0.7.tgz#b1dd0ad5a4c993b7695614239754b9be48f3b24b" + integrity sha512-4d1lhDVPukHFqkMv4G5vVcK+tgY52vwb5uR1SWKOaO5389r2q8fMxBWuXSW+YtbCOEGP0/X9KERi9E9le2pJuw== dependencies: - "@csstools/css-color-parser" "^1.3.2" + "@csstools/css-color-parser" "^1.4.0" "@csstools/css-parser-algorithms" "^2.3.2" "@csstools/css-tokenizer" "^2.2.1" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" postcss-logical@^7.0.0: version "7.0.0" @@ -8051,57 +8040,58 @@ postcss-place@^9.0.0: postcss-value-parser "^4.2.0" postcss-preset-env@^9.0.0: - version "9.1.4" - resolved "https://registry.yarnpkg.com/postcss-preset-env/-/postcss-preset-env-9.1.4.tgz#9a4b0b7ac2b2eb2b319fc76fd4ede0dd3e61a524" - integrity sha512-k2scWtmYBZhjAzMJw8Fgc4hnfkZa4KpPjK0z6+tTAJ4/3ZAmaJJ1VBQ9T7OS0qvper8AyD+kqN2UB2tYFQ4eeA== + version "9.2.0" + resolved "https://registry.yarnpkg.com/postcss-preset-env/-/postcss-preset-env-9.2.0.tgz#9106ed870811a6da44a5607860f8a2afffccec30" + integrity sha512-Lnr4C5gb7t5Cc8akQMJzNdJkqw7s7s7BHUaQSgsuf+CTY9Lsz5lqQTft5yNZr59JyCLz0aFNSAqSLm/xRtcTpg== dependencies: "@csstools/postcss-cascade-layers" "^4.0.0" - "@csstools/postcss-color-function" "^3.0.4" - "@csstools/postcss-color-mix-function" "^2.0.4" - "@csstools/postcss-exponential-functions" "^1.0.0" + "@csstools/postcss-color-function" "^3.0.7" + "@csstools/postcss-color-mix-function" "^2.0.7" + "@csstools/postcss-exponential-functions" "^1.0.1" "@csstools/postcss-font-format-keywords" "^3.0.0" - "@csstools/postcss-gradients-interpolation-method" "^4.0.4" - "@csstools/postcss-hwb-function" "^3.0.3" - "@csstools/postcss-ic-unit" "^3.0.1" + "@csstools/postcss-gamut-mapping" "^1.0.0" + "@csstools/postcss-gradients-interpolation-method" "^4.0.7" + "@csstools/postcss-hwb-function" "^3.0.6" + "@csstools/postcss-ic-unit" "^3.0.2" "@csstools/postcss-initial" "^1.0.0" - "@csstools/postcss-is-pseudo-class" "^4.0.2" + "@csstools/postcss-is-pseudo-class" "^4.0.3" "@csstools/postcss-logical-float-and-clear" "^2.0.0" "@csstools/postcss-logical-resize" "^2.0.0" - "@csstools/postcss-logical-viewport-units" "^2.0.2" - "@csstools/postcss-media-minmax" "^1.0.7" - "@csstools/postcss-media-queries-aspect-ratio-number-values" "^2.0.2" + "@csstools/postcss-logical-viewport-units" "^2.0.3" + "@csstools/postcss-media-minmax" "^1.1.0" + "@csstools/postcss-media-queries-aspect-ratio-number-values" "^2.0.3" "@csstools/postcss-nested-calc" "^3.0.0" "@csstools/postcss-normalize-display-values" "^3.0.1" - "@csstools/postcss-oklab-function" "^3.0.4" - "@csstools/postcss-progressive-custom-properties" "^3.0.1" - "@csstools/postcss-relative-color-syntax" "^2.0.4" + "@csstools/postcss-oklab-function" "^3.0.7" + "@csstools/postcss-progressive-custom-properties" "^3.0.2" + "@csstools/postcss-relative-color-syntax" "^2.0.7" "@csstools/postcss-scope-pseudo-class" "^3.0.0" - "@csstools/postcss-stepped-value-functions" "^3.0.1" + "@csstools/postcss-stepped-value-functions" "^3.0.2" "@csstools/postcss-text-decoration-shorthand" "^3.0.3" - "@csstools/postcss-trigonometric-functions" "^3.0.1" + "@csstools/postcss-trigonometric-functions" "^3.0.2" "@csstools/postcss-unset-value" "^3.0.0" - autoprefixer "^10.4.15" - browserslist "^4.21.10" + autoprefixer "^10.4.16" + browserslist "^4.22.1" css-blank-pseudo "^6.0.0" css-has-pseudo "^6.0.0" css-prefers-color-scheme "^9.0.0" - cssdb "^7.7.2" + cssdb "^7.8.0" postcss-attribute-case-insensitive "^6.0.2" postcss-clamp "^4.1.0" - postcss-color-functional-notation "^6.0.1" + postcss-color-functional-notation "^6.0.2" postcss-color-hex-alpha "^9.0.2" postcss-color-rebeccapurple "^9.0.1" - postcss-custom-media "^10.0.1" - postcss-custom-properties "^13.3.1" - postcss-custom-selectors "^7.1.5" + postcss-custom-media "^10.0.2" + postcss-custom-properties "^13.3.2" + postcss-custom-selectors "^7.1.6" postcss-dir-pseudo-class "^8.0.0" - postcss-double-position-gradients "^5.0.1" + postcss-double-position-gradients "^5.0.2" postcss-focus-visible "^9.0.0" postcss-focus-within "^8.0.0" postcss-font-variant "^5.0.0" postcss-gap-properties "^5.0.0" postcss-image-set-function "^6.0.1" - postcss-lab-function "^6.0.4" + postcss-lab-function "^6.0.7" postcss-logical "^7.0.0" postcss-nesting "^12.0.1" postcss-opacity-percentage "^2.0.0" @@ -9502,7 +9492,7 @@ unplugin@1.0.1: webpack-sources "^3.2.3" webpack-virtual-modules "^0.5.0" -update-browserslist-db@^1.0.11, update-browserslist-db@^1.0.13: +update-browserslist-db@^1.0.13: version "1.0.13" resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz#3c5e4f5c083661bd38ef64b6328c26ed6c8248c4" integrity sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg== From 227d4339784169a6836ac974b5472f91eb58a385 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Wed, 11 Oct 2023 14:47:59 +0000 Subject: [PATCH 14/14] Update dependency @opentelemetry/instrumentation-user-interaction to v0.33.2 --- yarn.lock | 36 ++++++++---------------------------- 1 file changed, 8 insertions(+), 28 deletions(-) diff --git a/yarn.lock b/yarn.lock index 4886fffc..94843ed4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2092,25 +2092,14 @@ "@opentelemetry/semantic-conventions" "^1.0.0" "@opentelemetry/instrumentation-user-interaction@^0.33.0": - version "0.33.1" - resolved "https://registry.yarnpkg.com/@opentelemetry/instrumentation-user-interaction/-/instrumentation-user-interaction-0.33.1.tgz#0528056df612177e0b5a379e3e5b07d6e91bc126" - integrity sha512-2oun4gwWpqtCW+qydC51jqSSUZSOuNCBXOWinTuTmO6w/sd4DJaQ6kEboSx5gENT/56qnCM9jQZlHI+zKbL63w== + version "0.33.2" + resolved "https://registry.yarnpkg.com/@opentelemetry/instrumentation-user-interaction/-/instrumentation-user-interaction-0.33.2.tgz#a4ac68d51fccc93ef3157f7f58747d7fe90a605e" + integrity sha512-+9fxN9zlO2YKX5rajw8W9O4aCl9keyjI6VSGnnFiB5+zYDxzE55B7aTa8LAW6unz+kOYalHSwizkDa1mduGLCg== dependencies: "@opentelemetry/core" "^1.8.0" - "@opentelemetry/instrumentation" "^0.41.2" + "@opentelemetry/instrumentation" "^0.44.0" "@opentelemetry/sdk-trace-web" "^1.8.0" -"@opentelemetry/instrumentation@^0.41.2": - version "0.41.2" - resolved "https://registry.yarnpkg.com/@opentelemetry/instrumentation/-/instrumentation-0.41.2.tgz#cae11fa64485dcf03dae331f35b315b64bc6189f" - integrity sha512-rxU72E0pKNH6ae2w5+xgVYZLzc5mlxAbGzF4shxMVK8YC2QQsfN38B2GPbj0jvrKWWNUElfclQ+YTykkNg/grw== - dependencies: - "@types/shimmer" "^1.0.2" - import-in-the-middle "1.4.2" - require-in-the-middle "^7.1.1" - semver "^7.5.1" - shimmer "^1.2.1" - "@opentelemetry/instrumentation@^0.44.0": version "0.44.0" resolved "https://registry.yarnpkg.com/@opentelemetry/instrumentation/-/instrumentation-0.44.0.tgz#194f16fc96671575b6bd73d3fadffb5aa4497e67" @@ -2192,7 +2181,7 @@ "@opentelemetry/resources" "1.17.1" "@opentelemetry/semantic-conventions" "1.17.1" -"@opentelemetry/sdk-trace-web@^1.15.0": +"@opentelemetry/sdk-trace-web@^1.15.0", "@opentelemetry/sdk-trace-web@^1.8.0": version "1.17.1" resolved "https://registry.yarnpkg.com/@opentelemetry/sdk-trace-web/-/sdk-trace-web-1.17.1.tgz#1c13e6d8427a33b5e97ac85cb745a084b976c470" integrity sha512-Nle48xE1eaR6lRqyOvUlIwW/C2Bz6pptHzlHqrd+a6tGSLWEP1ZhPfuJbNeq/tWX5PX2RgeOsLlvPLEEBKeKxg== @@ -2201,7 +2190,7 @@ "@opentelemetry/sdk-trace-base" "1.17.1" "@opentelemetry/semantic-conventions" "1.17.1" -"@opentelemetry/sdk-trace-web@^1.8.0", "@opentelemetry/sdk-trace-web@^1.9.1": +"@opentelemetry/sdk-trace-web@^1.9.1": version "1.15.2" resolved "https://registry.yarnpkg.com/@opentelemetry/sdk-trace-web/-/sdk-trace-web-1.15.2.tgz#1db22d0afbd07b1287e8a331e30862eb19b24e20" integrity sha512-OjCrwtu4b+cAt540wyIr7d0lCA/cY9y42lmYDFUfJ8Ixj2bByIUJ4yyd9M7mXHpQHdiR/Kq2vzsgS14Uj+RU0Q== @@ -8667,16 +8656,7 @@ resolve@^1.1.6, resolve@^1.14.2, resolve@^1.20.0, resolve@^1.22.4: path-parse "^1.0.7" supports-preserve-symlinks-flag "^1.0.0" -resolve@^1.10.0: - version "1.22.8" - resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.8.tgz#b6c87a9f2aa06dfab52e3d70ac8cde321fa5a48d" - integrity sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw== - dependencies: - is-core-module "^2.13.0" - path-parse "^1.0.7" - supports-preserve-symlinks-flag "^1.0.0" - -resolve@^1.22.1: +resolve@^1.10.0, resolve@^1.22.1: version "1.22.8" resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.8.tgz#b6c87a9f2aa06dfab52e3d70ac8cde321fa5a48d" integrity sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw== @@ -8836,7 +8816,7 @@ semver@^6.3.0, semver@^6.3.1: resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4" integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA== -semver@^7.5.1, semver@^7.5.2, semver@^7.5.3, semver@^7.5.4: +semver@^7.5.2, semver@^7.5.3, semver@^7.5.4: version "7.5.4" resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.4.tgz#483986ec4ed38e1c6c48c34894a9182dbff68a6e" integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==