From 08cc84d2dc0a16708edde2c20078fa8786760f96 Mon Sep 17 00:00:00 2001 From: Julien Margail <j.margail@geofit.fr> Date: Mon, 19 Dec 2022 18:01:34 +0100 Subject: [PATCH] fix Link internal check --- src/components/core/Link.tsx | 37 ++++++++++++++++++++++-------------- 1 file changed, 23 insertions(+), 14 deletions(-) diff --git a/src/components/core/Link.tsx b/src/components/core/Link.tsx index db25e3a..45cd335 100644 --- a/src/components/core/Link.tsx +++ b/src/components/core/Link.tsx @@ -1,15 +1,14 @@ // From https://www.gatsbyjs.com/docs/reference/built-in-components/gatsby-link/ import React from "react" -import { Link as GatsbyLink } from "gatsby" - +import { graphql, useStaticQuery, Link as GatsbyLink } from "gatsby" interface Props { children?: React.ReactNode to: string activeClassName?: string partiallyActive?: any - onClick?:any + onClick?: any className?: any } @@ -25,34 +24,44 @@ const Link = ({ className, ...other }: Props) => { - // Si commence par http - // Si contient - // geoportal | geonetwork | metabase | ... - - // Basé sur les données de l'api grapgql = liste des pages ? + // Basé sur les données de l'API GraphQL = liste des pages + const data = useStaticQuery(graphql` + query appPages { + allSitePage { + nodes { + path + } + } + } + `) - // Tailor the following test to your environment. - // This example assumes that any internal link (intended for Gatsby) - // will start with exactly one slash, and that anything else is external. - const internal = /^\/(?!\/)/.test(to) + // /^https?:\/\// + // Si "to" n'est pas dans la liste des pages, c'est un lien externe + // ignore le "/" à la fin du 'path' et de 'to' + const internal = data.allSitePage.nodes.find( + ({ path }) => path.replace(/\/+$/, "") === to.replace(/\/+$/, "") + ) // Use Gatsby Link for internal links, and <a> for others if (internal) { + // console.log("Internal", to) return ( <GatsbyLink to={to} activeClassName={activeClassName} partiallyActive={partiallyActive} onClick={onClick} - className = {className} + className={className} {...other} > {children} </GatsbyLink> ) } + + // console.log("External", to) return ( - <a href={to} {...other} onClick={onClick} className = {className}> + <a href={to} {...other} onClick={onClick} className={className}> {children} </a> ) -- GitLab