chore: resolved lint warnings - < Slider />, < StepIndicator />, < Ba…

…r />, <TabsContext /> (#1652)
mondaycom · Oct 12, 2023 · a10b184 · a10b184
1 parent 5054900
commit a10b184
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 25 deletions.
diff --git a/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx b/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx
@@ -6,7 +6,7 @@ import cx from "classnames";
 import { keyCodes } from "../../../../constants/keyCodes";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { CSSTransition, SwitchTransition } from "react-transition-group";
-import useEventListener from "../../../../hooks/useKeyEvent";
+import useEventListener from "../../../../hooks/useEventListener";
 import useKeyEvent from "../../../../hooks/useKeyEvent";
 import Icon from "../../../../components/Icon/Icon";
 import Check from "../../../../components/Icon/Icons/components/Check";
@@ -111,7 +111,6 @@ const StepIndicator: React.FC<StepIndicatorProps> = ({
 
   // Event listeners for removing animation.
   useEventListener({
-    // @ts-ignore TODO either fix the import to 'useEventListener' OR fix to fit 'useKeyEvent' OR remove entirely
     eventName: "animationend",
     callback: disableStatusChangeAnimation,
     ref: componentRef

diff --git a/src/components/ProgressBars/LinearProgressBar/Bar/Bar.tsx b/src/components/ProgressBars/LinearProgressBar/Bar/Bar.tsx
@@ -53,7 +53,7 @@ const Bar: FC<BarProps> = ({
     return cx(styles.bar, getStyle(styles, camelCase("type__" + type + "--" + barStyle)), className, {
       [styles.animate]: animated
     });
-  }, [type, barStyle, animated]);
+  }, [type, barStyle, animated, className]);
 
   const valuePercentage = useMemo(() => {
     if (value === null || value === undefined) return 0;

diff --git a/src/components/Slider/SliderHelpers.ts b/src/components/Slider/SliderHelpers.ts
@@ -1,26 +1,9 @@
-import cx from "classnames";
-import { BEM_PREFIX, COMPONENT_ID } from "./SliderConstants";
-
 export function _calcDimension(max: number, min: number, value: number): [number, number] {
   const valuePoints = max - min;
   const dimension = Math.round(((value - min) * 100) / valuePoints);
   return [dimension, dimension];
 }
 
-function _createBemBlockHelper(block: string, isConsume = false) {
-  if (!block || block === "") {
-    return () => "";
-  }
-  const blockClass = isConsume ? block : `${BEM_PREFIX}-${block}`;
-  return function bem(element: any, modifiers: any = "", extraClasses = "") {
-    const elClass = element !== "" ? `${blockClass}__${element}` : blockClass;
-    const modClasses = cx(modifiers)
-      .split(" ")
-      .map(modClass => (modClass === "" ? "" : `${elClass}--${modClass}`));
-    return cx(elClass, modClasses, extraClasses);
-  };
-}
-
 function _ensureSingleValueText(valueText: string, value: number, formatter: (value: number) => string): string {
   if (valueText) {
     return valueText;
@@ -42,8 +25,6 @@ function _ensureStepModulo(pageStep: number, step: number) {
   return pageStep - moduloToStep;
 }
 
-export const bem = _createBemBlockHelper(COMPONENT_ID);
-
 export function calcDimensions(max: number, min: number, ranged: boolean, value: number | number[]) {
   if (!ranged) {
     const [dimension, position] = _calcDimension(max, min, value as number);

diff --git a/src/components/Tabs/TabsContext/TabsContext.tsx b/src/components/Tabs/TabsContext/TabsContext.tsx
@@ -9,6 +9,10 @@ export interface TabsContextProps extends VibeComponentProps {
   children?: ReactElement | ReactElement[];
 }
 
+type TabsChild = ReactElement & {
+  type: Record<string, unknown>;
+};
+
 const TabsContext: FC<TabsContextProps> = forwardRef(
   ({ className, id, activeTabId = 0, children, "data-testid": dataTestId }, ref) => {
     const componentRef = useRef(null);
@@ -41,12 +45,10 @@ const TabsContext: FC<TabsContextProps> = forwardRef(
         id={id}
         data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABS_CONTEXT, id)}
       >
-        {React.Children.map(children, child => {
-          // @ts-ignore
+        {React.Children.map(children, (child: TabsChild) => {
           if (child.type.isTabList) {
             return React.cloneElement(child, { activeTabId: activeTabIdState, onTabChange: onTabClick });
           }
-          // @ts-ignore
           if (child.type.isTabPanels) {
             const animationDirection = previousActiveTabIdState < activeTabIdState ? "ltr" : "rtl";
             return React.cloneElement(child, { activeTabId: activeTabIdState, animationDirection });