Merge branch 'master' into docs-sidebar

components/MDX.js

@@ -60,9 +60,14 @@ export function getMDXComponents() {
     th: props => <th {...props} className={`${props.className || ''} px-6 py-3 border-b border-gray-200 bg-gray-100 text-left text-xs leading-4 font-medium font-body text-gray-900 uppercase tracking-wider`} />,
     tr: props => <tr {...props} className={`${props.className || ''} bg-white`} />,
     td: props => <td {...props} className={`${props.className || ''} px-6 py-4 border-b border-gray-200 text-sm leading-5 text-gray-700 tracking-tight`} />,
-    pre: props => <div {...props} className={`${props.className || ''} my-8`} />,
-    inlineCode: props => <code {...props} className={`${props.className || ''} px-1 py-0.5 bg-gray-200 text-gray-800 rounded font-mono text-sm`} />,
-    code: CodeComponent,
+    pre: props => CodeComponent(props.children.props),
+    code:  props => <code {...props} className={`${props.className || ''} px-1 py-0.5 bg-gray-200 text-gray-800 rounded font-mono text-sm`} />,
+    details: (props) => 
+      <details {...props} className={`${ props.className || ''} mb-1 font-heading antialiased text-gray-900`}/>,
+    summary: (props) => 
+      <summary {...props} className={`${props.className || ''} my-2 font-heading cursor-pointer antialiased font-semibold text-gray-900`}/>,
+    p: (props) => 
+    <p {...props} className={`${props.className || ''} ml-4 cursor-pointer`}/>,
     hr: props => <hr {...props} className={`${props.className || ''} my-8`} />,
     CodeBlock,
     ChapterSuggestions,

components/buttons/ScrollButton.js

@@ -23,7 +23,7 @@ function ScrollButton(){
 
         })
     }
-    return <div className="fixed bottom-14 right-4  h-16 w-12 z-50">
+    return <div className="fixed bottom-14 right-4 h-16 w-12 z-40">
         {backToTopButton &&(
             <button className="rounded-full shadow-md bg-white " onClick={scrollUp}> <img src={scrollImage}/></button>
         )}

components/navigation/MobileNavMenu.js

@@ -9,7 +9,7 @@ import Link from 'next/link';
 
 export default function MobileNavMenu({ onClickClose = () => {} }) {
   return (
-    <div className="fixed top-0 inset-x-0 py-2 transition transform origin-top-right max-h-full lg:hidden overflow-y-scroll">
+    <div className="fixed top-0 z-60 inset-x-0 py-2 transition transform origin-top-right max-h-full lg:hidden overflow-y-scroll">
       <div className="rounded-lg shadow-lg">
         <div className="rounded-lg shadow-xs bg-white divide-y-2 divide-gray-50">
           <div className="pt-5 pb-6 px-5 space-y-6">

components/navigation/NavBar.js

@@ -9,7 +9,6 @@ import LearningPanel from './LearningPanel'
 import CommunityPanel from "./CommunityPanel"
 import MobileNavMenu from './MobileNavMenu'
 import otherItems from './otherItems'
-
 import GithubButton from "../buttons/GithubButton"
 import { SearchButton } from '../AlgoliaSearch';
 import IconLoupe from '../icons/Loupe';
@@ -100,7 +99,7 @@ export default function NavBar({
   useEffect(() => {
     setMobileMenuOpen(false);
     setOpen(null);
-  }, [asPath])
+  }, [asPath]);
 
   return (
     <div className={`bg-white ${className} z-50`}>

config/meetings.json

@@ -1,25 +1,11 @@
 [
-  {
-    "title": "Spec 3.0 Docs Meeting",
-    "calLink": "https://www.google.com/calendar/event?eid=aHJwdnA1bzI1ajVjNzliZ2h2bm1nZnI3b3MgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
-    "url": "https://github.com/asyncapi/community/issues/793",
-    "banner": "",
-    "date": "2023-08-31T14:30:00.000Z"
-  },
   {
     "title": "Spec 3.0 Meeting",
     "calLink": "https://www.google.com/calendar/event?eid=NDEzM2E1ZGE5YWttYXVpYW9zbTl1cWM1YWMgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
     "url": "https://github.com/asyncapi/community/issues/857",
     "banner": "",
     "date": "2023-09-06T16:00:00.000Z"
   },
-  {
-    "title": "AsyncAPI spec v3 support in Diff",
-    "calLink": "https://www.google.com/calendar/event?eid=YnVvZWt1azlwcTQxNzZnNzNpZ2c3cjdmbzAgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
-    "url": "https://github.com/asyncapi/community/issues/858",
-    "banner": "",
-    "date": "2023-08-29T13:30:00.000Z"
-  },
   {
     "title": "Brainstorm on AsyncAPI Cheat Sheet Poster",
     "calLink": "https://www.google.com/calendar/event?eid=bGx1dXBuc2x1a29mN3RzMmQzcGFjaWM4anMgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
@@ -112,10 +98,15 @@
     "date": "2023-12-19T13:00:00.000Z"
   },
   {
-    "title": "4 Request/Reply Use Cases",
-    "calLink": "https://www.google.com/calendar/event?eid=Nmw4dWN1c2piYnBtYTgwcTM3ZDdqbW1kdHMgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
-    "url": "https://github.com/asyncapi/community/issues/983",
-    "banner": "https://user-images.githubusercontent.com/40604284/288090985-e34cee85-2ad1-4109-a841-678e7435a88d.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTEiLCJleHAiOjE3MDE3OTAwMjgsIm5iZiI6MTcwMTc4OTcyOCwicGF0aCI6Ii80MDYwNDI4NC8yODgwOTA5ODUtZTM0Y2VlODUtMmFkMS00MTA5LWE4NDEtNjc4ZTc0MzVhODhkLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFJV05KWUFYNENTVkVINTNBJTJGMjAyMzEyMDUlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjMxMjA1VDE1MjIwOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTZlNjg0N2Y1NGU5YWI2YWM5Yjc5ZGY4MzMyYzY2ZjRmMmNhYTAwMWVkZWI3MTE5MGRmZjAwNzE2NWRhYjkzYWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.TZLYLUFI1kKex1hzyaEGIkpK-JUN0wM2TPusmOivfeE",
+    "title": "AsyncAPI v3 announcement",
+    "calLink": "https://www.google.com/calendar/event?eid=NmhzMGZnNTRnZHNnZTFtbnRjbmhpZnJzbjAgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
+    "date": "2023-12-06T15:00:00.000Z"
+  },
+  {
+    "title": "3 Request/Reply Use Cases",
+    "calLink": "https://www.google.com/calendar/event?eid=b3NvM2c0dW9tcTk1djRiMDJmbWU4dG9odGcgY19xOXRzZWlnbG9tZHNqNm5qdWh2YnB0czExY0Bn",
+    "url": "https://github.com/asyncapi/community/issues/985",
+    "banner": "https://user-images.githubusercontent.com/40604284/288488243-e274e624-c5b3-4bff-b0ec-8c1929a24aae.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTEiLCJleHAiOjE3MDE4ODI2MTUsIm5iZiI6MTcwMTg4MjMxNSwicGF0aCI6Ii80MDYwNDI4NC8yODg0ODgyNDMtZTI3NGU2MjQtYzViMy00YmZmLWIwZWMtOGMxOTI5YTI0YWFlLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFJV05KWUFYNENTVkVINTNBJTJGMjAyMzEyMDYlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjMxMjA2VDE3MDUxNVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWUyMGYyNDE3Nzg4OGUyZGVmYjNlMDkxYzVkOWFkNjEwYjM4ZDI2YzZjZmUyYjRjMDliMDQ3YWJiNTVlNDI1MmQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.jYmY72ZRresQv1lMFeKwA49Wi6VkAozRpIHH4uE0J8g",
     "date": "2023-12-14T18:00:00.000Z"
   }
 ]

config/tools-automated.json

@@ -420,41 +420,41 @@
     "description": "The following is a list of tools that compare AsyncAPI documents.",
     "toolsList": [
       {
-        "title": "AsyncAPI Diff",
-        "description": "Diff is a library that compares two AsyncAPI Documents and provides information about the differences by pointing out explicitly information like breaking changes.",
+        "title": "jasyncapicmp",
+        "description": "Tool for comparing two AsyncAPI versions and evaluating compatibility.",
         "links": {
-          "repoUrl": "https://github.com/asyncapi/diff"
+          "websiteUrl": "https://siom79.github.io/jasyncapicmp/",
+          "docsUrl": "https://github.com/siom79/jasyncapicmp",
+          "repoUrl": "https://github.com/siom79/jasyncapicmp"
         },
         "filters": {
-          "language": "TypeScript",
+          "language": "Java",
           "technology": [
-            "TypeScript"
+            "Maven"
           ],
           "categories": [
             "compare-tool"
           ],
           "hasCommercial": false,
-          "isAsyncAPIOwner": true
+          "isAsyncAPIOwner": false
         }
       },
       {
-        "title": "jasyncapicmp",
-        "description": "Tool for comparing two AsyncAPI versions and evaluating compatibility.",
+        "title": "AsyncAPI Diff",
+        "description": "Diff is a library that compares two AsyncAPI Documents and provides information about the differences by pointing out explicitly information like breaking changes.",
         "links": {
-          "websiteUrl": "https://siom79.github.io/jasyncapicmp/",
-          "docsUrl": "https://github.com/siom79/jasyncapicmp",
-          "repoUrl": "https://github.com/siom79/jasyncapicmp"
+          "repoUrl": "https://github.com/asyncapi/diff"
         },
         "filters": {
-          "language": "Java",
+          "language": "TypeScript",
           "technology": [
-            "Maven"
+            "TypeScript"
           ],
           "categories": [
             "compare-tool"
           ],
           "hasCommercial": false,
-          "isAsyncAPIOwner": false
+          "isAsyncAPIOwner": true
         }
       }
     ]
@@ -617,10 +617,10 @@
     "description": "The following is a list of templates compatible with AsyncAPI Generator. You can use them to generate apps, clients or documentation from your AsyncAPI documents.",
     "toolsList": [
       {
-        "title": "Node.js Multiprotocol Template",
-        "description": "This template generates a server using your AsyncAPI document. It supports multiple different protocols, like Kafka or MQTT.  It is designed in the way that generated code is a library and with it's API you can start the server, send messages or register a middleware for listening incoming messages. Runtime message validation included.",
+        "title": "Node.js Websockets Template",
+        "description": "Node.js WebSockets template for the AsyncAPI Generator. It showcases how from a single AsyncAPI document you can generate a server and a client at the same time.",
         "links": {
-          "repoUrl": "https://github.com/asyncapi/nodejs-template"
+          "repoUrl": "https://github.com/asyncapi/nodejs-ws-template"
         },
         "filters": {
           "language": "javascript",
@@ -635,15 +635,19 @@
         }
       },
       {
-        "title": "Node.js Websockets Template",
-        "description": "Node.js WebSockets template for the AsyncAPI Generator. It showcases how from a single AsyncAPI document you can generate a server and a client at the same time.",
+        "title": "Java Spring Template",
+        "description": "Java Spring template for the AsyncAPI Generator",
         "links": {
-          "repoUrl": "https://github.com/asyncapi/nodejs-ws-template"
+          "repoUrl": "https://github.com/asyncapi/java-spring-template"
         },
         "filters": {
-          "language": "javascript",
+          "language": [
+            "javascript"
+          ],
           "technology": [
-            "Node.js"
+            "Springboot",
+            "Maven",
+            "Gradle"
           ],
           "categories": [
             "generator-template"
@@ -671,19 +675,15 @@
         }
       },
       {
-        "title": "Java Spring Template",
-        "description": "Java Spring template for the AsyncAPI Generator",
+        "title": "Node.js Multiprotocol Template",
+        "description": "This template generates a server using your AsyncAPI document. It supports multiple different protocols, like Kafka or MQTT.  It is designed in the way that generated code is a library and with it's API you can start the server, send messages or register a middleware for listening incoming messages. Runtime message validation included.",
         "links": {
-          "repoUrl": "https://github.com/asyncapi/java-spring-template"
+          "repoUrl": "https://github.com/asyncapi/nodejs-template"
         },
         "filters": {
-          "language": [
-            "javascript"
-          ],
+          "language": "javascript",
           "technology": [
-            "Springboot",
-            "Maven",
-            "Gradle"
+            "Node.js"
           ],
           "categories": [
             "generator-template"

cypress/test/components/campaignTests/AnnouncementHero.cy.js

@@ -7,26 +7,28 @@ beforeEach(() => {
   mount(<AnnouncementHero />);
 });
 
+// .skip should be removed once the AnnouncementHero component is rendered in the website
 describe('AnnouncementHero Component', () => {
-  it('should render the component when the date is within the valid range', () => {
+  it.skip('should render the component when the date is within the valid range', () => {
     const mockDate = new Date(2021, 10, 12).getTime();
     cy.clock(mockDate);
     cy.get('[data-testid="AnnouncementHero-main-div"]').should('exist');
   });
 
   //check if announcement rendered is small or large .
-  it('should render a small announcement when "small" prop is true', () => {
+  it.skip('should render a small announcement when "small" prop is true', () => {
     mount(<AnnouncementHero small />);
     cy.get('[data-testid="AnnouncementHero-main-div"]').should('have.class', 'mb-4');
   });
 
-  it('should display the correct event information', () => {
+  it.skip('should display the correct event information', () => {
     // Assert the event details
     cy.get('[data-testid="Paragraph-test"]').should('exist');
     cy.get('h2').should('exist');
 
   });
-  it('should have a link and text for the button', () => {
+
+  it.skip('should have a link and text for the button', () => {
     mount(<AnnouncementHero />);
     cy.get('[data-testid="Button-link"]')
       .should('have.attr', 'target', '_blank')
@@ -38,7 +40,7 @@ describe('AnnouncementHero Component', () => {
    });
 
   //check if announcement rendered is small or large .
-  it('should render a small announcement when "small" prop is true', () => {
+  it.skip('should render a small announcement when "small" prop is true', () => {
     const mockDate = new Date('2023-05-01T00:00:00Z');
     cy.clock(mockDate.getTime());
 
@@ -47,7 +49,7 @@ describe('AnnouncementHero Component', () => {
     cy.get('[data-testid="AnnouncementHero-main-div"]').should('have.class', 'mb-4');
   });
 
-  it('should render a large announcement when "small" prop is false', () => {
+  it.skip('should render a large announcement when "small" prop is false', () => {
     const mockDate = new Date('2023-05-01T00:00:00Z');
     cy.clock(mockDate.getTime());
 

cypress/test/components/campaignTests/Banner.cy.js

@@ -2,8 +2,9 @@ import React from 'react';
 import { mount } from '@cypress/react';
 import Banner from '../../../../components/campaigns/Banner';
 
+// .skip should be removed once the Banner component is rendered in the website with default functionalities
 describe('Banner Component', () => {
-  it('should not render the banner when the date is not within the valid range', () => {
+  it.skip('should not render the banner when the date is not within the valid range', () => {
     const today = new Date();
     const [day,  month, year] = [today.getUTCDate(),  today.getUTCMonth(),  today.getUTCFullYear()];
     if (year > 2022 || month !== 10 || day < 6) {
@@ -17,21 +18,21 @@ describe('Banner Component', () => {
     }
   });
 
-  it('should render the banner when the date is within the valid range', () => {
+  it.skip('should render the banner when the date is within the valid range', () => {
     const mockDate = new Date(2021, 10, 12).getTime();
     cy.clock(mockDate);
     mount(<Banner />);
     cy.get('[data-testid="Banner-main-div"]').should('be.visible');
   });
 
-  it('should display the correct message when the date is within the valid range', () => {
+  it.skip('should display the correct message when the date is within the valid range', () => {
     const mockDate = new Date(2021, 10, 12).getTime();
     cy.clock(mockDate);
     mount(<Banner />);
     cy.contains('.font-medium', 'AsyncAPI Conference 2022 has ended').should('be.visible');
   });
 
-  it('should have a link to the recordings playlist', () => {
+  it.skip('should have a link to the recordings playlist', () => {
     const mockDate = new Date(2021, 10, 12).getTime();
     cy.clock(mockDate);
     mount(<Banner />);
@@ -41,7 +42,7 @@ describe('Banner Component', () => {
       .should('have.attr', 'rel', 'noopener noreferrer');
   });
 
-  it('should have the max-w-screen-xl class in the div element', () => {
+  it.skip('should have the max-w-screen-xl class in the div element', () => {
     const mockDate = new Date(2021, 10, 12).getTime();
     cy.clock(mockDate);
     mount(<Banner />);

pages/about/index.md

@@ -100,11 +100,47 @@ All the information about the project's economy, the amount of the donations, th
 
 ## FAQs
 
-- **What is the goal of the project?** To make asynchronous APIs as successful and mature as REST APIs.
-- **What protocols does it support?** AsyncAPI is protocol-agnostic, so you can use it for APIs that work over any protocol (e.g., AMQP, MQTT, WebSockets, Kafka, STOMP, HTTP, Mercure, etc). For more information, refer to the [AsyncAPI specification documentation](https://www.asyncapi.com/docs/reference/specification/latest#serverBindingsObject).
-- **Who are the users of AsyncAPI?** AsyncAPI users are those who implement and maintain event-driven architecture. For example, people that write backend API using WebSocket, or people that maintain communication between their microservices using Kafka.
-- **What is the AsyncAPI Community?** It’s the core of the initiative. The AsyncAPI community contributes to the development of the tool, it promotes access and distribution of the specification allowing freedom of use, study, copying, modification, and redistribution to anyone who wishes to do so. The cooperation between these people in all areas of software production generates a substantial improvement in the quality of the software, as well as greater dissemination and sustainability over time, and prioritizing the benefit of society over any other.
-- **Who can use it?** Anyone. All projects under AsyncAPI Initiative are part of the Linux Foundation, licensed under the Apache 2.0 license. It’s open to use and contribution.
-- **Where can I find more information?**
-    - [Official AsyncAPI Documentation](/docs)
-    - [Presentation by Fran Méndez, explaining the project](https://www.youtube.com/watch?v=UID1nnuFDtM&list=PLbi1gRlP7piitNgvqhIAvGNZM_kvP0r8R)
+<details class="cursor-pointer">
+<summary>What is the goal of the project?</summary>
+
+<p> To make asynchronous APIs as successful and mature as REST APIs.</p>
+
+</details>
+
+<details class="cursor-pointer ">
+<summary>What protocols does it support?</summary>
+
+<p>AsyncAPI is protocol-agnostic, so you can use it for APIs that work over any protocol (e.g., AMQP, MQTT, WebSockets, Kafka, STOMP, HTTP, Mercure, etc). For more information, refer to the [AsyncAPI specification documentation](https://www.asyncapi.com/docs/reference/specification/latest#serverBindingsObject).
+</p>
+
+</details>
+
+<details class="cursor-pointer">
+<summary>Who are the users of AsyncAPI?</summary>
+
+<p>AsyncAPI users are those who implement and maintain event-driven architecture. For example, people that write backend API using WebSocket, or people that maintain communication between their microservices using Kafka.</p>
+
+</details>
+
+<details class="cursor-pointer">
+<summary>What is the AsyncAPI Community?</summary>
+
+<p>It’s the core of the initiative. The AsyncAPI community contributes to the development of the tool, it promotes access and distribution of the specification allowing freedom of use, study, copying, modification, and redistribution to anyone who wishes to do so. The cooperation between these people in all areas of software production generates a substantial improvement in the quality of the software, as well as greater dissemination and sustainability over time, and prioritizing the benefit of society over any other.</p>
+
+</details>
+
+<details class="cursor-pointer">
+<summary>Who can use it?</summary>
+
+<p>Anyone. All projects under AsyncAPI Initiative are part of the Linux Foundation, licensed under the Apache 2.0 license. It’s open to use and contribution.</p>
+
+</details>
+
+<details class="cursor-pointer">
+<summary>Where can I find more information?</summary>
+
+&nbsp;[Official AsyncAPI Documentation](/docs)
+
+&nbsp;[Presentation by Fran Méndez, explaining the project](https://www.youtube.com/watch?v=UID1nnuFDtM&list=PLbi1gRlP7piitNgvqhIAvGNZM_kvP0r8R)
+
+</details>