Merge pull request #292 from bitlogic/dev

Release 27-09-2024

Author: marino-martin

src/components/BlogPage/BlogGrid/BlogGrid.js

@@ -1,21 +1,20 @@
-import React from 'react'
-import './BlogGrid.scss'
-import Pagination from '../../Pagination/Pagination'
-import PropTypes from 'prop-types'
+import React from "react"
+import "./BlogGrid.scss"
+import Pagination from "../../Pagination/Pagination"
+import PropTypes from "prop-types"
 
 const BlogGrid = ({ title, children }) => {
   return (
     <div className="grid__container">
       <h4>{title}</h4>
-      {/* <div className="grid__content">{children}</div> */}
       <Pagination initialState={true} postPerPage="9" posts={children} />
     </div>
   )
 }
 
 BlogGrid.propTypes = {
   title: PropTypes.string.isRequired,
-  children: PropTypes.object.isRequired
+  children: PropTypes.array.isRequired,
 }
 
-export default BlogGrid
+export default BlogGrid

src/components/CustomImage/CustomImage.js

@@ -6,10 +6,9 @@ const CustomImage = memo(({ image, className, alt, width, height }) => {
   if (!image) return null
 
   const { url, localFile } = image
+  const localImage = getImage(localFile)
 
-  if (localFile) {
-    const localImage = getImage(localFile)
-
+  if (localImage) {
     return (
       <GatsbyImage
         loading="lazy"

src/components/DualSection/DualSection.js

@@ -65,7 +65,7 @@ DualSection.propTypes = {
     summary: PropTypes.string,
     dualSectionPart: PropTypes.arrayOf(
       PropTypes.shape({
-        id: PropTypes.number.isRequired,
+        id: PropTypes.string.isRequired,
         title: PropTypes.string.isRequired,
         description: PropTypes.string,
         button: PropTypes.shape({

src/components/FaIcon/FaIcon.js

@@ -1,7 +1,7 @@
 import React from "react"
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 import "../FontAwesomeOne/FontAwesomeOne"
-import PropTypes from 'prop-types'
+import PropTypes from "prop-types"
 
 const FaIcon = ({ type, code }) => {
   return (
@@ -11,9 +11,9 @@ const FaIcon = ({ type, code }) => {
   )
 }
 
-FaIcon.protoType = {
+FaIcon.propTypes = {
   type: PropTypes.string.isRequired,
-  code: PropTypes.string.isRequired
+  code: PropTypes.string.isRequired,
 }
 
-export default FaIcon
+export default FaIcon

src/components/ListItems/ListItems.js

@@ -60,7 +60,7 @@ ListItems.propTypes = {
     title: PropTypes.string,
     ListItem: PropTypes.arrayOf(
       PropTypes.shape({
-        id: PropTypes.number.isRequired,
+        id: PropTypes.string.isRequired,
         title: PropTypes.string.isRequired,
         description: PropTypes.string,
         landing_page: PropTypes.shape({

src/components/LogosSection/logosSection.js

@@ -1,45 +1,26 @@
 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"
 import CustomImage from "../CustomImage/CustomImage"
 
-const handleKeyDown = (event, onClick) => {
-  if (event.key === "Enter" || event.key === " ") {
-    onClick()
-  }
-}
-
 const CustomLeftArrow = ({ onClick }) => {
   return (
-    <FontAwesomeIcon
-      role="button"
-      aria-label="Flecha izquierda para ver logo anterior"
-      tabIndex={0}
-      aria-hidden={false}
-      focusable
-      onKeyDown={event => handleKeyDown(event, onClick)}
+    <button
       className="react-multiple-carousel__arrow react-multiple-carousel__arrow--left custom-arrow left"
-      icon="fa-solid fa-chevron-left"
+      aria-label="Flecha izquierda para ver logo anterior"
       onClick={() => onClick()}
     />
   )
 }
 
 const CustomRightArrow = ({ onClick }) => {
   return (
-    <FontAwesomeIcon
-      role="button"
-      aria-label="Flecha derecha para ver el siguiente logo"
-      tabIndex={0}
-      aria-hidden={false}
-      focusable
-      onKeyDown={event => handleKeyDown(event, onClick)}
+    <button
       className="react-multiple-carousel__arrow react-multiple-carousel__arrow--right custom-arrow right"
-      icon="fa-solid fa-chevron-right"
+      aria-label="Flecha derecha para ver el siguiente logo"
       onClick={() => onClick()}
     />
   )
@@ -123,7 +104,7 @@ LogosSection.propTypes = {
     summary: PropTypes.string,
     media: PropTypes.arrayOf(
       PropTypes.shape({
-        id: PropTypes.number.isRequired,
+        id: PropTypes.string.isRequired,
         name: PropTypes.string.isRequired,
         img: PropTypes.shape({
           url: PropTypes.string.isRequired,

src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js

@@ -8,7 +8,7 @@ import { useLandingUrl } from "../../../hooks"
 import PropTypes from "prop-types"
 
 function getDropdown(navItem) {
-  return () => (
+  return () =>
     navItem?.dropdown ? (
       <Dropdown
         sections={navItem?.dropdownItems}
@@ -17,7 +17,6 @@ function getDropdown(navItem) {
     ) : (
       <Dropdown sections={null} topLevel={null} />
     )
-  );
 }
 
 const AnimatedNavbar = ({ navbarItems = [], duration }) => {
@@ -116,7 +115,7 @@ const AnimatedNavbar = ({ navbarItems = [], duration }) => {
               onMouseEnter={() => onMouseEnter(index)}
               isDropdown={n?.isDropdown}
             >
-              {currentIndex === index && (
+              {currentIndex === index ? (
                 <DropdownContainer
                   direction={direction}
                   animatingOut={animationOut}
@@ -125,7 +124,7 @@ const AnimatedNavbar = ({ navbarItems = [], duration }) => {
                   <CurrentDropdown />
                   {PrevDropdown && <PrevDropdown />}
                 </DropdownContainer>
-              )}
+              ) : null}
             </NavbarItem>
           )
         })}

src/components/NavBar/AnimatedNavBar/DropdownContainer/Dropdown.js

@@ -37,7 +37,7 @@ RenderSection.propTypes = {
       slug: PropTypes.string.isRequired,
     }),
     icon: PropTypes.shape({
-      url: PropTypes.string.isRequired,
+      url: PropTypes.string,
       alternativeText: PropTypes.string,
       localFile: PropTypes.shape({
         childImageSharp: PropTypes.shape({
@@ -83,40 +83,10 @@ const Dropdown = memo(({ sections, topLevel }) => {
 })
 
 Dropdown.propTypes = {
-  topLevel: PropTypes.shape({
-    label: PropTypes.string.isRequired,
-    text: PropTypes.string,
-    url: PropTypes.string,
-    landing_page: PropTypes.shape({
-      slug: PropTypes.string.isRequired,
-    }),
-    icon: PropTypes.shape({
-      url: PropTypes.string.isRequired,
-      alternativeText: PropTypes.string,
-      localFile: PropTypes.shape({
-        childImageSharp: PropTypes.shape({
-          gatsbyImageData: PropTypes.object.isRequired,
-        }),
-      }),
-    }),
-  }),
+  topLevel: PropTypes.object,
   sections: PropTypes.arrayOf(
     PropTypes.shape({
-      label: PropTypes.string.isRequired,
-      text: PropTypes.string,
-      url: PropTypes.string,
-      landing_page: PropTypes.shape({
-        slug: PropTypes.string.isRequired,
-      }),
-      icon: PropTypes.shape({
-        url: PropTypes.string.isRequired,
-        alternativeText: PropTypes.string,
-        localFile: PropTypes.shape({
-          childImageSharp: PropTypes.shape({
-            gatsbyImageData: PropTypes.object.isRequired,
-          }),
-        }),
-      }),
+      id: PropTypes.number.isRequired,
     })
   ),
 }

src/components/NavBar/AnimatedNavBar/DropdownContainer/FadeContents.js

@@ -19,7 +19,6 @@ const FadeContents = forwardRef(
 )
 
 const propTypes = {
-  duration: PropTypes.number,
   direction: PropTypes.oneOf(["right", "left"]),
   animatingOut: PropTypes.bool,
   children: PropTypes.node,

src/components/NavBar/AnimatedNavBar/DropdownContainer/dropdown.scss

@@ -24,14 +24,14 @@
       align-items: center;
       font-size: 18px;
 
-
       &-inner {
+        text-align: start;
         color: $primary;
         padding: 8px 0;
         font-weight: $standard;
 
         &:hover {
-          text-decoration: underline solid $primary
+          text-decoration: underline solid $primary;
         }
       }
 
@@ -58,8 +58,10 @@
 }
 
 .navbarItemIcon {
-  width: 28px !important;
-  height: 28px !important;
+  width: 100%;
+  height: 100%;
+  max-width: 28px;
+  max-height: 28px;
   align-self: center;
   margin-right: 5px;
 
@@ -109,7 +111,6 @@
     padding-left: 50px;
   }
 
-
   &-background {
     filter: brightness(120%);
     transform-origin: 0 0;
@@ -171,4 +172,4 @@
     transform: rotateX(-15deg);
     opacity: 0;
   }
-}
+}