fix(premeeting): call hooks before any conditional block in ConnectionStatus (#11136)

react/features/base/premeeting/components/web/ConnectionStatus.js

@@ -148,11 +148,6 @@ const CONNECTION_TYPE_MAP = {
 function ConnectionStatus({ connectionDetails, t, connectionType }: Props) {
     const classes = useStyles();
 
-    if (connectionType === CONNECTION_TYPE.NONE) {
-        return null;
-    }
-
-    const { connectionClass, icon, connectionText } = CONNECTION_TYPE_MAP[connectionType];
     const [ showDetails, toggleDetails ] = useState(false);
     const arrowClassName = showDetails
         ? 'con-status-arrow con-status-arrow--up'
@@ -174,6 +169,12 @@ function ConnectionStatus({ connectionDetails, t, connectionType }: Props) {
         }
     }, [ showDetails, toggleDetails ]);
 
+    if (connectionType === CONNECTION_TYPE.NONE) {
+        return null;
+    }
+
+    const { connectionClass, icon, connectionText } = CONNECTION_TYPE_MAP[connectionType];
+
     return (
         <div className = { classes.connectionStatus }>
             <div