diff --git a/assets/docs/fragments/bindings-overview.md b/assets/docs/fragments/bindings-overview.md
new file mode 100644
index 000000000000..5f92b0ca3800
--- /dev/null
+++ b/assets/docs/fragments/bindings-overview.md
@@ -0,0 +1 @@
+Bindings in AsyncAPI provide a way to add protocol-specific information to the AsyncAPI documentation. They can be added to different document parts, such as servers, channels, or messages; they specify standard details specific to a particular protocol. The purpose of bindings is to enhance the API's understanding and usage by providing additional context and configuration options for different protocols.
diff --git a/components/tools/ToolsCard.tsx b/components/tools/ToolsCard.tsx
index d690bf6b495a..b3e73df9364a 100644
--- a/components/tools/ToolsCard.tsx
+++ b/components/tools/ToolsCard.tsx
@@ -1,5 +1,4 @@
 import { useEffect, useRef, useState } from 'react';
-import TextTruncate from 'react-text-truncate';
 
 import type { ToolData, VisibleDataListType } from '@/types/components/tools/ToolDataType';
 import { HeadingTypeStyle } from '@/types/typography/Heading';
@@ -23,21 +22,16 @@ interface ToolsCardProp {
  */
 export default function ToolsCard({ toolData }: ToolsCardProp) {
   const [showDescription, setShowDescription] = useState<boolean>(false);
-  const [showMoreDescription, setShowMoreDescription] = useState<boolean>(false);
+  const [isTruncated, setIsTruncated] = useState<boolean>(false);
   const [readMore, setReadMore] = useState<boolean>(false);
   const descriptionRef = useRef<HTMLDivElement>(null);
 
   // Decide whether to show full description or not in the card based on the number of lines occupied by the description.
   useEffect(() => {
-    const divHeight = descriptionRef.current?.offsetHeight || 0;
-    const numberOfLines = divHeight / 20;
-
-    if (numberOfLines > 3) {
-      setShowMoreDescription(true);
-    } else {
-      setShowMoreDescription(false);
+    if (descriptionRef.current) {
+      setIsTruncated(descriptionRef.current?.scrollHeight! > descriptionRef.current?.clientHeight!);
     }
-  }, []);
+  }, [descriptionRef.current]);
 
   let onGit = false;
 
@@ -91,17 +85,19 @@ export default function ToolsCard({ toolData }: ToolsCardProp) {
           <div className='relative'>
             <Paragraph typeStyle={ParagraphTypeStyle.sm}>
               <span
-                ref={descriptionRef}
-                className={`w-full ${showMoreDescription ? 'cursor-pointer' : ''}`}
+                className={`w-full ${isTruncated ? 'cursor-pointer' : ''}`}
                 onMouseEnter={() =>
                   setTimeout(() => {
-                    if (showMoreDescription) setShowDescription(true);
+                    if (isTruncated) setShowDescription(true);
                   }, 500)
                 }
               >
-                <TextTruncate element='span' line={3} text={toolData.description} />
+                <div ref={descriptionRef} className={`line-clamp-3 ${isTruncated && 'after:content-["..."]'}`}>
+                  {toolData.description}
+                </div>
               </span>
             </Paragraph>
+
             {showDescription && (
               <div
                 className='absolute top-0 z-10 w-full border border-gray-200 bg-white p-2 shadow-md'
diff --git a/components/tools/ToolsDashboard.tsx b/components/tools/ToolsDashboard.tsx
index bec91768c97d..920aaee66eb3 100644
--- a/components/tools/ToolsDashboard.tsx
+++ b/components/tools/ToolsDashboard.tsx
@@ -1,7 +1,6 @@
 import { useRouter } from 'next/router';
-import { useContext, useEffect, useRef, useState } from 'react';
+import { createRef, useContext, useEffect, useMemo, useRef, useState } from 'react';
 
-import AsyncAPIColorIcon from '@/components/icons/AsyncAPIColorIcon';
 import type { ToolsListData } from '@/types/components/tools/ToolDataType';
 
 import ToolsDataList from '../../config/tools.json';
@@ -10,7 +9,6 @@ import ArrowDown from '../icons/ArrowDown';
 import Cross from '../icons/Cross';
 import FilterIcon from '../icons/Filter';
 import SearchIcon from '../icons/Search';
-import Loader from '../Loader';
 import CategoryDropdown from './CategoryDropdown';
 import Filters from './Filters';
 import ToolsList from './ToolsList';
@@ -22,8 +20,6 @@ const ToolsData = ToolsDataList as ToolsListData;
  */
 export default function ToolsDashboard() {
   const router = useRouter();
-
-  const [loading, setLoading] = useState<boolean>(false); // used to handle the preloader on the page
   const filterRef = useRef<HTMLDivElement>(); // used to provide ref to the Filter menu and outside click close feature
   const categoryRef = useRef<HTMLDivElement>(); // used to provide ref to the Category menu and outside click close feature
   const [openFilter, setOpenFilter] = useState<boolean>(false);
@@ -31,7 +27,6 @@ export default function ToolsDashboard() {
   // filter parameters extracted from the context
   const { isPaid, isAsyncAPIOwner, languages, technologies, categories } = useContext(ToolFilterContext);
   const [searchName, setSearchName] = useState<string>(''); // state variable used to get the search name
-  const [toolsList, setToolsList] = useState<ToolsListData>({}); // state variable used to set the list of tools according to the filters applied
   const [checkToolsList, setCheckToolsList] = useState<boolean>(true); // state variable used to check whether any tool is available according to the needs of the user.
 
   // useEffect function to enable the close Modal feature when clicked outside of the modal
@@ -49,14 +44,6 @@ export default function ToolsDashboard() {
     };
   });
 
-  // sets the preloader on the page for 1 second
-  useEffect(() => {
-    setLoading(true);
-    setTimeout(() => {
-      setLoading(false);
-    }, 1000);
-  }, []);
-
   // useEffect function to enable the close Category dropdown Modal feature when clicked outside of the modal
   useEffect(() => {
     const checkIfClickOutside = (event: MouseEvent) => {
@@ -72,8 +59,8 @@ export default function ToolsDashboard() {
     };
   });
 
-  // Function to update the list of tools according to the current filters applied
-  const updateToolsList = () => {
+  // useMemo function to filter the tools according to the filters applied by the user
+  const toolsList = useMemo(() => {
     let tempToolsList: ToolsListData = {};
 
     // Tools data list is first filtered according to the category filter if applied by the user.
@@ -150,18 +137,36 @@ export default function ToolsDashboard() {
       }
     });
 
-    setToolsList(tempToolsList);
-  };
+    Object.keys(tempToolsList).map((category) => {
+      tempToolsList[category].elementRef = createRef();
+
+      return tempToolsList;
+    });
+
+    return tempToolsList;
+  }, [isPaid, isAsyncAPIOwner, languages, technologies, categories, searchName]);
+
+  // useEffect to scroll to the opened category when url has category as element id
+  useEffect(() => {
+    const { hash } = window.location;
+
+    if (hash) {
+      const elementID = decodeURIComponent(hash.slice(1));
+      const element = toolsList[elementID]?.elementRef!;
 
+      if (element.current) {
+        document.documentElement.style.scrollPaddingTop = '6rem';
+        element.current.scrollIntoView({ behavior: 'smooth' });
+        document.documentElement.style.scrollPaddingTop = '0';
+      }
+    }
+  }, []);
+  // Function to update the list of tools according to the current filters applied
   const clearFilters = () => {
     setOpenFilter(false);
     router.push('/tools', undefined, { shallow: true });
   };
 
-  useEffect(() => {
-    updateToolsList();
-  }, [isPaid, isAsyncAPIOwner, languages, technologies, categories, searchName]);
-
   const isFiltered = Boolean(
     isPaid !== 'all' || isAsyncAPIOwner || languages.length || technologies.length || categories.length
   );
@@ -226,20 +231,16 @@ export default function ToolsDashboard() {
             <span className='ml-3'>Clear Filters</span>
           </div>
         )}
-        {loading ? (
-          <Loader loaderText='Loading Tools...' loaderIcon={<AsyncAPIColorIcon alt='Loading...' />} pulsating />
-        ) : (
-          <div className='mt-0'>
-            {checkToolsList ? (
-              <ToolsList toolsListData={toolsList} />
-            ) : (
-              <div className='p-4'>
-                <img src='/img/illustrations/not-found.webp' alt='not found' className='m-auto w-1/2' />
-                <div className='text-center text-lg'> Sorry, we don&apos;t have tools according to your needs. </div>
-              </div>
-            )}
-          </div>
-        )}
+        <div className='mt-0'>
+          {checkToolsList ? (
+            <ToolsList toolsListData={toolsList} />
+          ) : (
+            <div className='p-4'>
+              <img src='/img/illustrations/not-found.webp' alt='not found' className='m-auto w-1/2' />
+              <div className='text-center text-lg'> Sorry, we don&apos;t have tools according to your needs. </div>
+            </div>
+          )}
+        </div>
       </div>
     </ToolFilter>
   );
diff --git a/components/tools/ToolsList.tsx b/components/tools/ToolsList.tsx
index 9e41e58caeaa..b6e6eeeafe51 100644
--- a/components/tools/ToolsList.tsx
+++ b/components/tools/ToolsList.tsx
@@ -22,7 +22,7 @@ export default function ToolsList({ toolsListData }: ToolsListProp) {
       {Object.keys(toolsListData).map((categoryName, index) => {
         if (toolsListData[categoryName].toolsList.length > 0) {
           return (
-            <div className='my-8' key={index} id={categoryName}>
+            <div className='my-8' key={index} id={categoryName} ref={toolsListData[categoryName].elementRef}>
               <Heading typeStyle={HeadingTypeStyle.mdSemibold} className='my-2'>
                 {categoryName}
               </Heading>
diff --git a/config/MAINTAINERS.json b/config/MAINTAINERS.json
index 1d9a5cab3e3d..cdcde198a1f2 100644
--- a/config/MAINTAINERS.json
+++ b/config/MAINTAINERS.json
@@ -276,8 +276,7 @@
             "template-for-generator-templates",
             "community",
             "diff",
-            "chatbot",
-            "infra"
+            "chatbot"
         ],
         "githubID": 6995927
     },
@@ -447,8 +446,7 @@
             "go-watermill-template",
             "template-for-go-projects",
             "parser-api",
-            "server-api",
-            "infra"
+            "server-api"
         ],
         "githubID": 1083296
     },
@@ -972,5 +970,14 @@
             "kotlin-asyncapi"
         ],
         "githubID": 39913716
+    },
+    {
+        "name": "Jonas S\u00fcskind",
+        "github": "sueskind",
+        "isTscMember": false,
+        "repos": [
+            "kotlin-asyncapi"
+        ],
+        "githubID": 52210599
     }
 ]
\ No newline at end of file
diff --git a/config/all-tags.json b/config/all-tags.json
index bcbe78efc37c..9f22bcd87c86 100644
--- a/config/all-tags.json
+++ b/config/all-tags.json
@@ -1 +1 @@
-{"languages":[{"name":"Go/Golang","color":"bg-[#8ECFDF]","borderColor":"border-[#00AFD9]"},{"name":"Java","color":"bg-[#ECA2A4]","borderColor":"border-[#EC2125]"},{"name":"JavaScript","color":"bg-[#F2F1C7]","borderColor":"border-[#BFBE86]"},{"name":"HTML","color":"bg-[#E2A291]","borderColor":"border-[#E44D26]"},{"name":"C/C++","color":"bg-[#93CDEF]","borderColor":"border-[#0080CC]"},{"name":"C#","color":"bg-[#E3AFE0]","borderColor":"border-[#9B4F96]"},{"name":"Python","color":"bg-[#A8D0EF]","borderColor":"border-[#3878AB]"},{"name":"TypeScript","color":"bg-[#7DBCFE]","borderColor":"border-[#2C78C7]"},{"name":"Kotlin","color":"bg-[#B1ACDF]","borderColor":"border-[#756BD9]"},{"name":"Scala","color":"bg-[#FFA299]","borderColor":"border-[#DF301F]"},{"name":"Markdown","color":"bg-[#BABEBF]","borderColor":"border-[#445B64]"},{"name":"YAML","color":"bg-[#FFB764]","borderColor":"border-[#F1901F]"},{"name":"R","color":"bg-[#84B5ED]","borderColor":"border-[#246BBE]"},{"name":"Ruby","color":"bg-[#FF8289]","borderColor":"border-[#FF000F]"},{"name":"Rust","color":"bg-[#FFB8AA]","borderColor":"border-[#E43716]"},{"name":"Shell","color":"bg-[#87D4FF]","borderColor":"border-[#389ED7]"},{"name":"Groovy","color":"bg-[#B6D5E5]","borderColor":"border-[#609DBC]"}],"technologies":[{"name":"Node.js","color":"bg-[#BDFF67]","borderColor":"border-[#84CE24]"},{"name":"Hermes","color":"bg-[#8AEEBD]","borderColor":"border-[#2AB672]"},{"name":"React JS","color":"bg-[#9FECFA]","borderColor":"border-[#08D8FE]"},{"name":".NET","color":"bg-[#A184FF]","borderColor":"border-[#5026D4]"},{"name":"ASP.NET","color":"bg-[#71C2FB]","borderColor":"border-[#1577BC]"},{"name":"Springboot","color":"bg-[#98E279]","borderColor":"border-[#68BC44]"},{"name":"AWS","color":"bg-[#FF9F59]","borderColor":"border-[#EF6703]"},{"name":"Docker","color":"bg-[#B8E0FF]","borderColor":"border-[#2596ED]"},{"name":"Node-RED","color":"bg-[#FF7474]","borderColor":"border-[#8F0101]"},{"name":"Maven","color":"bg-[#FF6B80]","borderColor":"border-[#CA1A33]"},{"name":"Saas","color":"bg-[#6AB8EC]","borderColor":"border-[#2275AD]"},{"name":"Kubernetes-native","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Scala","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Azure","color":"bg-[#4B93FF]","borderColor":"border-[#015ADF]"},{"name":"Jenkins","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Flask","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Nest Js","color":"bg-[#E1224E]","borderColor":"border-[#B9012b]"},{"name":"TypeScript","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Socket.IO","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Liquid","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Kotlin","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Gradle","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Spring Cloud Streams","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"JHipster JDL","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Groovy","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Markdown","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Shell","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"WebComponents","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Babel","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Storybook","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"AsyncAPI Generator","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"VSCode","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"SmartPaste","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"JetBrains","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"IntelliJ IDEA","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Java","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"HTML","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"}]}
\ No newline at end of file
+{"languages":[{"name":"Go/Golang","color":"bg-[#8ECFDF]","borderColor":"border-[#00AFD9]"},{"name":"Java","color":"bg-[#ECA2A4]","borderColor":"border-[#EC2125]"},{"name":"JavaScript","color":"bg-[#F2F1C7]","borderColor":"border-[#BFBE86]"},{"name":"HTML","color":"bg-[#E2A291]","borderColor":"border-[#E44D26]"},{"name":"C/C++","color":"bg-[#93CDEF]","borderColor":"border-[#0080CC]"},{"name":"C#","color":"bg-[#E3AFE0]","borderColor":"border-[#9B4F96]"},{"name":"Python","color":"bg-[#A8D0EF]","borderColor":"border-[#3878AB]"},{"name":"TypeScript","color":"bg-[#7DBCFE]","borderColor":"border-[#2C78C7]"},{"name":"Kotlin","color":"bg-[#B1ACDF]","borderColor":"border-[#756BD9]"},{"name":"Scala","color":"bg-[#FFA299]","borderColor":"border-[#DF301F]"},{"name":"Markdown","color":"bg-[#BABEBF]","borderColor":"border-[#445B64]"},{"name":"YAML","color":"bg-[#FFB764]","borderColor":"border-[#F1901F]"},{"name":"R","color":"bg-[#84B5ED]","borderColor":"border-[#246BBE]"},{"name":"Ruby","color":"bg-[#FF8289]","borderColor":"border-[#FF000F]"},{"name":"Rust","color":"bg-[#FFB8AA]","borderColor":"border-[#E43716]"},{"name":"Shell","color":"bg-[#87D4FF]","borderColor":"border-[#389ED7]"},{"name":"Groovy","color":"bg-[#B6D5E5]","borderColor":"border-[#609DBC]"}],"technologies":[{"name":"Node.js","color":"bg-[#BDFF67]","borderColor":"border-[#84CE24]"},{"name":"Hermes","color":"bg-[#8AEEBD]","borderColor":"border-[#2AB672]"},{"name":"React JS","color":"bg-[#9FECFA]","borderColor":"border-[#08D8FE]"},{"name":".NET","color":"bg-[#A184FF]","borderColor":"border-[#5026D4]"},{"name":"ASP.NET","color":"bg-[#71C2FB]","borderColor":"border-[#1577BC]"},{"name":"Springboot","color":"bg-[#98E279]","borderColor":"border-[#68BC44]"},{"name":"AWS","color":"bg-[#FF9F59]","borderColor":"border-[#EF6703]"},{"name":"Docker","color":"bg-[#B8E0FF]","borderColor":"border-[#2596ED]"},{"name":"Node-RED","color":"bg-[#FF7474]","borderColor":"border-[#8F0101]"},{"name":"Maven","color":"bg-[#FF6B80]","borderColor":"border-[#CA1A33]"},{"name":"Saas","color":"bg-[#6AB8EC]","borderColor":"border-[#2275AD]"},{"name":"Kubernetes-native","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Scala","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Azure","color":"bg-[#4B93FF]","borderColor":"border-[#015ADF]"},{"name":"Jenkins","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Flask","color":"bg-[#D7C7F2]","borderColor":"border-[#A387D2]"},{"name":"Nest Js","color":"bg-[#E1224E]","borderColor":"border-[#B9012b]"},{"name":"TypeScript","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Socket.IO","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Liquid","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Kotlin","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Gradle","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Spring Cloud Streams","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"JHipster JDL","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Groovy","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Markdown","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Shell","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"WebComponents","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Babel","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Storybook","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"AsyncAPI Generator","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"JetBrains","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"IntelliJ IDEA","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"VSCode","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"SmartPaste","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"Java","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"},{"name":"HTML","color":"bg-[#61d0f2]","borderColor":"border-[#40ccf7]"}]}
\ No newline at end of file
diff --git a/config/tools-automated.json b/config/tools-automated.json
index 94ea5b30fbe6..504b55f18f86 100644
--- a/config/tools-automated.json
+++ b/config/tools-automated.json
@@ -91,44 +91,44 @@
         }
       },
       {
-        "title": "Zod Sockets",
-        "description": "Socket.IO solution with I/O validation and the ability to generate AsyncAPI specification and a contract for consumers.",
+        "title": "SIO-AsyncAPI",
+        "description": "This is code-first approach to generate AsyncAPI specification from Socket.IO server.",
         "links": {
-          "websiteUrl": "https://www.npmjs.com/package/zod-sockets",
-          "repoUrl": "https://github.com/RobinTail/zod-sockets"
+          "websiteUrl": "https://github.com/daler-rahimov/sio-asyncapi",
+          "docsUrl": "https://github.com/daler-rahimov/sio-asyncapi",
+          "repoUrl": "https://github.com/daler-rahimov/sio-asyncapi"
         },
         "filters": {
-          "language": "TypeScript",
+          "language": "Python",
           "technology": [
-            "Node.js",
-            "TypeScript"
+            "Socket.IO",
+            "Flask"
           ],
           "categories": [
             "code-first",
-            "dsl",
-            "framework"
+            "api"
           ],
           "hasCommercial": false,
           "isAsyncAPIOwner": false
         }
       },
       {
-        "title": "SIO-AsyncAPI",
-        "description": "This is code-first approach to generate AsyncAPI specification from Socket.IO server.",
+        "title": "Zod Sockets",
+        "description": "Socket.IO solution with I/O validation and the ability to generate AsyncAPI specification and a contract for consumers.",
         "links": {
-          "websiteUrl": "https://github.com/daler-rahimov/sio-asyncapi",
-          "docsUrl": "https://github.com/daler-rahimov/sio-asyncapi",
-          "repoUrl": "https://github.com/daler-rahimov/sio-asyncapi"
+          "websiteUrl": "https://www.npmjs.com/package/zod-sockets",
+          "repoUrl": "https://github.com/RobinTail/zod-sockets"
         },
         "filters": {
-          "language": "Python",
+          "language": "TypeScript",
           "technology": [
-            "Socket.IO",
-            "Flask"
+            "Node.js",
+            "TypeScript"
           ],
           "categories": [
             "code-first",
-            "api"
+            "dsl",
+            "framework"
           ],
           "hasCommercial": false,
           "isAsyncAPIOwner": false
@@ -289,28 +289,6 @@
   "DSL": {
     "description": "Writing YAML by hand is no fun, and maybe you don't want a GUI, so use a Domain Specific Language to write AsyncAPI in your language of choice.",
     "toolsList": [
-      {
-        "title": "Zod Sockets",
-        "description": "Socket.IO solution with I/O validation and the ability to generate AsyncAPI specification and a contract for consumers.",
-        "links": {
-          "websiteUrl": "https://www.npmjs.com/package/zod-sockets",
-          "repoUrl": "https://github.com/RobinTail/zod-sockets"
-        },
-        "filters": {
-          "language": "TypeScript",
-          "technology": [
-            "Node.js",
-            "TypeScript"
-          ],
-          "categories": [
-            "code-first",
-            "dsl",
-            "framework"
-          ],
-          "hasCommercial": false,
-          "isAsyncAPIOwner": false
-        }
-      },
       {
         "title": "ZenWave SDK",
         "description": "DDD and API-First for Event-Driven Microservices",
@@ -336,6 +314,28 @@
           "hasCommercial": false,
           "isAsyncAPIOwner": false
         }
+      },
+      {
+        "title": "Zod Sockets",
+        "description": "Socket.IO solution with I/O validation and the ability to generate AsyncAPI specification and a contract for consumers.",
+        "links": {
+          "websiteUrl": "https://www.npmjs.com/package/zod-sockets",
+          "repoUrl": "https://github.com/RobinTail/zod-sockets"
+        },
+        "filters": {
+          "language": "TypeScript",
+          "technology": [
+            "Node.js",
+            "TypeScript"
+          ],
+          "categories": [
+            "code-first",
+            "dsl",
+            "framework"
+          ],
+          "hasCommercial": false,
+          "isAsyncAPIOwner": false
+        }
       }
     ]
   },
@@ -640,15 +640,18 @@
     "description": "The following is a list of extensions for different IDEs like VSCode, IntelliJ IDEA and others",
     "toolsList": [
       {
-        "title": "asyncapi-preview",
-        "description": "VSCode extension that enables you to:\n  - Preview documentation generated using you AsyncAPI document. It uses AsyncAPI React component under the hood,\n  - Create AsyncAPI documents faster using SmartPaste functionality\n",
+        "title": "jAsyncAPI - IDEA plugin",
+        "description": "Idea plugin for the java-asyncapi - Helps to edit and validate AsyncAPI schemas.",
         "links": {
-          "repoUrl": "https://github.com/asyncapi/vs-asyncapi-preview"
+          "websiteUrl": "https://plugins.jetbrains.com/plugin/15673-asyncapi",
+          "docsUrl": "https://github.com/asyncapi/jasyncapi-idea-plugin#usage",
+          "repoUrl": "https://github.com/asyncapi/jasyncapi-idea-plugin"
         },
         "filters": {
+          "language": "Kotlin",
           "technology": [
-            "VSCode",
-            "SmartPaste"
+            "JetBrains",
+            "IntelliJ IDEA"
           ],
           "categories": [
             "ide-extension"
@@ -658,18 +661,15 @@
         }
       },
       {
-        "title": "jAsyncAPI - IDEA plugin",
-        "description": "Idea plugin for the java-asyncapi - Helps to edit and validate AsyncAPI schemas.",
+        "title": "asyncapi-preview",
+        "description": "VSCode extension that enables you to:\n  - Preview documentation generated using you AsyncAPI document. It uses AsyncAPI React component under the hood,\n  - Create AsyncAPI documents faster using SmartPaste functionality\n",
         "links": {
-          "websiteUrl": "https://plugins.jetbrains.com/plugin/15673-asyncapi",
-          "docsUrl": "https://github.com/asyncapi/jasyncapi-idea-plugin#usage",
-          "repoUrl": "https://github.com/asyncapi/jasyncapi-idea-plugin"
+          "repoUrl": "https://github.com/asyncapi/vs-asyncapi-preview"
         },
         "filters": {
-          "language": "Kotlin",
           "technology": [
-            "JetBrains",
-            "IntelliJ IDEA"
+            "VSCode",
+            "SmartPaste"
           ],
           "categories": [
             "ide-extension"
@@ -701,6 +701,24 @@
   "AsyncAPI Generator Templates": {
     "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 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-ws-template"
+        },
+        "filters": {
+          "language": "javascript",
+          "technology": [
+            "Node.js"
+          ],
+          "categories": [
+            "generator-template"
+          ],
+          "hasCommercial": false,
+          "isAsyncAPIOwner": true
+        }
+      },
       {
         "title": "Java Template",
         "description": "Java template for the AsyncAPI Generator",
@@ -722,15 +740,18 @@
         }
       },
       {
-        "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 Cloud Stream Template",
+        "description": "Java Spring Cloud Stream template for the AsyncAPI Generator",
         "links": {
-          "repoUrl": "https://github.com/asyncapi/nodejs-ws-template"
+          "repoUrl": "https://github.com/asyncapi/java-spring-cloud-stream-template"
         },
         "filters": {
-          "language": "javascript",
+          "language": [
+            "javascript"
+          ],
           "technology": [
-            "Node.js"
+            "Spring Cloud Streams",
+            "Maven"
           ],
           "categories": [
             "generator-template"
@@ -775,27 +796,6 @@
           "isAsyncAPIOwner": true
         }
       },
-      {
-        "title": "Java Spring Cloud Stream Template",
-        "description": "Java Spring Cloud Stream template for the AsyncAPI Generator",
-        "links": {
-          "repoUrl": "https://github.com/asyncapi/java-spring-cloud-stream-template"
-        },
-        "filters": {
-          "language": [
-            "javascript"
-          ],
-          "technology": [
-            "Spring Cloud Streams",
-            "Maven"
-          ],
-          "categories": [
-            "generator-template"
-          ],
-          "hasCommercial": false,
-          "isAsyncAPIOwner": true
-        }
-      },
       {
         "title": "Java Spring Template",
         "description": "Java Spring template for the AsyncAPI Generator",
diff --git a/markdown/docs/concepts/asyncapi-document/adding-bindings.md b/markdown/docs/concepts/asyncapi-document/adding-bindings.md
index ef5d75de346a..7380fc5c30a3 100644
--- a/markdown/docs/concepts/asyncapi-document/adding-bindings.md
+++ b/markdown/docs/concepts/asyncapi-document/adding-bindings.md
@@ -3,7 +3,9 @@ title: Adding bindings
 weight: 260
 ---
 
-Bindings in AsyncAPI provide a way to add protocol-specific information to the AsyncAPI documentation. They can be added to different document parts, such as servers, channels, or messages; they specify standard details specific to a particular protocol. The purpose of bindings is to enhance the API's understanding and usage by providing additional context and configuration options for different protocols.
+import BindingsOverview from '../../../../assets/docs/fragments/bindings-overview.md' 
+
+<BindingsOverview/>
 
 The following diagram highlights the sections where bindings can be implemented:
 
diff --git a/markdown/docs/concepts/asyncapi-document/structure.md b/markdown/docs/concepts/asyncapi-document/structure.md
index 6beb3d9b865a..9b3d9fb9be2e 100644
--- a/markdown/docs/concepts/asyncapi-document/structure.md
+++ b/markdown/docs/concepts/asyncapi-document/structure.md
@@ -351,7 +351,7 @@ operations:
 
 The `components` field allows for the definition of reusable structures or definitions applicable across various sections of your document. Items detailed within `components` only become part of the API when explicitly referenced by properties external to this field. Utilize it to avoid repetition and enhance the document's maintainability.
 
-Key components of the `channels` field include:
+Key components of the `components` field include:
 
 - `schemas`: An object to hold the reusable [Schema Object](/docs/reference/specification/latest#schemaObject). 
 - `servers`: An object to hold the reusable [Server Objects](/docs/reference/specification/latest#serverObject).
diff --git a/markdown/docs/reference/bindings/_section.md b/markdown/docs/reference/bindings/_section.md
new file mode 100644
index 000000000000..1b810dd42e3d
--- /dev/null
+++ b/markdown/docs/reference/bindings/_section.md
@@ -0,0 +1,4 @@
+---
+title: Bindings
+weight: 15
+---
diff --git a/markdown/docs/reference/bindings/index.md b/markdown/docs/reference/bindings/index.md
new file mode 100644
index 000000000000..314c533f0ae4
--- /dev/null
+++ b/markdown/docs/reference/bindings/index.md
@@ -0,0 +1,18 @@
+---
+title: Overview
+weight: 15
+---
+
+## Overview
+
+import BindingsOverview from '../../../../assets/docs/fragments/bindings-overview.md' 
+
+<BindingsOverview/>
+
+## Usage in an AsyncAPI document
+
+To learn how to add bindings to your AsyncAPI document, read [Adding bindings](/docs/concepts/asyncapi-document/adding-bindings) concept document, or read the guide about using [Kafka bindings](/docs/tutorials/kafka/bindings-with-kafka).
+
+## Contributing to bindings
+
+Bindings are maintained by different community members that know and use given protocol and technology in production. If something can be improved, or some new binding is needed, open an issue in [bindings repository](https://github.com/asyncapi/bindings).
diff --git a/types/components/tools/ToolDataType.ts b/types/components/tools/ToolDataType.ts
index ef636d09b7e9..3ef659f3c976 100644
--- a/types/components/tools/ToolDataType.ts
+++ b/types/components/tools/ToolDataType.ts
@@ -41,6 +41,7 @@ export interface ToolsListData {
   [category: string]: {
     description: string;
     toolsList: ToolData[];
+    elementRef?: React.RefObject<any>;
   };
 }