refactor(table-of-contents): remove isActive and depth logic from link component

Author: TylerAPfledderer

src/components/TableOfContents/ItemsList.tsx

@@ -25,9 +25,7 @@ const ItemsList: React.FC<IPropsItemsList> = ({
     <>
       {items.map((item, index) => (
         <ListItem key={index} m={0} {...rest}>
-          {item.title && (
-            <Link depth={depth} item={item} activeHash={activeHash} />
-          )}
+          {item.title && <Link item={item} activeHash={activeHash} />}
           {item.items && (
             <List
               key={item.title}

src/components/TableOfContents/TableOfContentsLink.tsx

@@ -5,26 +5,12 @@ import CustomLink from "../Link"
 import { getCustomId, Item, trimmedTitle } from "./utils"
 
 export interface IPropsTableOfContentsLink {
-  depth: number
   item: Item
   activeHash?: string
 }
 
-const Link: React.FC<IPropsTableOfContentsLink> = ({
-  depth,
-  item,
-  activeHash,
-}) => {
+const Link: React.FC<IPropsTableOfContentsLink> = ({ item }) => {
   const url = `#${getCustomId(item.title)}`
-  const isActive = activeHash === url
-  const isNested = depth === 2
-  let classes = ""
-  if (isActive) {
-    classes += " active"
-  }
-  if (isNested) {
-    classes += " nested"
-  }
 
   const $dotBg = cssVar("dot-bg")
 
@@ -48,7 +34,6 @@ const Link: React.FC<IPropsTableOfContentsLink> = ({
     <CustomLink
       as={GatsbyLink}
       to={url}
-      className={classes}
       textDecoration="none"
       display="inline-block"
       position="relative"