Merge pull request #63 from bitlogic/SBIT-400

SBIT-400: fix code smells to sonar

Author: marino-martin

src/components/Banner/Banner.js

@@ -1,6 +1,5 @@
 import React from "react"
 import MarkdownView from "react-showdown"
-//import ReactMarkdown from "react-markdown"
 import Lottie from "react-lottie"
 import { useTheme } from "../../context/themeContext"
 import "./Banner.scss"
@@ -33,20 +32,21 @@ const Banner = ({ data }) => {
       <div className="container banner__wrapper">
         <div className="title container-md">
           <div>
-            {/* {variant === "hero" ? <h1>{title}</h1> : <h2>{title}</h2>} */}
             {showTitle()}
             {
               <MarkdownView
                 markdown={summary}
                 dangerouslySetInnerHTML={{ __html: summary }}
               />
             }
-            <CustomLink
-              content={button?.content}
-              url={button?.url}
-              landing={button?.english_landing_page}
-              className={"button"}
-            />
+            {button && (
+              <CustomLink
+                content={button?.content}
+                url={button?.url}
+                landing={button?.english_landing_page}
+                className={"button"}
+              />
+            )}
           </div>
         </div>
 

src/components/BannerHead/BannerHead.js

@@ -15,7 +15,7 @@ export default function BannerList({ data }) {
           <div className="card_item">
             <CustomImage
               image={item?.icon}
-              alt={item?.icon?.alternativeText || item?.icon?.name}
+              alt={item?.icon?.alternativeText || item.title}
               className={"d-block"}
               width={70}
               height={70}

src/components/BannerHead/BannerHead.scss

@@ -5,12 +5,10 @@ import PropTypes from "prop-types"
 const CustomImage = ({ image, className, alt, width, height }) => {
   if (!image) return null
 
-
   const { url, localFile } = image
+  const localImage = getImage(localFile?.childImageSharp?.gatsbyImageData)
 
-  if (localFile) {
-    const localImage = getImage(localFile?.childImageSharp?.gatsbyImageData)
-
+  if (localImage) {
     return (
       <GatsbyImage
         loading="lazy"

src/components/BannerList/BannerList.js

@@ -60,7 +60,7 @@ const OneSection = ({ data: { dualSectionPart } }) => {
   )
 }
 
-OneSection.protoTypes = {
+OneSection.propTypes = {
   data: PropTypes.shape({
     dualSectionPart: PropTypes.arrayOf(
       PropTypes.shape({

src/components/CustomImage/CustomImage.js

@@ -1,43 +1,24 @@
 import "./logosSection.scss"
 import React from "react"
 import { useTheme } from "../../context/themeContext"
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 import Carousel from "react-multi-carousel"
 import "react-multi-carousel/lib/styles.css"
 import PropTypes from "prop-types"
 
-const handleKeyDown = (event, onClick) => {
-  if (event.key === "Enter" || event.key === " ") {
-    onClick()
-  }
-}
-
 const CustomLeftArrow = ({ onClick }) => {
   return (
-    <FontAwesomeIcon
-      role="button"
+    <button
       aria-label="Left arrow to see the previous logo"
-      tabIndex={0}
-      aria-hidden={false}
-      focusable
-      onKeyDown={event => handleKeyDown(event, onClick)}
       className="react-multiple-carousel__arrow react-multiple-carousel__arrow--left custom-arrow left"
-      icon="fa-solid fa-chevron-left"
       onClick={() => onClick()}
     />
   )
 }
 const CustomRightArrow = ({ onClick }) => {
   return (
-    <FontAwesomeIcon
-      role="button"
+    <button
       aria-label="Right arrow to see the previous logo"
-      tabIndex={0}
-      aria-hidden={false}
-      focusable
-      onKeyDown={event => handleKeyDown(event, onClick)}
       className="react-multiple-carousel__arrow react-multiple-carousel__arrow--right custom-arrow right"
-      icon="fa-solid fa-chevron-right"
       onClick={() => onClick()}
     />
   )