chore: enable no-unused vars (#2181)

2026-02-12 12:28:42 +00:00 · 2023-04-28 00:41:06 -05:00
parent b6ca2aa063
commit 70fbbb39c1
70 changed files with 206 additions and 225 deletions
--- a/packages/component/src/components/app-sidebar/index.stories.tsx
+++ b/packages/component/src/components/app-sidebar/index.stories.tsx
@@ -14,7 +14,7 @@ export default {

 const Footer = () => <div>Add Page</div>;

-export const Default: StoryFn = props => {
+export const Default: StoryFn = () => {
  const [open, setOpen] = useAtom(appSidebarOpenAtom);
  const ref = useRef<HTMLElement>(null);
  return (
--- a/packages/component/src/components/contact-modal/style.ts
+++ b/packages/component/src/components/contact-modal/style.ts
@@ -1,6 +1,6 @@
 import { absoluteCenter, displayFlex, styled } from '@affine/component';

-export const StyledBigLink = styled('a')(({ theme }) => {
+export const StyledBigLink = styled('a')(() => {
  return {
    width: '268px',
    height: '76px',
@@ -57,7 +57,7 @@ export const StyledBigLink = styled('a')(({ theme }) => {
    },
  };
 });
-export const StyledSmallLink = styled('a')(({ theme }) => {
+export const StyledSmallLink = styled('a')(() => {
  return {
    width: '124px',
    height: '76px',
@@ -86,7 +86,7 @@ export const StyledSmallLink = styled('a')(({ theme }) => {
    },
  };
 });
-export const StyledSubTitle = styled('div')(({ theme }) => {
+export const StyledSubTitle = styled('div')(() => {
  return {
    fontSize: '18px',
    fontWeight: '600',
@@ -111,7 +111,7 @@ export const StyledModalHeader = styled('div')(() => {
  };
 });

-export const StyledModalFooter = styled('div')(({ theme }) => {
+export const StyledModalFooter = styled('div')(() => {
  return {
    fontSize: '14px',
    lineHeight: '20px',
@@ -121,7 +121,7 @@ export const StyledModalFooter = styled('div')(({ theme }) => {
  };
 });

-export const StyledPrivacyContainer = styled('div')(({ theme }) => {
+export const StyledPrivacyContainer = styled('div')(() => {
  return {
    marginTop: '4px',
    position: 'relative',
--- a/packages/component/src/components/share-menu/disable-public-link/style.ts
+++ b/packages/component/src/components/share-menu/disable-public-link/style.ts
@@ -1,6 +1,6 @@
 import { styled, TextButton } from '@affine/component';

-export const StyledModalWrapper = styled('div')(({ theme }) => {
+export const StyledModalWrapper = styled('div')(() => {
  return {
    position: 'relative',
    padding: '0px',
@@ -11,7 +11,7 @@ export const StyledModalWrapper = styled('div')(({ theme }) => {
  };
 });

-export const StyledModalHeader = styled('div')(({ theme }) => {
+export const StyledModalHeader = styled('div')(() => {
  return {
    margin: '44px 0px 12px 0px',
    width: '560px',
@@ -21,7 +21,7 @@ export const StyledModalHeader = styled('div')(({ theme }) => {
  };
 });

-export const StyledTextContent = styled('div')(({ theme }) => {
+export const StyledTextContent = styled('div')(() => {
  return {
    margin: 'auto',
    width: '560px',
@@ -40,7 +40,7 @@ export const StyledButtonContent = styled('div')(() => {
    justifyContent: 'center',
  };
 });
-export const StyledButton = styled(TextButton)(({ theme }) => {
+export const StyledButton = styled(TextButton)(() => {
  return {
    color: 'var(--affine-primary-color)',
    height: '32px',
@@ -50,7 +50,7 @@ export const StyledButton = styled(TextButton)(({ theme }) => {
    padding: '4px 20px',
  };
 });
-export const StyledDangerButton = styled(TextButton)(({ theme }) => {
+export const StyledDangerButton = styled(TextButton)(() => {
  return {
    color: '#FF631F',
    height: '32px',
--- a/packages/component/src/components/share-menu/styles.ts
+++ b/packages/component/src/components/share-menu/styles.ts
@@ -2,7 +2,7 @@ import { Button, displayFlex, styled, TextButton } from '../..';

 export const StyledShareButton = styled(TextButton, {
  shouldForwardProp: (prop: string) => prop !== 'isShared',
-})<{ isShared?: boolean }>(({ theme, isShared }) => {
+})<{ isShared?: boolean }>(({ isShared }) => {
  return {
    padding: '4px 8px',
    marginLeft: '4px',
@@ -30,55 +30,53 @@ export const StyledTabsWrapper = styled('div')(() => {
  };
 });

-export const TabItem = styled('li')<{ isActive?: boolean }>(
-  ({ theme, isActive }) => {
-    {
-      return {
-        ...displayFlex('center', 'center'),
-        flex: '1',
-        height: '30px',
-        color: 'var(--affine-text-primary-color)',
-        opacity: isActive ? 1 : 0.2,
-        fontWeight: '500',
-        fontSize: 'var(--affine-font-base)',
-        lineHeight: 'var(--affine-line-height)',
-        cursor: 'pointer',
-        transition: 'all 0.15s ease',
-        padding: '0 10px',
-        marginBottom: '4px',
-        borderRadius: '4px',
-        position: 'relative',
-        ':hover': {
-          background: 'var(--affine-hover-color)',
-          opacity: 1,
-          color: isActive
+export const TabItem = styled('li')<{ isActive?: boolean }>(({ isActive }) => {
+  {
+    return {
+      ...displayFlex('center', 'center'),
+      flex: '1',
+      height: '30px',
+      color: 'var(--affine-text-primary-color)',
+      opacity: isActive ? 1 : 0.2,
+      fontWeight: '500',
+      fontSize: 'var(--affine-font-base)',
+      lineHeight: 'var(--affine-line-height)',
+      cursor: 'pointer',
+      transition: 'all 0.15s ease',
+      padding: '0 10px',
+      marginBottom: '4px',
+      borderRadius: '4px',
+      position: 'relative',
+      ':hover': {
+        background: 'var(--affine-hover-color)',
+        opacity: 1,
+        color: isActive
+          ? 'var(--affine-text-primary-color)'
+          : 'var(--affine-text-secondary-color)',
+        svg: {
+          fill: isActive
            ? 'var(--affine-text-primary-color)'
            : 'var(--affine-text-secondary-color)',
-          svg: {
-            fill: isActive
-              ? 'var(--affine-text-primary-color)'
-              : 'var(--affine-text-secondary-color)',
-          },
        },
-        svg: {
-          fontSize: '20px',
-          marginRight: '12px',
-        },
-        ':after': {
-          content: '""',
-          position: 'absolute',
-          bottom: '-6px',
-          left: '0',
-          width: '100%',
-          height: '2px',
-          background: 'var(--affine-text-primary-color)',
-          opacity: 0.2,
-        },
-      };
-    }
+      },
+      svg: {
+        fontSize: '20px',
+        marginRight: '12px',
+      },
+      ':after': {
+        content: '""',
+        position: 'absolute',
+        bottom: '-6px',
+        left: '0',
+        width: '100%',
+        height: '2px',
+        background: 'var(--affine-text-primary-color)',
+        opacity: 0.2,
+      },
+    };
  }
-);
-export const StyledIndicator = styled('div')(({ theme }) => {
+});
+export const StyledIndicator = styled('div')(() => {
  return {
    height: '2px',
    background: 'var(--affine-text-primary-color)',
@@ -87,7 +85,7 @@ export const StyledIndicator = styled('div')(({ theme }) => {
    transition: 'left .3s, width .3s',
  };
 });
-export const StyledInput = styled('input')(({ theme }) => {
+export const StyledInput = styled('input')(() => {
  return {
    padding: '4px 8px',
    height: '28px',
@@ -101,7 +99,7 @@ export const StyledInput = styled('input')(({ theme }) => {
    marginRight: '10px',
  };
 });
-export const StyledButton = styled(TextButton)(({ theme }) => {
+export const StyledButton = styled(TextButton)(() => {
  return {
    color: 'var(--affine-primary-color)',
    height: '32px',
@@ -121,7 +119,7 @@ export const StyledDisableButton = styled(Button)(() => {
    padding: '0',
  };
 });
-export const StyledLinkSpan = styled('span')(({ theme }) => {
+export const StyledLinkSpan = styled('span')(() => {
  return {
    marginLeft: '4px',
    color: 'var(--affine-primary-color)',
--- a/packages/component/src/components/workspace-card/index.tsx
+++ b/packages/component/src/components/workspace-card/index.tsx
@@ -4,7 +4,7 @@ import type { AffineWorkspace, LocalWorkspace } from '@affine/workspace/type';
 import { WorkspaceFlavour } from '@affine/workspace/type';
 import { SettingsIcon } from '@blocksuite/icons';
 import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
-import type { FC, MouseEvent } from 'react';
+import type { FC } from 'react';
 import { useCallback } from 'react';

 import { WorkspaceAvatar } from '../workspace-avatar';
@@ -95,12 +95,9 @@ export const WorkspaceCard: FC<WorkspaceCardProps> = ({
  return (
    <StyledCard
      data-testid="workspace-card"
-      onClick={useCallback(
-        (event: MouseEvent) => {
-          onClick(workspace);
-        },
-        [onClick, workspace]
-      )}
+      onClick={useCallback(() => {
+        onClick(workspace);
+      }, [onClick, workspace])}
      active={workspace.id === currentWorkspaceId}
    >
      <WorkspaceAvatar size={58} workspace={workspace} />
--- a/packages/component/src/components/workspace-card/styles.ts
+++ b/packages/component/src/components/workspace-card/styles.ts
@@ -1,7 +1,7 @@
 import { displayFlex, styled, textEllipsis } from '../..';
 import { IconButton } from '../..';

-export const StyleWorkspaceInfo = styled('div')(({ theme }) => {
+export const StyleWorkspaceInfo = styled('div')(() => {
  return {
    marginLeft: '15px',
    width: '202px',
@@ -22,7 +22,7 @@ export const StyleWorkspaceInfo = styled('div')(({ theme }) => {
  };
 });

-export const StyleWorkspaceTitle = styled('div')(({ theme }) => {
+export const StyleWorkspaceTitle = styled('div')(() => {
  return {
    fontSize: 'var(--affine-font-base)',
    fontWeight: 600,
@@ -35,7 +35,7 @@ export const StyleWorkspaceTitle = styled('div')(({ theme }) => {

 export const StyledCard = styled('div')<{
  active?: boolean;
-}>(({ theme, active }) => {
+}>(({ active }) => {
  const borderColor = active ? 'var(--affine-primary-color)' : 'transparent';
  return {
    width: '310px',
--- a/packages/component/src/ui/breadcrumbs/index.ts
+++ b/packages/component/src/ui/breadcrumbs/index.ts
@@ -2,7 +2,7 @@ import MuiBreadcrumbs from '@mui/material/Breadcrumbs';

 import { styled } from '../../styles';

-export const Breadcrumbs = styled(MuiBreadcrumbs)(({ theme }) => {
+export const Breadcrumbs = styled(MuiBreadcrumbs)(() => {
  return {
    color: 'var(--affine-text-primary-color)',
  };
--- a/packages/component/src/ui/button/styles.ts
+++ b/packages/component/src/ui/button/styles.ts
@@ -104,7 +104,6 @@ export const StyledTextButton = styled('button', {
  >
 >(
  ({
-    theme,
    size = 'default',
    disabled,
    hoverBackground,
--- a/packages/component/src/ui/confirm/styles.ts
+++ b/packages/component/src/ui/confirm/styles.ts
@@ -11,7 +11,7 @@ export const StyledModalWrapper = styled(ModalWrapper)(() => {
  };
 });

-export const StyledConfirmTitle = styled('div')(({ theme }) => {
+export const StyledConfirmTitle = styled('div')(() => {
  return {
    fontSize: 'var(--affine-font-h6)',
    fontWeight: 600,
@@ -20,7 +20,7 @@ export const StyledConfirmTitle = styled('div')(({ theme }) => {
  };
 });

-export const StyledConfirmContent = styled('div')(({ theme }) => {
+export const StyledConfirmContent = styled('div')(() => {
  return {
    fontSize: 'var(--affine-font-base)',
    textAlign: 'center',
--- a/packages/component/src/ui/divider/index.ts
+++ b/packages/component/src/ui/divider/index.ts
@@ -2,7 +2,7 @@ import MuiDivider from '@mui/material/Divider';

 import { styled } from '../../styles';

-export const Divider = styled(MuiDivider)(({ theme }) => {
+export const Divider = styled(MuiDivider)(() => {
  return {
    borderColor: 'var(--affine-border-color)',
  };
--- a/packages/component/src/ui/empty/EmptySVG.tsx
+++ b/packages/component/src/ui/empty/EmptySVG.tsx
@@ -1,7 +1,7 @@
 import type { SvgIconProps } from '@mui/material/SvgIcon';
 import SvgIcon from '@mui/material/SvgIcon';

-export const EmptySVG = (props: SvgIconProps) => {
+export const EmptySVG = (_props: SvgIconProps) => {
  return (
    <SvgIcon
      width="200"
--- a/packages/component/src/ui/input/style.ts
+++ b/packages/component/src/ui/input/style.ts
@@ -8,7 +8,7 @@ export const StyledInput = styled('input')<{
  width?: CSSProperties['width'];
  height?: CSSProperties['height'];
  noBorder?: boolean;
-}>(({ theme, width, disabled, height, noBorder }) => {
+}>(({ width, disabled, height, noBorder }) => {
  return {
    width: width || '100%',
    height,
--- a/packages/component/src/ui/layout/Content.tsx
+++ b/packages/component/src/ui/layout/Content.tsx
@@ -31,7 +31,6 @@ export const Content = styled('div', {
  },
 })<ContentProps>(
  ({
-    theme,
    color,
    fontSize,
    weight,
--- a/packages/component/src/ui/menu/MenuItem.tsx
+++ b/packages/component/src/ui/menu/MenuItem.tsx
@@ -17,7 +17,7 @@ export type IconMenuProps = PropsWithChildren<{
  HTMLAttributes<HTMLButtonElement>;

 export const MenuItem = forwardRef<HTMLButtonElement, IconMenuProps>(
-  ({ endIcon, icon, iconSize, children, ...props }, ref) => {
+  ({ endIcon, icon, children, ...props }, ref) => {
    return (
      <StyledMenuItem ref={ref} {...props}>
        {icon && <StyledStartIconWrapper>{icon}</StyledStartIconWrapper>}
--- a/packages/component/src/ui/menu/PureMenu.tsx
+++ b/packages/component/src/ui/menu/PureMenu.tsx
@@ -12,7 +12,6 @@ export const PureMenu = ({
  children,
  placement,
  width,
-  height,
  ...otherProps
 }: PureMenuProps) => {
  return (
--- a/packages/component/src/ui/menu/styles.ts
+++ b/packages/component/src/ui/menu/styles.ts
@@ -6,7 +6,7 @@ import StyledPopperContainer from '../shared/Container';
 export const StyledMenuWrapper = styled(StyledPopperContainer)<{
  width?: CSSProperties['width'];
  height?: CSSProperties['height'];
-}>(({ theme, width, height }) => {
+}>(({ width, height }) => {
  return {
    width,
    height,
@@ -18,14 +18,14 @@ export const StyledMenuWrapper = styled(StyledPopperContainer)<{
  };
 });

-export const StyledStartIconWrapper = styled('div')(({ theme }) => {
+export const StyledStartIconWrapper = styled('div')(() => {
  return {
    marginRight: '12px',
    fontSize: '20px',
    color: 'var(--affine-icon-color)',
  };
 });
-export const StyledEndIconWrapper = styled('div')(({ theme }) => {
+export const StyledEndIconWrapper = styled('div')(() => {
  return {
    marginLeft: '12px',
    fontSize: '20px',
@@ -33,7 +33,7 @@ export const StyledEndIconWrapper = styled('div')(({ theme }) => {
  };
 });

-export const StyledContent = styled('div')(({ theme }) => {
+export const StyledContent = styled('div')(() => {
  return {
    textAlign: 'left',
    flexGrow: 1,
@@ -45,7 +45,7 @@ export const StyledContent = styled('div')(({ theme }) => {
 export const StyledMenuItem = styled('button')<{
  isDir?: boolean;
  disabled?: boolean;
-}>(({ theme, isDir = false, disabled = false }) => {
+}>(({ isDir = false, disabled = false }) => {
  return {
    width: '100%',
    borderRadius: '5px',
--- a/packages/component/src/ui/modal/ModalWrapper.tsx
+++ b/packages/component/src/ui/modal/ModalWrapper.tsx
@@ -6,7 +6,7 @@ export const ModalWrapper = styled('div')<{
  width?: CSSProperties['width'];
  height?: CSSProperties['height'];
  minHeight?: CSSProperties['minHeight'];
-}>(({ theme, width, height, minHeight }) => {
+}>(({ width, height, minHeight }) => {
  return {
    width,
    height,
--- a/packages/component/src/ui/modal/styles.ts
+++ b/packages/component/src/ui/modal/styles.ts
@@ -4,7 +4,7 @@ import type { CSSProperties } from 'react';
 import { styled } from '../../styles';
 import { Wrapper } from '../layout';

-export const StyledBackdrop = styled('div')(({ theme }) => {
+export const StyledBackdrop = styled('div')(() => {
  return {
    zIndex: '-1',
    position: 'fixed',
@@ -23,7 +23,7 @@ export const StyledModal = styled(ModalUnstyled, {
 })<{
  alignItems: CSSProperties['alignItems'];
  justifyContent: CSSProperties['justifyContent'];
-}>(({ theme, alignItems, justifyContent }) => {
+}>(({ alignItems, justifyContent }) => {
  return {
    width: '100vw',
    height: '100vh',
--- a/packages/component/src/ui/popper/PopoverArrow.tsx
+++ b/packages/component/src/ui/popper/PopoverArrow.tsx
@@ -73,7 +73,7 @@ const getArrowStyle = (

 const StyledArrow = styled('span')<{
  placement?: PopperArrowProps['placement'];
-}>(({ placement, theme }) => {
+}>(({ placement }) => {
  return {
    position: 'absolute',
    fontSize: '7px',
--- a/packages/component/src/ui/popper/Popper.tsx
+++ b/packages/component/src/ui/popper/Popper.tsx
@@ -189,7 +189,7 @@ export const BasicStyledPopper = styled(PopperUnstyled, {
    !['zIndex'].some(name => name === propName),
 })<{
  zIndex?: CSSProperties['zIndex'];
-}>(({ zIndex, theme }) => {
+}>(({ zIndex }) => {
  return {
    zIndex: zIndex ?? 'var(--affine-z-index-popover)',
  };
--- a/packages/component/src/ui/shared/Container.tsx
+++ b/packages/component/src/ui/shared/Container.tsx
@@ -43,7 +43,7 @@ export const placementToContainerDirection: Record<

 export const StyledPopperContainer = styled('div')<{
  placement?: PopperPlacementType;
-}>(({ theme, placement = 'top' }) => {
+}>(({ placement = 'top' }) => {
  const direction = placementToContainerDirection[placement];
  const borderRadius = getBorderRadius(
    direction,
--- a/packages/component/src/ui/switch/Switch.tsx
+++ b/packages/component/src/ui/switch/Switch.tsx
@@ -2,7 +2,7 @@
 import { styled } from '@affine/component';
 import { useState } from 'react';

-const StyledLabel = styled('label')(({ theme }) => {
+const StyledLabel = styled('label')(() => {
  return {
    display: 'flex',
    alignItems: 'center',
@@ -10,7 +10,7 @@ const StyledLabel = styled('label')(({ theme }) => {
    cursor: 'pointer',
  };
 });
-const StyledInput = styled('input')(({ theme }) => {
+const StyledInput = styled('input')(() => {
  return {
    opacity: 0,
    position: 'absolute',
--- a/packages/component/src/ui/table/styles.ts
+++ b/packages/component/src/ui/table/styles.ts
@@ -2,7 +2,7 @@ import { styled, textEllipsis } from '../../styles';
 import type { TableCellProps } from './interface';

 export const StyledTable = styled('table')<{ tableLayout: 'auto' | 'fixed' }>(
-  ({ theme, tableLayout }) => {
+  ({ tableLayout }) => {
    return {
      fontSize: 'var(--affine-font-base)',
      color: 'var(--affine-text-primary-color)',
@@ -53,7 +53,7 @@ export const StyledTableHead = styled('thead')(() => {
  };
 });

-export const StyledTableRow = styled('tr')(({ theme }) => {
+export const StyledTableRow = styled('tr')(() => {
  return {
    td: {
      transition: 'background .15s',
--- a/packages/component/src/ui/tooltip/Tooltip.tsx
+++ b/packages/component/src/ui/tooltip/Tooltip.tsx
@@ -3,7 +3,7 @@ import type { TooltipProps } from '@mui/material';
 import { styled } from '../../styles';
 import { Popper, type PopperProps } from '../popper';
 import StyledPopperContainer from '../shared/Container';
-const StyledTooltip = styled(StyledPopperContainer)(({ theme }) => {
+const StyledTooltip = styled(StyledPopperContainer)(() => {
  return {
    maxWidth: '320px',
    boxShadow: 'var(--affine-float-button-shadow)',
--- a/packages/component/src/ui/tree-view/TreeView.tsx
+++ b/packages/component/src/ui/tree-view/TreeView.tsx
@@ -19,7 +19,6 @@ export const TreeView = <RenderProps,>({
  enableKeyboardSelection,
  onSelect,
  enableDnd = true,
-  initialCollapsedIds = [],
  disableCollapse,
  onDrop,
  ...otherProps
--- a/packages/component/src/ui/tree-view/hooks/useCollapsed.ts
+++ b/packages/component/src/ui/tree-view/hooks/useCollapsed.ts
@@ -1,7 +1,7 @@
 import { useState } from 'react';

 import type { TreeNodeProps } from '../types';
-export const useCollapsed = <RenderProps>({
+export const useCollapsed = ({
  initialCollapsedIds = [],
  disableCollapse = false,
 }: {
--- a/packages/component/src/ui/tree-view/types.ts
+++ b/packages/component/src/ui/tree-view/types.ts
@@ -31,7 +31,7 @@ export type Node<RenderProps = unknown> = {
  renderBottomLine?: boolean;
 };

-type CommonProps<RenderProps = unknown> = {
+type CommonProps = {
  enableDnd?: boolean;
  enableKeyboardSelection?: boolean;
  indent?: CSSProperties['paddingLeft'];
@@ -51,7 +51,7 @@ export type TreeNodeProps<RenderProps = unknown> = {
  allowDrop?: boolean;
  selectedId?: string;
  draggingId?: string;
-} & CommonProps<RenderProps>;
+} & CommonProps;

 export type TreeNodeItemProps<RenderProps = unknown> = {
  collapsed: boolean;
@@ -64,7 +64,7 @@ export type TreeViewProps<RenderProps = unknown> = {
  data: Node<RenderProps>[];
  initialCollapsedIds?: string[];
  disableCollapse?: boolean;
-} & CommonProps<RenderProps>;
+} & CommonProps;

 export type NodeLIneProps<RenderProps = unknown> = {
  allowDrop: boolean;