diff --git a/apps/electron/layers/main/src/__tests__/integration.spec.ts b/apps/electron/layers/main/src/__tests__/integration.spec.ts
index 9ff3ecde5..b8d1b97df 100644
--- a/apps/electron/layers/main/src/__tests__/integration.spec.ts
+++ b/apps/electron/layers/main/src/__tests__/integration.spec.ts
@@ -27,7 +27,6 @@ async function dispatch<
 >(
   namespace: T,
   functionName: F,
-  // @ts-expect-error
   ...args: Parameters<WithoutFirstParameter<MainIPCHandlerMap[T][F]>>
 ): // @ts-expect-error
 ReturnType<MainIPCHandlerMap[T][F]> {
diff --git a/apps/web/src/components/affine/create-workspace-modal/index.tsx b/apps/web/src/components/affine/create-workspace-modal/index.tsx
index 3e1826d3b..ad86ad983 100644
--- a/apps/web/src/components/affine/create-workspace-modal/index.tsx
+++ b/apps/web/src/components/affine/create-workspace-modal/index.tsx
@@ -76,9 +76,7 @@ const NameWorkspaceContent = ({
         placeholder={t['Set a Workspace name']()}
         maxLength={64}
         minLength={0}
-        onChange={value => {
-          setWorkspaceName(value);
-        }}
+        onChange={setWorkspaceName}
         onCompositionStart={() => {
           isComposition.current = true;
         }}
@@ -90,9 +88,7 @@ const NameWorkspaceContent = ({
         <Button
           data-testid="create-workspace-close-button"
           type="light"
-          onClick={() => {
-            onClose();
-          }}
+          onClick={onClose}
         >
           {t.Cancel()}
         </Button>
@@ -103,9 +99,7 @@ const NameWorkspaceContent = ({
             opacity: !workspaceName ? 0.5 : 1,
           }}
           type="primary"
-          onClick={() => {
-            handleCreateWorkspace();
-          }}
+          onClick={handleCreateWorkspace}
         >
           {t.Create()}
         </Button>
@@ -137,20 +131,24 @@ const SetDBLocationContent = ({
   const defaultDBLocation = useDefaultDBLocation();
   const [opening, setOpening] = useState(false);
 
-  const handleSelectDBFileLocation = async () => {
+  const handleSelectDBFileLocation = useCallback(() => {
     if (opening) {
       return;
     }
     setOpening(true);
-    const result = await window.apis?.dialog.selectDBFileLocation();
-    setOpening(false);
-    if (result?.filePath) {
-      onConfirmLocation(result.filePath);
-    } else if (result?.error) {
-      // @ts-expect-error: result.error is dynamic so the type is unknown
-      toast(t[result.error]());
-    }
-  };
+    (async function () {
+      const result = await window.apis?.dialog.selectDBFileLocation();
+      setOpening(false);
+      if (result?.filePath) {
+        onConfirmLocation(result.filePath);
+      } else if (result?.error) {
+        // @ts-expect-error: result.error is dynamic so the type is unknown
+        toast(t[result.error]());
+      }
+    })().catch(err => {
+      logger.error(err);
+    });
+  }, [onConfirmLocation, opening, t]);
 
   return (
     <div className={style.content}>
@@ -334,22 +332,32 @@ export const CreateWorkspaceModal = ({
     ]
   );
 
+  const onConfirmName = useCallback(
+    (name: string) => {
+      setWorkspaceName(name);
+      if (environment.isDesktop) {
+        setStep('set-syncing-mode');
+      } else {
+        // this will be the last step for web for now
+        // fix me later
+        createLocalWorkspace(name)
+          .then(id => {
+            onCreate(id);
+          })
+          .catch(err => {
+            logger.error(err);
+          });
+      }
+    },
+    [createLocalWorkspace, onCreate]
+  );
+
   const nameWorkspaceNode =
     step === 'name-workspace' ? (
       <NameWorkspaceContent
         // go to previous step instead?
         onClose={onClose}
-        onConfirmName={async name => {
-          setWorkspaceName(name);
-          if (environment.isDesktop) {
-            setStep('set-syncing-mode');
-          } else {
-            // this will be the last step for web for now
-            // fix me later
-            const id = await createLocalWorkspace(name);
-            onCreate(id);
-          }
-        }}
+        onConfirmName={onConfirmName}
       />
     ) : null;
 
diff --git a/apps/web/src/components/affine/enable-affine-cloud-modal/index.tsx b/apps/web/src/components/affine/enable-affine-cloud-modal/index.tsx
index bb6631e2c..5fae1c8c6 100644
--- a/apps/web/src/components/affine/enable-affine-cloud-modal/index.tsx
+++ b/apps/web/src/components/affine/enable-affine-cloud-modal/index.tsx
@@ -24,11 +24,7 @@ export const EnableAffineCloudModal: React.FC<EnableAffineCloudModalProps> = ({
     <Modal open={open} onClose={onClose} data-testid="logout-modal">
       <ModalWrapper width={560} height={292}>
         <Header>
-          <IconButton
-            onClick={() => {
-              onClose();
-            }}
-          >
+          <IconButton onClick={onClose}>
             <CloseIcon />
           </IconButton>
         </Header>
@@ -41,18 +37,11 @@ export const EnableAffineCloudModal: React.FC<EnableAffineCloudModalProps> = ({
               data-testid="confirm-enable-affine-cloud-button"
               shape="round"
               type="primary"
-              onClick={() => {
-                onConfirm();
-              }}
+              onClick={onConfirm}
             >
               {user ? t.Enable() : t['Sign in and Enable']()}
             </StyleButton>
-            <StyleButton
-              shape="round"
-              onClick={() => {
-                onClose();
-              }}
-            >
+            <StyleButton shape="round" onClick={onClose}>
               {t['Not now']()}
             </StyleButton>
           </div>
diff --git a/apps/web/src/components/affine/tmp-disable-affine-cloud-modal/index.tsx b/apps/web/src/components/affine/tmp-disable-affine-cloud-modal/index.tsx
index b45ea3a1b..9fb6e1b11 100644
--- a/apps/web/src/components/affine/tmp-disable-affine-cloud-modal/index.tsx
+++ b/apps/web/src/components/affine/tmp-disable-affine-cloud-modal/index.tsx
@@ -31,11 +31,7 @@ export const TmpDisableAffineCloudModal: React.FC<
     >
       <ModalWrapper width={480}>
         <Header>
-          <IconButton
-            onClick={() => {
-              onClose();
-            }}
-          >
+          <IconButton onClick={onClose}>
             <CloseIcon />
           </IconButton>
         </Header>
@@ -69,13 +65,7 @@ export const TmpDisableAffineCloudModal: React.FC<
             />
           </StyleImage>
           <StyleButtonContainer>
-            <StyleButton
-              shape="round"
-              type="primary"
-              onClick={() => {
-                onClose();
-              }}
-            >
+            <StyleButton shape="round" type="primary" onClick={onClose}>
               {t['Got it']()}
             </StyleButton>
           </StyleButtonContainer>
diff --git a/apps/web/src/components/affine/transform-workspace-to-affine-modal/index.tsx b/apps/web/src/components/affine/transform-workspace-to-affine-modal/index.tsx
index 6dec30f04..a783d2889 100644
--- a/apps/web/src/components/affine/transform-workspace-to-affine-modal/index.tsx
+++ b/apps/web/src/components/affine/transform-workspace-to-affine-modal/index.tsx
@@ -26,11 +26,7 @@ export const TransformWorkspaceToAffineModal: React.FC<
     >
       <ModalWrapper width={560} height={292}>
         <Header>
-          <IconButton
-            onClick={() => {
-              onClose();
-            }}
-          >
+          <IconButton onClick={onClose}>
             <CloseIcon />
           </IconButton>
         </Header>
@@ -43,23 +39,7 @@ export const TransformWorkspaceToAffineModal: React.FC<
               data-testid="confirm-enable-cloud-button"
               shape="round"
               type="primary"
-              onClick={async () => {
-                onConform();
-                // setLoading(true);
-                // if (user || (await login())) {
-                //   if (currentWorkspace) {
-                //     const workspace = await dataCenter.enableWorkspaceCloud(
-                //       currentWorkspace
-                //     );
-                //     toast(t('Enabled success'));
-                //
-                //     if (workspace) {
-                //       router.push(`/workspace/${workspace.id}/setting`);
-                //     }
-                //   }
-                // }
-                // setLoading(false);
-              }}
+              onClick={onConform}
             >
               {user ? t['Enable']() : t['Sign in and Enable']()}
             </StyleButton>