@openstack_dev/gatsby-theme-marketing-oif-core 1.0.23 → 1.0.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstack_dev/gatsby-theme-marketing-oif-core",
-  "version": "1.0.23",
+  "version": "1.0.24",
   "description": "Base theme for Marketing Sites",
   "author": "smarcet",
   "keywords": [

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

@@ -1,15 +1,13 @@
-import { imageField, stringField } from "../../../fields";
-
-import {
-  ANNOUNCEMENT_BANNER_FILE_PATH
-} from "../../../../../utils/filePath";
+import { booleanField, imageField, stringField } from "../../../fields";
 
+import { ANNOUNCEMENT_BANNER_FILE_PATH } from "../../../../../utils/filePath";
 
 /*
 - file: "src/content/banners/announcement.json"
   label: "Announcement Banner"
   name: "announcement_banner"
   fields:
+    - {label: "Display", name: "display", widget: boolean, required: false},
     - {label: "Title", name: "title", widget: string, required: false}
     - {label: "Logo", name: "logo", widget: image, required: false}
     - {label: "Text", name: "text", widget: string, required: false}
@@ -23,37 +21,42 @@ const announcementBanner = {
   name: "announcement-banner",
   file: ANNOUNCEMENT_BANNER_FILE_PATH,
   fields: [
+    booleanField({
+      label: "Display",
+      name: "display",
+      required: true,
+    }),
     stringField({
       label: "Title",
       name: "title",
-      required: false
+      required: false,
     }),
     imageField({
       label: "Logo",
       name: "logo",
-      required: false
+      required: false,
     }),
     stringField({
       label: "Text",
       name: "text",
-      required: false
+      required: false,
     }),
     stringField({
       label: "CTA Title",
       name: "cta_title",
-      required: false
+      required: false,
     }),
     stringField({
       label: "CTA Label",
       name: "cta_label",
-      required: false
+      required: false,
     }),
     stringField({
       label: "CTA Link",
       name: "cta_link",
-      required: false
+      required: false,
     }),
-  ]
+  ],
 };
 
-export default announcementBanner;
+export default announcementBanner;

package/src/components/AnnouncementBanner/index.js

@@ -5,22 +5,23 @@ import Template from "./template";
 const dataQuery = graphql`
   query {
     announcementBannerJson {
-      title,
+      display
+      title
       logo {
         publicURL
-      },
-      text,
-      cta_title,
-      cta_label,
+      }
+      text
+      cta_title
+      cta_label
       cta_link
     }
   }
 `;
 
-const AnnouncementBanner = () => {
-  const {announcementBannerJson} = useStaticQuery(dataQuery);
+function AnnouncementBanner() {
+  const { announcementBannerJson } = useStaticQuery(dataQuery);
 
   return <Template data={announcementBannerJson} />;
-};
+}
 
 export default AnnouncementBanner;

package/src/components/AnnouncementBanner/template.js

@@ -1,11 +1,14 @@
 import React from "react";
-import {  Grid } from "@mui/material";
-import '@fortawesome/fontawesome-free/css/all.css';
-import RightArrow from '../svgs/RightArrow';
+import { Grid } from "@mui/material";
+import "@fortawesome/fontawesome-free/css/all.css";
+import RightArrow from "../svgs/RightArrow";
 import styles from "./index.module.scss";
 
-const Template = ({ data }) => {
-  const {title, logo, text, cta_title, cta_label, cta_link} = data || {};
+function Template({ data }) {
+  const {
+    title, logo, text, cta_title, cta_label, cta_link, display,
+  } = data || {};
+  if (!display) return null;
 
   return (
     <div className={styles.wrapper}>
@@ -13,12 +16,24 @@ const Template = ({ data }) => {
         <Grid item sm={12} md={8}>
           <div className={styles.header}>
             <img className={styles.logo} src={logo?.publicURL} alt="logo" />
-            <h2 className={styles.title}> {title} </h2>
+            <h2 className={styles.title}>
+              {" "}
+              {title}
+              {" "}
+            </h2>
           </div>
-          <p className={styles.text}> {text} </p>
+          <p className={styles.text}>
+            {" "}
+            {text}
+            {" "}
+          </p>
         </Grid>
         <Grid item sm={12} md={4}>
-          <h3 className={styles.ctaTitle}> {cta_title} </h3>
+          <h3 className={styles.ctaTitle}>
+            {" "}
+            {cta_title}
+            {" "}
+          </h3>
           <a className={styles.cta} href={cta_link}>
             {cta_label}
             <span className={styles.img}>
@@ -35,6 +50,6 @@ const Template = ({ data }) => {
       </div>
     </div>
   );
-};
+}
 
 export default Template;

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

@@ -1,4 +1,5 @@
 {
+  "display": true,
   "title": "OpenInfra Summit > Asia '24",
   "logo": "OpenInfrastructureFoundation-icon-RGB.svg",
   "text": "Join the OpenStack community in Suwon, South Korea from September 3-4 at the first regional OpenInfra Summit Asia! Hear how OpenStack developers and operators are collaborating to define AI requirements, new OpenStack + Kubernetes production use cases and how organizations continue to scale their OpenStack footprint.",