Fixes issue in settings page with CSV multiselector scroll (#622)

Co-authored-by: Benjamin Perez <benjamin@bexsoft.net>
Co-authored-by: Daniel Valdivia <hola@danielvaldivia.com>

portal-ui/src/screens/Console/Common/FormComponents/CSVMultiSelector/CSVMultiSelector.tsx

@@ -91,12 +91,13 @@ const CSVMultiSelector = ({
 
   // Use effect to send new values to onChange
   useEffect(() => {
-    const refScroll = bottomList.current;
-    if (refScroll) {
-      refScroll.scrollIntoView(false);
+    if (currentElements.length > 1) {
+      const refScroll = bottomList.current;
+      if (refScroll) {
+        refScroll.scrollIntoView(false);
+      }
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [currentElements]);
+  }, [currentElements, bottomList]);
 
   // We avoid multiple re-renders / hang issue typing too fast
   const firstUpdate = useRef(true);

portal-ui/src/screens/Console/Configurations/ConfTargetGeneric.tsx

@@ -14,7 +14,7 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, Fragment } from "react";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import Grid from "@material-ui/core/Grid";
 import { IElementValue, KVField } from "./types";
@@ -163,11 +163,11 @@ const ConfTargetGeneric = ({
     <Grid container>
       <Grid xs={12} item>
         {fieldsElements.map((field, item) => (
-          <React.Fragment key={field.name}>
+          <Fragment key={field.name}>
             <Grid item xs={12}>
               {fieldDefinition(field, item)}
             </Grid>
-          </React.Fragment>
+          </Fragment>
         ))}
       </Grid>
     </Grid>