Replace usage of forwardRef with React 19 ref prop (#29803)

* Replace usage of `forwardRef` with React 19 ref prop

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add lint rule

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski
2025-04-24 12:31:37 +00:00
committed by GitHub
parent 5e7b58a722
commit 22d5c00174
48 changed files with 989 additions and 963 deletions
+10 -16
View File
@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
Please see LICENSE files in the repository root for full details.
*/
import React, { type ComponentClass, createContext, forwardRef, useContext } from "react";
import React, { type ComponentClass, createContext, useContext } from "react";
import { type MatrixClient } from "matrix-js-sdk/src/matrix";
// This context is available to components under LoggedInView,
@@ -24,22 +24,16 @@ export function useMatrixClientContext(): MatrixClient {
return useContext(MatrixClientContext);
}
const matrixHOC = <ComposedComponentProps extends object>(
ComposedComponent: ComponentClass<ComposedComponentProps>,
): ((
props: Omit<ComposedComponentProps, "mxClient"> & React.RefAttributes<InstanceType<typeof ComposedComponent>>,
) => React.ReactElement | null) => {
type ComposedComponentInstance = InstanceType<typeof ComposedComponent>;
// eslint-disable-next-line react-hooks/rules-of-hooks
const TypedComponent = ComposedComponent;
return forwardRef<ComposedComponentInstance, Omit<ComposedComponentProps, "mxClient">>((props, ref) => {
const matrixHOC =
<ComposedComponentProps extends object>(
ComposedComponent: ComponentClass<ComposedComponentProps>,
): ((
props: Omit<ComposedComponentProps, "mxClient"> & React.RefAttributes<InstanceType<typeof ComposedComponent>>,
) => React.ReactElement | null) =>
(props) => {
const client = useContext(MatrixClientContext);
// @ts-ignore
return <TypedComponent ref={ref} {...props} mxClient={client} />;
});
};
return <ComposedComponent {...props} mxClient={client} />;
};
export const withMatrixClientHOC = matrixHOC;