Merge pull request #349 from bitlogic/dev

Merge dev to main

Author: brunoportesio

gatsby-config.js

@@ -1,3 +1,5 @@
+
+
 module.exports = {
   trailingSlash: "always",
   siteMetadata: {
@@ -169,4 +171,4 @@ module.exports = {
     "gatsby-plugin-webpack-bundle-analyser-v2",
     "gatsby-plugin-react-helmet"
   ],
-}
+}

gatsby-node.js

@@ -8,6 +8,20 @@ exports.onCreateWebpackConfig = ({ actions }) => {
         exclude: /mini-css-extract-plugin[^]*Conflicting order. Following module has been added:/,
       }),
     ],
+    
+      resolve: {
+        extensions: ['.mjs', '.js'],
+      },
+      module: {
+        rules: [
+          {
+            test: /\.mjs$/,
+            include: /node_modules/,
+            type: 'javascript/auto',
+          },
+        ],
+      },
+    
   })
 }
 
@@ -19,9 +33,8 @@ exports.createSchemaCustomization = ({ actions }) => {
   const iconSchema = require("./src/schema/iconSchema")
   const landingSchema = require("./src/schema/landingSchema")
   const layoutSchema = require("./src/schema/layoutSchema")
-  const generalSchema = require("./src/schema/generalSchema")
   const professionalsSchema = require("./src/schema/professionalsSchema")
-
+  const generalSchema = require("./src/schema/generalSchema")
   const { createTypes } = actions
   const typeDefs =
     blogSchema.value +
@@ -33,15 +46,25 @@ exports.createSchemaCustomization = ({ actions }) => {
     layoutSchema.value +
     professionalsSchema.value +
     generalSchema.value
+
+  // Core type definitions from schema files
   createTypes(typeDefs)
+
+  // POSTER
+  createTypes(`
+    type ComponentVideoBackground implements Node {
+      poster: File @link(from: "poster.localFile")
+      video: File @link(from: "video.localFile")
+    }
+  `)
 }
 
-exports.createPages = async ({ graphql, actions }) => {
+exports.createPages = async ({ graphql, actions, reporter }) => {
   const { createPage } = actions
 
-  // CREACION DE PAGINAS DE BLOG
-  const { data: blogQueryData } = await graphql(`
-    query Articles {
+  // 1) Blog detail pages
+  const blogResult = await graphql(`
+    {
       allStrapiArticle {
         nodes {
           slug
@@ -50,26 +73,24 @@ exports.createPages = async ({ graphql, actions }) => {
       }
     }
   `)
-
-  if (blogQueryData.errors) {
-    reporter.panicOnBuild("Error creando paginas de blog")
+  if (blogResult.errors) {
+    reporter.panicOnBuild("Error creating blog detail pages", blogResult.errors)
   }
-
-  blogQueryData.allStrapiArticle.nodes.forEach(node => {
-    const BlogDetail = path.resolve("./src/templates/BlogItemDetail.js")
+  const blogTemplate = path.resolve("./src/templates/BlogItemDetail.js")
+  blogResult.data.allStrapiArticle.nodes.forEach(node => {
     createPage({
-      path: "/blog/" + node.slug,
-      component: BlogDetail,
+      path: `/blog/${node.slug}`,
+      component: blogTemplate,
       context: {
         slug: node.slug,
         lastmod: node.updated_at,
       },
     })
   })
 
-  // CREACION DE LANDING PAGES
-  const { data: LandingQueryData } = await graphql(`
-    query Landings {
+  // 2) Landing pages
+  const landingResult = await graphql(`
+    {
       allStrapiLandingPage {
         nodes {
           slug
@@ -81,38 +102,56 @@ exports.createPages = async ({ graphql, actions }) => {
       }
     }
   `)
-
-  if (LandingQueryData.errors) {
-    reporter.panicOnBuild("Error creando paginas de landing")
+  if (landingResult.errors) {
+    reporter.panicOnBuild("Error creating landing pages", landingResult.errors)
   }
-
-  const landings = LandingQueryData.allStrapiLandingPage.nodes
-
-  function getUrl(node) {
+  const landings = landingResult.data.allStrapiLandingPage.nodes
+  const landingTemplate = path.resolve("./src/templates/LandingPage.js")
+  const buildLandingUrl = node => {
     if (!node) return ""
-
     if (node.parent_page) {
-      const parentPage = landings.find(
-        landing => landing.slug === node.parent_page.slug
-      )
-      const parentUrl = getUrl(parentPage)
-      return `${parentUrl}/${node.slug}`
+      const parent = landings.find(l => l.slug === node.parent_page.slug)
+      return buildLandingUrl(parent) + `/${node.slug}`
     }
-
     return `/${node.slug}`
   }
-
   landings.forEach(node => {
-    const LandingPage = path.resolve("./src/templates/LandingPage.js")
-    const url = getUrl(node)
-
     createPage({
-      path: url,
-      component: LandingPage,
+      path: buildLandingUrl(node),
+      component: landingTemplate,
       context: {
         slug: node.slug,
         lastmod: node.updated_at,
       },
     })
   })
+
+  // 3) Category pages
+  const categoryResult = await graphql(`
+    {
+      allStrapiBlogCategory {
+        nodes {
+          name
+          slug
+        }
+      }
+    }
+  `)
+  if (categoryResult.errors) {
+    reporter.panicOnBuild(
+      "Error creating category pages",
+      categoryResult.errors
+    )
+  }
+  const categoryTemplate = path.resolve("./src/templates/CategoryPage.js")
+  categoryResult.data.allStrapiBlogCategory.nodes.forEach(category => {
+    const slugLower = category.slug.toLowerCase()
+    createPage({
+      path: `/blog/${slugLower}`,
+      component: categoryTemplate,
+      context: {
+        name: category.name,
+      },
+    })
+  })
 }

package.json

@@ -37,7 +37,7 @@
     "react-dom": "^17.0.1",
     "react-flip-toolkit": "^7.0.13",
     "react-helmet": "^6.1.0",
-    "react-icons": "^4.2.0",
+    "react-icons": "^2.2.7",
     "react-lottie": "1.2.4",
     "react-multi-carousel": "^2.8.0",
     "react-showdown": "^2.3.1",

src/components/BannerRedirect/BannerRedirect.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from "react"
 import "./BannerRedirect.scss"
-import { MdClose } from "react-icons/md"
+import  MdClose  from "react-icons/lib/md/close"
 
 function BannerRedirect() {
   const [isOpen, setIsOpen] = useState(true)

src/components/BlogPage/BlogArticle/BlogArticle.js

@@ -1,51 +1,66 @@
 import React from "react"
 import { Link } from "gatsby"
-// import ReactMarkdown from "react-markdown"
 import MarkdownView from "react-showdown"
-import "./BlogArticle.scss"
 import PropTypes from "prop-types"
 import CustomImage from "../../CustomImage/CustomImage"
+import "./BlogArticle.scss"
+
+const BlogArticle = ({
+  title,
+  summary,
+  image,
+  slug,
+  text,
+  destacado = false,
+}) => (
+  <div
+    className={`article__container${destacado ? ' article--destacado' : ''}`}
+    data-nosnippet
+  >
+    {destacado && (
+      <span className="article__badge">Destacado</span>
+    )}
 
-const BlogArticle = ({ title, summary, image, slug, text }) => {
-
-  return (
-    <div className="article__container" data-nosnippet>
-      <CustomImage image={image}
-        alt={image?.alternativeText || title}
-        className="article__image"
-        width={140}
-        height={170}
-      />
-      <div className="article__description">
-        <h4>{title}</h4>
-        <MarkdownView markdown={`${summary}`}
+    <CustomImage
+      image={image}
+      alt={image?.alternativeText || title}
+      className="article__image"
+      width={140}
+      height={170}
+    />
+
+    <div className="article__description">
+      <h4 className="article__title">{title}</h4>
+      <MarkdownView markdown={`${summary}`}
           dangerouslySetInnerHTML={{ __html: summary }}
         />
-        <div className="article__link">
-          <Link to={slug}>
-            <small>{text || 'Ver más'}</small>
-          </Link>
-        </div>
+      <div className="article__link">
+        <Link to={slug}>
+          <small>{text || 'Ver más'}</small>
+        </Link>
       </div>
     </div>
-  )
-}
+  </div>
+)
 
 BlogArticle.propTypes = {
   title: PropTypes.string.isRequired,
-  slug: PropTypes.string.isRequired,
   summary: PropTypes.string.isRequired,
-  text: PropTypes.string,
   image: PropTypes.shape({
     alternativeText: PropTypes.string,
     url: PropTypes.string,
     localFile: PropTypes.shape({
       childImageSharp: PropTypes.shape({
-        gatsbyImageData: PropTypes.object.isRequired
-      })
-    })
-  }).isRequired
-};
+        gatsbyImageData: PropTypes.object.isRequired,
+      }),
+    }),
+  }).isRequired,
+  slug: PropTypes.string.isRequired,
+  text: PropTypes.string,
+  destacado: PropTypes.bool,
+}
 
 export default BlogArticle;
 
+
+

src/components/BlogPage/BlogArticle/BlogArticle.scss

@@ -109,4 +109,4 @@
       }
     }
   }
-}
+}