chore: enable no-unused vars (#2181)

.eslintrc.js

@@ -45,7 +45,14 @@ const config = {
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-empty-function': 'off',
-    '@typescript-eslint/no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      {
+        varsIgnorePattern: '^_',
+        argsIgnorePattern: '^_',
+        caughtErrorsIgnorePattern: '^_',
+      },
+    ],
     'unused-imports/no-unused-imports': 'error',
     'simple-import-sort/imports': 'error',
     'simple-import-sort/exports': 'error',

apps/electron/layers/main/src/__tests__/handlers.spec.ts

@@ -20,11 +20,11 @@ const browserWindow = {
   isDestroyed: () => {
     return false;
   },
-  setWindowButtonVisibility: (v: boolean) => {
+  setWindowButtonVisibility: (_v: boolean) => {
     // will be stubbed later
   },
   webContents: {
-    send: (type: string, ...args: any[]) => {
+    send: (_type: string, ..._args: any[]) => {
       // ...
     },
   },

apps/electron/layers/main/src/index.ts

@@ -28,11 +28,11 @@ if (!isSingleInstance) {
   process.exit(0);
 }
 
-app.on('second-instance', (event, argv) => {
+app.on('second-instance', () => {
   restoreOrCreateWindow();
 });
 
-app.on('open-url', async (_, url) => {
+app.on('open-url', async (_, _url) => {
   // todo: handle `affine://...` urls
 });
 

apps/server/src/tests/auth.spec.ts

@@ -5,7 +5,7 @@ import { UnauthorizedException } from '@nestjs/common';
 import { Test } from '@nestjs/testing';
 import { PrismaClient } from '@prisma/client';
 
-import { Config, ConfigModule } from '../config';
+import { ConfigModule } from '../config';
 import { getDefaultAFFiNEConfig } from '../config/default';
 import { GqlModule } from '../graphql.module';
 import { AuthModule } from '../modules/auth';
@@ -15,7 +15,6 @@ import { PrismaModule } from '../prisma';
 globalThis.AFFiNE = getDefaultAFFiNEConfig();
 
 let auth: AuthService;
-let config: Config;
 
 // cleanup database before each test
 beforeEach(async () => {
@@ -38,7 +37,6 @@ beforeEach(async () => {
       AuthModule,
     ],
   }).compile();
-  config = module.get(Config);
   auth = module.get(AuthService);
 });
 

apps/server/src/tests/config.spec.ts

@@ -16,12 +16,12 @@ beforeEach(async () => {
   config = module.get(Config);
 });
 
-test('should be able to get config', t => {
+test('should be able to get config', () => {
   ok(typeof config.host === 'string');
   equal(config.env, 'test');
 });
 
-test('should be able to override config', async t => {
+test('should be able to override config', async () => {
   const module = await Test.createTestingModule({
     imports: [
       ConfigModule.forRoot({

apps/web/src/components/affine/tmp-disable-affine-cloud-modal/style.ts

@@ -13,7 +13,7 @@ export const Content = styled('div')({
   padding: '0 40px',
 });
 
-export const ContentTitle = styled('h1')(({ theme }) => {
+export const ContentTitle = styled('h1')(() => {
   return {
     fontSize: 'var(--affine-font-h6)',
     lineHeight: '28px',
@@ -21,7 +21,7 @@ export const ContentTitle = styled('h1')(({ theme }) => {
   };
 });
 
-export const StyleTips = styled('div')(({ theme }) => {
+export const StyleTips = styled('div')(() => {
   return {
     userSelect: 'none',
     margin: '20px 0',
@@ -31,7 +31,7 @@ export const StyleTips = styled('div')(({ theme }) => {
   };
 });
 
-export const StyleButton = styled(Button)(({ theme }) => {
+export const StyleButton = styled(Button)(() => {
   return {
     textAlign: 'center',
     margin: '20px 0',

apps/web/src/components/affine/workspace-setting-detail/panel/collaboration/invite-member-modal/index.tsx

@@ -150,7 +150,7 @@ const InviteBox = styled('div')({
   position: 'relative',
 });
 
-const Members = styled('div')(({ theme }) => {
+const Members = styled('div')(() => {
   return {
     position: 'absolute',
     width: '100%',
@@ -178,7 +178,7 @@ const Members = styled('div')(({ theme }) => {
 //   };
 // });
 
-const Member = styled('div')(({ theme }) => {
+const Member = styled('div')(() => {
   return {
     color: 'var(--affine-icon-color)',
     fontSize: 'var(--affine-font-sm)',
@@ -188,7 +188,7 @@ const Member = styled('div')(({ theme }) => {
   };
 });
 
-const MemberIcon = styled('div')(({ theme }) => {
+const MemberIcon = styled('div')(() => {
   return {
     width: '40px',
     height: '40px',

apps/web/src/components/affine/workspace-setting-detail/panel/collaboration/style.ts

@@ -61,7 +61,7 @@ export const StyledMemberInfo = styled('div')(() => {
   };
 });
 
-export const StyledMemberName = styled('div')(({ theme }) => {
+export const StyledMemberName = styled('div')(() => {
   return {
     fontWeight: '400',
     fontSize: '18px',
@@ -70,7 +70,7 @@ export const StyledMemberName = styled('div')(({ theme }) => {
   };
 });
 
-export const StyledMemberEmail = styled('div')(({ theme }) => {
+export const StyledMemberEmail = styled('div')(() => {
   return {
     fontWeight: '400',
     fontSize: '16px',

apps/web/src/components/affine/workspace-setting-detail/panel/general/delete/style.ts

@@ -1,6 +1,6 @@
 import { styled } from '@affine/component';
 
-export const StyledModalWrapper = styled('div')(({ theme }) => {
+export const StyledModalWrapper = styled('div')(() => {
   return {
     position: 'relative',
     padding: '0px',
@@ -36,7 +36,7 @@ export const StyledTextContent = styled('div')(() => {
   };
 });
 
-export const StyledInputContent = styled('div')(({ theme }) => {
+export const StyledInputContent = styled('div')(() => {
   return {
     display: 'flex',
     flexDirection: 'row',

apps/web/src/components/affine/workspace-setting-detail/panel/general/leave/style.ts

@@ -1,6 +1,6 @@
 import { styled } from '@affine/component';
 
-export const StyledModalWrapper = styled('div')(({ theme }) => {
+export const StyledModalWrapper = styled('div')(() => {
   return {
     position: 'relative',
     padding: '0px',

apps/web/src/components/affine/workspace-setting-detail/panel/general/style.ts

@@ -1,7 +1,7 @@
 import { displayFlex, styled } from '@affine/component';
 import { Input } from '@affine/component';
 
-export const StyledInput = styled(Input)(({ theme }) => {
+export const StyledInput = styled(Input)(() => {
   return {
     border: '1px solid var(--affine-border-color)',
     borderRadius: '10px',
@@ -9,7 +9,7 @@ export const StyledInput = styled(Input)(({ theme }) => {
   };
 });
 
-export const StyledWorkspaceInfo = styled('div')(({ theme }) => {
+export const StyledWorkspaceInfo = styled('div')(() => {
   return {
     ...displayFlex('flex-start', 'center'),
     fontSize: '20px',
@@ -48,7 +48,7 @@ export const StyledAvatar = styled('div')(
   }
 );
 
-export const StyledEditButton = styled('div')(({ theme }) => {
+export const StyledEditButton = styled('div')(() => {
   return {
     color: 'var(--affine-primary-color)',
     cursor: 'pointer',

apps/web/src/components/affine/workspace-setting-detail/panel/sync/index.tsx

@@ -9,7 +9,7 @@ import { useCurrentUser } from '../../../../../hooks/current/use-current-user';
 import { WorkspaceAvatar } from '../../../../pure/footer';
 import type { PanelProps } from '../../index';
 
-export const StyledWorkspaceName = styled('span')(({ theme }) => {
+export const StyledWorkspaceName = styled('span')(() => {
   return {
     fontWeight: '400',
     fontSize: 'var(--affine-font-h6)',

apps/web/src/components/affine/workspace-setting-detail/style.ts

@@ -26,7 +26,7 @@ export const StyledSettingContent = styled('div')(() => {
 });
 
 export const WorkspaceSettingTagItem = styled('li')<{ isActive?: boolean }>(
-  ({ theme, isActive }) => {
+  ({ isActive }) => {
     {
       return {
         display: 'flex',
@@ -45,7 +45,7 @@ export const WorkspaceSettingTagItem = styled('li')<{ isActive?: boolean }>(
   }
 );
 
-export const StyledSettingKey = styled('div')(({ theme }) => {
+export const StyledSettingKey = styled('div')(() => {
   return {
     width: '140px',
     fontSize: 'var(--affine-font-base)',
@@ -60,14 +60,14 @@ export const StyledRow = styled(FlexWrapper)(() => {
   };
 });
 
-export const StyledWorkspaceName = styled('span')(({ theme }) => {
+export const StyledWorkspaceName = styled('span')(() => {
   return {
     fontWeight: '400',
     fontSize: 'var(--affine-font-h6)',
   };
 });
 
-export const StyledIndicator = styled('div')(({ theme }) => {
+export const StyledIndicator = styled('div')(() => {
   return {
     height: '2px',
     background: 'var(--affine-primary-color)',

apps/web/src/components/blocksuite/block-suite-page-list/page-list/OperationCell.tsx

@@ -38,7 +38,6 @@ export type OperationCellProps = {
 
 export const OperationCell: React.FC<OperationCellProps> = ({
   pageMeta,
-  metas,
   blockSuiteWorkspace,
   onOpenPageInNewTab,
   onToggleFavoritePage,

apps/web/src/components/blocksuite/block-suite-page-list/page-list/styles.ts

@@ -12,7 +12,7 @@ export const StyledTableContainer = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledTitleWrapper = styled('div')(({ theme }) => {
+export const StyledTitleWrapper = styled('div')(() => {
   return {
     ...displayFlex('flex-start', 'center'),
     a: {
@@ -26,7 +26,7 @@ export const StyledTitleWrapper = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledTitleLink = styled('div')(({ theme }) => {
+export const StyledTitleLink = styled('div')(() => {
   return {
     maxWidth: '80%',
     marginRight: '18px',

apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/style.ts

@@ -3,7 +3,7 @@ import { displayFlex, styled } from '@affine/component';
 export const StyledEditorModeSwitch = styled('div')<{
   switchLeft: boolean;
   showAlone?: boolean;
-}>(({ theme, switchLeft, showAlone }) => {
+}>(({ switchLeft, showAlone }) => {
   return {
     width: showAlone ? '40px' : '78px',
     height: '32px',

apps/web/src/components/blocksuite/workspace-header/header-right-items/EditPage.tsx

@@ -26,7 +26,7 @@ export default EditPage;
 const StyledEditPageButton = styled(
   TextButton,
   {}
-)(({ theme }) => {
+)(() => {
   return {
     border: '1px solid var(--affine-primary-color)',
     color: 'var(--affine-primary-color)',

apps/web/src/components/blocksuite/workspace-header/header-right-items/ShareMenu.tsx

@@ -76,12 +76,12 @@ const LocalHeaderShareMenu: React.FC<BaseHeaderProps> = props => {
           },
           [helper]
         )}
-        togglePagePublic={useCallback(async (page, isPublic) => {
+        togglePagePublic={useCallback(async () => {
           // local workspace should not have public page
           throw new Error('unreachable');
         }, [])}
         toggleWorkspacePublish={useCallback(
-          async (workspace, publish) => {
+          async workspace => {
             assertEquals(workspace.flavour, WorkspaceFlavour.LOCAL);
             assertEquals(workspace.id, props.workspace.id);
             await helper.jumpToSubPath(workspace.id, WorkspaceSubPath.SETTING);

apps/web/src/components/blocksuite/workspace-header/header-right-items/SyncUser.tsx

@@ -23,7 +23,7 @@ import { affineAuth } from '../../../../plugins/affine';
 import type { AffineOfficialWorkspace } from '../../../../shared';
 import { TransformWorkspaceToAffineModal } from '../../../affine/transform-workspace-to-affine-modal';
 
-const IconWrapper = styled('div')(({ theme }) => {
+const IconWrapper = styled('div')(() => {
   return {
     width: '32px',
     height: '32px',

apps/web/src/components/blocksuite/workspace-header/header-right-items/theme-mode-switch/style.ts

@@ -4,7 +4,7 @@ import spring, { toString } from 'css-spring';
 
 const ANIMATE_DURATION = 400;
 
-export const StyledThemeModeSwitch = styled('button')(({ theme }) => {
+export const StyledThemeModeSwitch = styled('button')(() => {
   return {
     width: '32px',
     height: '32px',
@@ -20,7 +20,7 @@ export const StyledThemeModeSwitch = styled('button')(({ theme }) => {
 export const StyledSwitchItem = styled('div')<{
   active: boolean;
   isHover: boolean;
-}>(({ active, isHover, theme }) => {
+}>(({ active, isHover }) => {
   const activeRaiseAnimate = toString(
     spring({ top: '0' }, { top: '-100%' }, { preset: 'gentle' })
   );

apps/web/src/components/blocksuite/workspace-header/header.tsx

@@ -106,19 +106,19 @@ const HeaderRightItems: Record<HeaderRightItemName, HeaderItem> = {
   },
   [HeaderRightItemName.ShareMenu]: {
     Component: HeaderShareMenu,
-    availableWhen: (workspace, currentPage, { isPublic, isPreview }) => {
+    availableWhen: (workspace, currentPage) => {
       return workspace.flavour !== WorkspaceFlavour.PUBLIC && !!currentPage;
     },
   },
   [HeaderRightItemName.EditPage]: {
     Component: EditPage,
-    availableWhen: (workspace, currentPage, { isPublic, isPreview }) => {
+    availableWhen: (workspace, currentPage, { isPublic }) => {
       return isPublic;
     },
   },
   [HeaderRightItemName.UserAvatar]: {
     Component: UserAvatar,
-    availableWhen: (workspace, currentPage, { isPublic, isPreview }) => {
+    availableWhen: (workspace, currentPage, { isPublic }) => {
       return isPublic;
     },
   },

apps/web/src/components/blocksuite/workspace-header/styles.ts

@@ -23,22 +23,20 @@ export const StyledHeaderContainer = styled('div')<{
     },
   };
 });
-export const StyledHeader = styled('div')<{ hasWarning: boolean }>(
+export const StyledHeader = styled('div')<{ hasWarning: boolean }>(() => {
-  ({ theme }) => {
+  return {
-    return {
+    flexShrink: 0,
-      flexShrink: 0,
+    height: '52px',
-      height: '52px',
+    width: '100%',
-      width: '100%',
+    padding: '0 20px',
-      padding: '0 20px',
+    ...displayFlex('space-between', 'center'),
-      ...displayFlex('space-between', 'center'),
+    background: 'var(--affine-background-primary-color)',
-      background: 'var(--affine-background-primary-color)',
+    zIndex: 99,
-      zIndex: 99,
+    position: 'relative',
-      position: 'relative',
+  };
-    };
+});
-  }
-);
 
-export const StyledTitleContainer = styled('div')(({ theme }) => ({
+export const StyledTitleContainer = styled('div')(() => ({
   width: '100%',
   height: '100%',
 
@@ -82,7 +80,7 @@ export const StyledHeaderRightSide = styled('div')({
 });
 
 export const StyledBrowserWarning = styled('div')<{ show: boolean }>(
-  ({ theme, show }) => {
+  ({ show }) => {
     return {
       backgroundColor: 'var(--affine-background-warning-color)',
       color: 'var(--affine-background-warning-color)',
@@ -95,7 +93,7 @@ export const StyledBrowserWarning = styled('div')<{ show: boolean }>(
   }
 );
 
-export const StyledCloseButton = styled('div')(({ theme }) => {
+export const StyledCloseButton = styled('div')(() => {
   return {
     width: '36px',
     height: '36px',
@@ -137,7 +135,7 @@ export const StyledSearchArrowWrapper = styled('div')(() => {
   };
 });
 
-export const StyledPageListTittleWrapper = styled(StyledTitle)(({ theme }) => {
+export const StyledPageListTittleWrapper = styled(StyledTitle)(() => {
   return {
     fontSize: 'var(--affine-font-base)',
     color: 'var(--affine-text-primary-color)',
@@ -148,7 +146,7 @@ export const StyledPageListTittleWrapper = styled(StyledTitle)(({ theme }) => {
     },
   };
 });
-export const StyledQuickSearchTipButton = styled('div')(({ theme }) => {
+export const StyledQuickSearchTipButton = styled('div')(() => {
   return {
     ...displayFlex('center', 'center'),
     marginTop: '12px',

apps/web/src/components/pure/footer/styles.ts

@@ -6,7 +6,7 @@ import {
 } from '@affine/component';
 import { Button } from '@affine/component';
 
-export const StyledSplitLine = styled('div')(({ theme }) => {
+export const StyledSplitLine = styled('div')(() => {
   return {
     width: '1px',
     height: '20px',
@@ -15,7 +15,7 @@ export const StyledSplitLine = styled('div')(({ theme }) => {
   };
 });
 
-export const StyleWorkspaceInfo = styled('div')(({ theme }) => {
+export const StyleWorkspaceInfo = styled('div')(() => {
   return {
     marginLeft: '15px',
     width: '202px',
@@ -36,7 +36,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,
@@ -54,7 +54,7 @@ export const StyledFooter = styled('div')({
   ...displayFlex('space-between', 'center'),
 });
 
-export const StyleUserInfo = styled('div')(({ theme }) => {
+export const StyleUserInfo = styled('div')(() => {
   return {
     textAlign: 'left',
     marginLeft: '16px',
@@ -73,14 +73,14 @@ export const StyleUserInfo = styled('div')(({ theme }) => {
 export const StyledModalHeaderLeft = styled('div')(() => {
   return { ...displayFlex('flex-start', 'center') };
 });
-export const StyledModalTitle = styled('div')(({ theme }) => {
+export const StyledModalTitle = styled('div')(() => {
   return {
     fontWeight: 600,
     fontSize: 'var(--affine-font-h6)',
   };
 });
 
-export const StyledHelperContainer = styled('div')(({ theme }) => {
+export const StyledHelperContainer = styled('div')(() => {
   return {
     color: 'var(--affine-icon-color)',
     marginLeft: '15px',
@@ -128,7 +128,7 @@ export const StyledModalHeader = styled('div')(() => {
   };
 });
 
-export const StyledSignInButton = styled(Button)(({ theme }) => {
+export const StyledSignInButton = styled(Button)(() => {
   return {
     fontWeight: 600,
     paddingLeft: 0,

apps/web/src/components/pure/help-island/style.ts

@@ -2,7 +2,7 @@ import { displayFlex, positionAbsolute, styled } from '@affine/component';
 
 export const StyledIsland = styled('div')<{
   spread: boolean;
-}>(({ theme, spread }) => {
+}>(({ spread }) => {
   return {
     transition: 'box-shadow 0.2s',
     width: '44px',
@@ -31,7 +31,7 @@ export const StyledIsland = styled('div')<{
     },
   };
 });
-export const StyledIconWrapper = styled('div')(({ theme }) => {
+export const StyledIconWrapper = styled('div')(() => {
   return {
     color: 'var(--affine-icon-color)',
     ...displayFlex('center', 'center'),
@@ -57,7 +57,7 @@ export const StyledAnimateWrapper = styled('div')(() => ({
 
 export const StyledTriggerWrapper = styled('div')<{
   spread?: boolean;
-}>(({ theme, spread }) => {
+}>(({ spread }) => {
   return {
     width: '36px',
     height: '36px',

apps/web/src/components/pure/quick-search-button/index.tsx

@@ -3,7 +3,7 @@ import { IconButton } from '@affine/component';
 import { styled } from '@affine/component';
 import { ArrowDownSmallIcon } from '@blocksuite/icons';
 
-const StyledIconButtonWithAnimate = styled(IconButton)(({ theme }) => {
+const StyledIconButtonWithAnimate = styled(IconButton)(() => {
   return {
     svg: {
       transition: 'transform 0.15s ease-in-out',

apps/web/src/components/pure/quick-search-modal/navigation-path/styles.ts

@@ -1,6 +1,6 @@
 import { displayFlex, styled, textEllipsis } from '@affine/component';
 
-export const StyledNavigationPathContainer = styled('div')(({ theme }) => {
+export const StyledNavigationPathContainer = styled('div')(() => {
   return {
     height: '46px',
     ...displayFlex('flex-start', 'center'),
@@ -24,7 +24,7 @@ export const StyledNavigationPathContainer = styled('div')(({ theme }) => {
 });
 
 export const StyledNavPathLink = styled('div')<{ active?: boolean }>(
-  ({ theme, active }) => {
+  ({ active }) => {
     return {
       color: active
         ? 'var(--affine-text-primary-color)'
@@ -45,7 +45,7 @@ export const StyledNavPathLink = styled('div')<{ active?: boolean }>(
 );
 
 export const StyledNavPathExtendContainer = styled('div')<{ show: boolean }>(
-  ({ show, theme }) => {
+  ({ show }) => {
     return {
       position: 'absolute',
       left: '0',

apps/web/src/components/pure/quick-search-modal/style.ts

@@ -1,6 +1,6 @@
 import { displayFlex, styled, textEllipsis } from '@affine/component';
 
-export const StyledContent = styled('div')(({ theme }) => {
+export const StyledContent = styled('div')(() => {
   return {
     minHeight: '290px',
     maxHeight: '70vh',
@@ -35,7 +35,7 @@ export const StyledContent = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledJumpTo = styled('div')(({ theme }) => {
+export const StyledJumpTo = styled('div')(() => {
   return {
     ...displayFlex('center', 'start'),
     flexDirection: 'column',
@@ -47,7 +47,7 @@ export const StyledJumpTo = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledNotFound = styled('div')(({ theme }) => {
+export const StyledNotFound = styled('div')(() => {
   return {
     width: '612px',
     ...displayFlex('center', 'center'),
@@ -68,7 +68,7 @@ export const StyledNotFound = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledInputContent = styled('div')(({ theme }) => {
+export const StyledInputContent = styled('div')(() => {
   return {
     ...displayFlex('space-between', 'center'),
     input: {
@@ -85,7 +85,7 @@ export const StyledInputContent = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledShortcut = styled('div')(({ theme }) => {
+export const StyledShortcut = styled('div')(() => {
   return {
     color: 'var(--affine-placeholder-color)',
     fontSize: 'var(--affine-font-sm)',
@@ -93,7 +93,7 @@ export const StyledShortcut = styled('div')(({ theme }) => {
   };
 });
 
-export const StyledLabel = styled('label')(({ theme }) => {
+export const StyledLabel = styled('label')(() => {
   return {
     width: '20px',
     height: '20px',
@@ -109,7 +109,7 @@ export const StyledModalHeader = styled('div')(() => {
     ...displayFlex('space-between', 'center'),
   };
 });
-export const StyledModalDivider = styled('div')(({ theme }) => {
+export const StyledModalDivider = styled('div')(() => {
   return {
     width: 'auto',
     height: '0',
@@ -118,7 +118,7 @@ export const StyledModalDivider = styled('div')(({ theme }) => {
   };
 });
 
-export const StyledModalFooter = styled('div')(({ theme }) => {
+export const StyledModalFooter = styled('div')(() => {
   return {
     fontSize: 'inherit',
     lineHeight: '22px',
@@ -142,7 +142,7 @@ export const StyledModalFooter = styled('div')(({ theme }) => {
     },
   };
 });
-export const StyledModalFooterContent = styled('button')(({ theme }) => {
+export const StyledModalFooterContent = styled('button')(() => {
   return {
     width: '600px',
     height: '32px',

apps/web/src/components/pure/shortcuts-modal/style.ts

@@ -1,6 +1,6 @@
 import { displayFlex, styled } from '@affine/component';
 
-export const StyledShortcutsModal = styled('div')(({ theme }) => ({
+export const StyledShortcutsModal = styled('div')(() => ({
   width: '288px',
   height: '74vh',
   paddingBottom: '28px',
@@ -16,7 +16,7 @@ export const StyledShortcutsModal = styled('div')(({ theme }) => ({
   margin: 'auto',
   zIndex: 'var(--affine-z-index-modal)',
 }));
-export const StyledTitle = styled('div')(({ theme }) => ({
+export const StyledTitle = styled('div')(() => ({
   color: 'var(--affine-text-primary-color)',
   fontWeight: '500',
   fontSize: 'var(--affine-font-sm)',
@@ -28,7 +28,7 @@ export const StyledTitle = styled('div')(({ theme }) => ({
     color: 'var(--affine-primary-color)',
   },
 }));
-export const StyledSubTitle = styled('div')(({ theme }) => ({
+export const StyledSubTitle = styled('div')(() => ({
   fontWeight: '500',
   fontSize: 'var(--affine-font-sm)',
   height: '34px',
@@ -49,7 +49,7 @@ export const StyledModalHeader = styled('div')(() => ({
   transition: 'background-color 0.5s',
 }));
 
-export const StyledListItem = styled('div')(({ theme }) => ({
+export const StyledListItem = styled('div')(() => ({
   height: '34px',
   ...displayFlex('space-between', 'center'),
   fontSize: 'var(--affine-font-sm)',

apps/web/src/components/pure/workspace-list-modal/language-menu.tsx

@@ -56,7 +56,7 @@ export const LanguageMenu: React.FC = () => {
   );
 };
 
-const ListItem = styled(MenuItem)(({ theme }) => ({
+const ListItem = styled(MenuItem)(() => ({
   height: '38px',
   fontSize: 'var(--affine-font-base)',
   textTransform: 'capitalize',

apps/web/src/components/pure/workspace-list-modal/styles.ts

@@ -1,6 +1,6 @@
 import { displayFlex, styled, textEllipsis } from '@affine/component';
 
-export const StyledSplitLine = styled('div')(({ theme }) => {
+export const StyledSplitLine = styled('div')(() => {
   return {
     width: '1px',
     height: '20px',
@@ -9,7 +9,7 @@ export const StyledSplitLine = styled('div')(({ theme }) => {
   };
 });
 
-export const StyleWorkspaceInfo = styled('div')(({ theme }) => {
+export const StyleWorkspaceInfo = styled('div')(() => {
   return {
     marginLeft: '15px',
     width: '202px',
@@ -30,7 +30,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,
@@ -41,7 +41,7 @@ export const StyleWorkspaceTitle = styled('div')(({ theme }) => {
   };
 });
 
-export const StyledCreateWorkspaceCard = styled('div')(({ theme }) => {
+export const StyledCreateWorkspaceCard = styled('div')(() => {
   return {
     width: '310px',
     height: '124px',
@@ -68,14 +68,14 @@ export const StyledCreateWorkspaceCard = styled('div')(({ theme }) => {
 export const StyledModalHeaderLeft = styled('div')(() => {
   return { ...displayFlex('flex-start', 'center') };
 });
-export const StyledModalTitle = styled('div')(({ theme }) => {
+export const StyledModalTitle = styled('div')(() => {
   return {
     fontWeight: 600,
     fontSize: 'var(--affine-font-h6)',
   };
 });
 
-export const StyledHelperContainer = styled('div')(({ theme }) => {
+export const StyledHelperContainer = styled('div')(() => {
   return {
     color: 'var(--affine-icon-color)',
     marginLeft: '15px',

apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/styles.ts

@@ -1,6 +1,6 @@
 import { displayFlex, textEllipsis } from '@affine/component';
 import { styled } from '@affine/component';
-export const StyledSelectorContainer = styled('div')(({ theme }) => {
+export const StyledSelectorContainer = styled('div')(() => {
   return {
     height: '58px',
     display: 'flex',
@@ -32,7 +32,7 @@ export const StyledWorkspaceName = styled('div')(() => {
   };
 });
 
-export const StyledWorkspaceStatus = styled('div')(({ theme }) => {
+export const StyledWorkspaceStatus = styled('div')(() => {
   return {
     height: '22px',
     ...displayFlex('flex-start', 'center'),

apps/web/src/components/pure/workspace-slider-bar/style.ts

@@ -37,7 +37,7 @@ export const StyledLink = styled(Link)(() => {
     '-webkit-app-region': 'no-drag',
   };
 });
-export const StyledNewPageButton = styled('button')(({ theme }) => {
+export const StyledNewPageButton = styled('button')(() => {
   return {
     height: '52px',
     ...displayFlex('flex-start', 'center'),
@@ -56,7 +56,7 @@ export const StyledNewPageButton = styled('button')(({ theme }) => {
   };
 });
 export const StyledSliderModalBackground = styled('div')<{ active: boolean }>(
-  ({ theme, active }) => {
+  ({ active }) => {
     return {
       transition: 'opacity .15s',
       pointerEvents: active ? 'auto' : 'none',
@@ -74,7 +74,7 @@ export const StyledSliderModalBackground = styled('div')<{ active: boolean }>(
 
 export const StyledScrollWrapper = styled('div')<{
   showTopBorder: boolean;
-}>(({ showTopBorder, theme }) => {
+}>(({ showTopBorder }) => {
   return {
     maxHeight: '50%',
     overflowY: 'auto',

apps/web/src/hooks/__tests__/index.spec.tsx

@@ -310,7 +310,6 @@ describe('useIsFirstLoad', () => {
   });
   test('useTipsDisplayStatus', async () => {
     const tipsDisplayStatus = renderHook(() => useTipsDisplayStatus());
-    const setTipsDisplayStatus = tipsDisplayStatus.result.current;
     expect(tipsDisplayStatus.result.current).toEqual({
       quickSearchTips: {
         permanentlyHidden: true,

apps/web/src/hooks/affine/use-affine-public-page.ts

@@ -1,3 +0,0 @@
-import type { AffineWorkspace } from '@affine/workspace/type';
-
-export function useAffinePublicPage(workspace: AffineWorkspace) {}

apps/web/src/hooks/use-workspaces.ts

@@ -86,14 +86,14 @@ export const useElementResizeEffect = (
   element: Element | null,
   fn: () => void | (() => () => void),
   // TODO: add throttle
-  throttle = 0
+  _throttle = 0
 ) => {
   useEffect(() => {
     if (!element) {
       return;
     }
     let dispose: void | (() => void);
-    const resizeObserver = new ResizeObserver(entries => {
+    const resizeObserver = new ResizeObserver(() => {
       dispose = fn();
     });
     resizeObserver.observe(element);

apps/web/src/layouts/styles.ts

@@ -77,7 +77,7 @@ export const StyledToolWrapper = styled('div')(({ theme }) => {
 });
 
 export const StyledSliderResizer = styled('div')<{ isResizing: boolean }>(
-  ({ theme }) => {
+  () => {
     return {
       position: 'absolute',
       top: 0,

apps/web/src/pages/invite/[invite_code].tsx

@@ -89,7 +89,7 @@ InvitePage.getLayout = page => {
   );
 };
 
-const StyledContainer = styled('div')(({ theme }) => {
+const StyledContainer = styled('div')(() => {
   return {
     height: '100vh',
     ...displayFlex('center', 'center'),

apps/web/src/pages/public-workspace/[workspaceId]/[pageId].tsx

@@ -27,7 +27,7 @@ import {
 } from '../../../layouts/public-workspace-layout';
 import type { NextPageWithLayout } from '../../../shared';
 
-export const NavContainer = styled('div')(({ theme }) => {
+export const NavContainer = styled('div')(() => {
   return {
     width: '100vw',
     height: '52px',
@@ -36,7 +36,7 @@ export const NavContainer = styled('div')(({ theme }) => {
   };
 });
 
-export const StyledBreadcrumbs = styled(Link)(({ theme }) => {
+export const StyledBreadcrumbs = styled(Link)(() => {
   return {
     flex: 1,
     ...displayFlex('center', 'center'),

apps/web/src/shared/apis.ts

@@ -14,7 +14,7 @@ const affineApis = {} as ReturnType<typeof createUserApis> &
 Object.assign(affineApis, createUserApis(prefixUrl));
 Object.assign(affineApis, createWorkspaceApis(prefixUrl));
 
-const debugLogger = new DebugLogger('affine-debug-apis');
+const _debugLogger = new DebugLogger('affine-debug-apis');
 
 if (!globalThis.AFFINE_APIS) {
   globalThis.AFFINE_APIS = affineApis;

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 (

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',

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',

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 }>(
+export const TabItem = styled('li')<{ isActive?: boolean }>(({ isActive }) => {
-  ({ theme, isActive }) => {
+  {
-    {
+    return {
-      return {
+      ...displayFlex('center', 'center'),
-        ...displayFlex('center', 'center'),
+      flex: '1',
-        flex: '1',
+      height: '30px',
-        height: '30px',
+      color: 'var(--affine-text-primary-color)',
-        color: 'var(--affine-text-primary-color)',
+      opacity: isActive ? 1 : 0.2,
-        opacity: isActive ? 1 : 0.2,
+      fontWeight: '500',
-        fontWeight: '500',
+      fontSize: 'var(--affine-font-base)',
-        fontSize: 'var(--affine-font-base)',
+      lineHeight: 'var(--affine-line-height)',
-        lineHeight: 'var(--affine-line-height)',
+      cursor: 'pointer',
-        cursor: 'pointer',
+      transition: 'all 0.15s ease',
-        transition: 'all 0.15s ease',
+      padding: '0 10px',
-        padding: '0 10px',
+      marginBottom: '4px',
-        marginBottom: '4px',
+      borderRadius: '4px',
-        borderRadius: '4px',
+      position: 'relative',
-        position: 'relative',
+      ':hover': {
-        ':hover': {
+        background: 'var(--affine-hover-color)',
-          background: 'var(--affine-hover-color)',
+        opacity: 1,
-          opacity: 1,
+        color: isActive
-          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',
+      svg: {
-          marginRight: '12px',
+        fontSize: '20px',
-        },
+        marginRight: '12px',
-        ':after': {
+      },
-          content: '""',
+      ':after': {
-          position: 'absolute',
+        content: '""',
-          bottom: '-6px',
+        position: 'absolute',
-          left: '0',
+        bottom: '-6px',
-          width: '100%',
+        left: '0',
-          height: '2px',
+        width: '100%',
-          background: 'var(--affine-text-primary-color)',
+        height: '2px',
-          opacity: 0.2,
+        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)',

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(
+      onClick={useCallback(() => {
-        (event: MouseEvent) => {
+        onClick(workspace);
-          onClick(workspace);
+      }, [onClick, workspace])}
-        },
-        [onClick, workspace]
-      )}
       active={workspace.id === currentWorkspaceId}
     >
       <WorkspaceAvatar size={58} workspace={workspace} />

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',

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)',
   };

packages/component/src/ui/button/styles.ts

@@ -104,7 +104,6 @@ export const StyledTextButton = styled('button', {
   >
 >(
   ({
-    theme,
     size = 'default',
     disabled,
     hoverBackground,

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',

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)',
   };

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"

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,

packages/component/src/ui/layout/Content.tsx

@@ -31,7 +31,6 @@ export const Content = styled('div', {
   },
 })<ContentProps>(
   ({
-    theme,
     color,
     fontSize,
     weight,

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>}

packages/component/src/ui/menu/PureMenu.tsx

@@ -12,7 +12,6 @@ export const PureMenu = ({
   children,
   placement,
   width,
-  height,
   ...otherProps
 }: PureMenuProps) => {
   return (

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',

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,

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',

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',

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)',
   };

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,

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',

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',

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)',

packages/component/src/ui/tree-view/TreeView.tsx

@@ -19,7 +19,6 @@ export const TreeView = <RenderProps,>({
   enableKeyboardSelection,
   onSelect,
   enableDnd = true,
-  initialCollapsedIds = [],
   disableCollapse,
   onDrop,
   ...otherProps

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,
 }: {

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;

packages/workspace/src/providers/__tests__/sqlite-provider.spec.ts

@@ -21,13 +21,13 @@ const mockedAddBlob = vi.fn();
 vi.stubGlobal('window', {
   apis: {
     db: {
-      getDoc: async (id: string) => {
+      getDoc: async () => {
         return Y.encodeStateAsUpdate(offlineYdoc);
       },
       applyDocUpdate: async (id: string, update: Uint8Array) => {
         Y.applyUpdate(offlineYdoc, update, 'sqlite');
       },
-      getPersistedBlobs: async (id: string) => {
+      getPersistedBlobs: async () => {
         // todo: may need to hack the way to get hash keys of blobs
         return [];
       },
@@ -88,7 +88,7 @@ describe('SQLite provider', () => {
     const bin = new Uint8Array([1, 2, 3]);
     const blob = new Blob([bin]);
     workspace.blobs.list = vi.fn(async () => ['blob1']);
-    workspace.blobs.get = vi.fn(async (key: string) => {
+    workspace.blobs.get = vi.fn(async () => {
       return blob;
     });
 

packages/workspace/src/type.ts

@@ -131,16 +131,11 @@ type PageDetailProps<Flavour extends keyof WorkspaceRegistry> =
     currentPageId: string;
   };
 
-type PageListProps<Flavour extends keyof WorkspaceRegistry> = {
+type PageListProps<_Flavour extends keyof WorkspaceRegistry> = {
   blockSuiteWorkspace: BlockSuiteWorkspace;
   onOpenPage: (pageId: string, newTab?: boolean) => void;
 };
 
-type SideBarMenuProps<Flavour extends keyof WorkspaceRegistry> =
-  UIBaseProps<Flavour> & {
-    setSideBarOpen: (open: boolean) => void;
-  };
-
 export interface WorkspaceUISchema<Flavour extends keyof WorkspaceRegistry> {
   PageDetail: FC<PageDetailProps<Flavour>>;
   PageList: FC<PageListProps<Flavour>>;

packages/y-indexeddb/src/index.ts

@@ -145,7 +145,6 @@ export const createIndexedDBProvider = (
   let reject: (reason?: unknown) => void;
   let early = true;
   let connect = false;
-  let destroy = false;
 
   async function handleUpdate(update: Uint8Array, origin: unknown) {
     const db = await dbPromise;
@@ -199,7 +198,6 @@ export const createIndexedDBProvider = (
   });
   const handleDestroy = async () => {
     connect = true;
-    destroy = true;
     const db = await dbPromise;
     db.close();
   };
@@ -277,7 +275,6 @@ export const createIndexedDBProvider = (
       doc.off('destroy', handleDestroy);
     },
     cleanup() {
-      destroy = true;
       // todo
     },
     whenSynced: Promise.resolve(),

tests/parallels/storybook/button.spec.ts

@@ -2,7 +2,7 @@ import { test } from '@affine-test/kit/playwright';
 import type { Page } from '@playwright/test';
 import { expect } from '@playwright/test';
 
-async function openStorybook(page: Page, storyName?: string) {
+async function openStorybook(page: Page) {
   return page.goto(`http://localhost:6006`);
 }