chore: use includes instead indexOf (#38139)

* chore: use includes instead indexOf

* fix: fix

components/_util/wave.tsx

@@ -87,7 +87,7 @@ class Wave extends React.Component<WaveProps> {
   onClick = (node: HTMLElement, waveColor: string) => {
     const { insertExtraNode, disabled } = this.props;
 
-    if (disabled || !node || isHidden(node) || node.className.indexOf('-leave') >= 0) {
+    if (disabled || !node || isHidden(node) || node.className.includes('-leave')) {
       return;
     }
 
@@ -163,7 +163,7 @@ class Wave extends React.Component<WaveProps> {
       !node ||
       !node.getAttribute ||
       node.getAttribute('disabled') ||
-      node.className.indexOf('disabled') >= 0
+      node.className.includes('disabled')
     ) {
       return;
     }

components/badge/utils.tsx

@@ -2,5 +2,5 @@ import { PresetColorTypes } from '../_util/colors';
 
 // eslint-disable-next-line import/prefer-default-export
 export function isPresetColor(color?: string): boolean {
-  return (PresetColorTypes as any[]).indexOf(color) !== -1;
+  return (PresetColorTypes as any[]).includes(color);
 }

components/checkbox/Checkbox.tsx

@@ -102,7 +102,7 @@ const InternalCheckbox: React.ForwardRefRenderFunction<HTMLInputElement, Checkbo
       }
     };
     checkboxProps.name = checkboxGroup.name;
-    checkboxProps.checked = checkboxGroup.value.indexOf(restProps.value) !== -1;
+    checkboxProps.checked = checkboxGroup.value.includes(restProps.value);
   }
   const classString = classNames(
     {

components/checkbox/Group.tsx

@@ -101,7 +101,7 @@ const InternalCheckboxGroup: React.ForwardRefRenderFunction<HTMLDivElement, Chec
     const opts = getOptions();
     onChange?.(
       newValue
-        .filter(val => registeredValues.indexOf(val) !== -1)
+        .filter(val => registeredValues.includes(val))
         .sort((a, b) => {
           const indexA = opts.findIndex(opt => opt.value === a);
           const indexB = opts.findIndex(opt => opt.value === b);
@@ -122,7 +122,7 @@ const InternalCheckboxGroup: React.ForwardRefRenderFunction<HTMLDivElement, Chec
         key={option.value.toString()}
         disabled={'disabled' in option ? option.disabled : restProps.disabled}
         value={option.value}
-        checked={value.indexOf(option.value) !== -1}
+        checked={value.includes(option.value)}
         onChange={option.onChange}
         className={`${groupPrefixCls}-item`}
         style={option.style}

components/form/util.ts

@@ -22,7 +22,7 @@ export function getFieldId(namePath: InternalNamePath, formName?: string): strin
     return `${formName}_${mergedId}`;
   }
 
-  const isIllegalName = formItemNameBlackList.indexOf(mergedId) >= 0;
+  const isIllegalName = formItemNameBlackList.includes(mergedId);
 
   return isIllegalName ? `${defaultItemNamePrefixCls}_${mergedId}` : mergedId;
 }

components/progress/progress.tsx

@@ -75,7 +75,7 @@ const Progress: React.FC<ProgressProps> = (props: ProgressProps) => {
 
   function getProgressStatus() {
     const { status } = props;
-    if (ProgressStatuses.indexOf(status!) < 0 && getPercentNumber() >= 100) {
+    if (!ProgressStatuses.includes(status!) && getPercentNumber() >= 100) {
       return 'success';
     }
     return status || 'normal';
@@ -119,7 +119,7 @@ const Progress: React.FC<ProgressProps> = (props: ProgressProps) => {
   const strokeColorNotArray = Array.isArray(strokeColor) ? strokeColor[0] : strokeColor;
   const strokeColorNotGradient =
     typeof strokeColor === 'string' || Array.isArray(strokeColor) ? strokeColor : undefined;
-  let progress;
+  let progress: React.ReactNode;
   // Render progress shape
   if (type === 'line') {
     progress = steps ? (

components/statistic/utils.tsx

@@ -41,7 +41,7 @@ export function formatTimeStr(duration: number, format: string) {
   const templateText = format.replace(escapeRegex, '[]');
 
   const replacedText = timeUnits.reduce((current, [name, unit]) => {
-    if (current.indexOf(name) !== -1) {
+    if (current.includes(name)) {
       const value = Math.floor(leftDuration / unit);
       leftDuration -= value * unit;
       return current.replace(new RegExp(`${name}+`, 'g'), (match: string) => {

components/table/Table.tsx

@@ -482,8 +482,8 @@ function InternalTable<RecordType extends object = any>(
     const defaultPosition = direction === 'rtl' ? 'left' : 'right';
     const { position } = mergedPagination;
     if (position !== null && Array.isArray(position)) {
-      const topPos = position.find(p => p.indexOf('top') !== -1);
-      const bottomPos = position.find(p => p.indexOf('bottom') !== -1);
+      const topPos = position.find(p => p.includes('top'));
+      const bottomPos = position.find(p => p.includes('bottom'));
       const isDisable = position.every(p => `${p}` === 'none');
       if (!topPos && !bottomPos && !isDisable) {
         bottomPaginationNode = renderPagination(defaultPosition);

components/transfer/ListBody.tsx

@@ -71,7 +71,7 @@ class ListBody<RecordType extends KeyWiseTransferItem> extends React.Component<
 
   onItemSelect = (item: RecordType) => {
     const { onItemSelect, selectedKeys } = this.props;
-    const checked = selectedKeys.indexOf(item.key) >= 0;
+    const checked = selectedKeys.includes(item.key);
     onItemSelect(item.key, !checked);
   };
 
@@ -144,7 +144,7 @@ class ListBody<RecordType extends KeyWiseTransferItem> extends React.Component<
         >
           {this.getItems().map(({ renderedEl, renderedText, item }: RenderedItem<RecordType>) => {
             const { disabled } = item;
-            const checked = selectedKeys.indexOf(item.key) >= 0;
+            const checked = selectedKeys.includes(item.key);
 
             return (
               <ListItem

components/transfer/index.tsx

@@ -156,8 +156,8 @@ class Transfer<RecordType extends TransferItem = TransferItem> extends React.Com
 
     const { selectedKeys = [], targetKeys = [] } = props;
     this.state = {
-      sourceSelectedKeys: selectedKeys.filter(key => targetKeys.indexOf(key) === -1),
-      targetSelectedKeys: selectedKeys.filter(key => targetKeys.indexOf(key) > -1),
+      sourceSelectedKeys: selectedKeys.filter(key => !targetKeys.includes(key)),
+      targetSelectedKeys: selectedKeys.filter(key => targetKeys.includes(key)),
     };
   }
 
@@ -198,7 +198,7 @@ class Transfer<RecordType extends TransferItem = TransferItem> extends React.Com
     const newTargetKeys =
       direction === 'right'
         ? newMoveKeys.concat(targetKeys)
-        : targetKeys.filter(targetKey => newMoveKeys.indexOf(targetKey) === -1);
+        : targetKeys.filter(targetKey => !newMoveKeys.includes(targetKey));
 
     // empty checked keys
     const oppositeDirection = direction === 'right' ? 'left' : 'right';
@@ -214,13 +214,13 @@ class Transfer<RecordType extends TransferItem = TransferItem> extends React.Com
 
   onItemSelectAll = (direction: TransferDirection, selectedKeys: string[], checkAll: boolean) => {
     this.setStateKeys(direction, prevKeys => {
-      let mergedCheckedKeys = [];
+      let mergedCheckedKeys: string[] = [];
       if (checkAll) {
         // Merge current keys with origin key
-        mergedCheckedKeys = Array.from(new Set([...prevKeys, ...selectedKeys]));
+        mergedCheckedKeys = Array.from(new Set<string>([...prevKeys, ...selectedKeys]));
       } else {
         // Remove current keys from origin keys
-        mergedCheckedKeys = prevKeys.filter((key: string) => selectedKeys.indexOf(key) === -1);
+        mergedCheckedKeys = prevKeys.filter(key => !selectedKeys.includes(key));
       }
 
       this.handleSelectChange(direction, mergedCheckedKeys);

components/transfer/list.tsx

@@ -109,7 +109,7 @@ export default class TransferList<
     if (checkedKeys.length === 0) {
       return 'none';
     }
-    if (filteredItems.every(item => checkedKeys.indexOf(item.key) >= 0 || !!item.disabled)) {
+    if (filteredItems.every(item => checkedKeys.includes(item.key) || !!item.disabled)) {
       return 'all';
     }
     return 'part';
@@ -161,7 +161,7 @@ export default class TransferList<
     if (filterOption) {
       return filterOption(filterValue, item);
     }
-    return text.indexOf(filterValue) >= 0;
+    return text.includes(filterValue);
   };
 
   // =============================== Render ===============================

components/tree/utils/dictUtil.ts

@@ -65,12 +65,7 @@ export function calcRangeKeys({
       // Append selection
       keys.push(key);
     }
-
-    if (expandedKeys.indexOf(key) === -1) {
-      return false;
-    }
-
-    return true;
+    return expandedKeys.includes(key);
   });
 
   return keys;

components/typography/Title.tsx

@@ -19,7 +19,7 @@ const Title = React.forwardRef<HTMLElement, TitleProps>((props, ref) => {
   const { level = 1, ...restProps } = props;
   let component: keyof JSX.IntrinsicElements;
 
-  if (TITLE_ELE_LIST.indexOf(level) !== -1) {
+  if (TITLE_ELE_LIST.includes(level)) {
     component = `h${level}`;
   } else {
     warning(

components/typography/__tests__/index.test.tsx

@@ -262,14 +262,14 @@ describe('Typography', () => {
             </Paragraph>,
           );
 
-          if (triggerType === undefined || triggerType.indexOf('icon') !== -1) {
+          if (triggerType === undefined || triggerType.includes('icon')) {
             if (icon) {
               expect(wrapper.querySelectorAll('.anticon-highlight').length).toBeGreaterThan(0);
             } else {
               expect(wrapper.querySelectorAll('.anticon-edit').length).toBeGreaterThan(0);
             }
 
-            if (triggerType === undefined || triggerType.indexOf('text') === -1) {
+            if (triggerType === undefined || !triggerType.includes('text')) {
               fireEvent.click(wrapper.firstChild!);
               expect(onStart).not.toHaveBeenCalled();
             }
@@ -295,15 +295,15 @@ describe('Typography', () => {
             fireEvent.click(wrapper.querySelectorAll('.ant-typography-edit')[0]);
 
             expect(onStart).toHaveBeenCalled();
-            if (triggerType !== undefined && triggerType.indexOf('text') !== -1) {
+            if (triggerType !== undefined && triggerType.includes('text')) {
               fireEvent.keyDown(wrapper.querySelector('textarea')!, { keyCode: KeyCode.ESC });
               fireEvent.keyUp(wrapper.querySelector('textarea')!, { keyCode: KeyCode.ESC });
               expect(onChange).not.toHaveBeenCalled();
             }
           }
 
-          if (triggerType !== undefined && triggerType.indexOf('text') !== -1) {
-            if (triggerType.indexOf('icon') === -1) {
+          if (triggerType !== undefined && triggerType.includes('text')) {
+            if (!triggerType.includes('icon')) {
               expect(wrapper.querySelectorAll('.anticon-highlight').length).toBe(0);
               expect(wrapper.querySelectorAll('.anticon-edit').length).toBe(0);
             }

scripts/generate-authors.js

@@ -21,7 +21,7 @@ async function execute() {
   logs = _.remove(logs, ({ author_email: email }) => {
     for (let i = 0; i < excludes.length; i++) {
       const item = excludes[i];
-      if (email.indexOf(item) !== -1) {
+      if (email.includes(item)) {
         return false;
       }
     }

site/theme/template/Color/Palette.jsx

@@ -19,7 +19,7 @@ export default class Palette extends React.Component {
     this.hexColors = {};
     Object.keys(this.colorNodes).forEach(key => {
       const computedColor = getComputedStyle(this.colorNodes[key])['background-color'];
-      if (computedColor.indexOf('rgba') >= 0) {
+      if (computedColor.includes('rgba')) {
         this.hexColors[key] = computedColor;
       } else {
         this.hexColors[key] = rgbToHex(computedColor);

site/theme/template/Content/index.jsx

@@ -3,7 +3,7 @@ import MainContent from './MainContent';
 import * as utils from '../utils';
 
 function isChangelog(pathname) {
-  return pathname.indexOf('changelog') >= 0;
+  return pathname.includes('changelog');
 }
 
 export default collect(async nextProps => {