From 2736795b2d05caf5c9b03c43540e8594de5e6f30 Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:26:31 -0300 Subject: [PATCH 1/8] cambio de colores svg theme --- public/page-data/index/page-data.json | 2 +- src/images/moon-solid.svg | 2 +- src/images/sun.svg | 1 + 3 files changed, 3 insertions(+), 2 deletions(-) create mode 100644 src/images/sun.svg diff --git a/public/page-data/index/page-data.json b/public/page-data/index/page-data.json index afd45c7a..46d42e34 100644 --- a/public/page-data/index/page-data.json +++ b/public/page-data/index/page-data.json @@ -2,4 +2,4 @@ "componentChunkName": "component---src-pages-index-js", "path": "/", "result": {"pageContext":{}}, - "staticQueryHashes": ["1128713364","1279924571","1292738615","1693928026","176670904","1868451474","1921816282","2499611023","2898073905","416013508","770242822","882490824"]} \ No newline at end of file + "staticQueryHashes": ["1128713364","1279924571","1292738615","1693928026","176670904","1868451474","2499611023","2898073905","3298386516","416013508","651390938","770242822","882490824"]} \ No newline at end of file diff --git a/src/images/moon-solid.svg b/src/images/moon-solid.svg index e687fb82..f12006da 100644 --- a/src/images/moon-solid.svg +++ b/src/images/moon-solid.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/images/sun.svg b/src/images/sun.svg new file mode 100644 index 00000000..da13b76c --- /dev/null +++ b/src/images/sun.svg @@ -0,0 +1 @@ + \ No newline at end of file From 51361bf99ef9ad11cac4cb819cb10dfdb4af6d87 Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:26:49 -0300 Subject: [PATCH 2/8] console.log - --- src/components/videoBackground/VideoBackground.js | 2 -- src/templates/LandingPage.js | 2 -- 2 files changed, 4 deletions(-) diff --git a/src/components/videoBackground/VideoBackground.js b/src/components/videoBackground/VideoBackground.js index 44c155a3..0f30870d 100644 --- a/src/components/videoBackground/VideoBackground.js +++ b/src/components/videoBackground/VideoBackground.js @@ -20,8 +20,6 @@ const VideoBackground = ({ data: { video, description, button } }) => { : undefined if (isVideoPauseLocal === "true") { - console.log(isVideoPauseLocal) - console.log("video pausado localmente") videoRef.current.pause() setIsVideoPause(isVideoPauseLocal) } diff --git a/src/templates/LandingPage.js b/src/templates/LandingPage.js index d517b1a5..1a404955 100644 --- a/src/templates/LandingPage.js +++ b/src/templates/LandingPage.js @@ -10,8 +10,6 @@ import ExpandGrid from "../components/expandGrid/ExpandGrid" const LandingPage = ({ data }) => { const pageData = data?.allStrapiLandingPage?.nodes[0] - console.log(pageData.body, "pageData") - const content = pageData.body.map((component, idx) => { const hero = component.strapi_component === "home.hero" ? From f726fd36b2086d9bcf6504f38c2fb648d41d1c1c Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:27:13 -0300 Subject: [PATCH 3/8] useNavbar hook --- src/hooks/index.js | 4 +++- src/hooks/useNavbar.js | 46 ++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 49 insertions(+), 1 deletion(-) create mode 100644 src/hooks/useNavbar.js diff --git a/src/hooks/index.js b/src/hooks/index.js index a1422cfa..c738a276 100644 --- a/src/hooks/index.js +++ b/src/hooks/index.js @@ -9,6 +9,7 @@ import useBlog from './useBlog' import useJobsPage from "./useJobsPage" import useServicePage from "./useServicePage" import useFooter from './useFooter'; +import useNavbar from './useNavbar'; export { useServices, @@ -21,5 +22,6 @@ export { useBlog, useJobsPage, useServicePage, - useFooter + useFooter, + useNavbar } diff --git a/src/hooks/useNavbar.js b/src/hooks/useNavbar.js new file mode 100644 index 00000000..e6c782e9 --- /dev/null +++ b/src/hooks/useNavbar.js @@ -0,0 +1,46 @@ +import { useStaticQuery, graphql } from "gatsby" + +const useNavbar = () => { + const query = useStaticQuery(graphql` + { + allStrapiLayout { + nodes { + navbar { + navbarItem { + url + label + landing { + slug + name + } + dropdown + id + } + logo { + localFile { + childImageSharp { + gatsbyImageData + } + } + } + } + } + } + allStrapiLandingPage { + nodes { + body + name + } + } + allStrapiHome { + nodes { + body + } + } + } + + `) + return query +} + +export default useNavbar From cf4b3d37f6f275224569b03077533807c64fbe46 Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:28:55 -0300 Subject: [PATCH 4/8] menuLinks eliminado --- src/constants/MenuLinks/MenuLinks.js | 57 ---------------------------- src/constants/index.js | 3 -- 2 files changed, 60 deletions(-) delete mode 100644 src/constants/MenuLinks/MenuLinks.js diff --git a/src/constants/MenuLinks/MenuLinks.js b/src/constants/MenuLinks/MenuLinks.js deleted file mode 100644 index 06ac418e..00000000 --- a/src/constants/MenuLinks/MenuLinks.js +++ /dev/null @@ -1,57 +0,0 @@ -import React from "react" -import { Link } from "gatsby" -import Nav from "react-bootstrap/Nav" -import { useTheme } from "../../context/themeContext" - -import moon from "../../images/moon-solid.svg" -import sun from "../../images/sun-icon-1.png" - -const MENU_LINKS = [ - { id: 1, text: "home", url: "/" }, - { id: 2, text: "servicios", url: "/services" }, -] - -const MenuLinks = ({ styleClass }) => { - const { theme, toggleTheme } = useTheme() - - return ( - - ) -} - -export default MenuLinks diff --git a/src/constants/index.js b/src/constants/index.js index bfaf145d..8b137891 100644 --- a/src/constants/index.js +++ b/src/constants/index.js @@ -1,4 +1 @@ -import MenuLinks from "./MenuLinks/MenuLinks" - -export { MenuLinks } From ddad41536f887e016f2225016ad2707ee137c025 Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:34:30 -0300 Subject: [PATCH 5/8] nuevo navbar --- .../NavBar/AnimatedNavBar/AnimatedNavbar.js | 158 ++++++++++++++++++ .../DropdownContainer/Dropdown.js | 23 +++ .../DropdownContainer/FadeContents.js | 30 ++++ .../DropdownContainer/dropdown.scss | 108 ++++++++++++ .../AnimatedNavBar/DropdownContainer/index.js | 125 ++++++++++++++ .../AnimatedNavBar/Navbar/NavbarItem.js | 20 +++ .../NavBar/AnimatedNavBar/Navbar/index.js | 11 ++ .../AnimatedNavBar/Navbar/navbarItems.scss | 39 +++++ src/components/NavBar/NavBar.scss | 51 +++--- src/components/NavBar/Navbar.js | 46 ++++- 10 files changed, 584 insertions(+), 27 deletions(-) create mode 100644 src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js create mode 100644 src/components/NavBar/AnimatedNavBar/DropdownContainer/Dropdown.js create mode 100644 src/components/NavBar/AnimatedNavBar/DropdownContainer/FadeContents.js create mode 100644 src/components/NavBar/AnimatedNavBar/DropdownContainer/dropdown.scss create mode 100644 src/components/NavBar/AnimatedNavBar/DropdownContainer/index.js create mode 100644 src/components/NavBar/AnimatedNavBar/Navbar/NavbarItem.js create mode 100644 src/components/NavBar/AnimatedNavBar/Navbar/index.js create mode 100644 src/components/NavBar/AnimatedNavBar/Navbar/navbarItems.scss diff --git a/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js b/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js new file mode 100644 index 00000000..257e5488 --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js @@ -0,0 +1,158 @@ +import React, { useState } from "react" +import Navbar from "./Navbar" +import NavbarItem from "./Navbar/NavbarItem" +import { Flipper } from "react-flip-toolkit" +import DropdownContainer from "./DropdownContainer" +import Dropdown from "./DropdownContainer/Dropdown" + +const getComponentTitle = component => { + // TODO: falta definir los titulos para cada componente + const titleReference = { + "home.hero": () => "Bitlogic", + "components.banner-list": () => "Dual section", + "components.selected-grid": () => "Selected grid", + "components.cases-section": () => " Cases section", + "home.quote": () => "Quote", + "home.video-background": () => "Video background", + "home.dual-section": () => "Dual section", + } + return ( + (titleReference[component.strapi_component] && + titleReference[component.strapi_component]()) || + "Titulo no definido" + ) +} + +const AnimatedNavbar = ({ + homeComponents, + landingComponents, + navbarItems, + duration, +}) => { + const navbarConfig = [ + { + title: "Home", + slug: "", + dropdown: () => ( + component.strapi_component !== "home.transition" + ) + .map(component => ({ + name: getComponentTitle(component), + href: "#" + component.strapi_component + "-" + component.id, + }))} + /> + ), + }, + ...navbarItems.map(navItem => { + if (navItem.landing) { + return { + title: navItem.label, + slug: navItem.landing.slug, + dropdown: () => ( + landing.name === navItem.landing.name) + .body.map(component => ({ + name: getComponentTitle(component), + href: + "/" + + navItem.landing.slug + + "#" + + component.strapi_component + + "-" + + component.id, + }))} + /> + ), + } + } else if (navItem.url) { + return { + title: navItem.label, + slug: navItem.url, + dropdown: () => , + } + } + }), + ] + + const [activeIndex, setActiveIndex] = useState([]) + const [animationOut, setAnimationOut] = useState(null) + + const [animatingOutTimeout, setAnimatingOutTimeout] = useState(null) + + const resetDropdownState = i => { + setActiveIndex(typeof i === "number" ? [i] : []) + setAnimationOut(false) + + setAnimatingOutTimeout(null) + } + + const onMouseEnter = i => { + if (animatingOutTimeout) { + clearTimeout(animatingOutTimeout) + resetDropdownState(i) + return + } + if (activeIndex[activeIndex.length - 1] === i) return + + setActiveIndex(prev => prev.concat(i)) + setAnimationOut(false) + } + + const onMouseLeave = () => { + setAnimationOut(true) + setAnimatingOutTimeout(setTimeout(resetDropdownState, duration)) + } + + let CurrentDropdown + let PrevDropdown + let direction + + const currentIndex = activeIndex[activeIndex.length - 1] + const prevIndex = + activeIndex.length > 1 && activeIndex[activeIndex.length - 2] + + if (typeof currentIndex === "number") + CurrentDropdown = navbarConfig[currentIndex].dropdown + if (typeof prevIndex === "number") { + PrevDropdown = navbarConfig[prevIndex].dropdown + direction = currentIndex > prevIndex ? "right" : "left" + } + + return ( + + + {navbarConfig.map((n, index) => { + return ( + + {currentIndex === index && ( + + + {PrevDropdown && } + + )} + + ) + })} + + + ) +} + +export default AnimatedNavbar diff --git a/src/components/NavBar/AnimatedNavBar/DropdownContainer/Dropdown.js b/src/components/NavBar/AnimatedNavBar/DropdownContainer/Dropdown.js new file mode 100644 index 00000000..47b2c960 --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/DropdownContainer/Dropdown.js @@ -0,0 +1,23 @@ +import React from "react" +import "./dropdown.scss" + +const Dropdown = ({ sections }) => { + return ( +
+
+
    + {sections && + sections.map(section => ( +

    + {section.name} +

    + ))} +
+
+
+ ) +} + + + +export default Dropdown diff --git a/src/components/NavBar/AnimatedNavBar/DropdownContainer/FadeContents.js b/src/components/NavBar/AnimatedNavBar/DropdownContainer/FadeContents.js new file mode 100644 index 00000000..e88496df --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/DropdownContainer/FadeContents.js @@ -0,0 +1,30 @@ +import React, { forwardRef } from "react" +import PropTypes from "prop-types" + +const FadeContents = forwardRef( + ({ children, animatingOut, direction }, ref) => ( + + ) +) + +const propTypes = { + duration: PropTypes.number, + direction: PropTypes.oneOf(["right", "left"]), + animatingOut: PropTypes.bool, + children: PropTypes.node, +} + +FadeContents.propTypes = propTypes + +export default FadeContents diff --git a/src/components/NavBar/AnimatedNavBar/DropdownContainer/dropdown.scss b/src/components/NavBar/AnimatedNavBar/DropdownContainer/dropdown.scss new file mode 100644 index 00000000..b9856c85 --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/DropdownContainer/dropdown.scss @@ -0,0 +1,108 @@ +.dropdown { + &_elem { + width: 18.5rem; + &-section { + padding: 28px; + position: relative; + z-index: 1; + } + &-link { + text-transform: uppercase; + font-size: 18px; + margin-top: 0; + margin-bottom: 1rem; + } + } +} + +.promote_layer { + will-change: transform; +} + +.fade_content { + @extend .promote_layer; + animation-duration: 300ms; + animation-fill-mode: forwards; + top: 0; + left: 0; +} + +@keyframes fade-forward { + to { + transform: translateX(0px); + opacity: 1; + } +} + +@keyframes fade-backward { + to { + transform: translateX(0px); + opacity: 0; + } +} + +.dropdown_root { + transform-origin: 0 0; + @extend .promote_layer; + animation-duration: 300ms; + animation-fill-mode: forwards; + display: flex; + flex-direction: column; + align-items: center; + position: relative; + top: -20px; + &-background { + transform-origin: 0 0; + background-color: white; + border-radius: 4px; + overflow: hidden; + position: relative; + box-shadow: 0 50px 100px rgba(50, 50, 93, 0.1); + margin-top: 10px; + @extend .promote_layer; + &-alt { + background-color: #f1f4f8b0; + width: 300%; + height: 100%; + position: absolute; + top: 0; + left: -100%; + transform-origin: 0 0; + z-index: 0; + transition: transform 300ms; + } + } + &-inverted { + @extend .promote_layer; + top: 0; + left: 0; + &:first-of-type { + z-index: 1; + } + &:not(:first-of-type) { + z-index: -1; + } + } +} + +@keyframes dropdown_root-forward { + from { + transform: rotateX(-15deg); + opacity: 0; + } + to { + transform: rotateX(0); + opacity: 1; + } +} + +@keyframes dropdown_root-backward { + from { + transform: rotateX(0); + opacity: 1; + } + to { + transform: rotateX(-15deg); + opacity: 0; + } +} diff --git a/src/components/NavBar/AnimatedNavBar/DropdownContainer/index.js b/src/components/NavBar/AnimatedNavBar/DropdownContainer/index.js new file mode 100644 index 00000000..1244240b --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/DropdownContainer/index.js @@ -0,0 +1,125 @@ +import React, { Component, Children, createRef } from "react" +import PropTypes from "prop-types" +import { Flipped } from "react-flip-toolkit" +import FadeContents from "./FadeContents" + +const getFirstDropdownSectionHeight = el => { + if ( + !el || + !el.querySelector || + !el.querySelector("*[data-first-dropdown-section]") + ) + return 0 + return el.querySelector("*[data-first-dropdown-section]").offsetHeight +} + +const updateAltBackground = ({ + altBackground, + prevDropdown, + currentDropdown, +}) => { + const prevHeight = getFirstDropdownSectionHeight(prevDropdown) + const currentHeight = getFirstDropdownSectionHeight(currentDropdown) + + const immediateSetTranslateY = (el, translateY) => { + el.style.transform = `translateY(${translateY}px)` + el.style.transition = "transform 0s" + requestAnimationFrame(() => (el.style.transitionDuration = "")) + } + + if (prevHeight) { + // transition the grey ("alt") background from its previous height to its current height + immediateSetTranslateY(altBackground, prevHeight) + requestAnimationFrame(() => { + altBackground.style.transform = `translateY(${currentHeight}px)` + }) + } else { + // just immediately set the background to the appropriate height + // since we don't have a stored value + immediateSetTranslateY(altBackground, currentHeight) + } +} + +class DropdownContainer extends Component { + static propTypes = { + children: PropTypes.node.isRequired, + animatingOut: PropTypes.bool, + direction: PropTypes.oneOf(["left", "right"]), + duration: PropTypes.number, + } + + currentDropdownEl = createRef() + prevDropdownEl = createRef() + + componentDidMount() { + updateAltBackground({ + altBackground: this.altBackgroundEl, + prevDropdown: this.prevDropdownEl.current, + currentDropdown: this.currentDropdownEl.current, + duration: this.props.duration, + }) + } + + render() { + const { children, direction, animatingOut, duration } = this.props + const [currentDropdown, prevDropdown] = Children.toArray(children) + return ( +
+ +
+ + +
+ +
+
(this.altBackgroundEl = el)} + duration={duration} + /> + + {currentDropdown} + +
+ + + +
+ {prevDropdown && ( + + {prevDropdown} + + )} +
+ +
+ +
+ ) + } +} + +export default DropdownContainer diff --git a/src/components/NavBar/AnimatedNavBar/Navbar/NavbarItem.js b/src/components/NavBar/AnimatedNavBar/Navbar/NavbarItem.js new file mode 100644 index 00000000..6cc42e13 --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/Navbar/NavbarItem.js @@ -0,0 +1,20 @@ +import { Link } from "gatsby" +import React from "react" +import "./navbarItems.scss" + +const NavbarItem = ({ title, children, index, to, ...props }) => { + const onMouseEnter = () => { + props.onMouseEnter(index) + } + return ( +
  • + {title} +
    {children}
    +
    • + ) +} +export default NavbarItem diff --git a/src/components/NavBar/AnimatedNavBar/Navbar/index.js b/src/components/NavBar/AnimatedNavBar/Navbar/index.js new file mode 100644 index 00000000..92513b6d --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/Navbar/index.js @@ -0,0 +1,11 @@ +import React from "react" + +const Navbar = ({ children, onMouseLeave }) => { + return ( + + ) +} + +export default Navbar diff --git a/src/components/NavBar/AnimatedNavBar/Navbar/navbarItems.scss b/src/components/NavBar/AnimatedNavBar/Navbar/navbarItems.scss new file mode 100644 index 00000000..01b0f34c --- /dev/null +++ b/src/components/NavBar/AnimatedNavBar/Navbar/navbarItems.scss @@ -0,0 +1,39 @@ +.navbar { + &-el { + margin: auto; + } + &-list { + display: flex; + justify-content: center; + list-style: none; + margin: 0; + } + &_item { + position: relative; + &-title { + background: transparent; + border: 0; + font-size: 18px; + padding: 2rem 1.5rem 1.2rem 1.5rem; + color: #1F1D37; + display: flex; + justify-content: center; + transition: opacity 250ms; + cursor: pointer; + /* position above the dropdown, otherwise the dropdown will cover up the bottom sliver of the buttons */ + position: relative; + z-index: 2; + &:hover, + &:focus { + opacity: 0.7; + outline: none; + } + } + &-dropdown_container { + position: absolute; + left: 50%; + transform: translateX(-50%); + perspective: 1500px; + } + } +} diff --git a/src/components/NavBar/NavBar.scss b/src/components/NavBar/NavBar.scss index ca3ff93a..b606dfb4 100644 --- a/src/components/NavBar/NavBar.scss +++ b/src/components/NavBar/NavBar.scss @@ -1,7 +1,7 @@ @import "../../styles/global.scss"; .NavBar { - background-color: none; + background-color: white; } .NavBar__Logo { margin: 16px 28px; @@ -43,7 +43,28 @@ color: #3f6BE8; } - +.NavBar_Side{ + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-around; + &-contact { + box-shadow: 0px 2px 10px #3f6be880; + padding: .6em; + background-color: #3F6BE8; + color: white; + border: 1px solid #3F6BE8; + border-radius: 4px; + &:hover{ + background-color: white; + color: #3F6BE8; + } + } + p { + color: #1F1D37; + margin: 0 3em; + } +} @media screen and (min-width: 992px) { .NavBar{ @@ -69,32 +90,22 @@ margin-right: 2.5rem; margin-top: .5em; } - .NavBar_Side{ - display: flex; - flex-direction: row; - align-items: center; - button { - padding: .6em; - background-color: #3f6BE8; - color: white; - border: none; - border-radius: 4px; - } - p { - margin: 0 0 0 3em; - } + justify-content: unset; } + } + .theme-toggle{ background: none; border: none; + height: 54px; + width: 54px; + position: relative; img { - margin: 0; - } - &-sun{ - filter: invert(100%); + color: white; + margin: 0 0 3px 0; } } \ No newline at end of file diff --git a/src/components/NavBar/Navbar.js b/src/components/NavBar/Navbar.js index 6efc265d..7195b185 100644 --- a/src/components/NavBar/Navbar.js +++ b/src/components/NavBar/Navbar.js @@ -1,14 +1,24 @@ import React from "react" +import "./NavBar.scss" +import { Link } from "gatsby" import Navbar from "react-bootstrap/Navbar" -import { MenuLinks } from "../../constants" +import AnimatedNavbar from "./AnimatedNavBar/AnimatedNavbar" + +import { useNavbar } from "../../hooks/index" + +// default logo import logoLight from "../../images/tipologo-azul.png" -import { Link } from "gatsby" -import "./NavBar.scss" +import { useTheme } from "../../context/themeContext" +// theme images +import moon from "../../images/moon-solid.svg" +import sun from "../../images/sun.svg" const NavBar = () => { + const { theme, toggleTheme } = useTheme() + const navbarData = useNavbar() return ( <> - + { /> {/* Menu Links */} - -
    - + +
    +

    ES

    +
    From e5676aa436c62dff9f2cf16edcbc5c7f8be89956 Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:40:49 -0300 Subject: [PATCH 6/8] null safe --- src/components/NavBar/Navbar.js | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/src/components/NavBar/Navbar.js b/src/components/NavBar/Navbar.js index 7195b185..61c1aa15 100644 --- a/src/components/NavBar/Navbar.js +++ b/src/components/NavBar/Navbar.js @@ -32,12 +32,16 @@ const NavBar = () => { /> {/* Menu Links */} - + {navbarData && ( + + )}

    ES

    From 6804c2a312878c0e3a1eb014cea494594a9cf52d Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 12:50:36 -0300 Subject: [PATCH 7/8] codesmell comentario --- src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js b/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js index 257e5488..9b425a17 100644 --- a/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js +++ b/src/components/NavBar/AnimatedNavBar/AnimatedNavbar.js @@ -6,7 +6,7 @@ import DropdownContainer from "./DropdownContainer" import Dropdown from "./DropdownContainer/Dropdown" const getComponentTitle = component => { - // TODO: falta definir los titulos para cada componente + // falta definir los titulos para cada componente y arreglar los vinculos internos const titleReference = { "home.hero": () => "Bitlogic", "components.banner-list": () => "Dual section", From bff959eec7b671026b843bd4bd568a35a1197507 Mon Sep 17 00:00:00 2001 From: benjacanas Date: Fri, 18 Mar 2022 13:17:18 -0300 Subject: [PATCH 8/8] code smell query --- src/hooks/useNavbar.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/hooks/useNavbar.js b/src/hooks/useNavbar.js index e6c782e9..3b3b5bf2 100644 --- a/src/hooks/useNavbar.js +++ b/src/hooks/useNavbar.js @@ -1,7 +1,7 @@ import { useStaticQuery, graphql } from "gatsby" const useNavbar = () => { - const query = useStaticQuery(graphql` + return useStaticQuery(graphql` { allStrapiLayout { nodes { @@ -40,7 +40,6 @@ const useNavbar = () => { } `) - return query } export default useNavbar