From 6cd9f2cc1232a690135582bd54b2805b92614562 Mon Sep 17 00:00:00 2001
From: Sourya07 <singhsourya137@gmail.com>
Date: Sat, 15 Nov 2025 16:26:24 +0530
Subject: [PATCH 1/6] fix: ensure unique TOC slugs for repeated headings
 (Examples)

---
 components/TOC.tsx | 23 ++++++++++++++++-------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/components/TOC.tsx b/components/TOC.tsx
index 197fcdc7607c..6902588d6054 100644
--- a/components/TOC.tsx
+++ b/components/TOC.tsx
@@ -38,10 +38,19 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
       // markdown document MDX takes these "a" tags and uses them to render the "id" for headers like
       // a-namedefinitionsapplicationaapplication slugWithATag contains transformed heading name that is later used
       // for scroll spy identification
-      slugWithATag: item.content
-        .replace(/[<>?!:`'."\\/=@#$%^&*()[\]{}+,;]/gi, '')
-        .replace(/\s/gi, '-')
-        .toLowerCase()
+      slugWithATag: (() => {
+        const base = item.content
+          .replace(/[<>?!:`'."\\/=@#$%^&*()[\]{}+,;]/gi, '')
+          .replace(/\s/gi, '-')
+          .toLowerCase();
+
+
+        if (typeof (item as any).seen === 'number' && (item as any).seen > 0) {
+          return `${base}-${(item as any).seen}`;
+        }
+
+        return base;
+      })()
     }));
 
   return (
@@ -56,12 +65,11 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
       >
         <h5
           className={twMerge(`${open && 'mb-4'} flex-1 text-primary-500 font-medium uppercase tracking-wide 
-          text-sm font-sans antialiased ${
-            cssBreakingPoint === 'xl'
+          text-sm font-sans antialiased ${cssBreakingPoint === 'xl'
               ? `xl:mb-4 xl:text-xs xl:text-gray-900 
           xl:font-bold`
               : 'lg:mb-4 lg:text-xs lg:text-gray-900 lg:font-bold'
-          }`)}
+            }`)}
           data-testid='TOC-Heading'
         >
           On this page
@@ -97,3 +105,4 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
     </div>
   );
 }
+

From 970bef63d55fd4405919e5e761c23a008f8818d5 Mon Sep 17 00:00:00 2001
From: Souryavardhan singh <144201791+Sourya07@users.noreply.github.com>
Date: Sat, 15 Nov 2025 17:37:57 +0530
Subject: [PATCH 2/6] Add optional 'seen' property to TOC items and formating
 issue

---
 components/TOC.tsx | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/components/TOC.tsx b/components/TOC.tsx
index 6902588d6054..c505ae08f933 100644
--- a/components/TOC.tsx
+++ b/components/TOC.tsx
@@ -11,6 +11,7 @@ interface ITOCProps {
     lvl: number;
     content: string;
     slug: string;
+    seen?: number;
   }[];
   contentSelector?: string;
   depth?: number;
@@ -28,7 +29,9 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
   const [open, setOpen] = useState(false);
 
   if (!toc || !toc.length) return null;
+
   const minLevel = toc.reduce((mLevel, item) => (!mLevel || item.lvl < mLevel ? item.lvl : mLevel), 0);
+
   const tocItems = toc
     .filter((item) => item.lvl <= minLevel + depth)
     .map((item) => ({
@@ -44,9 +47,8 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
           .replace(/\s/gi, '-')
           .toLowerCase();
 
-
-        if (typeof (item as any).seen === 'number' && (item as any).seen > 0) {
-          return `${base}-${(item as any).seen}`;
+        if (typeof item.seen === 'number' && item.seen > 0) {
+          return `${base}-${item.seen}`;
         }
 
         return base;
@@ -55,8 +57,10 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
 
   return (
     <div
-      className={twMerge(`${className} ${tocItems.length ? '' : 'hidden'} 
-      ${cssBreakingPoint === 'xl' ? 'xl:block' : 'lg:block'} md:top-24 md:max-h-(screen-14) mb-4 z-20`)}
+      className={twMerge(
+        `${className} ${tocItems.length ? '' : 'hidden'} 
+      ${cssBreakingPoint === 'xl' ? 'xl:block' : 'lg:block'} md:top-24 md:max-h-(screen-14) mb-4 z-20`
+      )}
       onClick={() => setOpen(!open)}
     >
       <div
@@ -64,12 +68,14 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
         ${cssBreakingPoint === 'xl' ? 'xl:cursor-auto' : 'lg:cursor-auto'} xl:mt-2`}
       >
         <h5
-          className={twMerge(`${open && 'mb-4'} flex-1 text-primary-500 font-medium uppercase tracking-wide 
+          className={twMerge(
+            `${open && 'mb-4'} flex-1 text-primary-500 font-medium uppercase tracking-wide 
           text-sm font-sans antialiased ${cssBreakingPoint === 'xl'
               ? `xl:mb-4 xl:text-xs xl:text-gray-900 
           xl:font-bold`
               : 'lg:mb-4 lg:text-xs lg:text-gray-900 lg:font-bold'
-            }`)}
+            }`
+          )}
           data-testid='TOC-Heading'
         >
           On this page
@@ -105,4 +111,3 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
     </div>
   );
 }
-

From 8666f791b9ecce67917f285cb22ed85672130f02 Mon Sep 17 00:00:00 2001
From: Souryavardhan singh <144201791+Sourya07@users.noreply.github.com>
Date: Sat, 15 Nov 2025 22:04:36 +0530
Subject: [PATCH 3/6] Update components/TOC.tsx

Co-authored-by: Prince Rajpoot <prince.rajpoot.20@gmail.com>
---
 components/TOC.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/components/TOC.tsx b/components/TOC.tsx
index c505ae08f933..5bd1e418fc6c 100644
--- a/components/TOC.tsx
+++ b/components/TOC.tsx
@@ -29,7 +29,6 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
   const [open, setOpen] = useState(false);
 
   if (!toc || !toc.length) return null;
-
   const minLevel = toc.reduce((mLevel, item) => (!mLevel || item.lvl < mLevel ? item.lvl : mLevel), 0);
 
   const tocItems = toc

From febb22e0fe508de94b04d7b48b33685bafb57ec9 Mon Sep 17 00:00:00 2001
From: Souryavardhan singh <144201791+Sourya07@users.noreply.github.com>
Date: Sat, 15 Nov 2025 22:49:22 +0530
Subject: [PATCH 4/6] Refactor TOC component for improved readability--eslint

---
 components/TOC.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/components/TOC.tsx b/components/TOC.tsx
index 5bd1e418fc6c..a3e871fc33a2 100644
--- a/components/TOC.tsx
+++ b/components/TOC.tsx
@@ -29,6 +29,7 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
   const [open, setOpen] = useState(false);
 
   if (!toc || !toc.length) return null;
+
   const minLevel = toc.reduce((mLevel, item) => (!mLevel || item.lvl < mLevel ? item.lvl : mLevel), 0);
 
   const tocItems = toc
@@ -68,17 +69,17 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
       >
         <h5
           className={twMerge(
-            `${open && 'mb-4'} flex-1 text-primary-500 font-medium uppercase tracking-wide 
-          text-sm font-sans antialiased ${cssBreakingPoint === 'xl'
-              ? `xl:mb-4 xl:text-xs xl:text-gray-900 
-          xl:font-bold`
-              : 'lg:mb-4 lg:text-xs lg:text-gray-900 lg:font-bold'
+            `${open && 'mb-4'} flex-1 text-primary-500 font-medium uppercase tracking-wide text-sm font-sans antialiased ${
+              cssBreakingPoint === 'xl'
+                ? 'xl:mb-4 xl:text-xs xl:text-gray-900 xl:font-bold'
+                : 'lg:mb-4 lg:text-xs lg:text-gray-900 lg:font-bold'
             }`
           )}
           data-testid='TOC-Heading'
         >
           On this page
         </h5>
+
         <div className={`text-underline p4 text-center ${cssBreakingPoint === 'xl' ? 'xl:hidden' : 'lg:hidden'}`}>
           <ArrowRight
             className={`${open ? '-rotate-90' : 'rotate-90'} -mt-0.5 h-6 

From bd6e8e43b0b3e24b3b7608985565722b6b06e3ed Mon Sep 17 00:00:00 2001
From: Souryavardhan singh <144201791+Sourya07@users.noreply.github.com>
Date: Sat, 15 Nov 2025 23:28:30 +0530
Subject: [PATCH 5/6] Update components/TOC.tsx

Co-authored-by: Prince Rajpoot <prince.rajpoot.20@gmail.com>
---
 components/TOC.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/components/TOC.tsx b/components/TOC.tsx
index a3e871fc33a2..fd6afe07b10f 100644
--- a/components/TOC.tsx
+++ b/components/TOC.tsx
@@ -29,7 +29,6 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
   const [open, setOpen] = useState(false);
 
   if (!toc || !toc.length) return null;
-
   const minLevel = toc.reduce((mLevel, item) => (!mLevel || item.lvl < mLevel ? item.lvl : mLevel), 0);
 
   const tocItems = toc

From 44464f3e7d45573940458a95bdd7c33e1cfdd7b6 Mon Sep 17 00:00:00 2001
From: Souryavardhan singh <144201791+Sourya07@users.noreply.github.com>
Date: Sat, 15 Nov 2025 23:28:45 +0530
Subject: [PATCH 6/6] Update components/TOC.tsx

Co-authored-by: Prince Rajpoot <prince.rajpoot.20@gmail.com>
---
 components/TOC.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/components/TOC.tsx b/components/TOC.tsx
index fd6afe07b10f..d63f9e8a2ba0 100644
--- a/components/TOC.tsx
+++ b/components/TOC.tsx
@@ -78,7 +78,6 @@ export default function TOC({ className, cssBreakingPoint = 'xl', toc, contentSe
         >
           On this page
         </h5>
-
         <div className={`text-underline p4 text-center ${cssBreakingPoint === 'xl' ? 'xl:hidden' : 'lg:hidden'}`}>
           <ArrowRight
             className={`${open ? '-rotate-90' : 'rotate-90'} -mt-0.5 h-6