F #3951: Fix proptypes components (#189)

src/fireedge/src/public/components/Dialogs/NetworkDialog.js

@@ -1,4 +1,4 @@
-import React, { useMemo, useEffect } from 'react';
+import React from 'react';
 
 import {
   makeStyles,

src/fireedge/src/public/components/FormStepper/Stepper.js

@@ -43,7 +43,7 @@ const CustomStepper = ({
 CustomStepper.propTypes = {
   steps: PropTypes.arrayOf(
     PropTypes.shape({
-      id: PropTypes.oneOf([PropTypes.string, PropTypes.number]).isRequired,
+      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
       label: PropTypes.string.isRequired
     })
   ),

src/fireedge/src/public/components/Header/Popover.js

@@ -105,7 +105,7 @@ HeaderPopover.propTypes = {
   id: PropTypes.string,
   icon: PropTypes.node,
   buttonLabel: PropTypes.string,
-  IconProps: PropTypes.objectOf(PropTypes.object),
+  IconProps: PropTypes.objectOf(PropTypes.any),
   headerTitle: PropTypes.string,
   disablePadding: PropTypes.bool,
   children: PropTypes.func

src/fireedge/src/public/components/Header/User.js

@@ -6,7 +6,7 @@ import AccountCircleIcon from '@material-ui/icons/AccountCircle';
 import useAuth from 'client/hooks/useAuth';
 import { Tr } from 'client/components/HOC';
 
-import { SignOut } from 'client/constants';
+import { SignOut } from 'client/constants/translates';
 import { PATH } from 'client/router/endpoints';
 import HeaderPopover from 'client/components/Header/Popover';
 

src/fireedge/src/public/components/Sidebar/SidebarLink.js

@@ -69,7 +69,14 @@ const SidebarLink = ({ label, path, icon: Icon, devMode, isSubItem }) => {
 SidebarLink.propTypes = {
   label: PropTypes.string.isRequired,
   path: PropTypes.string.isRequired,
-  icon: PropTypes.node,
+  icon: PropTypes.oneOfType([
+    PropTypes.element,
+    PropTypes.node,
+    PropTypes.func,
+    PropTypes.string,
+    PropTypes.symbol,
+    PropTypes.object
+  ]),
   devMode: PropTypes.bool,
   isSubItem: PropTypes.bool
 };
@@ -77,7 +84,7 @@ SidebarLink.propTypes = {
 SidebarLink.defaultProps = {
   label: '',
   path: '/',
-  icon: null,
+  icon: undefined,
   devMode: false,
   isSubItem: false
 };

src/fireedge/src/public/components/Sidebar/index.js

@@ -65,7 +65,7 @@ const Sidebar = () => {
         anchor="left"
         open={isFixMenu}
       >
-        <Box item className={classes.header}>
+        <Box className={classes.header}>
           <Logo
             width="100%"
             height={100}

src/fireedge/src/public/constants/index.js

@@ -14,21 +14,7 @@
 /* -------------------------------------------------------------------------- */
 
 module.exports = {
-  checkbox: 'checkbox',
-  classInputInvalid: 'is-invalid',
-  NotFound: 'Not found',
-  SignIn: 'Sign In',
-  Next: 'Next',
-  Language: 'Language',
-  Username: 'Username',
-  Password: 'Password',
-  keepLoggedIn: 'Keep me logged in',
-  Token2FA: '2FA Token',
-  SignOut: 'Sign Out',
   jwtName: 'SunstoneToken',
-  filterPool: 'FilterPool',
-  Submit: 'Submit',
-  Response: 'Response',
   by: {
     text: 'Opennebula',
     url: 'https://opennebula.io/'
@@ -43,5 +29,10 @@ module.exports = {
     USER_RESOURCES: '-3',
     ALL_RESOURCES: '-2',
     USER_GROUPS_RESOURCES: '-1'
+  },
+  TYPE_INPUT: {
+    TEXT: 'text',
+    SELECT: 'select',
+    CHECKBOX: 'checkbox'
   }
 };

src/fireedge/src/public/constants/translates.js

@@ -0,0 +1,13 @@
+module.exports = {
+  SignIn: 'Sign In',
+  Next: 'Next',
+  Username: 'Username',
+  Password: 'Password',
+  NotFound: 'Not found',
+  Language: 'Language',
+  KeepLoggedIn: 'Keep me logged in',
+  Token2FA: '2FA Token',
+  SignOut: 'Sign Out',
+  Submit: 'Submit',
+  Response: 'Response'
+};

src/fireedge/src/public/containers/Error404/index.js

@@ -16,7 +16,7 @@
 import React, { Fragment } from 'react';
 
 import { Translate } from 'client/components/HOC/Translate';
-import { NotFound } from 'client/constants';
+import { NotFound } from 'client/constants/translates';
 
 function Error404() {
   return (

src/fireedge/src/public/containers/Login/Forms/Form2fa.js

@@ -6,7 +6,7 @@ import { useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers';
 import * as yup from 'yup';
 
-import { Token2FA, Next } from 'client/constants';
+import { Token2FA, Next } from 'client/constants/translates';
 import loginStyles from 'client/containers/Login/styles';
 
 import { Tr } from 'client/components/HOC';

src/fireedge/src/public/containers/Login/Forms/FormGroup.js

@@ -8,7 +8,7 @@ import GroupSelect from 'client/components/FormControl/GroupSelect';
 import ButtonSubmit from 'client/components/FormControl/SubmitButton';
 import { Tr } from 'client/components/HOC';
 import loginStyles from 'client/containers/Login/styles';
-import { Next } from 'client/constants';
+import { Next } from 'client/constants/translates';
 
 function FormGroup({ onBack, onSubmit }) {
   const classes = loginStyles();

src/fireedge/src/public/containers/Login/Forms/FormUser.js

@@ -5,7 +5,12 @@ import { useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers';
 import * as yup from 'yup';
 
-import { SignIn, Username, Password, keepLoggedIn } from 'client/constants';
+import {
+  SignIn,
+  Username,
+  Password,
+  KeepLoggedIn
+} from 'client/constants/translates';
 import { Tr } from 'client/components/HOC';
 import ButtonSubmit from 'client/components/FormControl/SubmitButton';
 import ErrorHelper from 'client/components/FormControl/ErrorHelper';
@@ -74,7 +79,7 @@ function FormUser({ onSubmit, error }) {
             inputProps={{ 'data-cy': 'login-remember' }}
           />
         }
-        label={Tr(keepLoggedIn)}
+        label={Tr(KeepLoggedIn)}
         labelPlacement="end"
       />
       <ButtonSubmit

src/fireedge/src/public/containers/Login/index.js

@@ -13,7 +13,7 @@
 /* limitations under the License.                                             */
 /* -------------------------------------------------------------------------- */
 
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import {
   Paper,
   Box,
@@ -30,6 +30,7 @@ import Form2fa from 'client/containers/Login/Forms/Form2fa';
 import FormGroup from 'client/containers/Login/Forms/FormGroup';
 import loginStyles from 'client/containers/Login/styles';
 import Logo from 'client/icons/logo';
+import { ONEADMIN_ID } from 'client/constants';
 
 const STEP = {
   USER_FORM: 0,
@@ -54,7 +55,9 @@ function Login() {
   const handleSubmitUser = dataForm => {
     login({ ...user, ...dataForm }).then(data => {
       if (data?.token) {
-        getAuthInfo().then(() => setStep(STEP.GROUP_FORM));
+        getAuthInfo().then(() => {
+          data?.id !== ONEADMIN_ID && setStep(STEP.GROUP_FORM);
+        });
       } else {
         setStep(data ? STEP.FA2_FORM : step);
         setUser(data ? dataForm : user);
@@ -74,7 +77,7 @@ function Login() {
     <Container
       component="main"
       disableGutters={isMobile}
-      maxWidth={isMobile || 'xs'}
+      maxWidth={isMobile ? 'lg' : 'xs'}
       className={classes.root}
     >
       {isLoading && <LinearProgress className={classes.loading} />}

src/fireedge/src/public/containers/TestApi/ResponseForm.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { string, func, objectOf, object } from 'prop-types';
+import { string, func, shape, object } from 'prop-types';
 
 import { useForm, Controller } from 'react-hook-form';
 import {
@@ -85,7 +85,7 @@ const ResponseForm = ({
 };
 
 ResponseForm.propTypes = {
-  command: objectOf({
+  command: shape({
     name: string.isRequired,
     httpMethod: string.isRequired,
     params: object.isRequired

src/fireedge/src/public/icons/logo.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { number, string, bool } from 'prop-types';
+import { number, string, bool, oneOfType } from 'prop-types';
 
 const Logo = ({ width, height, spinner, withText, viewBox, ...props }) => {
   const cloudColor = {
@@ -18,7 +18,12 @@ const Logo = ({ width, height, spinner, withText, viewBox, ...props }) => {
       <defs>
         {spinner &&
           Object.entries(cloudColor)?.map(([key, color]) => (
-            <linearGradient id={`gradient__${key}`} x1="0%" x2="200%">
+            <linearGradient
+              key={`gradient-${key}`}
+              id={`gradient__${key}`}
+              x1="0%"
+              x2="200%"
+            >
               <stop offset="0%" stopColor={color.from} />
               <stop offset="200%" stopColor={color.to} />
               <animate
@@ -81,7 +86,7 @@ const Logo = ({ width, height, spinner, withText, viewBox, ...props }) => {
 };
 
 Logo.propTypes = {
-  width: number.isRequired,
+  width: oneOfType([number, string]).isRequired,
   height: number.isRequired,
   viewBox: string,
   spinner: bool,