fix: lint warnings

src/components/forms/RangeInput/RangeInput.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { render, queryByText } from '@testing-library/react'
+import { render } from '@testing-library/react'
 
 import { RangeInput } from './RangeInput'
 

src/components/grid/Grid/Grid.tsx

@@ -13,7 +13,7 @@ export type GridLayoutProp = {
 }
 
 export const getGridClasses = (
-  itemProps: GridItemProps,
+  itemProps: GridItemProps = {},
   breakpoint?: BreakpointKeys
 ): string => {
   // This should be fine bc TypeScript
@@ -38,6 +38,7 @@ export const applyGridClasses = (gridLayout: GridProps): string => {
   Object.keys(breakpoints).forEach((b) => {
     const bp = b as BreakpointKeys
     if (Object.prototype.hasOwnProperty.call(gridLayout, bp)) {
+      // eslint-disable-next-line security/detect-object-injection
       const bpProps = gridLayout[bp] as GridItemProps
       classes = classnames(classes, getGridClasses(bpProps, bp))
     }
@@ -52,28 +53,42 @@ export const Grid = ({
   ...props
 }: GridProps & React.HTMLAttributes<HTMLDivElement>): React.ReactElement => {
   const {
-    // defaults
     row,
     col,
     gap,
     offset,
-    // breakpoint specific
     mobile,
     mobileLg,
     tablet,
     tabletLg,
     desktop,
     desktopLg,
     widescreen,
-    // other
     ...otherProps
   } = props
 
-  let classes = getGridClasses(props)
+  const itemProps = {
+    row,
+    col,
+    gap,
+    offset,
+  }
+
+  const breakpointProps = {
+    mobile,
+    mobileLg,
+    tablet,
+    tabletLg,
+    desktop,
+    desktopLg,
+    widescreen,
+  }
+  let classes = getGridClasses(itemProps)
 
   Object.keys(breakpoints).forEach((b) => {
     const bp = b as BreakpointKeys
-    if (Object.prototype.hasOwnProperty.call(props, bp)) {
+    if (Object.prototype.hasOwnProperty.call(breakpointProps, bp)) {
+      // eslint-disable-next-line security/detect-object-injection
       const bpProps = props[bp] as GridItemProps
       classes = classnames(classes, getGridClasses(bpProps, bp))
     }

src/components/header/Header/Header.stories.tsx

@@ -25,6 +25,17 @@ const mockSubmit = (): void => {
   /* mock submit fn */
 }
 
+const onToggle = (
+  index: number,
+  setIsOpen: React.Dispatch<React.SetStateAction<boolean[]>>
+): void => {
+  setIsOpen((prevIsOpen) => {
+    const newIsOpen = [false, false]
+    // eslint-disable-next-line security/detect-object-injection
+    newIsOpen[index] = !prevIsOpen[index]
+    return newIsOpen
+  })
+}
 export const BasicHeader = (): React.ReactElement => {
   const [expanded, setExpanded] = useState(false)
   const onClick = (): void => setExpanded((prvExpanded) => !prvExpanded)
@@ -40,20 +51,12 @@ export const BasicHeader = (): React.ReactElement => {
 
   const [isOpen, setIsOpen] = useState([false, false])
 
-  const onToggle = (index: number): void => {
-    setIsOpen((prevIsOpen) => {
-      const newIsOpen = Array(prevIsOpen.length).fill(false)
-      newIsOpen[index] = !prevIsOpen[index]
-      return newIsOpen
-    })
-  }
-
   const testItemsMenu = [
     <>
       <NavDropDownButton
         menuId="testDropDownOne"
         onToggle={(): void => {
-          onToggle(0)
+          onToggle(0, setIsOpen)
         }}
         isOpen={isOpen[0]}
         label="Nav Label"
@@ -139,19 +142,11 @@ export const BasicHeaderWithMegaMenu = (): React.ReactElement => {
 
   const [isOpen, setIsOpen] = useState([false, false])
 
-  const onToggle = (index: number): void => {
-    setIsOpen((prevIsOpen) => {
-      const newIsOpen = [false, false]
-      newIsOpen[index] = !prevIsOpen[index]
-      return newIsOpen
-    })
-  }
-
   const testItemsMegaMenu = [
     <>
       <NavDropDownButton
         onToggle={(): void => {
-          onToggle(0)
+          onToggle(0, setIsOpen)
         }}
         menuId="testDropDownOne"
         isOpen={isOpen[0]}
@@ -168,7 +163,7 @@ export const BasicHeaderWithMegaMenu = (): React.ReactElement => {
     <>
       <NavDropDownButton
         onToggle={(): void => {
-          onToggle(1)
+          onToggle(1, setIsOpen)
         }}
         menuId="testDropDownTwo"
         isOpen={isOpen[1]}
@@ -215,14 +210,6 @@ export const extendedHeader = (): React.ReactElement => {
   const onClick = (): void => setExpanded((prvExpanded) => !prvExpanded)
   const [isOpen, setIsOpen] = useState([false])
 
-  const onToggle = (index: number): void => {
-    setIsOpen((prevIsOpen) => {
-      const newIsOpen = Array(prevIsOpen.length).fill(false)
-      newIsOpen[index] = !prevIsOpen[index]
-      return newIsOpen
-    })
-  }
-
   const testMenuItems = [
     <a href="#linkOne" key="one">
       Simple link one
@@ -236,7 +223,7 @@ export const extendedHeader = (): React.ReactElement => {
     <>
       <NavDropDownButton
         onToggle={(): void => {
-          onToggle(0)
+          onToggle(0, setIsOpen)
         }}
         menuId="testDropDownOne"
         isOpen={isOpen[0]}
@@ -311,19 +298,11 @@ export const extendedHeaderWithMegaMenu = (): React.ReactElement => {
 
   const [isOpen, setIsOpen] = useState([false, false])
 
-  const onToggle = (index: number): void => {
-    setIsOpen((prevIsOpen) => {
-      const newIsOpen = Array(prevIsOpen.length).fill(false)
-      newIsOpen[index] = !prevIsOpen[index]
-      return newIsOpen
-    })
-  }
-
   const testItemsMenu = [
     <>
       <NavDropDownButton
         onToggle={(): void => {
-          onToggle(0)
+          onToggle(0, setIsOpen)
         }}
         menuId="testDropDownOne"
         isOpen={isOpen[0]}

src/components/header/NavDropDownButton/NavDropDownButton.stories.tsx

@@ -26,6 +26,7 @@ export const defaultDropDownMenu = (): React.ReactElement => {
   const onToggle = (index: number): void => {
     setIsOpen((prevIsOpen) => {
       const newIsOpen = [false, false]
+      // eslint-disable-next-line security/detect-object-injection
       newIsOpen[index] = !prevIsOpen[index]
       return newIsOpen
     })

src/deprecation.ts

@@ -1,6 +1,7 @@
 export const deprecationWarning =
   process.env.NODE_ENV !== 'production'
     ? console.warn
-    : () => {
+    : // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+      () => {
         // do nothing in production
       }

src/stories/templates/documentation.stories.tsx

@@ -38,6 +38,7 @@ export const DocumentationPage = (): React.ReactElement => {
   const handleToggleNavDropdown = (index: number): void => {
     setNavDropdownOpen((prevNavDropdownOpen) => {
       const newOpenState = Array(prevNavDropdownOpen.length).fill(false)
+      // eslint-disable-next-line security/detect-object-injection
       newOpenState[index] = !prevNavDropdownOpen[index]
       return newOpenState
     })

src/stories/templates/landing.stories.tsx

@@ -38,6 +38,7 @@ export const LandingPage = (): React.ReactElement => {
   const handleToggleNavDropdown = (index: number): void => {
     setNavDropdownOpen((prevNavDropdownOpen) => {
       const newOpenState = Array(prevNavDropdownOpen.length).fill(false)
+      // eslint-disable-next-line security/detect-object-injection
       newOpenState[index] = !prevNavDropdownOpen[index]
       return newOpenState
     })