diff --git a/src/components/forms/RangeInput/RangeInput.test.tsx b/src/components/forms/RangeInput/RangeInput.test.tsx index 64b49604b9..638aaf5468 100644 --- a/src/components/forms/RangeInput/RangeInput.test.tsx +++ b/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' diff --git a/src/components/grid/Grid/Grid.tsx b/src/components/grid/Grid/Grid.tsx index d809a819f3..c29a91899f 100644 --- a/src/components/grid/Grid/Grid.tsx +++ b/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,12 +53,10 @@ export const Grid = ({ ...props }: GridProps & React.HTMLAttributes): React.ReactElement => { const { - // defaults row, col, gap, offset, - // breakpoint specific mobile, mobileLg, tablet, @@ -65,15 +64,31 @@ export const Grid = ({ 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)) } diff --git a/src/components/header/Header/Header.stories.tsx b/src/components/header/Header/Header.stories.tsx index b38782acb6..0dfecbdd1d 100644 --- a/src/components/header/Header/Header.stories.tsx +++ b/src/components/header/Header/Header.stories.tsx @@ -25,6 +25,17 @@ const mockSubmit = (): void => { /* mock submit fn */ } +const onToggle = ( + index: number, + setIsOpen: React.Dispatch> +): 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 = [ <> { - 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 = [ <> { - onToggle(0) + onToggle(0, setIsOpen) }} menuId="testDropDownOne" isOpen={isOpen[0]} @@ -168,7 +163,7 @@ export const BasicHeaderWithMegaMenu = (): React.ReactElement => { <> { - 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 = [ Simple link one @@ -236,7 +223,7 @@ export const extendedHeader = (): React.ReactElement => { <> { - 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 = [ <> { - onToggle(0) + onToggle(0, setIsOpen) }} menuId="testDropDownOne" isOpen={isOpen[0]} diff --git a/src/components/header/NavDropDownButton/NavDropDownButton.stories.tsx b/src/components/header/NavDropDownButton/NavDropDownButton.stories.tsx index 1bcb140e5f..e4b520565b 100644 --- a/src/components/header/NavDropDownButton/NavDropDownButton.stories.tsx +++ b/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 }) diff --git a/src/deprecation.ts b/src/deprecation.ts index 5e3111d0e1..f8a0891c40 100644 --- a/src/deprecation.ts +++ b/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 } diff --git a/src/stories/templates/documentation.stories.tsx b/src/stories/templates/documentation.stories.tsx index a762af5e3f..ba11495af8 100644 --- a/src/stories/templates/documentation.stories.tsx +++ b/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 }) diff --git a/src/stories/templates/landing.stories.tsx b/src/stories/templates/landing.stories.tsx index dc507c2813..4fb5aad094 100644 --- a/src/stories/templates/landing.stories.tsx +++ b/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 })