Disable lint warnings for dependencies

[monicawheeler]

Description

yarn lint was returning 14 warnings related to "React Hook useEffect or useCallback has a missing dependency", and "Unexpected console statement." This pull request disables linting for those warnings in order to prevent unintended side effects.

Screenshots

No visual changes.

Testing in sage-lib

1. Pull PR locally
2. Navigate to the fixed React files in Storybook and verify they work as expected
   a. http://localhost:4100/?path=/story/sage-drawer--default
   b. http://localhost:4100/?path=/story/sage-input--default
   c. http://localhost:4100/?path=/story/sage-panelcontrols--default
   d. http://localhost:4100/?path=/story/sage-table--default-story
   e. http://localhost:4100/?path=/story/sage-toast--default
   f. http://localhost:4100/?path=/story/sage-switch--default
   g. http://localhost:4100/?path=/story/sage-typeahead--default
   h. http://localhost:4100/?path=/docs/sage-tooltip--default

Testing in kajabi-products

1. (LOW) Disabled linting warnings has no impact on apps consuming Sage

Related

DSS-449

Warning specifics

/sage-lib/packages/sage-react/lib/Drawer/Drawer.jsx
  43:6  warning  React Hook useEffect has a missing dependency: 'onExpandChange'. Either include it or remove the dependency array. If 'onExpandChange' changes too often, find the parent component that defines it and wrap that definition in useCallback  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Input/Input.jsx
  106:6  warning  React Hook useEffect has a missing dependency: 'inputStyles'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Input/Input.story.jsx
  154:5  warning  Unexpected console statement  no-console

/sage-lib/packages/sage-react/lib/PanelControls/PanelControls.story.jsx
  150:6  warning  React Hook useEffect has a missing dependency: 'fetchData'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Table/Table.jsx
  176:6  warning  React Hook useEffect has a missing dependency: 'buildHeaders'. Either include it or remove the dependency array      react-hooks/exhaustive-deps
  182:6  warning  React Hook useEffect has a missing dependency: 'getSelectionType'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Table/TableRow.jsx
  79:6  warning  React Hook useEffect has a missing dependency: 'hasBorders'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Toast/Toast.jsx
  45:6  warning  React Hook useEffect has a missing dependency: 'dismiss'. Either include it or remove the dependency array  react-hooks/exhaustive-deps
  50:6  warning  React Hook useEffect has a missing dependency: 'dismiss'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Toggle/Switch.story.jsx
  106:37  warning  Using propTypes from another component is not safe because they may be removed in production builds  react/forbid-foreign-prop-types

/sage-lib/packages/sage-react/lib/Tooltip/TooltipElement.jsx
  68:6  warning  React Hook useLayoutEffect has missing dependencies: 'parentDomRect' and 'position'. Either include them or remove the dependency array. Mutable values like 'tooltipRef.current' aren't valid dependencies because mutating them doesn't re-render the component  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/Typeahead/Typeahead.jsx
  42:38  warning  React Hook useEffect has a missing dependency: 'filterList'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/common/hooks/useDebounceEffect.jsx
  4:20  warning  React Hook useCallback has a missing dependency: 'effect'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

/sage-lib/packages/sage-react/lib/common/hooks/useFocusTrap.jsx
  65:6  warning  React Hook useEffect has missing dependencies: 'containerRef', 'onDeactivateFn', and 'returnFocus'. Either include them or remove the dependency array. Mutable values like 'containerRef.current' aren't valid dependencies because mutating them doesn't re-render the component  react-hooks/exhaustive-deps

✖ 14 problems (0 errors, 14 warnings)

[ju-Skinner]

Be careful with these types of things...they can sometimes cause unexpected side effects. I would suggest you test these manually.

[monicawheeler]

@ju-Skinner - I did manually test these in the local dev environment for the doc site, and all the functionality and styles worked as expected. Anything in particular you suggest I look out for?

[ju-Skinner]

Let's consider disabling these instead of trying to add the dependency. This could have an adverse side-effect that we may not catch until it's in prod.

[QuintonJason]

Getting the following warning in the browser console

[monicawheeler]

Getting the following warning in the browser console

These are different from what I sought to resolve. These errors occur on the production side as well. What are your thoughts of dealing with those in another task?

[QuintonJason]

Looks great and console is error-free