Preparations for React 18 (#12860)

* Add missing types

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

* Eagerly add `children` to props in prep for React 18

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

* Avoid assuming that setState immediately sets `this.state` values

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

* Add missing context declaration

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

* Fix UserFriendlyError types to work with React 18

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

---------

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

src/components/structures/GenericDropdownMenu.tsx

@@ -97,6 +97,12 @@ type WithKeyFunction<T> = T extends Key
           toKey: (key: T) => Key;
       };
 
+export interface AdditionalOptionsProps {
+    menuDisplayed: boolean;
+    closeMenu: () => void;
+    openMenu: () => void;
+}
+
 type IProps<T> = WithKeyFunction<T> & {
     value: T;
     options: readonly GenericDropdownMenuOption<T>[] | readonly GenericDropdownMenuGroup<T>[];
@@ -105,11 +111,7 @@ type IProps<T> = WithKeyFunction<T> & {
     onOpen?: (ev: ButtonEvent) => void;
     onClose?: (ev: ButtonEvent) => void;
     className?: string;
-    AdditionalOptions?: FunctionComponent<{
-        menuDisplayed: boolean;
-        closeMenu: () => void;
-        openMenu: () => void;
-    }>;
+    AdditionalOptions?: FunctionComponent<AdditionalOptionsProps>;
 };
 
 export function GenericDropdownMenu<T>({

src/components/structures/ThreadPanel.tsx

@@ -117,7 +117,7 @@ export const ThreadPanelHeader: React.FC<{
     ) : null;
 
     const onMarkAllThreadsReadClick = React.useCallback(
-        (e) => {
+        (e: React.MouseEvent) => {
             PosthogTrackers.trackInteraction("WebThreadsMarkAllReadButton", e);
             if (!roomContext.room) {
                 logger.error("No room in context to mark all threads read");

src/components/structures/auth/Registration.tsx

@@ -248,15 +248,20 @@ export default class Registration extends React.Component<IProps, IState> {
             logger.error("Failed to get login flows to check for SSO support", e);
         }
 
-        this.setState(({ flows }) => ({
-            matrixClient: cli,
-            ssoFlow,
-            oidcNativeFlow,
-            // if we are using oidc native we won't continue with flow discovery on HS
-            // so set an empty array to indicate flows are no longer loading
-            flows: oidcNativeFlow ? [] : flows,
-            busy: false,
-        }));
+        await new Promise<void>((resolve) => {
+            this.setState(
+                ({ flows }) => ({
+                    matrixClient: cli,
+                    ssoFlow,
+                    oidcNativeFlow,
+                    // if we are using oidc native we won't continue with flow discovery on HS
+                    // so set an empty array to indicate flows are no longer loading
+                    flows: oidcNativeFlow ? [] : flows,
+                    busy: false,
+                }),
+                resolve,
+            );
+        });
 
         // don't need to check with homeserver for login flows
         // since we are going to use OIDC native flow