F #5422: Minor fixes (#2090)

src/fireedge/src/client/components/NumberEasing/index.js

@@ -27,7 +27,7 @@ const TOTAL_PROGRESS = 1
  * @param {number} [props.duration] - Duration of animation effect in ms
  * @returns {string} Returns a count number
  */
-const NumberEasing = ({ value = 0, start = 0, duration = 2000 }) => {
+const NumberEasing = ({ value = 0, start = 0, duration = 1500 }) => {
   const [count, setCount] = useState(start)
 
   useEffect(() => {
@@ -51,7 +51,7 @@ const NumberEasing = ({ value = 0, start = 0, duration = 2000 }) => {
     animation = window.requestAnimationFrame(step)
 
     return () => window.cancelAnimationFrame(animation)
-  }, [])
+  }, [value])
 
   return count
 }

src/fireedge/src/client/containers/Dashboard/Sunstone/index.js

@@ -99,13 +99,13 @@ function SunstoneDashboard() {
 }
 
 const ResourceWidget = memo(({ query, ...props }) => {
-  const { data = [], isLoading } = query()
+  const { data = [], isFetching } = query()
 
   return (
     <Grid item xs={12} sm={6} md={3}>
       <WavesCard
         value={
-          isLoading ? (
+          isFetching ? (
             <CircularProgress size={20} />
           ) : (
             <NumberEasing value={data?.length} />

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

@@ -14,8 +14,7 @@
  * limitations under the License.                                            *
  * ------------------------------------------------------------------------- */
 
-import { ReactElement, useState, memo } from 'react'
-import PropTypes from 'prop-types'
+import { ReactElement, useState, useMemo } from 'react'
 import {
   Box,
   Container,
@@ -27,7 +26,7 @@ import {
 import {
   useLoginMutation,
   useChangeAuthGroupMutation,
-} from 'client/features/AuthApi'
+} from 'client/features/OneApi/auth'
 import { useAuth, useAuthApi } from 'client/features/Auth'
 import { useGeneral } from 'client/features/General'
 
@@ -55,8 +54,6 @@ function Login() {
   const { logout } = useAuthApi()
   const { error: authError, isLoginInProgress: needGroupToContinue } = useAuth()
 
-  const { appTitle } = useGeneral()
-
   const [changeAuthGroup, changeAuthGroupState] = useChangeAuthGroupMutation()
   const [login, loginState] = useLoginMutation()
   const isLoading = loginState.isLoading || changeAuthGroupState.isLoading
@@ -173,22 +170,29 @@ function Login() {
           )}
         </Box>
 
-        {APPS?.filter((app) => app !== `${appTitle}`.toLowerCase())?.map(
-          (app) => (
-            <AppLink key={app} app={app} />
-          )
-        )}
+        {useMemo(() => STEPS.USER_FORM === step && <AppLinks />, [step])}
       </Box>
     </Container>
   )
 }
 
-const AppLink = memo(({ app }) => {
-  const name = APPS_WITH_ONE_PREFIX.includes(app)
-    ? `One${sentenceCase(app)}`
-    : sentenceCase(app)
+const AppLinks = () => {
+  const { appTitle } = useGeneral()
 
-  return (
+  const isNotCurrentApp = (app) => app !== `${appTitle}`.toLowerCase()
+
+  const transformAppTitle = (app) =>
+    APPS_WITH_ONE_PREFIX.includes(app)
+      ? `One${sentenceCase(app)}`
+      : sentenceCase(app)
+
+  const otherApps = APPS.filter(isNotCurrentApp).map(transformAppTitle)
+
+  if (otherApps?.length === 0) {
+    return null
+  }
+
+  return otherApps.map((app) => (
     <Link
       key={app}
       href={`${APP_URL}/${app}`}
@@ -198,10 +202,7 @@ const AppLink = memo(({ app }) => {
     >
       <Translate word={T.TakeMeToTheAppGui} values={name} />
     </Link>
-  )
-})
-
-AppLink.displayName = 'AppLink'
-AppLink.propTypes = { app: PropTypes.string.isRequired }
+  ))
+}
 
 export default Login