chore: upgrade oxlint to v0.13.2 (#8891)

Co-authored-by: LongYinan <lynweklm@gmail.com>
2026-02-14 21:27:20 +00:00 · 2024-11-26 17:56:35 +08:00
parent d87a6f7068
commit c349a24e95
35 changed files with 139 additions and 117 deletions
--- a/packages/frontend/admin/src/modules/ai/edit-prompt.tsx
+++ b/packages/frontend/admin/src/modules/ai/edit-prompt.tsx
@@ -120,7 +120,7 @@ export function EditPrompt({
          <div className="px-5 py-4 overflow-y-auto space-y-[10px] flex flex-col">
            <div className="text-sm font-medium">Messages</div>
            {messages.map((message, index) => (
-              <div key={index} className="flex flex-col gap-3">
+              <div key={message.content} className="flex flex-col gap-3">
                {index !== 0 && <Separator />}
                <div>
                  <div className="text-sm font-normal">Role</div>
--- a/packages/frontend/admin/src/modules/ai/prompts.tsx
+++ b/packages/frontend/admin/src/modules/ai/prompts.tsx
@@ -40,7 +40,7 @@ export function Prompts() {
        <div className="flex flex-col rounded-md border w-full">
          {list.map((item, index) => (
            <PromptRow
-              key={item.name.concat(index.toString())}
+              key={`${item.name}-${index}`}
              item={item}
              index={index}
            />
--- a/packages/frontend/admin/src/modules/nav/collapsible-item.tsx
+++ b/packages/frontend/admin/src/modules/nav/collapsible-item.tsx
@@ -51,9 +51,9 @@ export const CollapsibleItem = ({
          </AccordionTrigger>
        </NavLink>
        <AccordionContent className=" flex flex-col gap-2 py-1">
-          {items.map((item, index) => (
+          {items.map(item => (
            <NavLink
-              key={index}
+              key={item}
              to={`/admin/settings/${title}#${item}`}
              className={({ isActive }) => {
                return isActive && activeSubTab === item
--- a/packages/frontend/admin/src/modules/setup/form.tsx
+++ b/packages/frontend/admin/src/modules/setup/form.tsx
@@ -213,7 +213,7 @@ export const Form = () => {
      <div className="py-2 px-0 text-sm mt-16 max-lg:mt-5 relative">
        {Array.from({ length: count }).map((_, index) => (
          <span
-            key={index}
+            key={`${index}`}
            className={`inline-block w-16 h-1 rounded mr-1 ${
              index <= current - 1
                ? 'bg-primary'
--- a/packages/frontend/component/src/components/auth-components/onboarding-page.tsx
+++ b/packages/frontend/component/src/components/auth-components/onboarding-page.tsx
@@ -159,11 +159,11 @@ export const OnboardingPage = ({
          <div className={styles.optionsWrapper}>
            {question.options &&
              question.options.length > 0 &&
-              question.options.map((option, optionIndex) => {
+              question.options.map(option => {
                if (option.type === 'checkbox') {
                  return (
                    <Checkbox
-                      key={optionIndex}
+                      key={option.label}
                      name={option.value}
                      className={styles.checkBox}
                      labelClassName={styles.label}
@@ -184,7 +184,7 @@ export const OnboardingPage = ({
                } else if (option.type === 'input') {
                  return (
                    <Input
-                      key={optionIndex}
+                      key={option.label}
                      className={styles.input}
                      type="text"
                      size="large"
--- a/packages/frontend/component/src/ui/date-picker/calendar/day-picker.tsx
+++ b/packages/frontend/component/src/ui/date-picker/calendar/day-picker.tsx
@@ -187,23 +187,27 @@ export const DayPicker = memo(function DayPicker(
        {/* Weeks in month */}
        {matrix.map((week, i) => {
          return (
+            // eslint-disable-next-line react/no-array-index-key
            <div key={i} className={clsx(styles.monthViewRow)}>
-              {week.map((cell, j) => (
-                <div
-                  className={clsx(
-                    styles.monthViewBodyCell,
-                    monthBodyCellClassName
-                  )}
-                  key={j}
-                  onClick={() => onChange?.(cell.date.format(format))}
-                >
-                  {customDayRenderer ? (
-                    customDayRenderer(cell)
-                  ) : (
-                    <DefaultDateCell key={j} {...cell} />
-                  )}
-                </div>
-              ))}
+              {week.map(cell => {
+                const dateValue = cell.date.format(format);
+                return (
+                  <div
+                    className={clsx(
+                      styles.monthViewBodyCell,
+                      monthBodyCellClassName
+                    )}
+                    key={dateValue}
+                    onClick={() => onChange?.(dateValue)}
+                  >
+                    {customDayRenderer ? (
+                      customDayRenderer(cell)
+                    ) : (
+                      <DefaultDateCell key={dateValue} {...cell} />
+                    )}
+                  </div>
+                );
+              })}
            </div>
          );
        })}
--- a/packages/frontend/component/src/ui/date-picker/calendar/items.tsx
+++ b/packages/frontend/component/src/ui/date-picker/calendar/items.tsx
@@ -45,6 +45,7 @@ const HeaderLayout = memo(function HeaderLayout({
          const isRight = index === length - 1;
          return (
            <div
+              // eslint-disable-next-line react/no-array-index-key
              key={index}
              data-length={length}
              data-is-left={isLeft}
--- a/packages/frontend/component/src/ui/date-picker/calendar/month-picker.tsx
+++ b/packages/frontend/component/src/ui/date-picker/calendar/month-picker.tsx
@@ -126,21 +126,24 @@ export const MonthPicker = memo(function MonthPicker(
  const Body = useMemo(() => {
    return (
      <div className={styles.yearViewBody}>
+        {/* eslint-disable-next-line react/no-array-index-key */}
        {matrix.map((row, i) => {
          return (
+            // eslint-disable-next-line react/no-array-index-key
            <div key={i} className={styles.yearViewRow}>
-              {row.map((month, j) => {
+              {row.map(month => {
+                const monthValue = month.format('YYYY-MM');
                return (
-                  <div key={j} className={styles.yearViewBodyCell}>
+                  <div key={monthValue} className={styles.yearViewBodyCell}>
                    <button
-                      data-value={month.format('YYYY-MM')}
+                      data-value={monthValue}
                      data-is-month-cell
                      className={styles.yearViewBodyCellInner}
                      data-selected={value && month.isSame(value, 'month')}
                      data-current-month={month.isSame(dayjs(), 'month')}
                      onClick={() => onMonthChange(month)}
                      tabIndex={month.isSame(monthCursor, 'month') ? 0 : -1}
-                      aria-label={month.format('YYYY-MM')}
+                      aria-label={monthValue}
                    >
                      {monthNames.split(',')[month.month()]}
                    </button>
--- a/packages/frontend/component/src/ui/date-picker/calendar/year-picker.tsx
+++ b/packages/frontend/component/src/ui/date-picker/calendar/year-picker.tsx
@@ -136,12 +136,14 @@ export const YearPicker = memo(function YearPicker(
      <div className={styles.decadeViewBody}>
        {matrix.map((row, i) => {
          return (
+            // eslint-disable-next-line react/no-array-index-key
            <div key={i} className={styles.decadeViewRow}>
-              {row.map((year, j) => {
+              {row.map(year => {
                const isDisabled =
                  year.isAfter(DATE_MAX) || year.isBefore(DATE_MIN);
+                const yearValue = year.year();
                return (
-                  <div key={j} className={styles.decadeViewBodyCell}>
+                  <div key={yearValue} className={styles.decadeViewBodyCell}>
                    <button
                      aria-disabled={isDisabled}
                      data-value={year.format('YYYY')}
@@ -154,7 +156,7 @@ export const YearPicker = memo(function YearPicker(
                        isDisabled ? undefined : () => onYearChange(year)
                      }
                    >
-                      {year.year()}
+                      {yearValue}
                    </button>
                  </div>
                );
--- a/packages/frontend/component/src/ui/slider/slider.tsx
+++ b/packages/frontend/component/src/ui/slider/slider.tsx
@@ -107,7 +107,7 @@ export const Slider = ({
          {!!nodes &&
            nodes.map((nodeValue, index) => (
              <div
-                key={index}
+                key={nodeValue}
                className={styles.nodeStyle}
                data-active={value && value[0] >= nodeValue}
                data-disabled={disabled}
--- a/packages/frontend/core/src/components/affine/affine-error-boundary/error-basic/error-detail.tsx
+++ b/packages/frontend/core/src/components/affine/affine-error-boundary/error-basic/error-detail.tsx
@@ -75,6 +75,7 @@ export const ErrorDetail: FC<ErrorDetailProps> = props => {
  }, [onButtonClick, resetError]);

  const desc = descriptions.map((item, i) => (
+    // eslint-disable-next-line react/no-array-index-key
    <p key={i} className={styles.text}>
      {item}
    </p>
--- a/packages/frontend/core/src/components/affine/ai-onboarding/slider.tsx
+++ b/packages/frontend/core/src/components/affine/ai-onboarding/slider.tsx
@@ -46,7 +46,7 @@ export const Slider = <T,>({
        }}
      >
        {items?.map((item, index) => (
-          <div key={index} className={styles.slideItem}>
+          <div key={`${item}-${index}`} className={styles.slideItem}>
            {preload === undefined || Math.abs(index - activeIndex) <= preload
              ? itemRenderer?.(item, index)
              : null}
--- a/packages/frontend/core/src/components/affine/onboarding/steps/edgeless-switch.tsx
+++ b/packages/frontend/core/src/components/affine/onboarding/steps/edgeless-switch.tsx
@@ -210,6 +210,7 @@ export const EdgelessSwitch = ({
              {
                /* render blocks */
                article.blocks.map((block, key) => {
+                  // eslint-disable-next-line react/no-array-index-key
                  return <OnboardingBlock key={key} mode={mode} {...block} />;
                })
              }
--- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
+++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
@@ -584,17 +584,17 @@ export function patchForMobile() {
      // Disable some toolbar widgets for mobile.
      {
        di.override(WidgetViewMapIdentifier('affine:page'), () => {
-          const ignoreWidgets = [
+          const ignoreWidgets = new Set([
            AFFINE_FORMAT_BAR_WIDGET,
            AFFINE_EMBED_CARD_TOOLBAR_WIDGET,
-          ];
+          ]);

          type pageRootWidgetViewMapKey = keyof typeof pageRootWidgetViewMap;
          return (
            Object.keys(pageRootWidgetViewMap) as pageRootWidgetViewMapKey[]
          ).reduce(
            (acc, key) => {
-              if (ignoreWidgets.includes(key)) return acc;
+              if (ignoreWidgets.has(key)) return acc;
              acc[key] = pageRootWidgetViewMap[key];
              return acc;
            },
--- a/packages/frontend/core/src/components/doc-properties/icons/icons-selector.tsx
+++ b/packages/frontend/core/src/components/doc-properties/icons/icons-selector.tsx
@@ -26,9 +26,9 @@ const IconsSelectorPanel = ({
      </div>
      <Scrollable.Viewport className={styles.iconsContainerScrollable}>
        <div className={styles.iconsContainer}>
-          {iconRows.map((iconRow, index) => {
+          {iconRows.map(iconRow => {
            return (
-              <div key={index} className={styles.iconsRow}>
+              <div key={iconRow.join('-')} className={styles.iconsRow}>
                {iconRow.map(iconName => {
                  const Icon = iconNameToComponent(iconName);
                  return (
--- a/packages/frontend/core/src/components/page-list/collections/virtualized-collection-list.tsx
+++ b/packages/frontend/core/src/components/page-list/collections/virtualized-collection-list.tsx
@@ -63,8 +63,8 @@ export const VirtualizedCollectionList = ({
  });

  const filteredSelectedCollectionIds = useMemo(() => {
-    const ids = collections.map(collection => collection.id);
-    return selectedCollectionIds.filter(id => ids.includes(id));
+    const ids = new Set(collections.map(collection => collection.id));
+    return selectedCollectionIds.filter(id => ids.has(id));
  }, [collections, selectedCollectionIds]);

  const hideFloatingToolbar = useCallback(() => {
--- a/packages/frontend/core/src/components/page-list/docs/virtualized-page-list.tsx
+++ b/packages/frontend/core/src/components/page-list/docs/virtualized-page-list.tsx
@@ -83,8 +83,8 @@ export const VirtualizedPageList = ({
  }, [filteredPageMetas, listItem]);

  const filteredSelectedPageIds = useMemo(() => {
-    const ids = pageMetasToRender.map(page => page.id);
-    return selectedPageIds.filter(id => ids.includes(id));
+    const ids = new Set(pageMetasToRender.map(page => page.id));
+    return selectedPageIds.filter(id => ids.has(id));
  }, [pageMetasToRender, selectedPageIds]);

  const hideFloatingToolbar = useCallback(() => {
--- a/packages/frontend/core/src/components/page-list/filter/condition.tsx
+++ b/packages/frontend/core/src/components/page-list/filter/condition.tsx
@@ -163,7 +163,7 @@ export const renderArgs = (
    const value = filter.args[i];
    return (
      <Arg
-        key={i}
+        key={`${argType.type}-${i}`}
        type={argType}
        value={value}
        onChange={value => {
--- a/packages/frontend/core/src/components/page-list/scoped-atoms.tsx
+++ b/packages/frontend/core/src/components/page-list/scoped-atoms.tsx
@@ -136,12 +136,12 @@ const defaultSortingFn: SorterConfig<MetaRecord<ListItem>>['sortingFn'] = (
  return 0;
 };

-const validKeys: Array<keyof MetaRecord<ListItem>> = [
+const validKeys: Set<keyof MetaRecord<ListItem>> = new Set([
  'id',
  'title',
  'createDate',
  'updatedDate',
-];
+]);

 const sorterStateAtom = atom<SorterConfig<MetaRecord<ListItem>>>({
  key: DEFAULT_SORT_KEY,
@@ -175,7 +175,7 @@ export const sorterAtom = atom(
  },
  (_get, set, { newSortKey }: { newSortKey: keyof MetaRecord<ListItem> }) => {
    set(sorterStateAtom, sorterState => {
-      if (validKeys.includes(newSortKey)) {
+      if (validKeys.has(newSortKey)) {
        return {
          ...sorterState,
          key: newSortKey,
--- a/packages/frontend/core/src/components/page-list/tags/virtualized-tag-list.tsx
+++ b/packages/frontend/core/src/components/page-list/tags/virtualized-tag-list.tsx
@@ -36,8 +36,8 @@ export const VirtualizedTagList = ({
  );

  const filteredSelectedTagIds = useMemo(() => {
-    const ids = tags.map(tag => tag.id);
-    return selectedTagIds.filter(id => ids.includes(id));
+    const ids = new Set(tags.map(tag => tag.id));
+    return selectedTagIds.filter(id => ids.has(id));
  }, [selectedTagIds, tags]);

  const hideFloatingToolbar = useCallback(() => {
--- a/packages/frontend/core/src/components/page-list/virtualized-trash-list.tsx
+++ b/packages/frontend/core/src/components/page-list/virtualized-trash-list.tsx
@@ -33,8 +33,8 @@ export const VirtualizedTrashList = () => {
  const pageHeaderColsDef = usePageHeaderColsDef();

  const filteredSelectedPageIds = useMemo(() => {
-    const ids = filteredPageMetas.map(page => page.id);
-    return selectedPageIds.filter(id => ids.includes(id));
+    const ids = new Set(filteredPageMetas.map(page => page.id));
+    return selectedPageIds.filter(id => ids.has(id));
  }, [filteredPageMetas, selectedPageIds]);

  const hideFloatingToolbar = useCallback(() => {
--- a/packages/frontend/core/src/components/tags/tag-edit-menu.tsx
+++ b/packages/frontend/core/src/components/tags/tag-edit-menu.tsx
@@ -87,12 +87,12 @@ const DesktopTagEditMenu = ({
          <MenuSeparator />
          <Scrollable.Root>
            <Scrollable.Viewport className={styles.menuItemList}>
-              {colors.map(({ name, value: color }, i) => (
+              {colors.map(({ name, value: color }) => (
                <MenuItem
-                  key={i}
+                  key={color}
                  checked={tag.color === color}
                  prefixIcon={
-                    <div key={i} className={styles.tagColorIconWrapper}>
+                    <div className={styles.tagColorIconWrapper}>
                      <div
                        className={styles.tagColorIcon}
                        style={{
@@ -173,14 +173,14 @@ const MobileTagEditMenu = ({
        />

        <ConfigModal.RowGroup title={t['Colors']()}>
-          {colors.map(({ name, value: color }, i) => (
+          {colors.map(({ name, value: color }) => (
            <ConfigModal.Row
-              key={i}
+              key={color}
              onClick={() => {
                setLocalTag({ ...localTag, color });
              }}
            >
-              <div key={i} className={styles.tagColorIconWrapper}>
+              <div className={styles.tagColorIconWrapper}>
                <div
                  className={styles.tagColorIcon}
                  style={{
--- a/packages/frontend/core/src/desktop/dialogs/doc-info/links-row.tsx
+++ b/packages/frontend/core/src/desktop/dialogs/doc-info/links-row.tsx
@@ -21,9 +21,9 @@ export const LinksRow = ({
      title={`${label} · ${references.length}`}
      className={className}
    >
-      {references.map((link, index) => (
+      {references.map(link => (
        <AffinePageReference
-          key={index}
+          key={link.docId}
          pageId={link.docId}
          params={'params' in link ? link.params : undefined}
          className={styles.wrapper}
--- a/packages/frontend/core/src/mobile/components/explorer/tree/node.tsx
+++ b/packages/frontend/core/src/mobile/components/explorer/tree/node.tsx
@@ -116,7 +116,7 @@ export const ExplorerTreeNode = ({
            }}
          >
            <MobileMenu
-              items={menuOperations.map(({ view }, index) => (
+              items={menuOperations.map(({ view, index }) => (
                <Fragment key={index}>{view}</Fragment>
              ))}
            >
--- a/packages/frontend/core/src/mobile/views/recent-docs/index.tsx
+++ b/packages/frontend/core/src/mobile/views/recent-docs/index.tsx
@@ -31,8 +31,8 @@ export const RecentDocs = ({ max = 5 }: { max?: number }) => {
    >
      <div className={styles.scroll} data-testid="recent-docs-list">
        <ul className={styles.list}>
-          {cardMetas.map((doc, index) => (
-            <li key={index} className={styles.cardWrapper}>
+          {cardMetas.map(doc => (
+            <li key={doc.id} className={styles.cardWrapper}>
              <DocCard meta={doc} />
            </li>
          ))}
--- a/packages/frontend/core/src/modules/app-sidebar/views/index.tsx
+++ b/packages/frontend/core/src/modules/app-sidebar/views/index.tsx
@@ -285,6 +285,7 @@ const RandomBars = ({ count, header }: { count: number; header?: boolean }) => {
        />
      ) : null}
      {Array.from({ length: count }).map((_, index) => (
+        // eslint-disable-next-line react/no-array-index-key
        <RandomBar key={index} />
      ))}
    </div>
--- a/packages/frontend/core/src/modules/app-tabs-header/views/app-tabs-header.tsx
+++ b/packages/frontend/core/src/modules/app-tabs-header/views/app-tabs-header.tsx
@@ -39,7 +39,7 @@ import {
 } from '../services/app-tabs-header-service';
 import * as styles from './styles.css';

-const TabSupportType = ['collection', 'tag', 'doc'];
+const TabSupportType = new Set(['collection', 'tag', 'doc']);

 const tabCanDrop =
  (tab?: TabStatus): NonNullable<DropTargetOptions<AffineDNDData>['canDrop']> =>
@@ -53,7 +53,7 @@ const tabCanDrop =

    if (
      ctx.source.data.entity?.type &&
-      TabSupportType.includes(ctx.source.data.entity?.type)
+      TabSupportType.has(ctx.source.data.entity?.type)
    ) {
      return true;
    }
--- a/packages/frontend/core/src/modules/explorer/views/tree/node.tsx
+++ b/packages/frontend/core/src/modules/explorer/views/tree/node.tsx
@@ -383,12 +383,12 @@ export const ExplorerTreeNode = ({
            e.preventDefault();
          }}
        >
-          {inlineOperations.map(({ view }, index) => (
+          {inlineOperations.map(({ view, index }) => (
            <Fragment key={index}>{view}</Fragment>
          ))}
          {menuOperations.length > 0 && (
            <Menu
-              items={menuOperations.map(({ view }, index) => (
+              items={menuOperations.map(({ view, index }) => (
                <Fragment key={index}>{view}</Fragment>
              ))}
            >
--- a/packages/frontend/core/src/modules/quicksearch/views/cmdk.tsx
+++ b/packages/frontend/core/src/modules/quicksearch/views/cmdk.tsx
@@ -314,9 +314,9 @@ const CMDKKeyBinding = ({ keyBinding }: { keyBinding: string }) => {

  return (
    <div className={styles.keybinding}>
-      {fragments.map((fragment, index) => {
+      {fragments.map(fragment => {
        return (
-          <div key={index} className={styles.keybindingFragment}>
+          <div key={fragment} className={styles.keybindingFragment}>
            {fragment}
          </div>
        );
--- a/packages/frontend/core/src/modules/quicksearch/views/highlight-text.tsx
+++ b/packages/frontend/core/src/modules/quicksearch/views/highlight-text.tsx
@@ -30,11 +30,11 @@ export const HighlightText = ({ text = '', end, start }: HighlightProps) => {

  return (
    <span className={styles.highlightText}>
-      {parts.map((part, i) =>
+      {parts.map(part =>
        typeof part === 'string' ? (
-          <Fragment key={i}>{part}</Fragment>
+          <Fragment key={part}>{part}</Fragment>
        ) : (
-          <span key={i} className={styles.highlightKeyword}>
+          <span key={part.h} className={styles.highlightKeyword}>
            {part.h}
          </span>
        )