@openstack_dev/gatsby-theme-marketing-oif-core 1.0.29 → 1.0.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstack_dev/gatsby-theme-marketing-oif-core",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "description": "Base theme for Marketing Sites",
   "author": "smarcet",
   "keywords": [
@@ -15,7 +15,7 @@
     "format": "prettier --trailing-comma es5 --no-semi --single-quote --write \"{gatsby-*.js,src/**/*.js}\"",
     "prepare": "husky",
     "lint": "eslint src",
-    "precommit": "npx lint-staged --diff=origin/main --verbose",
+    "precommit": "yarn lint-staged --verbose",
     "rewrite_rules": "NODE_ENV=development node redirection-rules.js"
   },
   "lint-staged": {
@@ -23,7 +23,9 @@
     "**/*": "prettier --write --ignore-unknown"
   },
   "dependencies": {
-    "@babel/core": "^7.12.3",
+    "@babel/core": "^7.26.10",
+    "@babel/preset-env": "^7.26.9",
+    "@babel/preset-react": "^7.26.3",
     "@emotion/cache": "^11.11.0",
     "@emotion/react": "^11.11.4",
     "@emotion/server": "^11.11.0",
@@ -152,6 +154,8 @@
     "yup": "^0.32.11"
   },
   "devDependencies": {
+    "@babel/eslint-parser": "^7.27.0",
+    "babel-preset-gatsby": "^3.14.0",
     "eslint": "^7.32.0 || ^8.2.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-prettier": "^9.1.0",

package/redirection-rules.js

@@ -56,13 +56,32 @@ const buildRedirectionRules = () => {
     const hasSplat = redirect.from.endsWith("*");
     if (formerToml && tomlNodeExists(formerToml, NodeType.Route, redirect.from)) continue;
 
+    const httpRegExp = /^https?:\/\//;
+    const isAbsolute = httpRegExp.test(redirect.to);
+    const host = isAbsolute ? '' : redirectionHost;
+
+    // Status code logic correction:
+    // 200 for regular redirects (within the same site): for backward compatibility below v1.1.0
+    // 301 for absolute URLs (external redirects): permanent redirect
+    // If status is provided and is a valid number, has precedence over defaultStatus
+    const defaultStatus = isAbsolute ? 301 : 200;
+    const parsedStatus = parseInt(redirect.status, 10);
+    const status = !isNaN(parsedStatus) ? parsedStatus : defaultStatus;
+    const headers = [
+      `X-From = "netlify"`,
+      `X-Forwarded-Host = "${forwardedHost}"`,
+    ]
+    if (!isAbsolute) {
+      headers.unshift(`Authorization = "Basic ${authToken}"`);
+    }
+
     netlifyToml += `
     [[redirects]]
       from = "${redirect.from}"
-      to = "${redirectionHost}${redirect.to}${hasSplat ? ":splat" : ""}"
-      status = 200
+      to = "${host}${redirect.to}${hasSplat ? ":splat" : ""}"
+      status = ${status}
       force = true
-      headers = {Authorization = "Basic ${authToken}", X-From = "netlify", X-Forwarded-Host = "${forwardedHost}"}\n`;
+      headers = {${headers.join(", ")}}\n`;
   }
 
   if (!appendMode) {

package/src/cms/config/collections/configurationsCollection/index.js

@@ -4,13 +4,14 @@ import siteSettings from "./siteSettings";
 import navbar from "./navbar";
 import footer from "./footer";
 import announcementBanner from "./announcementBanner";
+import siteBanner from "./siteBanner";
 
 const configurationsCollection = {
   ...collectionDefaults({
     label: "Configurations",
-    name: "configurations",
+    name: "configurations"
   }),
-  files: [siteSettings, navbar, footer, announcementBanner],
+  files: [siteSettings, navbar, footer, announcementBanner, siteBanner]
 };
 
 export default configurationsCollection;

package/src/cms/config/collections/configurationsCollection/siteBanner/index.js

@@ -0,0 +1,32 @@
+import { SITE_BANNER_FILE_PATH } from "@utils/filePath";
+import { stringField, textField, booleanField } from "../../../fields";
+
+const siteBanner = {
+  label: "Site Banner",
+  name: "site-banner",
+  file: SITE_BANNER_FILE_PATH,
+  fields: [
+    textField({
+      label: "Text",
+      name: "text",
+      required: true
+    }),
+    stringField({
+      label: "CTA Title",
+      name: "cta_title",
+      required: true
+    }),
+    stringField({
+      label: "CTA Link",
+      name: "cta_link",
+      required: true
+    }),
+    booleanField({
+      label: "Display",
+      name: "display",
+      required: false
+    })
+  ]
+};
+
+export default siteBanner;

package/src/cms/config/collections/configurationsCollection/siteBanner/typeDefs.js

@@ -0,0 +1,7 @@
+module.exports = `
+  type SiteBannerJson implements Node {    
+    text: String
+    cta_title: String
+    cta_link: String
+  }
+`;

package/src/cms/config/collections/configurationsCollection/typeDefs.js

@@ -1,9 +1,11 @@
 const siteSettingsTypeDefs = require("./siteSettings/typeDefs");
 const footerTypeDefs = require("./footer/typeDefs");
 const announcementBannerTypeDefs = require("./announcementBanner/typeDefs");
+const siteBannerTypeDefs = require("./siteBanner/typeDefs");
 
 module.exports = [
   siteSettingsTypeDefs,
   footerTypeDefs,
-  announcementBannerTypeDefs
+  announcementBannerTypeDefs,
+  siteBannerTypeDefs
 ].join("");

package/src/cms/config/index.js

@@ -1,11 +1,9 @@
 import configurationsCollection from "./collections/configurationsCollection";
 
 const CMS_BACKEND_REPO = process.env.GATSBY_CMS_BACKEND_REPO;
-const CMS_BACKEND_BRANCH = process.env.GATSBY_CMS_BACKEND_BRANCH ||  "main";
+const CMS_BACKEND_BRANCH = process.env.GATSBY_CMS_BACKEND_BRANCH || "main";
 
-export const collections = [
-  configurationsCollection,
-];
+export const collections = [configurationsCollection];
 
 const config = {
   backend: {
@@ -17,7 +15,7 @@ const config = {
       update: "Update {{collection}} “{{slug}}”",
       delete: "Delete {{collection}} “{{slug}}”",
       uploadMedia: "[skip ci] Upload “{{path}}”",
-      deleteMedia: "[skip ci] Delete “{{path}}”",
+      deleteMedia: "[skip ci] Delete “{{path}}”"
     }
   },
   // It is not required to set `load_config_file` if the `config.yml` file is
@@ -25,7 +23,7 @@ const config = {
   load_config_file: false,
   media_folder: "static/img",
   public_folder: "/img",
-  collections: collections
+  collections
 };
 
 if (!CMS_BACKEND_REPO || !CMS_BACKEND_BRANCH) {

package/src/components/SiteBanner/index.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { useStaticQuery, graphql } from "gatsby";
+import SiteBannerTemplate from "./template";
+
+const siteBannerQuery = graphql`
+  query {
+    siteBannerJson {
+      text
+      cta_title
+      cta_link
+      display
+    }
+  }
+`;
+
+function SiteBanner() {
+  const { siteBannerJson: siteBannerContent } = useStaticQuery(siteBannerQuery);
+
+  return <SiteBannerTemplate data={siteBannerContent} />;
+}
+
+export default SiteBanner;

package/src/components/SiteBanner/index.module.scss

@@ -0,0 +1,69 @@
+.siteBannerWrapper {
+  display: flex;
+  min-height: 40px;
+  position: relative;
+  left: 0;
+  z-index: 20;
+  background-color: #4d96c7;
+  color: #f0f9fe;
+  font-size: 14px;
+  line-height: 20px;
+  .siteBannerContainer {
+    display: flex;
+    flex-direction: row;
+    text-align: left;
+    align-items: center;
+  }
+  .bannerText {
+    display: inline;
+    font-size: 16px;
+    line-height: 22px;
+    letter-spacing: normal;
+    max-width: 734px;
+    color: white;
+    font-size: 12px;
+    font-family: "Open Sans", Helvetica, Arial, sans-serif;
+    -webkit-font-smoothing: none;
+    -moz-osx-font-smoothing: none;
+    text-rendering: auto;
+    @media (min-width: 991px) {
+      font-size: 16px;
+    }
+  }
+  .bannerButton {
+    margin-left: 20px;
+    border-radius: 5px;
+    border: 1px solid #2f729c;
+    padding: 2px 10px 3px;
+    background-color: #2f729c;
+    display: inline-block;
+    text-transform: uppercase;
+    font-family: "Open Sans", Helvetica, Arial, sans-serif;
+    font-size: 14px;
+    line-height: 20px;
+    letter-spacing: normal;
+    @media (max-width: 574px) {
+      width: 100px;
+      margin: 5px;
+    }
+    &:hover {
+      text-decoration: none;
+      background-color: #f0f9fe;
+      a {
+        color: #2f729c;
+        -webkit-font-smoothing: none;
+        -moz-osx-font-smoothing: none;
+        text-rendering: auto;
+      }
+    }
+    a {
+      color: white;
+      font-size: 90%;
+      line-height: 20px;
+      letter-spacing: normal;
+      -webkit-font-smoothing: none;
+      -moz-osx-font-smoothing: none;
+      text-rendering: auto;
+    }
+  }
+}

package/src/components/SiteBanner/template.js

@@ -0,0 +1,26 @@
+import React from "react";
+import { Container, Typography, Button } from "@mui/material";
+import Link from "../Link";
+
+import styles from "./index.module.scss";
+
+function SiteBannerTemplate({ data }) {
+  const { text, cta_title, cta_link, display } = data || {};
+  if (!display) return null;
+
+  return (
+    <div className={styles.siteBannerWrapper}>
+      <Container maxWidth="xl" className={styles.siteBannerContainer}>
+        <Typography
+          dangerouslySetInnerHTML={{ __html: text }}
+          className={styles.bannerText}
+        />
+        <Button className={styles.bannerButton}>
+          <Link to={cta_link}>{cta_title}</Link>
+        </Button>
+      </Container>
+    </div>
+  );
+}
+
+export default SiteBannerTemplate;

package/src/components/SiteBannerLayout.js

@@ -0,0 +1,36 @@
+import React from "react";
+import PropTypes from "prop-types";
+import loadable from "@loadable/component";
+import Footer from "./Footer";
+import SponsoredProjectsNav from "./SponsoredProjectsNav";
+import SubscribeForm from "./SubscribeForm";
+import NavBarPlaceholder from "./Navbar/placeholder";
+import SiteBanner from "./SiteBanner";
+
+const Navbar = loadable(() => import("./Navbar"), {
+  ssr: false,
+  fallback: <NavBarPlaceholder />
+});
+
+function SiteBannerLayout({ children }) {
+  return (
+    <div>
+      <SponsoredProjectsNav />
+      <SiteBanner />
+      <Navbar />
+      <div>
+        <main id="content-wrapper">
+          {children}
+          <SubscribeForm />
+        </main>
+        <Footer />
+      </div>
+    </div>
+  );
+}
+
+SiteBannerLayout.propTypes = {
+  children: PropTypes.node.isRequired
+};
+
+export default SiteBannerLayout;

package/src/content/site-banner/index.json

@@ -0,0 +1,6 @@
+{
+  "text": "Join the OpenInfra Summit Europe in Paris, Oct 17-19! Registration, CFP & Sponsorships are Open!",
+  "cta_title": "Join Us!",
+  "cta_link": "https://summit2025.openinfra.org/",
+  "display": true
+}

package/src/utils/filePath.js

@@ -10,6 +10,8 @@ const COLORS_SASS_FILE_PATH = `${STYLES_DIR_PATH}/colors.scss`;
 const FONTS_SCSS_FILE_PATH = `${STYLES_DIR_PATH}/fonts.scss`;
 const SITE_SETTINGS_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/site-settings`;
 const SITE_SETTINGS_FILE_PATH = `${SITE_SETTINGS_DIR_PATH}/index.json`;
+const SITE_BANNER_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/site-banner`;
+const SITE_BANNER_FILE_PATH = `${SITE_BANNER_DIR_PATH}/index.json`;
 const MARKETING_PAGE_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/marketing-page`;
 const MARKETING_PAGE_FILE_PATH = `${MARKETING_PAGE_DIR_PATH}/index.json`;
 const LOBBY_PAGE_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/lobby-page`;
@@ -43,7 +45,8 @@ const SPONSORS_FILE_PATH = `${STATIC_CONTENT_DIR_PATH}/${SPONSORS_FILE_NAME}`;
 const CMS_FONT_FILE_PATH = "/static/fonts/";
 const PAYMENTS_FILE_PATH = `${STATIC_CONTENT_DIR_PATH}/payments.json`;
 const APPLE_PAY_DOMAIN_FILE_PATH = "/static/.well-known/";
-const APPLE_PAY_DOMAIN_FILE_NAME = "apple-developer-merchantid-domain-association";
+const APPLE_PAY_DOMAIN_FILE_NAME =
+  "apple-developer-merchantid-domain-association";
 
 exports.REQUIRED_DIR_PATHS = [
   DATA_DIR_PATH,
@@ -52,7 +55,7 @@ exports.REQUIRED_DIR_PATHS = [
   STYLES_DIR_PATH,
   SITE_SETTINGS_DIR_PATH,
   NAVBAR_DIR_PATH,
-  FOOTER_DIR_PATH,
+  FOOTER_DIR_PATH
 ];
 
 exports.DATA_DIR_PATH = DATA_DIR_PATH;
@@ -63,6 +66,7 @@ exports.COLORS_SASS_FILE_PATH = COLORS_SASS_FILE_PATH;
 exports.FONTS_SCSS_FILE_PATH = FONTS_SCSS_FILE_PATH;
 exports.SITE_SETTINGS_DIR_PATH = SITE_SETTINGS_DIR_PATH;
 exports.SITE_SETTINGS_FILE_PATH = SITE_SETTINGS_FILE_PATH;
+exports.SITE_BANNER_FILE_PATH = SITE_BANNER_FILE_PATH;
 exports.CONTENT_PAGES_DIR_PATH = CONTENT_PAGES_DIR_PATH;
 exports.MARKETING_PAGE_FILE_PATH = MARKETING_PAGE_FILE_PATH;
 exports.LOBBY_PAGE_FILE_PATH = LOBBY_PAGE_FILE_PATH;