[MM-56850] Convert ./components/modal_controller/modal_controller.tsx from Class Component to Function Component (#26259)

* [MM-56850] Convert `./components/modal_controller/modal_controller.tsx` from Class Component to Function Component

* fix: failing type check

webapp/channels/src/components/modal_controller/modal_controller.tsx

@@ -32,15 +32,15 @@ type Props = {
     };
 }
 
-export default class ModalController extends React.PureComponent<Props> {
+const ModalController = ({
-    public render(): React.ReactNode {
+    modals,
-        const {modals, ...props} = this.props;
+    actions,
-        const {modalState} = modals;
+}: Props) => {
-
     if (!modals) {
         return null;
     }
 
+    const {modalState} = modals;
     const modalOutput = [];
 
     for (const modalId in modalState) {
@@ -49,12 +49,12 @@ export default class ModalController extends React.PureComponent<Props> {
             if (modal.open) {
                 const modalComponent = React.createElement(modal.dialogType, Object.assign({}, modal.dialogProps, {
                     onExited: () => {
-                            props.actions.closeModal(modalId);
+                        actions.closeModal(modalId);
 
                         // Call any onExited prop provided by whoever opened the modal, if one was provided
                         modal.dialogProps?.onExited?.();
                     },
-                        onHide: props.actions.closeModal.bind(this, modalId),
+                    onHide: actions.closeModal.bind(this, modalId),
                     key: `${modalId}_modal`,
                 }));
 
@@ -63,8 +63,7 @@ export default class ModalController extends React.PureComponent<Props> {
         }
     }
 
-        return (
+    return <>{modalOutput}</>;
-            modalOutput
+};
-        );
+
-    }
+export default ModalController;
-}