Fixed the 12 ESLint errors in src/sections/Company/Brand/index.js.

Cause: commit 89c867c commented out brand sections with //, which is
invalid inside JSX children — it produced react/jsx-no-comment-textnodes
errors plus react/jsx-no-undef for the now-unimported brands, and left
stray </div> closers.
Changes in src/sections/Company/Brand/index.js:
- Lines ~233-242: replaced the three broken // <div...> blocks with one
  proper JSX comment {/* <div id="meshery"...> ... <div
  id="meshery-operator"...> ... */}, preserving the intent to hide
  Meshery / MeshSync / Meshery Operator kits.
- scrollTo:52: added if (!element) return; guard so clicking those nav
  links while their sections are commented out no-ops instead of
  throwing on null.offsetTop.

Signed-off-by: Tanav Poswal <tanavposwal939@gmail.com>

Author: tanav29

src/sections/Company/Brand/index.js

@@ -13,20 +13,24 @@ const SMPBrand = loadable(() => import("./Brand-components/smp"));
 const CommunityBrand = loadable(() => import("./Brand-components/community"));
 const Button = loadable(() => import("../../../reusecore/Button"));
 const NightHawk = loadable(() => import("./Brand-components/nighthawk"));
-const ServiceMeshPatterns = loadable(() => import("./Brand-components/servicemeshpatterns"));
+const ServiceMeshPatterns = loadable(
+  () => import("./Brand-components/servicemeshpatterns"),
+);
 const MeshMasterBrand = loadable(() => import("./Brand-components/meshmaster"));
 const MeshMarkBrand = loadable(() => import("./Brand-components/meshmark"));
 const KanvasBrand = loadable(() => import("./Brand-components/kanvas"));
 const BrandGuide = loadable(() => import("./Brand-components/brand-guide"));
 const StickFigures = loadable(() => import("./Brand-components/stickfigures"));
 const Catalog = loadable(() => import("./Brand-components/catalog"));
 const Academy = loadable(() => import("./Brand-components/academy"));
-const SocialBackgrounds = loadable(() => import("./Brand-components/social-backgrounds"));
+const SocialBackgrounds = loadable(
+  () => import("./Brand-components/social-backgrounds"),
+);
 
 const getDimensions = (ele) => {
   let dummyheight = 0,
-      dummyoffsetTop = 0,
-      dummyoffsetBottom = 0;
+    dummyoffsetTop = 0,
+    dummyoffsetBottom = 0;
   if (ele) {
     const { height } = ele.getBoundingClientRect();
     const offsetTop = ele.offsetTop;
@@ -49,6 +53,9 @@ const getDimensions = (ele) => {
 // Functions to make scroll with speed control
 // Element to move, element or px from, element or px to, time in ms to animate
 const scrollTo = (element, sectionId, duration = 2000) => {
+  // Sections for disabled brand kits are commented out, so their refs
+  // stay null. Bail out instead of throwing on element.offsetTop.
+  if (!element) return;
   // Update URL hash
   if (sectionId) {
     window.history.pushState(null, null, `#${sectionId}`);
@@ -142,22 +149,22 @@ const Brand = () => {
   ];
 
   const sectionIdMap = {
-    "layer5": layer5Ref,
+    layer5: layer5Ref,
     "social-backgrounds": SocialBackgroundsRef,
-    "meshery": mesheryRef,
-    "meshsync": meshsyncRef,
+    meshery: mesheryRef,
+    meshsync: meshsyncRef,
     "meshery-operator": mesheryOperatorRef,
     "image-hub": imageHubRef,
-    "smp": smpRef,
-    "meshmark": meshmarkRef,
+    smp: smpRef,
+    meshmark: meshmarkRef,
     "service-mesh-patterns": servicemeshpatternsRef,
-    "nighthawk": nightHawkRef,
-    "meshmate": meshmateRef,
-    "meshmaster": meshMasterRef,
-    "kanvas": kanvasRef,
-    "catalog": CatalogRef,
-    "academy": AcademyRef,
-    "five": stickfiguresRef
+    nighthawk: nightHawkRef,
+    meshmate: meshmateRef,
+    meshmaster: meshMasterRef,
+    kanvas: kanvasRef,
+    catalog: CatalogRef,
+    academy: AcademyRef,
+    five: stickfiguresRef,
   };
 
   // Handle initial hash navigation on page load
@@ -224,18 +231,22 @@ const Brand = () => {
           <div className="section" id="layer5" ref={layer5Ref}>
             <Layer5Brand />
           </div>
-          <div className="section" id="social-backgrounds" ref={SocialBackgroundsRef}>
+          <div
+            className="section"
+            id="social-backgrounds"
+            ref={SocialBackgroundsRef}
+          >
             <SocialBackgrounds />
           </div>
-          // <div className="section" id="meshery" ref={mesheryRef}>
-          //   <MesheryBrand />
-          // </div>
-          // <div className="section" id="meshsync" ref={meshsyncRef}>
-          //   <MeshSyncBrand />
-          // </div>
-          // <div className="section" id="meshery-operator" ref={mesheryOperatorRef}>
-          //   <MesheryOperatorBrand />
-          // </div>
+          {/* <div className="section" id="meshery" ref={mesheryRef}>
+            <MesheryBrand />
+          </div>
+          <div className="section" id="meshsync" ref={meshsyncRef}>
+            <MeshSyncBrand />
+          </div>
+          <div className="section" id="meshery-operator" ref={mesheryOperatorRef}>
+            <MesheryOperatorBrand />
+          </div> */}
           <div className="section" id="image-hub" ref={imageHubRef}>
             <ImageHubBrand />
           </div>
@@ -245,7 +256,11 @@ const Brand = () => {
           <div className="section" id="meshmark" ref={meshmarkRef}>
             <MeshMarkBrand />
           </div>
-          <div className="section" id="service-mesh-patterns" ref={servicemeshpatternsRef}>
+          <div
+            className="section"
+            id="service-mesh-patterns"
+            ref={servicemeshpatternsRef}
+          >
             <ServiceMeshPatterns />
           </div>
           <div className="section" id="nighthawk" ref={nightHawkRef}>
@@ -357,7 +372,10 @@ const Brand = () => {
                 visibleSection === "ServiceMeshPatterns" ? "selected" : ""
               }`}
               onClick={() => {
-                scrollTo(servicemeshpatternsRef.current, "service-mesh-patterns");
+                scrollTo(
+                  servicemeshpatternsRef.current,
+                  "service-mesh-patterns",
+                );
               }}
             >
               <span>Cloud Native Patterns</span>