diff --git a/features/stepDefinitions/electron.ts b/features/stepDefinitions/electron.ts
index 4bdaaee2..a65f2980 100644
--- a/features/stepDefinitions/electron.ts
+++ b/features/stepDefinitions/electron.ts
@@ -1,30 +1,30 @@
 /* eslint-disable @typescript-eslint/no-unused-expressions */
-import { setWorldConstructor, Given, Then } from '@cucumber/cucumber';
+import { Given, setWorldConstructor, Then } from '@cucumber/cucumber';
 import { delay } from 'bluebird';
 import { expect } from 'chai';
 import { TidGiWorld } from '../supports/world';
 
 setWorldConstructor(TidGiWorld);
 
-Given('the app is launched', async function (this: TidGiWorld) {
+Given('the app is launched', async function(this: TidGiWorld) {
   await delay(100);
   await this.start();
   const windowCount = await this.app?.client?.getWindowCount();
   expect(windowCount).equal(1);
 });
 
-Then('the element {string} is on the page', async function (this: TidGiWorld, elementSelector: string) {
+Then('the element {string} is on the page', async function(this: TidGiWorld, elementSelector: string) {
   const result = await this.getElement(elementSelector);
   expect(result).to.not.be.undefined;
   this.updateContext({ previousElement: result });
 });
-Then('click on this element', async function (this: TidGiWorld) {
+Then('click on this element', async function(this: TidGiWorld) {
   expect(this.context?.previousElement).to.not.be.undefined;
   if (this.context?.previousElement !== undefined) {
     await this.context.previousElement.click();
   }
 });
-Then('click on {string} element', async function (this: TidGiWorld, elementSelector: string) {
+Then('click on {string} element', async function(this: TidGiWorld, elementSelector: string) {
   const result = await this.getElement(elementSelector);
   expect(result).to.not.be.undefined;
   if (result !== undefined) {
@@ -32,7 +32,7 @@ Then('click on {string} element', async function (this: TidGiWorld, elementSelec
     await result.click();
   }
 });
-Then('{string} window show up', async function (this: TidGiWorld, windowName: string) {
+Then('{string} window show up', async function(this: TidGiWorld, windowName: string) {
   // await delay(1000);
   const windowCount = await this.app?.client?.getWindowCount();
   expect(windowCount).equal(2);
diff --git a/features/supports/after.ts b/features/supports/after.ts
index 9259406d..b4c944b2 100644
--- a/features/supports/after.ts
+++ b/features/supports/after.ts
@@ -1,17 +1,17 @@
 import { After, Before } from '@cucumber/cucumber';
 import fs from 'fs-extra';
 
-import { DEFAULT_WIKI_FOLDER } from '../../src/constants/paths';
 import { SETTINGS_FOLDER } from '../../src/constants/appPaths';
+import { DEFAULT_WIKI_FOLDER } from '../../src/constants/paths';
 import { TidGiWorld } from './world';
 
-Before(async function () {
+Before(async function() {
   // clear setting folder
   await fs.remove(SETTINGS_FOLDER);
   await fs.remove(DEFAULT_WIKI_FOLDER);
 });
 
-After(async function (this: TidGiWorld, testCase) {
+After(async function(this: TidGiWorld, testCase) {
   // print logs if test failed
   // if (this.app !== undefined && testCase.result?.status === Status.FAILED) {
   //   console.log('main:\n---\n');
diff --git a/forge.config.js b/forge.config.js
index ea4ed519..2290ac77 100644
--- a/forge.config.js
+++ b/forge.config.js
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/restrict-template-expressions */
 const packageJson = require('./package.json');
-const beforeAsar = require('./scripts/beforeAsar')
+const beforeAsar = require('./scripts/beforeAsar');
 
 const { version, description } = packageJson;
 
@@ -91,7 +91,7 @@ const config = {
         An unhandled rejection has occurred inside Forge:
         [object Object]
      */
-        {
+    {
       name: '@reforged/maker-appimage',
       platforms: ['linux'],
       config: {
diff --git a/scripts/beforeAsar.js b/scripts/beforeAsar.js
index 08ee5266..f192f0ff 100644
--- a/scripts/beforeAsar.js
+++ b/scripts/beforeAsar.js
@@ -15,7 +15,6 @@ const fs = require('fs-extra');
 const util = require('util');
 
 /**
- *
  * @param {*} buildPath /var/folders/qj/7j0zx32d0l75zmnrl1w3m3b80000gn/T/electron-packager/darwin-x64/TidGi-darwin-x64/Electron.app/Contents/Resources/app
  * @param {*} electronVersion 12.0.6
  * @param {*} platform darwin
diff --git a/src/components/FindInPage.tsx b/src/components/FindInPage.tsx
index 97c3eec1..b58fb999 100644
--- a/src/components/FindInPage.tsx
+++ b/src/components/FindInPage.tsx
@@ -1,9 +1,9 @@
-import React, { useState, useCallback, useEffect, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import styled from 'styled-components';
 import Button from '@material-ui/core/Button';
 import TextField from '@material-ui/core/TextField';
 import Typography from '@material-ui/core/Typography';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
 const Root = styled.div`
   display: flex;
@@ -66,11 +66,11 @@ export default function FindInPage(): JSX.Element | null {
   return (
     <Root>
       <InfoContainer>
-        <Typography variant="body2">
+        <Typography variant='body2'>
           <strong>{activeMatch}</strong>
-          <span> / </span>
+          <span>/</span>
           <strong>{matches}</strong>
-          <span> {t('Menu.FindMatches')}</span>
+          <span>{t('Menu.FindMatches')}</span>
         </Typography>
       </InfoContainer>
       <div>
@@ -79,7 +79,7 @@ export default function FindInPage(): JSX.Element | null {
           inputRef={inputReference}
           placeholder={t('Menu.Find')}
           value={text}
-          margin="dense"
+          margin='dense'
           onChange={(event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
             const value = event.target.value;
             if (typeof value !== 'string') return;
@@ -119,41 +119,45 @@ export default function FindInPage(): JSX.Element | null {
         />
       </div>
       <Button
-        size="small"
+        size='small'
         disabled={text.length === 0 || matches < 1}
         onClick={() => {
           if (text.length > 0) {
             void window.service.window.findInPage(text, false);
           }
-        }}>
+        }}
+      >
         {t('Menu.FindPrevious')}
       </Button>
       <Button
-        size="small"
+        size='small'
         disabled={text.length === 0 || matches < 1}
         onClick={() => {
           if (text.length > 0) {
             void window.service.window.findInPage(text, true);
           }
-        }}>
+        }}
+      >
         {t('Menu.FindNext')}
       </Button>
       <Button
-        size="small"
+        size='small'
         disabled={text.length === 0}
         onClick={() => {
           if (text.length > 0) {
             void window.service.window.findInPage(text, true);
           }
-        }}>
+        }}
+      >
         {t('Menu.Find')}
       </Button>
       <Button
-        size="small"
+        size='small'
         onClick={() => {
           void window.service.window.stopFindInPage(true);
           openSetter(false);
-        }}>
+        }}
+      >
         {t('Menu.Close')}
       </Button>
     </Root>
diff --git a/src/components/PopUpMenuItem.tsx b/src/components/PopUpMenuItem.tsx
index d2feab11..4ebb64ea 100644
--- a/src/components/PopUpMenuItem.tsx
+++ b/src/components/PopUpMenuItem.tsx
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import React from 'react';
 import Menu from '@material-ui/core/Menu';
+import React from 'react';
 
 interface Props {
   buttonElement: React.ReactElement;
diff --git a/src/components/RestartSnackbar.tsx b/src/components/RestartSnackbar.tsx
index 67a47011..3cf960d2 100644
--- a/src/components/RestartSnackbar.tsx
+++ b/src/components/RestartSnackbar.tsx
@@ -1,9 +1,9 @@
-import React, { useCallback, useState } from 'react';
-import styled, { keyframes } from 'styled-components';
-import { Snackbar, Button, IconButton, Tooltip } from '@material-ui/core';
+import { Button, IconButton, Snackbar, Tooltip } from '@material-ui/core';
 import { Close as CloseIcon } from '@material-ui/icons';
-import { useTranslation } from 'react-i18next';
 import useDebouncedCallback from 'beautiful-react-hooks/useDebouncedCallback';
+import React, { useCallback, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import styled, { keyframes } from 'styled-components';
 
 const progressAnimation = keyframes`
   from {
@@ -65,7 +65,7 @@ export function useRestartSnackbar(waitBeforeCountDown = 1000, waitBeforeRestart
 
   return [
     requestRestartCountDown,
-    <div key="RestartSnackbar">
+    <div key='RestartSnackbar'>
       <Snackbar
         anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }}
         open={opened}
@@ -88,14 +88,15 @@ export function useRestartSnackbar(waitBeforeCountDown = 1000, waitBeforeRestart
             <RestartButton
               key={currentWaitBeforeRestart}
               currentWaitBeforeRestart={currentWaitBeforeRestart}
-              color="secondary"
-              size="small"
-              onClick={handleCloseAndRestart}>
+              color='secondary'
+              size='small'
+              onClick={handleCloseAndRestart}
+            >
               {t('Dialog.RestartNow')}
             </RestartButton>
             <Tooltip title={<span>{t('Dialog.Later')}</span>}>
-              <IconButton size="small" aria-label="close" color="inherit" onClick={handleCancelRestart}>
-                <CloseIcon fontSize="small" />
+              <IconButton size='small' aria-label='close' color='inherit' onClick={handleCancelRestart}>
+                <CloseIcon fontSize='small' />
               </IconButton>
             </Tooltip>
           </>
diff --git a/src/components/RootStyle.tsx b/src/components/RootStyle.tsx
index 7b38c71a..392fcca1 100644
--- a/src/components/RootStyle.tsx
+++ b/src/components/RootStyle.tsx
@@ -4,20 +4,20 @@ export const RootStyle = styled.div`
   .Mui-selected,
   .Mui-checked {
     ${({ theme }) =>
-      theme.palette.mode === 'dark'
-        ? css`
+  theme.palette.mode === 'dark'
+    ? css`
             color: ${theme.palette.primary.light} !important;
           `
-        : ''};
+    : ''};
   }
   .Mui-disabled {
     ${({ theme }) =>
-      theme.palette.mode === 'dark'
-        ? css`
+  theme.palette.mode === 'dark'
+    ? css`
             color: ${theme.palette.primary.dark} !important;
             -webkit-text-fill-color: ${theme.palette.primary.light};
           `
-        : ''};
+    : ''};
   }
 
   label,
diff --git a/src/components/StorageService/SearchGithubRepo.tsx b/src/components/StorageService/SearchGithubRepo.tsx
index 09f36c68..9b2d7aba 100644
--- a/src/components/StorageService/SearchGithubRepo.tsx
+++ b/src/components/StorageService/SearchGithubRepo.tsx
@@ -1,14 +1,14 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
-import Promise from 'bluebird';
-import React, { useState, useEffect, useMemo, useCallback } from 'react';
-import styled from 'styled-components';
-import { useQuery, useMutation, GraphQLClient, ClientContext } from 'graphql-hooks';
-import { trim } from 'lodash';
-import { useTranslation } from 'react-i18next';
 import useDebouncedCallback from 'beautiful-react-hooks/useDebouncedCallback';
+import Promise from 'bluebird';
+import { ClientContext, GraphQLClient, useMutation, useQuery } from 'graphql-hooks';
+import { trim } from 'lodash';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
-import { TextField, LinearProgress, List, ListItem, ListItemIcon, ListItemText, Button } from '@material-ui/core';
-import { Folder as FolderIcon, Cached as CachedIcon, CreateNewFolder as CreateNewFolderIcon } from '@material-ui/icons';
+import { Button, LinearProgress, List, ListItem, ListItemIcon, ListItemText, TextField } from '@material-ui/core';
+import { Cached as CachedIcon, CreateNewFolder as CreateNewFolderIcon, Folder as FolderIcon } from '@material-ui/icons';
 
 import { GITHUB_GRAPHQL_API } from '@/constants/auth';
 import { useUserInfoObservable } from '@services/auth/hooks';
@@ -80,7 +80,7 @@ export default function SearchGithubRepo(props: Props): JSX.Element {
     [],
   );
   useEffect(() => {
-    graphqlClient.setHeader('Authorization', accessToken !== undefined ? `Bearer ${accessToken}` : '');
+    graphqlClient.setHeader('Authorization', accessToken === undefined ? '' : `Bearer ${accessToken}`);
   }, [accessToken, graphqlClient]);
 
   if (githubUsername === '' || githubUsername === undefined || accessToken === '' || accessToken === undefined) {
@@ -132,7 +132,9 @@ function SearchGithubRepoResultList({
     const timeoutHandle = setTimeout(async () => {
       await refetchDebounced();
     }, 100);
-    return () => clearTimeout(timeoutHandle);
+    return () => {
+      clearTimeout(timeoutHandle);
+    };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [githubUsername, accessToken]);
   // try refetch on error
@@ -143,7 +145,9 @@ function SearchGithubRepoResultList({
         await refetchDebounced();
         retryIntervalSetter(retryInterval * 10);
       }, retryInterval);
-      return () => clearTimeout(timeoutHandle);
+      return () => {
+        clearTimeout(timeoutHandle);
+      };
     }
     return () => {};
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -189,11 +193,18 @@ function SearchGithubRepoResultList({
         value={githubRepoSearchString}
         helperText={helperText}
       />
-      {(loading || isCreatingRepo) && <LinearProgress variant="query" />}
+      {(loading || isCreatingRepo) && <LinearProgress variant='query' />}
 
-      <List component="nav" aria-label="main mailbox folders">
+      <List component='nav' aria-label='main mailbox folders'>
         {repoList.map(({ name, url }) => (
-          <ListItem button key={url} onClick={() => onSelectRepo(url, name)} selected={trim(githubWikiUrl) === trim(url)}>
+          <ListItem
+            button
+            key={url}
+            onClick={() => {
+              onSelectRepo(url, name);
+            }}
+            selected={trim(githubWikiUrl) === trim(url)}
+          >
             <ListItemIcon>
               <FolderIcon />
             </ListItemIcon>
@@ -220,20 +231,19 @@ function SearchGithubRepoResultList({
               isCreatingRepoSetter(false);
               githubWikiUrlSetter(wikiUrlToCreate);
             }}
-            selected={isCreateNewRepo}>
+            selected={isCreateNewRepo}
+          >
             <ListItemIcon>
               <CreateNewFolderIcon />
             </ListItemIcon>
             <ListItemText
-              primary={`${
-                isCreateMainWorkspace ? t('AddWorkspace.CreatePublicRepository') : t('AddWorkspace.CreatePrivateRepository')
-              } ${githubRepoSearchString}`}
+              primary={`${isCreateMainWorkspace ? t('AddWorkspace.CreatePublicRepository') : t('AddWorkspace.CreatePrivateRepository')} ${githubRepoSearchString}`}
             />
           </ListItem>
         )}
       </List>
       {repoList.length === 0 && (
-        <ReloadButton color="secondary" endIcon={<CachedIcon />} onClick={async () => await refetchDebounced()}>
+        <ReloadButton color='secondary' endIcon={<CachedIcon />} onClick={async () => await refetchDebounced()}>
           {t('AddWorkspace.Reload')}
         </ReloadButton>
       )}
diff --git a/src/components/TokenForm/GitTokenForm.tsx b/src/components/TokenForm/GitTokenForm.tsx
index 2f4a5d05..3de5c3e8 100644
--- a/src/components/TokenForm/GitTokenForm.tsx
+++ b/src/components/TokenForm/GitTokenForm.tsx
@@ -1,12 +1,12 @@
-import styled from 'styled-components';
 import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
-import { TextField, Button } from '@material-ui/core';
+import { Button, TextField } from '@material-ui/core';
 
-import { SupportedStorageServices } from '@services/types';
 import { useUserInfoObservable } from '@services/auth/hooks';
-import { useAuth } from './gitTokenHooks';
 import { getServiceBranchTypes, getServiceEmailTypes, getServiceTokenTypes, getServiceUserNameTypes } from '@services/auth/interface';
+import { SupportedStorageServices } from '@services/types';
+import { useAuth } from './gitTokenHooks';
 
 const AuthingLoginButton = styled(Button)`
   width: 100%;
diff --git a/src/components/TokenForm/gitTokenHooks.ts b/src/components/TokenForm/gitTokenHooks.ts
index ee2201d5..096760f2 100644
--- a/src/components/TokenForm/gitTokenHooks.ts
+++ b/src/components/TokenForm/gitTokenHooks.ts
@@ -1,8 +1,8 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import { useCallback, useMemo } from 'react';
-import { AuthenticationClient } from 'authing-js-sdk';
+import { APP_DOMAIN, APP_ID } from '@/constants/auth';
 import { SupportedStorageServices } from '@services/types';
-import { APP_ID, APP_DOMAIN } from '@/constants/auth';
+import { AuthenticationClient } from 'authing-js-sdk';
+import { useCallback, useMemo } from 'react';
 
 export function useAuth(storageService: SupportedStorageServices): [() => Promise<void>, () => Promise<void>] {
   const authing = useMemo(
@@ -42,7 +42,9 @@ export function useAuth(storageService: SupportedStorageServices): [() => Promis
             }
           }
         },
-        onError: (code, message) => onFailure(new Error(message + String(code))),
+        onError: (code, message) => {
+          onFailure(new Error(message + String(code)));
+        },
       });
     } catch (error) {
       onFailure(error as Error);
diff --git a/src/components/TokenForm/index.tsx b/src/components/TokenForm/index.tsx
index fa8ffe61..a83e574e 100644
--- a/src/components/TokenForm/index.tsx
+++ b/src/components/TokenForm/index.tsx
@@ -1,10 +1,10 @@
 /* eslint-disable @typescript-eslint/explicit-function-return-type */
-import React, { useEffect, useState } from 'react';
-import styled, { DefaultTheme, keyframes } from 'styled-components';
-import { Tab as TabRaw, ListItemText as ListItemTextRaw } from '@material-ui/core';
-import { TabPanel as TabPanelRaw, TabContext, TabList as TabListRaw } from '@material-ui/lab';
+import { ListItemText as ListItemTextRaw, Tab as TabRaw } from '@material-ui/core';
+import { TabContext, TabList as TabListRaw, TabPanel as TabPanelRaw } from '@material-ui/lab';
 import { SupportedStorageServices } from '@services/types';
+import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+import styled, { DefaultTheme, keyframes } from 'styled-components';
 
 import { GitTokenForm } from './GitTokenForm';
 
@@ -45,7 +45,8 @@ const TabsContainer = styled.div`
     min-width: 160px;
   }
 `;
-const backgroundColorShift = ({ theme }: { theme: DefaultTheme }) => keyframes`
+const backgroundColorShift = ({ theme }: { theme: DefaultTheme }) =>
+  keyframes`
 from {background-color: ${theme.palette.background.default};}
   to {background-color: ${theme.palette.background.default};}
 `;
@@ -85,14 +86,17 @@ export function TokenForm({ storageProvider, storageProviderSetter }: Props): JS
       <TabContext value={currentTab}>
         <TabsContainer>
           <TabList
-            onChange={(_event, newValue) => currentTabSetter(newValue as SupportedStorageServices)}
-            orientation="vertical"
-            variant="scrollable"
+            onChange={(_event, newValue) => {
+              currentTabSetter(newValue as SupportedStorageServices);
+            }}
+            orientation='vertical'
+            variant='scrollable'
             value={currentTab}
-            aria-label="Vertical tabs example">
-            <Tab label="GitHub" value={SupportedStorageServices.github} />
-            <Tab label="GitLab" value={SupportedStorageServices.gitlab} />
-            <Tab label="Gitee" value={SupportedStorageServices.gitee} />
+            aria-label='Vertical tabs example'
+          >
+            <Tab label='GitHub' value={SupportedStorageServices.github} />
+            <Tab label='GitLab' value={SupportedStorageServices.gitlab} />
+            <Tab label='Gitee' value={SupportedStorageServices.gitee} />
           </TabList>
           <TabPanel value={SupportedStorageServices.github}>
             <GitTokenForm storageService={SupportedStorageServices.github} />
diff --git a/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelector.tsx b/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelector.tsx
index ea65be88..3bc4cb04 100644
--- a/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelector.tsx
+++ b/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelector.tsx
@@ -1,10 +1,10 @@
-import { useCallback, MouseEvent, useState } from 'react';
-import { useTranslation } from 'react-i18next';
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
-import { WorkspaceSelector } from './WorkspaceSelector';
-import { IWorkspace } from '@services/workspaces/interface';
 import { getWorkspaceMenuTemplate, openWorkspaceTagTiddler } from '@services/workspaces/getWorkspaceMenuTemplate';
+import { IWorkspace } from '@services/workspaces/interface';
+import { MouseEvent, useCallback, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { WorkspaceSelector } from './WorkspaceSelector';
 
 import defaultIcon from '@/images/default-icon.png';
 
diff --git a/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx b/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx
index 589d187e..37be8006 100644
--- a/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx
+++ b/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx
@@ -1,6 +1,6 @@
-import { DndContext, useSensor, useSensors, PointerSensor } from '@dnd-kit/core';
-import { SortableContext, arrayMove, verticalListSortingStrategy } from '@dnd-kit/sortable';
+import { DndContext, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
 import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
+import { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
 import { IWorkspace, IWorkspaceWithMetadata } from '@services/workspaces/interface';
 import { SortableWorkspaceSelector } from './SortableWorkspaceSelector';
 
@@ -38,7 +38,8 @@ export function SortableWorkspaceSelectorList({ workspacesList, sidebarShortcutH
         });
 
         await window.service.workspace.setWorkspaces(newWorkspaces);
-      }}>
+      }}
+    >
       <SortableContext items={workspaceIDs} strategy={verticalListSortingStrategy}>
         {workspacesList
           .sort((a, b) => a.order - b.order)
diff --git a/src/components/WorkspaceIconAndSelector/WorkspaceSelector.tsx b/src/components/WorkspaceIconAndSelector/WorkspaceSelector.tsx
index 281c2961..fad39400 100644
--- a/src/components/WorkspaceIconAndSelector/WorkspaceSelector.tsx
+++ b/src/components/WorkspaceIconAndSelector/WorkspaceSelector.tsx
@@ -1,11 +1,11 @@
-import Promise from 'bluebird';
-import React, { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
 import BadgeRaw from '@material-ui/core/Badge';
+import Promise from 'bluebird';
+import React, { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import styled, { css, keyframes } from 'styled-components';
 
-import defaultIcon from '../../images/default-icon.png';
 import { getAssetsFileUrl } from '@/helpers/url';
+import defaultIcon from '../../images/default-icon.png';
 
 Promise.config({ cancellation: true });
 
@@ -28,21 +28,21 @@ const Root = styled.div<{ active?: boolean; hibernated?: boolean; workspaceClick
   border: 0;
   border-color: transparent;
   ${({ hibernated }) =>
-    hibernated === true &&
-    css`
+  hibernated === true &&
+  css`
       opacity: 0.4;
     `}
   ${({ active }) =>
-    active === true &&
-    css`
+  active === true &&
+  css`
       opacity: 1;
     `}
       box-sizing: border-box;
   border-left: ${({ workspaceCount }) => (workspaceCount > 1 ? '3px' : '0')} solid
     ${({ active, theme }) => (active === true ? theme.palette.text.primary : 'transparent')};
   ${({ workspaceClickedLoading }) =>
-    workspaceClickedLoading === true &&
-    css`
+  workspaceClickedLoading === true &&
+  css`
       &:hover {
         cursor: wait;
       }
@@ -69,15 +69,15 @@ const Avatar = styled.div<IAvatarProps>`
   text-transform: uppercase;
   overflow: hidden;
   ${({ large }) =>
-    large === true &&
-    css`
+  large === true &&
+  css`
       height: 44px;
       width: 44px;
       line-height: 44px;
     `}
   ${({ transparent }) =>
-    transparent === true &&
-    css`
+  transparent === true &&
+  css`
       background: transparent;
       border: none;
       border-radius: 0;
@@ -91,9 +91,9 @@ const Avatar = styled.div<IAvatarProps>`
     color: ${({ theme }) => theme.palette.common.black};
   }
   ${({ addAvatar }: IAvatarProps) =>
-    addAvatar
-      ? ''
-      : css`
+  addAvatar
+    ? ''
+    : css`
           background-color: transparent;
         `}
 `;
@@ -102,8 +102,8 @@ const AvatarPicture = styled.img<{ large?: boolean }>`
   height: calc(36px - 2px);
   width: calc(36px - 2px);
   ${({ large }) =>
-    large === true &&
-    css`
+  large === true &&
+  css`
       height: 44px;
       width: 44px;
     `}
@@ -119,8 +119,8 @@ const ShortcutText = styled.p<{ active?: boolean }>`
   word-break: break-all;
   text-align: center;
   ${({ active }) =>
-    active === true &&
-    css`
+  active === true &&
+  css`
       text-decoration: underline;
       text-underline-offset: 0.2em;
     `}
@@ -172,28 +172,32 @@ export function WorkspaceSelector({
       active={active}
       onClick={workspaceClickedLoading ? () => {} : onClick}
       workspaceClickedLoading={workspaceClickedLoading}
-      workspaceCount={workspaceCount}>
-      <Badge color="secondary" badgeContent={badgeCount} max={99}>
+      workspaceCount={workspaceCount}
+    >
+      <Badge color='secondary' badgeContent={badgeCount} max={99}>
         {!hideSideBarIcon && (
           <Avatar
             large={!showSidebarShortcutHints}
             transparent={transparentBackground}
             addAvatar={id === 'add'}
             highlightAdd={index === 0}
-            id={id === 'add' || id === 'guide' ? 'add-workspace-button' : `workspace-avatar-${id}`}>
-            {id === 'add' ? (
-              '+'
-            ) : id === 'guide' ? (
-              '※'
-            ) : (
-              <AvatarPicture alt="Icon" large={!showSidebarShortcutHints} src={getAssetsFileUrl(picturePath ?? defaultIcon)} draggable={false} />
-            )}
+            id={id === 'add' || id === 'guide' ? 'add-workspace-button' : `workspace-avatar-${id}`}
+          >
+            {id === 'add'
+              ? (
+                '+'
+              )
+              : (id === 'guide'
+                ? (
+                  '※'
+                )
+                : <AvatarPicture alt='Icon' large={!showSidebarShortcutHints} src={getAssetsFileUrl(picturePath ?? defaultIcon)} draggable={false} />)}
           </Avatar>
         )}
       </Badge>
       {(showSidebarShortcutHints || hideSideBarIcon) && (
         <ShortcutText active={active}>
-          {id === 'add' ? t('WorkspaceSelector.Add') : id === 'guide' ? t('WorkspaceSelector.Guide') : shortWorkspaceName}
+          {id === 'add' ? t('WorkspaceSelector.Add') : (id === 'guide' ? t('WorkspaceSelector.Guide') : shortWorkspaceName)}
         </ShortcutText>
       )}
     </Root>
diff --git a/src/components/WorkspaceIconAndSelector/index.ts b/src/components/WorkspaceIconAndSelector/index.ts
index 58b2d18f..c3b6895a 100644
--- a/src/components/WorkspaceIconAndSelector/index.ts
+++ b/src/components/WorkspaceIconAndSelector/index.ts
@@ -1,3 +1,3 @@
-export * from './WorkspaceSelector';
 export * from './SortableWorkspaceSelector';
 export * from './SortableWorkspaceSelectorList';
+export * from './WorkspaceSelector';
diff --git a/src/components/icon/CommandPaletteSVG.tsx b/src/components/icon/CommandPaletteSVG.tsx
index 046ca279..96bdf2c3 100644
--- a/src/components/icon/CommandPaletteSVG.tsx
+++ b/src/components/icon/CommandPaletteSVG.tsx
@@ -4,10 +4,10 @@ import { SVGContainer } from './SVGContainer';
 
 function CommandPaletteSVG(): JSX.Element {
   return (
-    <svg width="22pt" height="22pt" viewBox="0 0 512 512" style={{ transform: 'rotate(225deg)' }} fill="currentColor">
+    <svg width='22pt' height='22pt' viewBox='0 0 512 512' style={{ transform: 'rotate(225deg)' }} fill='currentColor'>
       <path
-        d="M224 96l16-32 32-16-32-16-16-32-16 32-32 16 32 16 16 32zM80 160l26.66-53.33L160 80l-53.34-26.67L80 0 53.34 53.33 0 80l53.34 26.67L80 160zm0-96c8.84 0 16 7.16 16 16s-7.16 16-16 16-16-7.16-16-16 7.16-16 16-16zm352 224l-26.66 53.33L352 368l53.34 26.67L432 448l26.66-53.33L512 368l-53.34-26.67L432 288zm0 96c-8.84 0-16-7.16-16-16s7.16-16 16-16 16 7.16 16 16-7.16 16-16 16zm70.63-306.04L434.04 9.37C427.79 3.12 419.6 0 411.41 0s-16.38 3.12-22.63 9.37L9.37 388.79c-12.5 12.5-12.5 32.76 0 45.25l68.59 68.59c6.25 6.25 14.44 9.37 22.63 9.37s16.38-3.12 22.63-9.37l379.41-379.41c12.49-12.5 12.49-32.76 0-45.26zM100.59 480L32 411.41l258.38-258.4 68.6 68.6L100.59 480zm281.02-281.02l-68.6-68.6L411.38 32h.03L480 100.59l-98.39 98.39z"
-        fillRule="evenodd"
+        d='M224 96l16-32 32-16-32-16-16-32-16 32-32 16 32 16 16 32zM80 160l26.66-53.33L160 80l-53.34-26.67L80 0 53.34 53.33 0 80l53.34 26.67L80 160zm0-96c8.84 0 16 7.16 16 16s-7.16 16-16 16-16-7.16-16-16 7.16-16 16-16zm352 224l-26.66 53.33L352 368l53.34 26.67L432 448l26.66-53.33L512 368l-53.34-26.67L432 288zm0 96c-8.84 0-16-7.16-16-16s7.16-16 16-16 16 7.16 16 16-7.16 16-16 16zm70.63-306.04L434.04 9.37C427.79 3.12 419.6 0 411.41 0s-16.38 3.12-22.63 9.37L9.37 388.79c-12.5 12.5-12.5 32.76 0 45.25l68.59 68.59c6.25 6.25 14.44 9.37 22.63 9.37s16.38-3.12 22.63-9.37l379.41-379.41c12.49-12.5 12.49-32.76 0-45.26zM100.59 480L32 411.41l258.38-258.4 68.6 68.6L100.59 480zm281.02-281.02l-68.6-68.6L411.38 32h.03L480 100.59l-98.39 98.39z'
+        fillRule='evenodd'
       />
     </svg>
   );
diff --git a/src/constants/appPaths.ts b/src/constants/appPaths.ts
index 924da10d..ea769e27 100644
--- a/src/constants/appPaths.ts
+++ b/src/constants/appPaths.ts
@@ -7,7 +7,7 @@ import { sourcePath } from './paths';
 export const USER_DATA_FOLDER = app.getPath('userData');
 export const SETTINGS_FOLDER = isDevelopmentOrTest
   ? path.resolve(sourcePath, '..', developmentSettingFolderName)
-  : // eslint-disable-next-line @typescript-eslint/no-var-requires
-    path.resolve(USER_DATA_FOLDER, 'settings');
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  : path.resolve(USER_DATA_FOLDER, 'settings');
 export const LOCAL_GIT_DIRECTORY = path.resolve(isDevelopmentOrTest ? path.join(sourcePath, '..') : process.resourcesPath, 'node_modules', 'dugite', 'git');
 export const LOG_FOLDER = isDevelopmentOrTest ? path.resolve(sourcePath, '..', 'logs') : path.resolve(USER_DATA_FOLDER, 'logs');
diff --git a/src/constants/isElectronDevelopment.ts b/src/constants/isElectronDevelopment.ts
index 3200e045..194c5de2 100644
--- a/src/constants/isElectronDevelopment.ts
+++ b/src/constants/isElectronDevelopment.ts
@@ -5,5 +5,5 @@
 const electron = require('electron');
 const { isPackaged } = require('electron-is-packaged');
 
-export const isElectronDevelopment =
-  !isPackaged && (process.env.NODE_ENV === 'development' || (typeof electron === 'string' || electron.app === undefined ? false : !electron.app.isPackaged));
+export const isElectronDevelopment = !isPackaged &&
+  (process.env.NODE_ENV === 'development' || (typeof electron === 'string' || electron.app === undefined ? false : !electron.app.isPackaged));
diff --git a/src/constants/languages.ts b/src/constants/languages.ts
index 0ad062f5..fdc8f790 100644
--- a/src/constants/languages.ts
+++ b/src/constants/languages.ts
@@ -1,6 +1,6 @@
+import { LOCALIZATION_FOLDER } from '@/constants/paths';
 import fs from 'fs-extra';
 import path from 'path';
-import { LOCALIZATION_FOLDER } from '@/constants/paths';
 
 export const supportedLanguagesMap = fs.readJsonSync(path.join(LOCALIZATION_FOLDER, 'supportedLanguages.json')) as Record<string, string>;
 export const tiddlywikiLanguagesMap = fs.readJsonSync(path.join(LOCALIZATION_FOLDER, 'tiddlywikiLanguages.json')) as Record<string, string | undefined>;
diff --git a/src/constants/paths.ts b/src/constants/paths.ts
index f0cf2711..3fbc85e9 100644
--- a/src/constants/paths.ts
+++ b/src/constants/paths.ts
@@ -1,8 +1,8 @@
-import path from 'path';
 import os from 'os';
+import path from 'path';
+import { isMac } from '../helpers/system';
 import { isDevelopmentOrTest } from './environment';
 import { developmentWikiFolderName, localizationFolderName } from './fileNames';
-import { isMac } from '../helpers/system';
 
 /** src folder */
 export const sourcePath = path.resolve(__dirname, '..');
diff --git a/src/constants/wiki.ts b/src/constants/wiki.ts
index 3c68aebf..83d537ae 100644
--- a/src/constants/wiki.ts
+++ b/src/constants/wiki.ts
@@ -1,4 +1,4 @@
 export enum WikiStateKey {
-  titleBarOpened = 'titleBarOpened',
   sideBarOpened = 'sideBarOpened',
+  titleBarOpened = 'titleBarOpened',
 }
diff --git a/src/helpers/configSetting.ts b/src/helpers/configSetting.ts
index 7f1f9dd0..0e2a1278 100644
--- a/src/helpers/configSetting.ts
+++ b/src/helpers/configSetting.ts
@@ -1,13 +1,13 @@
-import fs from 'fs-extra';
-import settings from 'electron-settings';
-import { parse as bestEffortJsonParser } from 'best-effort-json-parser';
 import { SETTINGS_FOLDER } from '@/constants/appPaths';
 import { logger } from '@services/libs/log';
+import { parse as bestEffortJsonParser } from 'best-effort-json-parser';
+import settings from 'electron-settings';
+import fs from 'fs-extra';
 import { isWin } from './system';
 
 export function fixSettingFileWhenError(jsonError: Error): void {
   logger.error('Setting file format bad: ' + jsonError.message);
-  const jsonContent = fs.readFileSync(settings.file(), 'utf-8');
+  const jsonContent = fs.readFileSync(settings.file(), 'utf8');
   logger.info('Try to fix JSON content.');
   try {
     const repaired = bestEffortJsonParser(jsonContent) as Record<string, unknown>;
diff --git a/src/helpers/ip.ts b/src/helpers/ip.ts
index 4baa6a3d..ec6c1730 100644
--- a/src/helpers/ip.ts
+++ b/src/helpers/ip.ts
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import { platform, type, networkInterfaces } from 'os';
 import ip from 'ipaddr.js';
+import { networkInterfaces, platform, type } from 'os';
 
 /**
  * Copy from https://github.com/sindresorhus/internal-ip, to fi xsilverwind/default-gateway 's bug
diff --git a/src/helpers/singleInstance.ts b/src/helpers/singleInstance.ts
index b543e730..d3f46bcf 100644
--- a/src/helpers/singleInstance.ts
+++ b/src/helpers/singleInstance.ts
@@ -1,5 +1,5 @@
-import { app } from 'electron';
 import { logger } from '@services/libs/log';
+import { app } from 'electron';
 
 const gotTheLock = app.requestSingleInstanceLock();
 
diff --git a/src/helpers/url.ts b/src/helpers/url.ts
index edffaa04..a894852a 100644
--- a/src/helpers/url.ts
+++ b/src/helpers/url.ts
@@ -1,6 +1,6 @@
 export function extractDomain(fullUrl: string | undefined): string | undefined {
-  const matches = /^([a-zA-Z\-]+):\/\/([^#/?]+)(?:[#/?]|$)/i.exec(fullUrl ?? '');
-  const domain = matches !== null ? matches[1] : undefined;
+  const matches = /^([a-z\-]+):\/\/([^#/?]+)(?:[#/?]|$)/i.exec(fullUrl ?? '');
+  const domain = matches === null ? undefined : matches[1];
   // https://stackoverflow.com/a/9928725
   return typeof domain === 'string' ? domain.replace(/^(www\.)/, '') : undefined;
 }
diff --git a/src/helpers/useServiceValue.ts b/src/helpers/useServiceValue.ts
index 416503a9..8655e103 100644
--- a/src/helpers/useServiceValue.ts
+++ b/src/helpers/useServiceValue.ts
@@ -1,6 +1,6 @@
-import { useEffect, useState, useCallback } from 'react';
-import { AsyncReturnType } from 'type-fest';
 import useDebouncedCallback from 'beautiful-react-hooks/useDebouncedCallback';
+import { useCallback, useEffect, useState } from 'react';
+import { AsyncReturnType } from 'type-fest';
 
 /**
  * Use value from service, especially constant value that never changes
diff --git a/src/main.ts b/src/main.ts
index 90d5e030..ec5683a9 100755
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,34 +1,34 @@
+/* eslint-disable unicorn/prefer-top-level-await */
 /* eslint-disable @typescript-eslint/no-misused-promises */
 import { uninstall } from './helpers/installV8Cache';
 import 'source-map-support/register';
 import 'reflect-metadata';
 import './helpers/singleInstance';
 import './helpers/configSetting';
-import fs from 'fs-extra';
-import path from 'path';
-import { ipcMain, protocol, powerMonitor, app } from 'electron';
+import { app, ipcMain, powerMonitor, protocol } from 'electron';
 import settings from 'electron-settings';
 import unhandled from 'electron-unhandled';
+import fs from 'fs-extra';
+import path from 'path';
 
-import { buildLanguageMenu } from '@services/menu/buildLanguageMenu';
 import { MainChannel } from '@/constants/channels';
 import { isTest } from '@/constants/environment';
 import { container } from '@services/container';
-import { logger } from '@services/libs/log';
 import { initRendererI18NHandler } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
+import { buildLanguageMenu } from '@services/menu/buildLanguageMenu';
 
+import { bindServiceAndProxy } from '@services/libs/bindServiceAndProxy';
 import serviceIdentifier from '@services/serviceIdentifier';
 import { WindowNames } from '@services/windows/WindowProperties';
-import { bindServiceAndProxy } from '@services/libs/bindServiceAndProxy';
 
-import type { IPreferenceService } from './services/preferences/interface';
-import type { IWikiService } from './services/wiki/interface';
-import type { IWindowService } from './services/windows/interface';
-import type { IWorkspaceViewService } from './services/workspacesView/interface';
-import type { IUpdaterService } from '@services/updater/interface';
 import { reportErrorToGithubWithTemplates } from '@services/native/reportError';
+import type { IUpdaterService } from '@services/updater/interface';
 import { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
 import { isLinux, isMac } from './helpers/system';
+import type { IPreferenceService } from './services/preferences/interface';
+import type { IWindowService } from './services/windows/interface';
+import type { IWorkspaceViewService } from './services/workspacesView/interface';
 
 logger.info('App booting');
 
@@ -82,9 +82,10 @@ ipcMain.once(MainChannel.commonInitFinished, () => {
  */
 const whenCommonInitFinished = async (): Promise<void> => {
   if (commonInitFinished) {
-    return await Promise.resolve();
+    await Promise.resolve();
+    return;
   }
-  return await new Promise((resolve) => {
+  await new Promise<void>((resolve) => {
     ipcMain.once(MainChannel.commonInitFinished, () => {
       commonInitFinished = true;
       resolve();
@@ -112,8 +113,8 @@ const commonInit = async (): Promise<void> => {
   // if user want a menubar, we create a new window for that
   await Promise.all([
     windowService.open(WindowNames.main),
-    preferenceService.get('attachToMenubar').then((attachToMenubar) => {
-      attachToMenubar && windowService.open(WindowNames.menuBar);
+    preferenceService.get('attachToMenubar').then(async (attachToMenubar) => {
+      attachToMenubar && await windowService.open(WindowNames.menuBar);
     }),
   ]);
   // perform wiki startup and git sync for each workspace
@@ -160,7 +161,9 @@ app.on('ready', async () => {
       }
       await updaterService.checkForUpdates();
     })
-    .catch((error) => console.error(error));
+    .catch((error) => {
+      console.error(error);
+    });
   powerMonitor.on('shutdown', () => {
     app.quit();
   });
diff --git a/src/pages/About.tsx b/src/pages/About.tsx
index 71ad2928..8e941428 100644
--- a/src/pages/About.tsx
+++ b/src/pages/About.tsx
@@ -1,10 +1,10 @@
 import React from 'react';
-import styled from 'styled-components';
-import { Trans, useTranslation } from 'react-i18next';
 import { Helmet } from 'react-helmet';
+import { Trans, useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
-import { Button, DialogContent as DialogContentRaw } from '@material-ui/core';
 import { usePromiseValue } from '@/helpers/useServiceValue';
+import { Button, DialogContent as DialogContentRaw } from '@material-ui/core';
 import iconPath from '../../build-resources/icon.png';
 
 const DialogContent = styled(DialogContentRaw)`
@@ -81,11 +81,11 @@ export default function About(): JSX.Element {
 
   return (
     <DialogContent>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       <Helmet>
         <title>{t('ContextMenu.About')}</title>
       </Helmet>
-      <Icon src={iconPath} alt="TidGi" />
+      <Icon src={iconPath} alt='TidGi' />
       <Title>TidGi ({platform ?? 'Unknown Platform'})</Title>
       <TidGiVersion>{`Version v${appVersion ?? ' - '}.`}</TidGiVersion>
       <DependenciesVersionsContainer>
@@ -97,45 +97,59 @@ export default function About(): JSX.Element {
       </DependenciesVersionsContainer>
 
       <ButtonContainer>
-        <GoToTheWebsiteButton onClick={async () => await window.service.native.open('https://github.com/tiddly-gittly/TidGi-Desktop')}>
+        <GoToTheWebsiteButton
+          onClick={async () => {
+            await window.service.native.open('https://github.com/tiddly-gittly/TidGi-Desktop');
+          }}
+        >
           Website
         </GoToTheWebsiteButton>
-        <GoToTheWebsiteButton onClick={async () => await window.service.native.open('https://github.com/tiddly-gittly/TidGi-Desktop/issues/new/choose')}>
+        <GoToTheWebsiteButton
+          onClick={async () => {
+            await window.service.native.open('https://github.com/tiddly-gittly/TidGi-Desktop/issues/new/choose');
+          }}
+        >
           Support
         </GoToTheWebsiteButton>
       </ButtonContainer>
 
       <MadeBy>
-        <Trans t={t} i18nKey="Dialog.MadeWithLove">
-          <span>Made with </span>
-          <span role="img" aria-label="love">
+        <Trans t={t} i18nKey='Dialog.MadeWithLove'>
+          <span>Made with</span>
+          <span role='img' aria-label='love'>
             ❤
           </span>
-          <span> by </span>
+          <span>by</span>
         </Trans>
         <Link
-          onClick={async () => await window.service.native.open('https://onetwo.ren/wiki/')}
+          onClick={async () => {
+            await window.service.native.open('https://onetwo.ren/wiki/');
+          }}
           onKeyDown={async (event) => {
             if (event.key !== 'Enter') {
               return;
             }
             await window.service.native.open('https://onetwo.ren/wiki/');
           }}
-          role="link"
-          tabIndex={0}>
+          role='link'
+          tabIndex={0}
+        >
           {t('LinOnetwo')}
         </Link>
-        <span> && </span>
+        <span>&&</span>
         <Link
-          onClick={async () => await window.service.native.open('https://webcatalog.app/?utm_source=tidgi_app')}
+          onClick={async () => {
+            await window.service.native.open('https://webcatalog.app/?utm_source=tidgi_app');
+          }}
           onKeyDown={async (event) => {
             if (event.key !== 'Enter') {
               return;
             }
             await window.service.native.open('https://webcatalog.app/?utm_source=tidgi_app');
           }}
-          role="link"
-          tabIndex={0}>
+          role='link'
+          tabIndex={0}
+        >
           {t('Preference.WebCatalog')}
         </Link>
       </MadeBy>
diff --git a/src/pages/AddWorkspace/CloneWikiDoneButton.tsx b/src/pages/AddWorkspace/CloneWikiDoneButton.tsx
index 649b8d8a..81ef3833 100644
--- a/src/pages/AddWorkspace/CloneWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/CloneWikiDoneButton.tsx
@@ -1,13 +1,13 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 import { useTranslation } from 'react-i18next';
 
-import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
+import { LinearProgress, Snackbar, Typography } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 
+import { CloseButton, ReportErrorFabButton, WikiLocation } from './FormComponents';
+import { useCloneWiki, useValidateCloneWiki } from './useCloneWiki';
 import type { IWikiWorkspaceFormProps } from './useForm';
-import { useValidateCloneWiki, useCloneWiki } from './useCloneWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation, CloseButton, ReportErrorFabButton } from './FormComponents';
 
 export function CloneWikiDoneButton({ form, isCreateMainWorkspace, errorInWhichComponentSetter }: IWikiWorkspaceFormProps): JSX.Element {
   const { t } = useTranslation();
@@ -21,7 +21,7 @@ export function CloneWikiDoneButton({ form, isCreateMainWorkspace, errorInWhichC
   if (hasError) {
     return (
       <>
-        <CloseButton variant="contained" disabled>
+        <CloseButton variant='contained' disabled>
           {wikiCreationMessage}
         </CloseButton>
         {wikiCreationMessage !== undefined && <ReportErrorFabButton message={wikiCreationMessage} />}
@@ -30,29 +30,37 @@ export function CloneWikiDoneButton({ form, isCreateMainWorkspace, errorInWhichC
   }
   return (
     <>
-      {inProgressOrError && <LinearProgress color="secondary" />}
-      <Snackbar open={logPanelOpened} autoHideDuration={5000} onClose={() => logPanelSetter(false)}>
-        <Alert severity="info">{wikiCreationMessage}</Alert>
+      {inProgressOrError && <LinearProgress color='secondary' />}
+      <Snackbar
+        open={logPanelOpened}
+        autoHideDuration={5000}
+        onClose={() => {
+          logPanelSetter(false);
+        }}
+      >
+        <Alert severity='info'>{wikiCreationMessage}</Alert>
       </Snackbar>
 
-      {isCreateMainWorkspace ? (
-        <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.CloneWiki')}
-          </Typography>
-          <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
-        </CloseButton>
-      ) : (
-        <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.CloneWiki')}
-          </Typography>
-          <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.AndLinkToMainWorkspace')}
-          </Typography>
-        </CloseButton>
-      )}
+      {isCreateMainWorkspace
+        ? (
+          <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.CloneWiki')}
+            </Typography>
+            <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
+          </CloseButton>
+        )
+        : (
+          <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.CloneWiki')}
+            </Typography>
+            <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.AndLinkToMainWorkspace')}
+            </Typography>
+          </CloseButton>
+        )}
     </>
   );
 }
diff --git a/src/pages/AddWorkspace/CloneWikiForm.tsx b/src/pages/AddWorkspace/CloneWikiForm.tsx
index ef8b35bb..51a8f9ff 100644
--- a/src/pages/AddWorkspace/CloneWikiForm.tsx
+++ b/src/pages/AddWorkspace/CloneWikiForm.tsx
@@ -1,20 +1,13 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import React, { useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Typography, MenuItem } from '@material-ui/core';
+import { MenuItem, Typography } from '@material-ui/core';
 import { Folder as FolderIcon } from '@material-ui/icons';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
 
-import {
-  CreateContainer,
-  LocationPickerContainer,
-  LocationPickerInput,
-  LocationPickerButton,
-  SoftLinkToMainWikiSelect,
-  SubWikiTagAutoComplete,
-} from './FormComponents';
+import { CreateContainer, LocationPickerButton, LocationPickerContainer, LocationPickerInput, SoftLinkToMainWikiSelect, SubWikiTagAutoComplete } from './FormComponents';
 
-import type { IWikiWorkspaceFormProps } from './useForm';
 import { useValidateCloneWiki } from './useCloneWiki';
+import type { IWikiWorkspaceFormProps } from './useForm';
 
 export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichComponent, errorInWhichComponentSetter }: IWikiWorkspaceFormProps): JSX.Element {
   const { t } = useTranslation();
@@ -24,7 +17,9 @@ export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichCompone
       <LocationPickerContainer>
         <LocationPickerInput
           error={errorInWhichComponent.parentFolderLocation}
-          onChange={(event) => form.parentFolderLocationSetter(event.target.value)}
+          onChange={(event) => {
+            form.parentFolderLocationSetter(event.target.value);
+          }}
           label={t('AddWorkspace.WorkspaceParentFolder')}
           value={form.parentFolderLocation}
         />
@@ -37,8 +32,9 @@ export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichCompone
               form.parentFolderLocationSetter(filePaths[0]);
             }
           }}
-          endIcon={<FolderIcon />}>
-          <Typography variant="button" display="inline">
+          endIcon={<FolderIcon />}
+        >
+          <Typography variant='button' display='inline'>
             {t('AddWorkspace.Choose')}
           </Typography>
         </LocationPickerButton>
@@ -46,7 +42,9 @@ export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichCompone
       <LocationPickerContainer>
         <LocationPickerInput
           error={errorInWhichComponent.wikiFolderName}
-          onChange={(event) => form.wikiFolderNameSetter(event.target.value)}
+          onChange={(event) => {
+            form.wikiFolderNameSetter(event.target.value);
+          }}
           label={t('AddWorkspace.WorkspaceFolderNameToCreate')}
           helperText={`${t('AddWorkspace.CloneWiki')}${form.wikiFolderLocation ?? ''}`}
           value={form.wikiFolderName}
@@ -57,16 +55,15 @@ export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichCompone
           <SoftLinkToMainWikiSelect
             error={errorInWhichComponent.mainWikiToLink}
             label={t('AddWorkspace.MainWorkspaceLocation')}
-            helperText={
-              form.mainWikiToLink.wikiFolderLocation &&
+            helperText={form.mainWikiToLink.wikiFolderLocation &&
               `${t('AddWorkspace.SubWorkspaceWillLinkTo')}
-                    ${form.mainWikiToLink.wikiFolderLocation}/tiddlers/${form.wikiFolderName}`
-            }
+                    ${form.mainWikiToLink.wikiFolderLocation}/tiddlers/${form.wikiFolderName}`}
             value={form.mainWikiToLinkIndex}
             onChange={(event) => {
               const index = event.target.value as unknown as number;
               form.mainWikiToLinkSetter(form.mainWorkspaceList[index]);
-            }}>
+            }}
+          >
             {form.mainWorkspaceList.map((workspace, index) => (
               <MenuItem key={index} value={index}>
                 {workspace.name}
@@ -76,7 +73,9 @@ export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichCompone
           <SubWikiTagAutoComplete
             options={form.fileSystemPaths.map((fileSystemPath) => fileSystemPath.tagName)}
             value={form.tagName}
-            onInputChange={(_, value) => form.tagNameSetter(value)}
+            onInputChange={(_, value) => {
+              form.tagNameSetter(value);
+            }}
             renderInput={(parameters) => (
               <LocationPickerInput
                 {...parameters}
diff --git a/src/pages/AddWorkspace/Description.tsx b/src/pages/AddWorkspace/Description.tsx
index f3fe674e..17fbb282 100644
--- a/src/pages/AddWorkspace/Description.tsx
+++ b/src/pages/AddWorkspace/Description.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
-import styled from 'styled-components';
 import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
-import Paper from '@material-ui/core/Paper';
 import FormControlLabel from '@material-ui/core/FormControlLabel';
+import Paper from '@material-ui/core/Paper';
 import SwitchRaw from '@material-ui/core/Switch';
 import Typography from '@material-ui/core/Typography';
 
@@ -36,10 +36,17 @@ export function MainSubWikiDescription({
   return (
     <Container elevation={0} square>
       <FormControlLabel
-        control={<Switch checked={isCreateMainWorkspace} onChange={(event) => isCreateMainWorkspaceSetter(event.target.checked)} />}
+        control={
+          <Switch
+            checked={isCreateMainWorkspace}
+            onChange={(event) => {
+              isCreateMainWorkspaceSetter(event.target.checked);
+            }}
+          />
+        }
         label={label}
       />
-      <Typography variant="body2" display="inline">
+      <Typography variant='body2' display='inline'>
         {description}
       </Typography>
     </Container>
@@ -63,10 +70,17 @@ export function SyncedWikiDescription({
   return (
     <Container elevation={0} square>
       <FormControlLabel
-        control={<Switch checked={isCreateSyncedWorkspace} onChange={(event) => isCreateSyncedWorkspaceSetter(event.target.checked)} />}
+        control={
+          <Switch
+            checked={isCreateSyncedWorkspace}
+            onChange={(event) => {
+              isCreateSyncedWorkspaceSetter(event.target.checked);
+            }}
+          />
+        }
         label={label}
       />
-      <Typography variant="body2" display="inline">
+      <Typography variant='body2' display='inline'>
         {description}
       </Typography>
     </Container>
diff --git a/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx b/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx
index 5c2c006b..e39aaf2e 100644
--- a/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx
@@ -1,12 +1,12 @@
 import { useTranslation } from 'react-i18next';
 
-import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
+import { LinearProgress, Snackbar, Typography } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 
+import { CloseButton, ReportErrorFabButton, WikiLocation } from './FormComponents';
+import { useExistedWiki, useValidateExistedWiki } from './useExistedWiki';
 import type { IWikiWorkspaceFormProps } from './useForm';
-import { useValidateExistedWiki, useExistedWiki } from './useExistedWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation, CloseButton, ReportErrorFabButton } from './FormComponents';
 
 export function ExistedWikiDoneButton({
   form,
@@ -26,7 +26,7 @@ export function ExistedWikiDoneButton({
   if (hasError) {
     return (
       <>
-        <CloseButton variant="contained" disabled>
+        <CloseButton variant='contained' disabled>
           {wikiCreationMessage}
         </CloseButton>
         {wikiCreationMessage !== undefined && <ReportErrorFabButton message={wikiCreationMessage} />}
@@ -35,29 +35,37 @@ export function ExistedWikiDoneButton({
   }
   return (
     <>
-      {inProgressOrError && <LinearProgress color="secondary" />}
-      <Snackbar open={logPanelOpened} autoHideDuration={5000} onClose={() => logPanelSetter(false)}>
-        <Alert severity="info">{wikiCreationMessage}</Alert>
+      {inProgressOrError && <LinearProgress color='secondary' />}
+      <Snackbar
+        open={logPanelOpened}
+        autoHideDuration={5000}
+        onClose={() => {
+          logPanelSetter(false);
+        }}
+      >
+        <Alert severity='info'>{wikiCreationMessage}</Alert>
       </Snackbar>
 
-      {isCreateMainWorkspace ? (
-        <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.ImportWiki')}
-          </Typography>
-          <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
-        </CloseButton>
-      ) : (
-        <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.ImportWiki')}
-          </Typography>
-          <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.AndLinkToMainWorkspace')}
-          </Typography>
-        </CloseButton>
-      )}
+      {isCreateMainWorkspace
+        ? (
+          <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.ImportWiki')}
+            </Typography>
+            <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
+          </CloseButton>
+        )
+        : (
+          <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.ImportWiki')}
+            </Typography>
+            <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.AndLinkToMainWorkspace')}
+            </Typography>
+          </CloseButton>
+        )}
     </>
   );
 }
diff --git a/src/pages/AddWorkspace/ExistedWikiForm.tsx b/src/pages/AddWorkspace/ExistedWikiForm.tsx
index 33b0849a..dec3a1f3 100644
--- a/src/pages/AddWorkspace/ExistedWikiForm.tsx
+++ b/src/pages/AddWorkspace/ExistedWikiForm.tsx
@@ -1,20 +1,13 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
+import { MenuItem, Typography } from '@material-ui/core';
+import { Folder as FolderIcon } from '@material-ui/icons';
 import React, { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Typography, MenuItem } from '@material-ui/core';
-import { Folder as FolderIcon } from '@material-ui/icons';
 
-import {
-  CreateContainer,
-  LocationPickerContainer,
-  LocationPickerInput,
-  LocationPickerButton,
-  SoftLinkToMainWikiSelect,
-  SubWikiTagAutoComplete,
-} from './FormComponents';
+import { CreateContainer, LocationPickerButton, LocationPickerContainer, LocationPickerInput, SoftLinkToMainWikiSelect, SubWikiTagAutoComplete } from './FormComponents';
 
-import type { IWikiWorkspaceFormProps } from './useForm';
 import { useValidateExistedWiki } from './useExistedWiki';
+import type { IWikiWorkspaceFormProps } from './useForm';
 
 export function ExistedWikiForm({
   form,
@@ -73,8 +66,9 @@ export function ExistedWikiForm({
               onLocationChange(filePaths[0]);
             }
           }}
-          endIcon={<FolderIcon />}>
-          <Typography variant="button" display="inline">
+          endIcon={<FolderIcon />}
+        >
+          <Typography variant='button' display='inline'>
             {t('AddWorkspace.Choose')}
           </Typography>
         </LocationPickerButton>
@@ -84,16 +78,15 @@ export function ExistedWikiForm({
           <SoftLinkToMainWikiSelect
             error={errorInWhichComponent.mainWikiToLink}
             label={t('AddWorkspace.MainWorkspaceLocation')}
-            helperText={
-              mainWikiToLink.wikiFolderLocation &&
+            helperText={mainWikiToLink.wikiFolderLocation &&
               `${t('AddWorkspace.SubWorkspaceWillLinkTo')}
-                    ${mainWikiToLink.wikiFolderLocation}/tiddlers/${wikiFolderName}`
-            }
+                    ${mainWikiToLink.wikiFolderLocation}/tiddlers/${wikiFolderName}`}
             value={mainWikiToLinkIndex}
             onChange={(event) => {
               const index = event.target.value as unknown as number;
               mainWikiToLinkSetter(mainWorkspaceList[index]);
-            }}>
+            }}
+          >
             {mainWorkspaceList.map((workspace, index) => (
               <MenuItem key={index} value={index}>
                 {workspace.name}
@@ -103,7 +96,9 @@ export function ExistedWikiForm({
           <SubWikiTagAutoComplete
             options={fileSystemPaths.map((fileSystemPath) => fileSystemPath.tagName)}
             value={tagName}
-            onInputChange={(_, value) => tagNameSetter(value)}
+            onInputChange={(_, value) => {
+              tagNameSetter(value);
+            }}
             renderInput={(parameters) => (
               <LocationPickerInput
                 {...parameters}
diff --git a/src/pages/AddWorkspace/FormComponents.tsx b/src/pages/AddWorkspace/FormComponents.tsx
index d70e425c..83d23c6e 100644
--- a/src/pages/AddWorkspace/FormComponents.tsx
+++ b/src/pages/AddWorkspace/FormComponents.tsx
@@ -1,6 +1,6 @@
-import styled, { css } from 'styled-components';
-import { Paper, Button, TextField, Autocomplete, Typography, Fab, Tooltip } from '@material-ui/core';
+import { Autocomplete, Button, Fab, Paper, TextField, Tooltip, Typography } from '@material-ui/core';
 import { useTranslation } from 'react-i18next';
+import styled, { css } from 'styled-components';
 
 export const CreateContainer = styled(Paper)`
   padding: 10px;
@@ -28,9 +28,9 @@ export const LocationPickerButton = styled(Button)`
 `;
 export const CloseButton = styled(Button)`
   ${({ disabled }) =>
-    disabled === true
-      ? ''
-      : css`
+  disabled === true
+    ? ''
+    : css`
           white-space: nowrap;
         `}
   width: 100%;
@@ -61,12 +61,13 @@ export function ReportErrorButton(props: { message: string }): JSX.Element {
   return (
     <Tooltip title={(t('Dialog.ReportBugDetail') ?? '') + (t('Menu.ReportBugViaGithub') ?? '')}>
       <Button
-        color="secondary"
+        color='secondary'
         onClick={() => {
           const error = new Error(props.message);
           error.stack = 'ReportErrorButton';
           void window.service.native.openNewGitHubIssue(error);
-        }}>
+        }}
+      >
         {t('Dialog.ReportBug')}
       </Button>
     </Tooltip>
@@ -85,12 +86,13 @@ export function ReportErrorFabButton(props: { message: string }): JSX.Element {
   return (
     <Tooltip title={(t('Dialog.ReportBugDetail') ?? '') + (t('Menu.ReportBugViaGithub') ?? '')}>
       <AbsoluteFab
-        color="default"
+        color='default'
         onClick={() => {
           const error = new Error(props.message);
           error.stack = 'ReportErrorButton';
           void window.service.native.openNewGitHubIssue(error);
-        }}>
+        }}
+      >
         {t('Dialog.ReportBug')}
       </AbsoluteFab>
     </Tooltip>
diff --git a/src/pages/AddWorkspace/GitRepoUrlForm.tsx b/src/pages/AddWorkspace/GitRepoUrlForm.tsx
index ecd05d4c..807d6819 100644
--- a/src/pages/AddWorkspace/GitRepoUrlForm.tsx
+++ b/src/pages/AddWorkspace/GitRepoUrlForm.tsx
@@ -26,7 +26,14 @@ export function GitRepoUrlForm({
   return (
     <CreateContainer elevation={2} square>
       <LocationPickerContainer>
-        <LocationPickerInput error={error} onChange={(event) => gitRepoUrlSetter(event.target.value)} label={t('AddWorkspace.GitRepoUrl')} value={gitRepoUrl} />
+        <LocationPickerInput
+          error={error}
+          onChange={(event) => {
+            gitRepoUrlSetter(event.target.value);
+          }}
+          label={t('AddWorkspace.GitRepoUrl')}
+          value={gitRepoUrl}
+        />
       </LocationPickerContainer>
       {storageProvider === SupportedStorageServices.github && (
         <SearchGithubRepo
diff --git a/src/pages/AddWorkspace/ImportHtmlWikiDoneButton.tsx b/src/pages/AddWorkspace/ImportHtmlWikiDoneButton.tsx
index 37973b56..cdb506dd 100644
--- a/src/pages/AddWorkspace/ImportHtmlWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/ImportHtmlWikiDoneButton.tsx
@@ -1,12 +1,12 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import { useTranslation } from 'react-i18next';
 import Alert from '@material-ui/lab/Alert';
+import { useTranslation } from 'react-i18next';
 
-import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
+import { LinearProgress, Snackbar, Typography } from '@material-ui/core';
+import { CloseButton, ReportErrorFabButton, WikiLocation } from './FormComponents';
 import type { IWikiWorkspaceFormProps } from './useForm';
-import { useValidateHtmlWiki, useImportHtmlWiki } from './useImportHtmlWiki';
+import { useImportHtmlWiki, useValidateHtmlWiki } from './useImportHtmlWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation, CloseButton, ReportErrorFabButton } from './FormComponents';
 
 export function ImportHtmlWikiDoneButton({
   form,
@@ -33,7 +33,7 @@ export function ImportHtmlWikiDoneButton({
   if (hasError) {
     return (
       <>
-        <CloseButton variant="contained" disabled>
+        <CloseButton variant='contained' disabled>
           {wikiCreationMessage}
         </CloseButton>
         {wikiCreationMessage !== undefined && <ReportErrorFabButton message={wikiCreationMessage} />}
@@ -42,14 +42,20 @@ export function ImportHtmlWikiDoneButton({
   }
   return (
     <>
-      {inProgressOrError && <LinearProgress color="secondary" />}
+      {inProgressOrError && <LinearProgress color='secondary' />}
       {/* 这个好像是log面板 */}
-      <Snackbar open={logPanelOpened} autoHideDuration={5000} onClose={() => logPanelSetter(false)}>
-        <Alert severity="info">{wikiCreationMessage}</Alert>
+      <Snackbar
+        open={logPanelOpened}
+        autoHideDuration={5000}
+        onClose={() => {
+          logPanelSetter(false);
+        }}
+      >
+        <Alert severity='info'>{wikiCreationMessage}</Alert>
       </Snackbar>
 
-      <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-        <Typography variant="body1" display="inline">
+      <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+        <Typography variant='body1' display='inline'>
           {t('AddWorkspace.ImportWiki')}
         </Typography>
         <WikiLocation>{form.wikiHtmlPath}</WikiLocation>
diff --git a/src/pages/AddWorkspace/ImportHtmlWikiForm.tsx b/src/pages/AddWorkspace/ImportHtmlWikiForm.tsx
index 37f1e5e1..e574c66b 100644
--- a/src/pages/AddWorkspace/ImportHtmlWikiForm.tsx
+++ b/src/pages/AddWorkspace/ImportHtmlWikiForm.tsx
@@ -1,9 +1,9 @@
-import { useTranslation } from 'react-i18next';
 import { Typography } from '@material-ui/core';
 import { Folder as FolderIcon } from '@material-ui/icons';
+import { useTranslation } from 'react-i18next';
 import { useValidateHtmlWiki } from './useImportHtmlWiki';
 
-import { CreateContainer, LocationPickerContainer, LocationPickerInput, LocationPickerButton } from './FormComponents';
+import { CreateContainer, LocationPickerButton, LocationPickerContainer, LocationPickerInput } from './FormComponents';
 
 import type { IWikiWorkspaceFormProps } from './useForm';
 
@@ -45,8 +45,9 @@ export function ImportHtmlWikiForm({
               }
             }
           }}
-          endIcon={<FolderIcon />}>
-          <Typography variant="button" display="inline">
+          endIcon={<FolderIcon />}
+        >
+          <Typography variant='button' display='inline'>
             {t('AddWorkspace.Choose')}
           </Typography>
         </LocationPickerButton>
@@ -54,7 +55,9 @@ export function ImportHtmlWikiForm({
       <LocationPickerContainer>
         <LocationPickerInput
           error={errorInWhichComponent.parentFolderLocation}
-          onChange={(event) => form.parentFolderLocationSetter(event.target.value)}
+          onChange={(event) => {
+            form.parentFolderLocationSetter(event.target.value);
+          }}
           label={t('AddWorkspace.WorkspaceParentFolder')}
           value={parentFolderLocation}
         />
@@ -67,8 +70,9 @@ export function ImportHtmlWikiForm({
               form.parentFolderLocationSetter(filePaths[0]);
             }
           }}
-          endIcon={<FolderIcon />}>
-          <Typography variant="button" display="inline">
+          endIcon={<FolderIcon />}
+        >
+          <Typography variant='button' display='inline'>
             {t('AddWorkspace.Choose')}
           </Typography>
         </LocationPickerButton>
@@ -76,7 +80,9 @@ export function ImportHtmlWikiForm({
       <LocationPickerContainer>
         <LocationPickerInput
           error={errorInWhichComponent.wikiFolderName}
-          onChange={(event) => wikiFolderNameSetter(event.target.value)}
+          onChange={(event) => {
+            wikiFolderNameSetter(event.target.value);
+          }}
           label={t('AddWorkspace.ExtractedWikiFolderName')}
           helperText={`${t('AddWorkspace.CreateWiki')}${wikiFolderLocation ?? ''}`}
           value={wikiFolderName}
diff --git a/src/pages/AddWorkspace/NewWikiDoneButton.tsx b/src/pages/AddWorkspace/NewWikiDoneButton.tsx
index 55b0858c..a20ffbef 100644
--- a/src/pages/AddWorkspace/NewWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/NewWikiDoneButton.tsx
@@ -1,13 +1,13 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 import { useTranslation } from 'react-i18next';
 
-import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
+import { LinearProgress, Snackbar, Typography } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 
+import { CloseButton, ReportErrorFabButton, WikiLocation } from './FormComponents';
 import type { IWikiWorkspaceFormProps } from './useForm';
-import { useValidateNewWiki, useNewWiki } from './useNewWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation, CloseButton, ReportErrorFabButton } from './FormComponents';
+import { useNewWiki, useValidateNewWiki } from './useNewWiki';
 
 export function NewWikiDoneButton({
   form,
@@ -27,7 +27,7 @@ export function NewWikiDoneButton({
   if (hasError) {
     return (
       <>
-        <CloseButton variant="contained" disabled={true}>
+        <CloseButton variant='contained' disabled={true}>
           {wikiCreationMessage}
         </CloseButton>
         {wikiCreationMessage !== undefined && <ReportErrorFabButton message={wikiCreationMessage} />}
@@ -36,29 +36,37 @@ export function NewWikiDoneButton({
   }
   return (
     <>
-      {inProgressOrError && <LinearProgress color="secondary" />}
-      <Snackbar open={logPanelOpened} autoHideDuration={5000} onClose={() => logPanelSetter(false)}>
-        <Alert severity="info">{wikiCreationMessage}</Alert>
+      {inProgressOrError && <LinearProgress color='secondary' />}
+      <Snackbar
+        open={logPanelOpened}
+        autoHideDuration={5000}
+        onClose={() => {
+          logPanelSetter(false);
+        }}
+      >
+        <Alert severity='info'>{wikiCreationMessage}</Alert>
       </Snackbar>
 
-      {isCreateMainWorkspace ? (
-        <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.CreateWiki')}
-          </Typography>
-          <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
-        </CloseButton>
-      ) : (
-        <CloseButton variant="contained" color="secondary" disabled={inProgressOrError} onClick={onSubmit}>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.CreateWiki')}
-          </Typography>
-          <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
-          <Typography variant="body1" display="inline">
-            {t('AddWorkspace.AndLinkToMainWorkspace')}
-          </Typography>
-        </CloseButton>
-      )}
+      {isCreateMainWorkspace
+        ? (
+          <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.CreateWiki')}
+            </Typography>
+            <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
+          </CloseButton>
+        )
+        : (
+          <CloseButton variant='contained' color='secondary' disabled={inProgressOrError} onClick={onSubmit}>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.CreateWiki')}
+            </Typography>
+            <WikiLocation>{form.wikiFolderLocation}</WikiLocation>
+            <Typography variant='body1' display='inline'>
+              {t('AddWorkspace.AndLinkToMainWorkspace')}
+            </Typography>
+          </CloseButton>
+        )}
     </>
   );
 }
diff --git a/src/pages/AddWorkspace/NewWikiForm.tsx b/src/pages/AddWorkspace/NewWikiForm.tsx
index b5b74fd7..e8cc9bf3 100644
--- a/src/pages/AddWorkspace/NewWikiForm.tsx
+++ b/src/pages/AddWorkspace/NewWikiForm.tsx
@@ -1,16 +1,9 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import { useTranslation } from 'react-i18next';
-import { Typography, MenuItem } from '@material-ui/core';
+import { MenuItem, Typography } from '@material-ui/core';
 import { Folder as FolderIcon } from '@material-ui/icons';
+import { useTranslation } from 'react-i18next';
 
-import {
-  CreateContainer,
-  LocationPickerContainer,
-  LocationPickerInput,
-  LocationPickerButton,
-  SoftLinkToMainWikiSelect,
-  SubWikiTagAutoComplete,
-} from './FormComponents';
+import { CreateContainer, LocationPickerButton, LocationPickerContainer, LocationPickerInput, SoftLinkToMainWikiSelect, SubWikiTagAutoComplete } from './FormComponents';
 
 import type { IWikiWorkspaceFormProps } from './useForm';
 import { useValidateNewWiki } from './useNewWiki';
@@ -29,7 +22,9 @@ export function NewWikiForm({
       <LocationPickerContainer>
         <LocationPickerInput
           error={errorInWhichComponent.parentFolderLocation}
-          onChange={(event) => form.parentFolderLocationSetter(event.target.value)}
+          onChange={(event) => {
+            form.parentFolderLocationSetter(event.target.value);
+          }}
           label={t('AddWorkspace.WorkspaceParentFolder')}
           value={form.parentFolderLocation}
         />
@@ -42,8 +37,9 @@ export function NewWikiForm({
               form.parentFolderLocationSetter(filePaths[0]);
             }
           }}
-          endIcon={<FolderIcon />}>
-          <Typography variant="button" display="inline">
+          endIcon={<FolderIcon />}
+        >
+          <Typography variant='button' display='inline'>
             {t('AddWorkspace.Choose')}
           </Typography>
         </LocationPickerButton>
@@ -51,7 +47,9 @@ export function NewWikiForm({
       <LocationPickerContainer>
         <LocationPickerInput
           error={errorInWhichComponent.wikiFolderName}
-          onChange={(event) => form.wikiFolderNameSetter(event.target.value)}
+          onChange={(event) => {
+            form.wikiFolderNameSetter(event.target.value);
+          }}
           label={t('AddWorkspace.WorkspaceFolderNameToCreate')}
           helperText={`${t('AddWorkspace.CreateWiki')}${form.wikiFolderLocation ?? ''}`}
           value={form.wikiFolderName}
@@ -72,7 +70,8 @@ export function NewWikiForm({
             onChange={(event) => {
               const index = event.target.value as unknown as number;
               form.mainWikiToLinkSetter(form.mainWorkspaceList[index]);
-            }}>
+            }}
+          >
             {form.mainWorkspaceList.map((workspace, index) => (
               <MenuItem key={index} value={index}>
                 {workspace.name}
@@ -82,7 +81,9 @@ export function NewWikiForm({
           <SubWikiTagAutoComplete
             options={form.fileSystemPaths.map((fileSystemPath) => fileSystemPath.tagName)}
             value={form.tagName}
-            onInputChange={(_, value) => form.tagNameSetter(value)}
+            onInputChange={(_, value) => {
+              form.tagNameSetter(value);
+            }}
             renderInput={(parameters) => (
               <LocationPickerInput
                 error={errorInWhichComponent.tagName}
diff --git a/src/pages/AddWorkspace/index.tsx b/src/pages/AddWorkspace/index.tsx
index 493457e0..4743f2d7 100644
--- a/src/pages/AddWorkspace/index.tsx
+++ b/src/pages/AddWorkspace/index.tsx
@@ -1,29 +1,29 @@
-import React, { useState, useEffect } from 'react';
-import styled from 'styled-components';
-import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet';
-import { Accordion as AccordionRaw, AccordionSummary, AccordionDetails, AppBar, Paper as PaperRaw, Tab as TabRaw } from '@material-ui/core';
-import { TabPanel as TabPanelRaw, TabContext, TabList as TabListRaw } from '@material-ui/lab';
+import { Accordion as AccordionRaw, AccordionDetails, AccordionSummary, AppBar, Paper as PaperRaw, Tab as TabRaw } from '@material-ui/core';
 import { ExpandMore as ExpandMoreIcon } from '@material-ui/icons';
+import { TabContext, TabList as TabListRaw, TabPanel as TabPanelRaw } from '@material-ui/lab';
+import React, { useEffect, useState } from 'react';
+import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
 import { SupportedStorageServices } from '@services/types';
 
 import { MainSubWikiDescription, SyncedWikiDescription } from './Description';
 
-import { NewWikiForm } from './NewWikiForm';
-import { NewWikiDoneButton } from './NewWikiDoneButton';
-import { ExistedWikiForm } from './ExistedWikiForm';
-import { ExistedWikiDoneButton } from './ExistedWikiDoneButton';
-import { CloneWikiForm } from './CloneWikiForm';
 import { CloneWikiDoneButton } from './CloneWikiDoneButton';
-import { IErrorInWhichComponent, useIsCreateSyncedWorkspace, useWikiWorkspaceForm } from './useForm';
+import { CloneWikiForm } from './CloneWikiForm';
+import { ExistedWikiDoneButton } from './ExistedWikiDoneButton';
+import { ExistedWikiForm } from './ExistedWikiForm';
+import { NewWikiDoneButton } from './NewWikiDoneButton';
+import { NewWikiForm } from './NewWikiForm';
+import { IErrorInWhichComponent, useWikiWorkspaceForm } from './useForm';
 
 import { TokenForm } from '@/components/TokenForm';
-import { GitRepoUrlForm } from './GitRepoUrlForm';
-import { LocationPickerContainer, LocationPickerInput } from './FormComponents';
 import { usePromiseValue } from '@/helpers/useServiceValue';
-import { ImportHtmlWikiForm } from './ImportHtmlWikiForm';
+import { LocationPickerContainer, LocationPickerInput } from './FormComponents';
+import { GitRepoUrlForm } from './GitRepoUrlForm';
 import { ImportHtmlWikiDoneButton } from './ImportHtmlWikiDoneButton';
+import { ImportHtmlWikiForm } from './ImportHtmlWikiForm';
 
 enum CreateWorkspaceTabs {
   CloneOnlineWiki = 'CloneOnlineWiki',
@@ -108,19 +108,22 @@ export function AddWorkspace(): JSX.Element {
 
   return (
     <TabContext value={currentTab}>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       <Helmet>
         <title>
           {t('AddWorkspace.AddWorkspace')} {wikiFolderName}
         </title>
       </Helmet>
-      <AppBar position="static">
+      <AppBar position='static'>
         <Paper square>
           <TabList
-            onChange={(_event, newValue) => currentTabSetter(newValue as CreateWorkspaceTabs)}
-            variant="scrollable"
+            onChange={(_event, newValue) => {
+              currentTabSetter(newValue as CreateWorkspaceTabs);
+            }}
+            variant='scrollable'
             value={currentTab}
-            aria-label={t('AddWorkspace.SwitchCreateNewOrOpenExisted')}>
+            aria-label={t('AddWorkspace.SwitchCreateNewOrOpenExisted')}
+          >
             <Tab label={t('AddWorkspace.CreateNewWiki')} value={CreateWorkspaceTabs.CreateNewWiki} />
             <Tab label={t(`AddWorkspace.CloneOnlineWiki`)} value={CreateWorkspaceTabs.CloneOnlineWiki} />
             <Tab label={t('AddWorkspace.OpenLocalWiki')} value={CreateWorkspaceTabs.OpenLocalWiki} />
diff --git a/src/pages/AddWorkspace/useExistedWiki.ts b/src/pages/AddWorkspace/useExistedWiki.ts
index a9c3f223..6a824f46 100644
--- a/src/pages/AddWorkspace/useExistedWiki.ts
+++ b/src/pages/AddWorkspace/useExistedWiki.ts
@@ -74,9 +74,9 @@ export function useExistedWiki(
         const parentFolderLocationForExistedFolder = await window.service.native.path('dirname', form.wikiFolderLocation);
         if (!wikiFolderNameForExistedFolder || !parentFolderLocationForExistedFolder) {
           throw new Error(
-            `Undefined folder name: parentFolderLocationForExistedFolder: ${
+            `Undefined folder name: parentFolderLocationForExistedFolder: ${parentFolderLocationForExistedFolder ?? '-'}, parentFolderLocationForExistedFolder: ${
               parentFolderLocationForExistedFolder ?? '-'
-            }, parentFolderLocationForExistedFolder: ${parentFolderLocationForExistedFolder ?? '-'}`,
+            }`,
           );
         }
         await window.service.wiki.ensureWikiExist(form.wikiFolderLocation, false);
diff --git a/src/pages/AddWorkspace/useForm.ts b/src/pages/AddWorkspace/useForm.ts
index 2c503eaf..cf843295 100644
--- a/src/pages/AddWorkspace/useForm.ts
+++ b/src/pages/AddWorkspace/useForm.ts
@@ -16,7 +16,9 @@ import type { INewWikiRequiredFormData } from './useNewWiki';
 export function useIsCreateSyncedWorkspace(): [boolean, React.Dispatch<React.SetStateAction<boolean>>] {
   const [isCreateSyncedWorkspace, isCreateSyncedWorkspaceSetter] = useState(false);
   useEffect(() => {
-    void window.service.auth.getRandomStorageServiceUserInfo().then((result) => isCreateSyncedWorkspaceSetter(result !== undefined));
+    void window.service.auth.getRandomStorageServiceUserInfo().then((result) => {
+      isCreateSyncedWorkspaceSetter(result !== undefined);
+    });
   }, []);
   return [isCreateSyncedWorkspace, isCreateSyncedWorkspaceSetter];
 }
@@ -29,7 +31,9 @@ export function useWikiWorkspaceForm(options?: { fromExisted: boolean }) {
   const [wikiPort, wikiPortSetter] = useState(5212);
   useEffect(() => {
     // only update default port on component mount
-    void window.service.workspace.countWorkspaces().then((workspaceCount) => wikiPortSetter(wikiPort + workspaceCount));
+    void window.service.workspace.countWorkspaces().then((workspaceCount) => {
+      wikiPortSetter(wikiPort + workspaceCount);
+    });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -79,7 +83,7 @@ export function useWikiWorkspaceForm(options?: { fromExisted: boolean }) {
   useEffect(() => {
     void (async function getDefaultExistedWikiFolderPathEffect() {
       const desktopPathAsDefaultExistedWikiFolderPath = await window.service.context.get('DEFAULT_WIKI_FOLDER');
-      wikiFolderNameSetter(mainWorkspaceList[mainWorkspaceList.length - 1]?.wikiFolderLocation ?? 'wiki');
+      wikiFolderNameSetter(mainWorkspaceList.at(-1)?.wikiFolderLocation ?? 'wiki');
       parentFolderLocationSetter(desktopPathAsDefaultExistedWikiFolderPath);
     })();
     // we only do this on component init
diff --git a/src/pages/AddWorkspace/useImportHtmlWiki.ts b/src/pages/AddWorkspace/useImportHtmlWiki.ts
index 053674ff..fa393c29 100644
--- a/src/pages/AddWorkspace/useImportHtmlWiki.ts
+++ b/src/pages/AddWorkspace/useImportHtmlWiki.ts
@@ -3,7 +3,7 @@ import { useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { IErrorInWhichComponent, IWikiWorkspaceForm } from './useForm';
 import { updateErrorInWhichComponentSetterByErrorMessage } from './useIndicator';
-import { useValidateNewWiki, useNewWiki } from './useNewWiki';
+import { useNewWiki, useValidateNewWiki } from './useNewWiki';
 
 export function useValidateHtmlWiki(
   isCreateMainWorkspace: boolean,
@@ -16,14 +16,14 @@ export function useValidateHtmlWiki(
   const [hasError, hasErrorSetter] = useState<boolean>(false);
   useValidateNewWiki(isCreateMainWorkspace, isCreateSyncedWorkspace, form, errorInWhichComponentSetter);
   useEffect(() => {
-    if (!form.wikiHtmlPath) {
-      wikiCreationMessageSetter(`${t('AddWorkspace.NotFilled')}：${t('AddWorkspace.LocalWikiHtml')}`);
-      errorInWhichComponentSetter({ wikiHtmlPath: true });
-      hasErrorSetter(true);
-    } else {
+    if (form.wikiHtmlPath) {
       wikiCreationMessageSetter('');
       errorInWhichComponentSetter({});
       hasErrorSetter(false);
+    } else {
+      wikiCreationMessageSetter(`${t('AddWorkspace.NotFilled')}：${t('AddWorkspace.LocalWikiHtml')}`);
+      errorInWhichComponentSetter({ wikiHtmlPath: true });
+      hasErrorSetter(true);
     }
   }, [t, form.wikiHtmlPath, form.parentFolderLocation, form.wikiFolderName, errorInWhichComponentSetter]);
 
diff --git a/src/pages/AddWorkspace/useIndicator.ts b/src/pages/AddWorkspace/useIndicator.ts
index 7052170a..93a758ca 100644
--- a/src/pages/AddWorkspace/useIndicator.ts
+++ b/src/pages/AddWorkspace/useIndicator.ts
@@ -1,5 +1,5 @@
-import { useState, useEffect } from 'react';
 import type { TFunction } from 'i18next';
+import { useEffect, useState } from 'react';
 import { IErrorInWhichComponent } from './useForm';
 
 export function useWikiCreationProgress(
diff --git a/src/pages/AddWorkspace/useNewWiki.ts b/src/pages/AddWorkspace/useNewWiki.ts
index 71c9ce66..6f7673d4 100644
--- a/src/pages/AddWorkspace/useNewWiki.ts
+++ b/src/pages/AddWorkspace/useNewWiki.ts
@@ -2,10 +2,10 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 import { useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+import { ConditionalExcept } from 'type-fest';
 import { callWikiInitialization } from './useCallWikiInitialization';
 import { IErrorInWhichComponent, IWikiWorkspaceForm, workspaceConfigFromForm } from './useForm';
 import { updateErrorInWhichComponentSetterByErrorMessage } from './useIndicator';
-import { ConditionalExcept } from 'type-fest';
 
 export function useValidateNewWiki(
   isCreateMainWorkspace: boolean,
diff --git a/src/pages/EditWorkspace/index.tsx b/src/pages/EditWorkspace/index.tsx
index bf9fcae7..19952df5 100644
--- a/src/pages/EditWorkspace/index.tsx
+++ b/src/pages/EditWorkspace/index.tsx
@@ -2,42 +2,42 @@
 /* eslint-disable unicorn/no-useless-undefined */
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 /* eslint-disable unicorn/no-null */
-import React, { useCallback } from 'react';
-import styled, { css } from 'styled-components';
-import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet';
 import {
-  Tooltip,
   Button as ButtonRaw,
-  TextField as TextFieldRaw,
   Divider,
+  Link,
   List as ListRaw,
   ListItem as ListItemRaw,
-  ListItemText as ListItemTextRaw,
   ListItemSecondaryAction,
-  Switch,
-  Typography,
-  Link,
+  ListItemText as ListItemTextRaw,
   Paper,
+  Switch,
+  TextField as TextFieldRaw,
+  Tooltip,
+  Typography,
 } from '@material-ui/core';
 import { Autocomplete } from '@material-ui/lab';
+import React, { useCallback } from 'react';
+import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
+import styled, { css } from 'styled-components';
 import defaultIcon from '../../images/default-icon.png';
 
-import type { ISubWikiPluginContent } from '@services/wiki/plugin/subWikiPlugin';
-import { WindowNames, WindowMeta } from '@services/windows/WindowProperties';
 import { usePromiseValue } from '@/helpers/useServiceValue';
+import type { ISubWikiPluginContent } from '@services/wiki/plugin/subWikiPlugin';
+import { WindowMeta, WindowNames } from '@services/windows/WindowProperties';
 import { useWorkspaceObservable } from '@services/workspaces/hooks';
-import { useForm } from './useForm';
 import { IWorkspace } from '@services/workspaces/interface';
+import { useForm } from './useForm';
 
 import { useRestartSnackbar } from '@/components/RestartSnackbar';
-import { defaultServerIP } from '@/constants/urls';
-import { SupportedStorageServices } from '@services/types';
-import { SyncedWikiDescription } from '../AddWorkspace/Description';
 import { TokenForm } from '@/components/TokenForm';
-import { GitRepoUrlForm } from '../AddWorkspace/GitRepoUrlForm';
-import { isEqual } from 'lodash';
+import { defaultServerIP } from '@/constants/urls';
 import { useActualIp } from '@services/native/hooks';
+import { SupportedStorageServices } from '@services/types';
+import { isEqual } from 'lodash';
+import { SyncedWikiDescription } from '../AddWorkspace/Description';
+import { GitRepoUrlForm } from '../AddWorkspace/GitRepoUrlForm';
 
 const Root = styled(Paper)`
   height: 100%;
@@ -88,7 +88,7 @@ const AvatarRight = styled.div`
 `;
 /**
  * border: theme.palette.type === 'dark' ? 'none': '1px solid rgba(0, 0, 0, 0.12)';
- * */
+ */
 const Avatar = styled.div<{ transparentBackground?: boolean }>`
   height: 85px;
   width: 85px;
@@ -103,14 +103,14 @@ const Avatar = styled.div<{ transparentBackground?: boolean }>`
 
   overflow: hidden;
   ${({ transparentBackground }) => {
-    if (transparentBackground === true) {
-      return css`
+  if (transparentBackground === true) {
+    return css`
         background: transparent;
         border: none;
         border-radius: 0;
       `;
-    }
-  }}
+  }
+}}
 `;
 const AvatarPicture = styled.img`
   height: 100%;
@@ -218,7 +218,7 @@ export default function EditWorkspace(): JSX.Element {
   const isCreateSyncedWorkspace = storageService !== SupportedStorageServices.local;
   return (
     <Root>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       {RestartSnackbar}
       <Helmet>
         <title>
@@ -227,21 +227,25 @@ export default function EditWorkspace(): JSX.Element {
       </Helmet>
       <FlexGrow>
         <TextField
-          id="outlined-full-width"
+          id='outlined-full-width'
           label={t('EditWorkspace.Name')}
           helperText={t('EditWorkspace.NameDescription')}
-          placeholder="Optional"
+          placeholder='Optional'
           value={name}
-          onChange={(event) => workspaceSetter({ ...workspace, name: event.target.value })}
+          onChange={(event) => {
+            workspaceSetter({ ...workspace, name: event.target.value });
+          }}
         />
         <TextField
-          id="outlined-full-width"
+          id='outlined-full-width'
           label={t('EditWorkspace.Path')}
           helperText={t('EditWorkspace.PathDescription')}
-          placeholder="Optional"
+          placeholder='Optional'
           disabled
           value={wikiFolderLocation}
-          onChange={(event) => workspaceSetter({ ...workspace, wikiFolderLocation: event.target.value })}
+          onChange={(event) => {
+            workspaceSetter({ ...workspace, wikiFolderLocation: event.target.value });
+          }}
         />
         <TextField
           helperText={t('AddWorkspace.WorkspaceUserNameDetail')}
@@ -257,17 +261,22 @@ export default function EditWorkspace(): JSX.Element {
         {!isSubWiki && (
           <>
             <TextField
-              id="outlined-full-width"
+              id='outlined-full-width'
               label={t('EditWorkspace.Port')}
               helperText={
                 <span>
                   {t('EditWorkspace.URL')}{' '}
-                  <Link onClick={async () => actualIP && (await window.service.native.open(actualIP))} style={{ cursor: 'pointer' }}>
+                  <Link
+                    onClick={async () => {
+                      actualIP && (await window.service.native.open(actualIP));
+                    }}
+                    style={{ cursor: 'pointer' }}
+                  >
                     {actualIP}
                   </Link>
                 </span>
               }
-              placeholder="Optional"
+              placeholder='Optional'
               value={port}
               onChange={async (event) => {
                 if (!Number.isNaN(Number.parseInt(event.target.value))) {
@@ -282,7 +291,7 @@ export default function EditWorkspace(): JSX.Element {
             />
             {rememberLastPageVisited && (
               <TextField
-                id="outlined-full-width"
+                id='outlined-full-width'
                 label={t('EditWorkspace.LastVisitState')}
                 helperText={t('Preference.RememberLastVisitState')}
                 placeholder={actualIP}
@@ -312,26 +321,32 @@ export default function EditWorkspace(): JSX.Element {
         <AvatarFlex>
           <AvatarLeft>
             <Avatar transparentBackground={transparentBackground}>
-              <AvatarPicture alt="Icon" src={getValidIconPath(picturePath)} />
+              <AvatarPicture alt='Icon' src={getValidIconPath(picturePath)} />
             </Avatar>
           </AvatarLeft>
           <AvatarRight>
-            <Tooltip title={wikiPictureExtensions.join(', ')} placement="top">
+            <Tooltip title={wikiPictureExtensions.join(', ')} placement='top'>
               <PictureButton
-                variant="outlined"
-                size="small"
+                variant='outlined'
+                size='small'
                 onClick={async () => {
                   const filePaths = await window.service.native.pickFile([{ name: 'Images', extensions: wikiPictureExtensions }]);
                   if (filePaths.length > 0) {
                     await window.service.workspace.update(workspaceID, { picturePath: filePaths[0] });
                   }
-                }}>
+                }}
+              >
                 {t('EditWorkspace.SelectLocal')}
               </PictureButton>
             </Tooltip>
 
-            <Tooltip title={t('EditWorkspace.NoRevert') ?? ''} placement="bottom">
-              <PictureButton onClick={() => workspaceSetter({ ...workspace, picturePath: null })} disabled={!picturePath}>
+            <Tooltip title={t('EditWorkspace.NoRevert') ?? ''} placement='bottom'>
+              <PictureButton
+                onClick={() => {
+                  workspaceSetter({ ...workspace, picturePath: null });
+                }}
+                disabled={!picturePath}
+              >
                 {t('EditWorkspace.ResetDefaultIcon')}
               </PictureButton>
             </Tooltip>
@@ -371,10 +386,12 @@ export default function EditWorkspace(): JSX.Element {
                 <ListItemText primary={t('EditWorkspace.SyncOnInterval')} secondary={t('EditWorkspace.SyncOnIntervalDescription')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={syncOnInterval}
-                    onChange={(event) => workspaceSetter({ ...workspace, syncOnInterval: event.target.checked })}
+                    onChange={(event) => {
+                      workspaceSetter({ ...workspace, syncOnInterval: event.target.checked });
+                    }}
                   />
                 </ListItemSecondaryAction>
               </ListItem>
@@ -382,10 +399,12 @@ export default function EditWorkspace(): JSX.Element {
                 <ListItemText primary={t('EditWorkspace.SyncOnStartup')} secondary={t('EditWorkspace.SyncOnStartupDescription')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={syncOnStartup}
-                    onChange={(event) => workspaceSetter({ ...workspace, syncOnStartup: event.target.checked })}
+                    onChange={(event) => {
+                      workspaceSetter({ ...workspace, syncOnStartup: event.target.checked });
+                    }}
                   />
                 </ListItemSecondaryAction>
               </ListItem>
@@ -401,10 +420,12 @@ export default function EditWorkspace(): JSX.Element {
                 <ListItemText primary={t('EditWorkspace.BackupOnInterval')} secondary={t('EditWorkspace.BackupOnIntervalDescription')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={backupOnInterval}
-                    onChange={(event) => workspaceSetter({ ...workspace, backupOnInterval: event.target.checked })}
+                    onChange={(event) => {
+                      workspaceSetter({ ...workspace, backupOnInterval: event.target.checked });
+                    }}
                   />
                 </ListItemSecondaryAction>
               </ListItem>
@@ -418,10 +439,12 @@ export default function EditWorkspace(): JSX.Element {
               <ListItemText primary={t('EditWorkspace.HibernateTitle')} secondary={t('EditWorkspace.HibernateDescription')} />
               <ListItemSecondaryAction>
                 <Switch
-                  edge="end"
-                  color="primary"
+                  edge='end'
+                  color='primary'
                   checked={hibernateWhenUnused}
-                  onChange={(event) => workspaceSetter({ ...workspace, hibernateWhenUnused: event.target.checked })}
+                  onChange={(event) => {
+                    workspaceSetter({ ...workspace, hibernateWhenUnused: event.target.checked });
+                  }}
                 />
               </ListItemSecondaryAction>
             </ListItem>
@@ -429,10 +452,12 @@ export default function EditWorkspace(): JSX.Element {
               <ListItemText primary={t('EditWorkspace.DisableNotificationTitle')} secondary={t('EditWorkspace.DisableNotification')} />
               <ListItemSecondaryAction>
                 <Switch
-                  edge="end"
-                  color="primary"
+                  edge='end'
+                  color='primary'
                   checked={disableNotifications}
-                  onChange={(event) => workspaceSetter({ ...workspace, disableNotifications: event.target.checked })}
+                  onChange={(event) => {
+                    workspaceSetter({ ...workspace, disableNotifications: event.target.checked });
+                  }}
                 />
               </ListItemSecondaryAction>
             </ListItem>
@@ -440,10 +465,12 @@ export default function EditWorkspace(): JSX.Element {
               <ListItemText primary={t('EditWorkspace.DisableAudioTitle')} secondary={t('EditWorkspace.DisableAudio')} />
               <ListItemSecondaryAction>
                 <Switch
-                  edge="end"
-                  color="primary"
+                  edge='end'
+                  color='primary'
                   checked={disableAudio}
-                  onChange={(event) => workspaceSetter({ ...workspace, disableAudio: event.target.checked })}
+                  onChange={(event) => {
+                    workspaceSetter({ ...workspace, disableAudio: event.target.checked });
+                  }}
                 />
               </ListItemSecondaryAction>
             </ListItem>
@@ -452,10 +479,10 @@ export default function EditWorkspace(): JSX.Element {
       </FlexGrow>
       {!isEqual(workspace, originalWorkspace) && (
         <div>
-          <Button color="primary" variant="contained" disableElevation onClick={requestSaveAndRestart}>
+          <Button color='primary' variant='contained' disableElevation onClick={requestSaveAndRestart}>
             {t('EditWorkspace.Save')}
           </Button>
-          <Button variant="contained" disableElevation onClick={() => void window.remote.closeCurrentWindow()}>
+          <Button variant='contained' disableElevation onClick={() => void window.remote.closeCurrentWindow()}>
             {t('EditWorkspace.Cancel')}
           </Button>
         </div>
diff --git a/src/pages/EditWorkspace/useForm.ts b/src/pages/EditWorkspace/useForm.ts
index 4c2a91b2..35e0642f 100644
--- a/src/pages/EditWorkspace/useForm.ts
+++ b/src/pages/EditWorkspace/useForm.ts
@@ -1,6 +1,6 @@
-import usePreviousValue from 'beautiful-react-hooks/usePreviousValue';
-import { useState, useEffect, useCallback } from 'react';
 import { IWorkspace } from '@services/workspaces/interface';
+import usePreviousValue from 'beautiful-react-hooks/usePreviousValue';
+import { useCallback, useEffect, useState } from 'react';
 
 export function useForm(
   originalWorkspace?: IWorkspace,
diff --git a/src/pages/Main/ErrorMessage.tsx b/src/pages/Main/ErrorMessage.tsx
index 9867ca92..5b0d482f 100644
--- a/src/pages/Main/ErrorMessage.tsx
+++ b/src/pages/Main/ErrorMessage.tsx
@@ -1,11 +1,11 @@
 /* eslint-disable unicorn/no-null */
+import { Accordion, AccordionDetails, AccordionSummary, Button, Typography } from '@material-ui/core';
 import { useCallback } from 'react';
-import { Button, Accordion, AccordionSummary, AccordionDetails, Typography } from '@material-ui/core';
 import { Trans, useTranslation } from 'react-i18next';
 import styled from 'styled-components';
 
 import { usePromiseValue } from '@/helpers/useServiceValue';
-import { IWorkspaceWithMetadata, IWorkspaceMetaData } from '@services/workspaces/interface';
+import { IWorkspaceMetaData, IWorkspaceWithMetadata } from '@services/workspaces/interface';
 import { ReportErrorButton } from '../AddWorkspace/FormComponents';
 
 const HelperTextsList = styled.ul`
@@ -38,15 +38,20 @@ export function WikiErrorMessages(props: IWikiErrorMessagesProps): JSX.Element {
       <WikiErrorMessagesContainer>
         <Accordion>
           <AccordionSummary>
-            <Typography align="left" variant="h5">
+            <Typography align='left' variant='h5'>
               {t('Error.WikiRuntimeError')} {t('ClickForDetails')}
             </Typography>
           </AccordionSummary>
           <AccordionDetails>
-            <Typography align="left" variant="body2">
+            <Typography align='left' variant='body2'>
               {t('Error.WikiRuntimeErrorDescription')}
             </Typography>
-            <Button variant="outlined" onClick={async () => await window.service.native.open(wikiLogs.filePath, true)}>
+            <Button
+              variant='outlined'
+              onClick={async () => {
+                await window.service.native.open(wikiLogs.filePath, true);
+              }}
+            >
               {t('Preference.OpenLogFolder')}
             </Button>
 
@@ -89,22 +94,22 @@ export function ViewLoadErrorMessages(props: IViewLoadErrorMessagesProps): JSX.E
 
   return (
     <WikiErrorMessagesContainer>
-      <Typography align="left" variant="h5">
+      <Typography align='left' variant='h5'>
         {t('AddWorkspace.WikiNotStarted')}
       </Typography>
-      <Typography align="left" variant="body2">
+      <Typography align='left' variant='body2'>
         {props.activeWorkspaceMetadata.didFailLoadErrorMessage}
       </Typography>
 
       <br />
-      <Trans t={t} i18nKey="AddWorkspace.MainPageReloadTip">
-        <Typography align="left" variant="body2" component="div">
+      <Trans t={t} i18nKey='AddWorkspace.MainPageReloadTip'>
+        <Typography align='left' variant='body2' component='div'>
           <>
             Try:
             <HelperTextsList>
               <li>
                 Click{' '}
-                <b onClick={requestReload} onKeyPress={requestReload} role="button" tabIndex={0} style={{ cursor: 'pointer' }}>
+                <b onClick={requestReload} onKeyPress={requestReload} role='button' tabIndex={0} style={{ cursor: 'pointer' }}>
                   Reload
                 </b>{' '}
                 button below or press <b>CMD_or_Ctrl + R</b> to reload the page.
@@ -112,11 +117,16 @@ export function ViewLoadErrorMessages(props: IViewLoadErrorMessagesProps): JSX.E
               <li>
                 Check the{' '}
                 <b
-                  onClick={async () => await window.service.native.open(await window.service.context.get('LOG_FOLDER'), true)}
-                  onKeyPress={async () => await window.service.native.open(await window.service.context.get('LOG_FOLDER'), true)}
-                  role="button"
+                  onClick={async () => {
+                    await window.service.native.open(await window.service.context.get('LOG_FOLDER'), true);
+                  }}
+                  onKeyPress={async () => {
+                    await window.service.native.open(await window.service.context.get('LOG_FOLDER'), true);
+                  }}
+                  role='button'
                   tabIndex={0}
-                  style={{ cursor: 'pointer' }}>
+                  style={{ cursor: 'pointer' }}
+                >
                   Log Folder
                 </b>{' '}
                 to see what happened.
@@ -128,12 +138,10 @@ export function ViewLoadErrorMessages(props: IViewLoadErrorMessagesProps): JSX.E
       </Trans>
 
       <ButtonGroup>
-        <Button variant="outlined" onClick={requestReload}>
+        <Button variant='outlined' onClick={requestReload}>
           {t('AddWorkspace.Reload')}
         </Button>
-        {typeof props.activeWorkspaceMetadata.didFailLoadErrorMessage === 'string' && (
-          <ReportErrorButton message={props.activeWorkspaceMetadata.didFailLoadErrorMessage} />
-        )}
+        {typeof props.activeWorkspaceMetadata.didFailLoadErrorMessage === 'string' && <ReportErrorButton message={props.activeWorkspaceMetadata.didFailLoadErrorMessage} />}
       </ButtonGroup>
     </WikiErrorMessagesContainer>
   );
diff --git a/src/pages/Main/NewUserMessage.tsx b/src/pages/Main/NewUserMessage.tsx
index 448774f0..acab0f49 100644
--- a/src/pages/Main/NewUserMessage.tsx
+++ b/src/pages/Main/NewUserMessage.tsx
@@ -1,11 +1,11 @@
 import { Trans, useTranslation } from 'react-i18next';
 import styled from 'styled-components';
 
-import { WindowNames } from '@services/windows/WindowProperties';
 import { IPreferences } from '@services/preferences/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
 
-import arrowWhite from '@/images/arrow-white.png';
 import arrowBlack from '@/images/arrow-black.png';
+import arrowWhite from '@/images/arrow-white.png';
 
 const Arrow = styled.div<{ image: string }>`
   height: 202px;
@@ -64,31 +64,37 @@ export interface IProps {
 export function NewUserMessage(props: IProps): JSX.Element {
   const { t } = useTranslation();
   return (
-    <AddWorkspaceGuideInfoContainer onClick={async () => await window.service.window.open(WindowNames.addWorkspace)}>
-      {props.sidebar ? (
-        <>
-          <Arrow image={props.themeSource === 'dark' ? arrowWhite : arrowBlack} />
-          <TipWithSidebar id="new-user-tip">
-            <Trans t={t} i18nKey="AddWorkspace.MainPageTipWithSidebar">
-              <Tip2Text>Click</Tip2Text>
-              <Avatar>+</Avatar>
-              <Tip2Text>to get started!</Tip2Text>
-            </Trans>
-          </TipWithSidebar>
-        </>
-      ) : (
-        <TipWithoutSidebar id="new-user-tip">
-          <Tip2Text>
-            <Trans t={t} i18nKey="AddWorkspace.MainPageTipWithoutSidebar">
-              <span>Click </span>
-              <strong>Workspaces &gt; Add Workspace</strong>
-              <span>Or </span>
-              <strong>Click Here</strong>
-              <span> to get started!</span>
-            </Trans>
-          </Tip2Text>
-        </TipWithoutSidebar>
-      )}
+    <AddWorkspaceGuideInfoContainer
+      onClick={async () => {
+        await window.service.window.open(WindowNames.addWorkspace);
+      }}
+    >
+      {props.sidebar
+        ? (
+          <>
+            <Arrow image={props.themeSource === 'dark' ? arrowWhite : arrowBlack} />
+            <TipWithSidebar id='new-user-tip'>
+              <Trans t={t} i18nKey='AddWorkspace.MainPageTipWithSidebar'>
+                <Tip2Text>Click</Tip2Text>
+                <Avatar>+</Avatar>
+                <Tip2Text>to get started!</Tip2Text>
+              </Trans>
+            </TipWithSidebar>
+          </>
+        )
+        : (
+          <TipWithoutSidebar id='new-user-tip'>
+            <Tip2Text>
+              <Trans t={t} i18nKey='AddWorkspace.MainPageTipWithoutSidebar'>
+                <span>Click</span>
+                <strong>Workspaces &gt; Add Workspace</strong>
+                <span>Or</span>
+                <strong>Click Here</strong>
+                <span>to get started!</span>
+              </Trans>
+            </Tip2Text>
+          </TipWithoutSidebar>
+        )}
     </AddWorkspaceGuideInfoContainer>
   );
 }
diff --git a/src/pages/Main/index.tsx b/src/pages/Main/index.tsx
index c0e458fd..8d57df4a 100644
--- a/src/pages/Main/index.tsx
+++ b/src/pages/Main/index.tsx
@@ -1,34 +1,34 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 /* eslint-disable @typescript-eslint/promise-function-async */
 import React, { useState } from 'react';
+import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
 import styled, { css } from 'styled-components';
 import is, { isNot } from 'typescript-styled-is';
-import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet';
 
 import SimpleBar from 'simplebar-react';
 import 'simplebar/dist/simplebar.min.css';
 
-import { Typography, Tooltip, IconButton as IconButtonRaw } from '@material-ui/core';
+import { IconButton as IconButtonRaw, Tooltip, Typography } from '@material-ui/core';
 import { Settings as SettingsIcon, Upgrade as UpgradeIcon } from '@material-ui/icons';
 
-import { WindowNames } from '@services/windows/WindowProperties';
 import { IUpdaterStatus } from '@services/updater/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
 
 import { usePromiseValue } from '@/helpers/useServiceValue';
 import { useUpdaterObservable } from '@services/updater/hooks';
 
-import FindInPage from '../../components/FindInPage';
 import { latestStableUpdateUrl } from '@/constants/urls';
+import FindInPage from '../../components/FindInPage';
 
-import { WorkspaceSelector, SortableWorkspaceSelectorList } from '@/components/WorkspaceIconAndSelector';
-import { useWorkspacesListObservable } from '@services/workspaces/hooks';
-import { usePreferenceObservable } from '@services/preferences/hooks';
 import { CommandPaletteIcon } from '@/components/icon/CommandPaletteSVG';
+import { SortableWorkspaceSelectorList, WorkspaceSelector } from '@/components/WorkspaceIconAndSelector';
+import { usePreferenceObservable } from '@services/preferences/hooks';
+import { useWorkspacesListObservable } from '@services/workspaces/hooks';
 import { Languages } from '../Preferences/sections/Languages';
 import { TiddlyWiki } from '../Preferences/sections/TiddlyWiki';
+import { ViewLoadErrorMessages, WikiErrorMessages } from './ErrorMessage';
 import { NewUserMessage } from './NewUserMessage';
-import { WikiErrorMessages, ViewLoadErrorMessages } from './ErrorMessage';
 import { useAutoCreateFirstWorkspace } from './useAutoCreateFirstWorkspace';
 
 const OuterRoot = styled.div`
@@ -91,11 +91,11 @@ const SidebarTop = styled.div<{ titleBar?: boolean }>`
   flex: 1;
   width: 100%;
   ${({ titleBar }) =>
-    titleBar === true
-      ? css`
+  titleBar === true
+    ? css`
           padding-top: 0;
         `
-      : css`
+    : css`
           padding-top: 30px;
         `}
 `;
@@ -167,13 +167,12 @@ export default function Main(): JSX.Element {
   if (preferences === undefined) return <div>{t('Loading')}</div>;
 
   const { sidebar, themeSource, sidebarShortcutHints, hideSideBarIcon } = preferences;
-  const hasError =
-    typeof activeWorkspaceMetadata?.didFailLoadErrorMessage === 'string' &&
+  const hasError = typeof activeWorkspaceMetadata?.didFailLoadErrorMessage === 'string' &&
     activeWorkspaceMetadata?.didFailLoadErrorMessage.length > 0 &&
     activeWorkspaceMetadata?.isLoading === false;
   return (
     <OuterRoot>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       <Helmet>
         <title>{t('Menu.TidGi')}</title>
       </Helmet>
@@ -181,13 +180,11 @@ export default function Main(): JSX.Element {
         {sidebar && (
           <SidebarContainer>
             <SidebarTop titleBar={titleBar}>
-              {workspacesList === undefined ? (
-                <div>{t('Loading')}</div>
-              ) : (
-                <SortableWorkspaceSelectorList sidebarShortcutHints={sidebarShortcutHints} workspacesList={workspacesList} hideSideBarIcon={hideSideBarIcon} />
-              )}
+              {workspacesList === undefined
+                ? <div>{t('Loading')}</div>
+                : <SortableWorkspaceSelectorList sidebarShortcutHints={sidebarShortcutHints} workspacesList={workspacesList} hideSideBarIcon={hideSideBarIcon} />}
               <WorkspaceSelector
-                id="add"
+                id='add'
                 hideSideBarIcon={hideSideBarIcon}
                 index={workspacesList?.length ?? 0}
                 showSidebarShortcutHints={sidebarShortcutHints}
@@ -196,7 +193,7 @@ export default function Main(): JSX.Element {
               {workspacesList === undefined ||
                 (workspacesList.length === 0 && (
                   <WorkspaceSelector
-                    id="guide"
+                    id='guide'
                     hideSideBarIcon={hideSideBarIcon}
                     index={workspacesList?.length ? workspacesList.length ?? 0 + 1 : 1}
                     active={activeWorkspace?.id === undefined}
@@ -209,10 +206,13 @@ export default function Main(): JSX.Element {
               {(workspacesList?.length ?? 0) > 0 && (
                 <>
                   <IconButton
-                    id="open-command-palette-button"
+                    id='open-command-palette-button'
                     aria-label={t('SideBar.CommandPalette')}
-                    onClick={async () => await window.service.wiki.requestWikiSendActionMessage('open-command-palette')}>
-                    <Tooltip title={<span>{t('SideBar.CommandPalette')}</span>} placement="top">
+                    onClick={async () => {
+                      await window.service.wiki.requestWikiSendActionMessage('open-command-palette');
+                    }}
+                  >
+                    <Tooltip title={<span>{t('SideBar.CommandPalette')}</span>} placement='top'>
                       <CommandPaletteIcon />
                     </Tooltip>
                   </IconButton>
@@ -220,19 +220,25 @@ export default function Main(): JSX.Element {
               )}
               {updaterMetaData?.status === IUpdaterStatus.updateAvailable && (
                 <IconButton
-                  id="update-available"
+                  id='update-available'
                   aria-label={t('SideBar.UpdateAvailable')}
-                  onClick={async () => await window.service.native.open(updaterMetaData.info?.latestReleasePageUrl ?? latestStableUpdateUrl)}>
-                  <Tooltip title={<span>{t('SideBar.UpdateAvailable')}</span>} placement="top">
+                  onClick={async () => {
+                    await window.service.native.open(updaterMetaData.info?.latestReleasePageUrl ?? latestStableUpdateUrl);
+                  }}
+                >
+                  <Tooltip title={<span>{t('SideBar.UpdateAvailable')}</span>} placement='top'>
                     <UpgradeIcon />
                   </Tooltip>
                 </IconButton>
               )}
               <IconButton
-                id="open-preferences-button"
+                id='open-preferences-button'
                 aria-label={t('SideBar.Preferences')}
-                onClick={async () => await window.service.window.open(WindowNames.preferences)}>
-                <Tooltip title={<span>{t('SideBar.Preferences')}</span>} placement="top">
+                onClick={async () => {
+                  await window.service.window.open(WindowNames.preferences);
+                }}
+              >
+                <Tooltip title={<span>{t('SideBar.Preferences')}</span>} placement='top'>
                   <SettingsIcon />
                 </Tooltip>
               </IconButton>
@@ -247,9 +253,9 @@ export default function Main(): JSX.Element {
               <ViewLoadErrorMessages activeWorkspace={activeWorkspace} activeWorkspaceMetadata={activeWorkspaceMetadata} />
             )}
             {Array.isArray(workspacesList) && workspacesList.length > 0 && activeWorkspaceMetadata?.isLoading === true && (
-              <Typography color="textSecondary">{t('Loading')}</Typography>
+              <Typography color='textSecondary'>{t('Loading')}</Typography>
             )}
-            {wikiCreationMessage && <Typography color="textSecondary">{wikiCreationMessage}</Typography>}
+            {wikiCreationMessage && <Typography color='textSecondary'>{wikiCreationMessage}</Typography>}
             {Array.isArray(workspacesList) && workspacesList.length === 0 && <NewUserMessage sidebar={sidebar} themeSource={themeSource} />}
           </InnerContentRoot>
           <Languages languageSelectorOnly />
diff --git a/src/pages/Main/useAutoCreateFirstWorkspace.ts b/src/pages/Main/useAutoCreateFirstWorkspace.ts
index 3afcee40..17dcc383 100644
--- a/src/pages/Main/useAutoCreateFirstWorkspace.ts
+++ b/src/pages/Main/useAutoCreateFirstWorkspace.ts
@@ -1,10 +1,10 @@
 /* eslint-disable @typescript-eslint/promise-function-async */
-import { useEffect, useState } from 'react';
-import { IWorkspaceWithMetadata } from '@services/workspaces/interface';
-import { INewWikiRequiredFormData, useNewWiki } from '../AddWorkspace/useNewWiki';
-import { SupportedStorageServices } from '@services/types';
-import { useWikiWorkspaceForm } from '../AddWorkspace/useForm';
 import { usePromiseValue } from '@/helpers/useServiceValue';
+import { SupportedStorageServices } from '@services/types';
+import { IWorkspaceWithMetadata } from '@services/workspaces/interface';
+import { useEffect, useState } from 'react';
+import { useWikiWorkspaceForm } from '../AddWorkspace/useForm';
+import { INewWikiRequiredFormData, useNewWiki } from '../AddWorkspace/useNewWiki';
 
 export function useAutoCreateFirstWorkspace(workspacesList: IWorkspaceWithMetadata[] | undefined, wikiCreationMessageSetter: (m: string) => void): void {
   const form = useWikiWorkspaceForm();
diff --git a/src/pages/Notifications/index.tsx b/src/pages/Notifications/index.tsx
index 4dfe8321..1f07d46a 100644
--- a/src/pages/Notifications/index.tsx
+++ b/src/pages/Notifications/index.tsx
@@ -2,18 +2,18 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 /* eslint-disable unicorn/no-useless-undefined */
 import React, { useState } from 'react';
-import styled from 'styled-components';
-import { useTranslation } from 'react-i18next';
 import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
-import ListSubheader from '@material-ui/core/ListSubheader';
+import Container from '@material-ui/core/Container';
+import Divider from '@material-ui/core/Divider';
 import ListRaw from '@material-ui/core/List';
 import ListItem from '@material-ui/core/ListItem';
 import ListItemText from '@material-ui/core/ListItemText';
-import Divider from '@material-ui/core/Divider';
-import TextField from '@material-ui/core/TextField';
+import ListSubheader from '@material-ui/core/ListSubheader';
 import MenuItem from '@material-ui/core/MenuItem';
-import Container from '@material-ui/core/Container';
+import TextField from '@material-ui/core/TextField';
 
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
 
@@ -23,12 +23,12 @@ import { WindowNames } from '@services/windows/WindowProperties';
 import PopUpMenuItem from '@/components/PopUpMenuItem';
 
 // https://www.sketchappsources.com/free-source/2501-iphone-app-background-sketch-freebie-resource.html
-import nightBackgroundPng from '../../images/night-background.png';
-import { usePreferenceObservable } from '@services/preferences/hooks';
-import { useNotificationInfoObservable } from '@services/notifications/hooks';
-import { quickShortcuts } from './quickShortcuts';
-import { PreferenceSections } from '@services/preferences/interface';
 import { formatDate } from '@services/libs/formatDate';
+import { useNotificationInfoObservable } from '@services/notifications/hooks';
+import { usePreferenceObservable } from '@services/preferences/hooks';
+import { PreferenceSections } from '@services/preferences/interface';
+import nightBackgroundPng from '../../images/night-background.png';
+import { quickShortcuts } from './quickShortcuts';
 
 const Root = styled(Container)`
   width: 100%;
@@ -90,7 +90,7 @@ export default function Notifications(): JSX.Element {
           </PausingHeader>
           <ListItem button>
             <ListItemText
-              primary="Resume notifications"
+              primary='Resume notifications'
               onClick={async () => {
                 if (pauseNotificationsInfo === undefined) {
                   return;
@@ -114,19 +114,31 @@ export default function Notifications(): JSX.Element {
             <>
               <Divider />
               <PopUpMenuItem
-                id="adjustTime"
+                id='adjustTime'
                 buttonElement={
                   <ListItem button>
-                    <ListItemText primary="Adjust time" />
-                    <ChevronRightIcon color="action" />
+                    <ListItemText primary='Adjust time' />
+                    <ChevronRightIcon color='action' />
                   </ListItem>
-                }>
+                }
+              >
                 {quickShortcuts.map((shortcut) => (
-                  <MenuItem dense key={shortcut.name} onClick={() => pauseNotification(shortcut.calcDate())}>
+                  <MenuItem
+                    dense
+                    key={shortcut.name}
+                    onClick={() => {
+                      pauseNotification(shortcut.calcDate());
+                    }}
+                  >
                     {shortcut.name}
                   </MenuItem>
                 ))}
-                <MenuItem dense onClick={() => showDateTimePickerSetter(true)}>
+                <MenuItem
+                  dense
+                  onClick={() => {
+                    showDateTimePickerSetter(true);
+                  }}
+                >
                   Custom...
                 </MenuItem>
               </PopUpMenuItem>
@@ -147,19 +159,30 @@ export default function Notifications(): JSX.Element {
     }
 
     return (
-      <List subheader={<ListSubheader component="div">Pause notifications</ListSubheader>}>
+      <List subheader={<ListSubheader component='div'>Pause notifications</ListSubheader>}>
         {quickShortcuts.map((shortcut) => (
-          <ListItem button key={shortcut.name} onClick={() => pauseNotification(shortcut.calcDate())}>
+          <ListItem
+            button
+            key={shortcut.name}
+            onClick={() => {
+              pauseNotification(shortcut.calcDate());
+            }}
+          >
             <ListItemText primary={shortcut.name} />
           </ListItem>
         ))}
-        <ListItem button onClick={() => showDateTimePickerSetter(true)}>
-          <ListItemText primary="Custom..." />
+        <ListItem
+          button
+          onClick={() => {
+            showDateTimePickerSetter(true);
+          }}
+        >
+          <ListItemText primary='Custom...' />
         </ListItem>
         <Divider />
         <ListItem button>
           <ListItemText
-            primary="Pause notifications by schedule..."
+            primary='Pause notifications by schedule...'
             onClick={async () => {
               await window.service.window.open(WindowNames.preferences, { gotoTab: PreferenceSections.notifications });
               void window.remote.closeCurrentWindow();
@@ -172,7 +195,7 @@ export default function Notifications(): JSX.Element {
 
   return (
     <Root>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       <Helmet>
         <title>{t('ContextMenu.Notifications')}</title>
       </Helmet>
@@ -184,10 +207,14 @@ export default function Notifications(): JSX.Element {
           if (tilDate === null) return;
           pauseNotification(tilDate);
         }}
-        label="Custom"
+        label='Custom'
         open={showDateTimePicker}
-        onOpen={() => showDateTimePickerSetter(true)}
-        onClose={() => showDateTimePickerSetter(false)}
+        onOpen={() => {
+          showDateTimePickerSetter(true);
+        }}
+        onClose={() => {
+          showDateTimePickerSetter(false);
+        }}
         disablePast
         showTodayButton
       />
diff --git a/src/pages/Notifications/quickShortcuts.ts b/src/pages/Notifications/quickShortcuts.ts
index 674a93cf..f4c1723b 100644
--- a/src/pages/Notifications/quickShortcuts.ts
+++ b/src/pages/Notifications/quickShortcuts.ts
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-import { addMinutes, addHours, addDays, addWeeks } from 'date-fns';
+import { addDays, addHours, addMinutes, addWeeks } from 'date-fns';
 
 export const quickShortcuts = [
   {
diff --git a/src/pages/Preferences/PreferenceComponents.tsx b/src/pages/Preferences/PreferenceComponents.tsx
index e0f12028..6d9cae1c 100644
--- a/src/pages/Preferences/PreferenceComponents.tsx
+++ b/src/pages/Preferences/PreferenceComponents.tsx
@@ -1,12 +1,5 @@
+import { InputLabel as InputLabelRaw, ListItem as ListItemRaw, ListItemText as ListItemTextRaw, Paper as PaperRaw, TextField as TextFieldRaw, Typography } from '@material-ui/core';
 import styled, { keyframes } from 'styled-components';
-import {
-  Paper as PaperRaw,
-  Typography,
-  TextField as TextFieldRaw,
-  ListItem as ListItemRaw,
-  ListItemText as ListItemTextRaw,
-  InputLabel as InputLabelRaw,
-} from '@material-ui/core';
 
 export const Paper = styled(PaperRaw)`
   margin-top: 5px;
diff --git a/src/pages/Preferences/SectionsSideBar.tsx b/src/pages/Preferences/SectionsSideBar.tsx
index cb7db409..ad497059 100644
--- a/src/pages/Preferences/SectionsSideBar.tsx
+++ b/src/pages/Preferences/SectionsSideBar.tsx
@@ -1,9 +1,9 @@
+import { Divider as DividerRaw, List, ListItem, ListItemIcon as ListItemIconRaw, ListItemText } from '@material-ui/core';
 import React from 'react';
 import styled, { keyframes } from 'styled-components';
-import { Divider as DividerRaw, List, ListItem, ListItemIcon as ListItemIconRaw, ListItemText } from '@material-ui/core';
 
-import { ISectionProps } from './useSections';
 import { PreferenceSections } from '@services/preferences/interface';
+import { ISectionProps } from './useSections';
 
 const SideBar = styled.div`
   position: fixed;
diff --git a/src/pages/Preferences/index.tsx b/src/pages/Preferences/index.tsx
index 8d2d8ac4..576544f5 100644
--- a/src/pages/Preferences/index.tsx
+++ b/src/pages/Preferences/index.tsx
@@ -1,27 +1,27 @@
 import React, { useEffect } from 'react';
-import styled, { css } from 'styled-components';
 import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
 import { useRestartSnackbar } from '@/components/RestartSnackbar';
 
 import { IPossibleWindowMeta, WindowMeta, WindowNames } from '@services/windows/WindowProperties';
-import { usePreferenceSections } from './useSections';
-import { SectionSideBar } from './SectionsSideBar';
-import { TiddlyWiki } from './sections/TiddlyWiki';
-import { Sync } from './sections/Sync';
-import { General } from './sections/General';
-import { System } from './sections/System';
-import { Notifications } from './sections/Notifications';
-import { Languages } from './sections/Languages';
-import { Downloads } from './sections/Downloads';
-import { Network } from './sections/Network';
-import { PrivacyAndSecurity } from './sections/PrivacyAndSecurity';
 import { DeveloperTools } from './sections/DeveloperTools';
-import { Performance } from './sections/Performance';
-import { Updates } from './sections/Updates';
+import { Downloads } from './sections/Downloads';
 import { FriendLinks } from './sections/FriendLinks';
+import { General } from './sections/General';
+import { Languages } from './sections/Languages';
 import { Miscellaneous } from './sections/Miscellaneous';
+import { Network } from './sections/Network';
+import { Notifications } from './sections/Notifications';
+import { Performance } from './sections/Performance';
+import { PrivacyAndSecurity } from './sections/PrivacyAndSecurity';
+import { Sync } from './sections/Sync';
+import { System } from './sections/System';
+import { TiddlyWiki } from './sections/TiddlyWiki';
+import { Updates } from './sections/Updates';
+import { SectionSideBar } from './SectionsSideBar';
+import { usePreferenceSections } from './useSections';
 
 const Root = styled.div`
   padding: 20px;
@@ -47,7 +47,7 @@ export default function Preferences(): JSX.Element {
 
   return (
     <Root>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       {RestartSnackbar}
 
       <Helmet>
diff --git a/src/pages/Preferences/sections/DeveloperTools.tsx b/src/pages/Preferences/sections/DeveloperTools.tsx
index 98407ca8..9902ee91 100644
--- a/src/pages/Preferences/sections/DeveloperTools.tsx
+++ b/src/pages/Preferences/sections/DeveloperTools.tsx
@@ -1,11 +1,11 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
 import { Divider, List } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 import { usePromiseValue } from '@/helpers/useServiceValue';
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function DeveloperTools(props: ISectionProps): JSX.Element {
   const { t } = useTranslation();
@@ -24,9 +24,7 @@ export function DeveloperTools(props: ISectionProps): JSX.Element {
       <SectionTitle ref={props.sections.developers.ref}>{t('Preference.DeveloperTools')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {LOG_FOLDER === undefined || SETTINGS_FOLDER === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {LOG_FOLDER === undefined || SETTINGS_FOLDER === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem
                 button
@@ -34,9 +32,10 @@ export function DeveloperTools(props: ISectionProps): JSX.Element {
                   if (LOG_FOLDER !== undefined) {
                     void window.service.native.open(LOG_FOLDER, true);
                   }
-                }}>
+                }}
+              >
                 <ListItemText primary={t('Preference.OpenLogFolder')} secondary={t('Preference.OpenLogFolderDetail')} />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
               <ListItem
@@ -45,14 +44,20 @@ export function DeveloperTools(props: ISectionProps): JSX.Element {
                   if (SETTINGS_FOLDER !== undefined) {
                     void window.service.native.open(SETTINGS_FOLDER, true);
                   }
-                }}>
+                }}
+              >
                 <ListItemText primary={t('Preference.OpenMetaDataFolder')} secondary={t('Preference.OpenMetaDataFolderDetail')} />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
-              <ListItem button onClick={async () => await window.service.preference.resetWithConfirm()}>
+              <ListItem
+                button
+                onClick={async () => {
+                  await window.service.preference.resetWithConfirm();
+                }}
+              >
                 <ListItemText primary={t('Preference.RestorePreferences')} />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
             </>
           )}
diff --git a/src/pages/Preferences/sections/Downloads.tsx b/src/pages/Preferences/sections/Downloads.tsx
index 48607347..9ad772d2 100644
--- a/src/pages/Preferences/sections/Downloads.tsx
+++ b/src/pages/Preferences/sections/Downloads.tsx
@@ -1,11 +1,11 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
 import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 import { usePreferenceObservable } from '@services/preferences/hooks';
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Downloads(props: Required<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -17,9 +17,7 @@ export function Downloads(props: Required<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections.downloads.ref}>{t('Preference.Downloads')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem
                 button
@@ -34,17 +32,18 @@ export function Downloads(props: Required<ISectionProps>): JSX.Element {
                     .catch((error: Error) => {
                       console.log(error); // eslint-disable-line no-console
                     });
-                }}>
+                }}
+              >
                 <ListItemText primary={t('Preference.DownloadLocation')} secondary={preference.downloadPath} />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
               <ListItem>
                 <ListItemText primary={t('Preference.AskDownloadLocation')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.askForDownloadPath}
                     onChange={async (event) => {
                       await window.service.preference.set('askForDownloadPath', event.target.checked);
diff --git a/src/pages/Preferences/sections/FriendLinks.tsx b/src/pages/Preferences/sections/FriendLinks.tsx
index a56f5fc7..1a58e27f 100644
--- a/src/pages/Preferences/sections/FriendLinks.tsx
+++ b/src/pages/Preferences/sections/FriendLinks.tsx
@@ -1,14 +1,14 @@
-import React from 'react';
-import styled from 'styled-components';
-import { useTranslation } from 'react-i18next';
 import { Divider, List } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 
-import webcatalogLogo from '@/images/webcatalog-logo.svg';
 import translatiumLogo from '@/images/translatium-logo.svg';
+import webcatalogLogo from '@/images/webcatalog-logo.svg';
 
 const Logo = styled.img`
   height: 28px;
@@ -22,19 +22,34 @@ export function FriendLinks(props: ISectionProps): JSX.Element {
       <SectionTitle ref={props.sections.friendLinks.ref}>{t('Preference.FriendLinks')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          <ListItem button onClick={async () => await window.service.native.open('https://github.com/webcatalog/webcatalog-engine')}>
+          <ListItem
+            button
+            onClick={async () => {
+              await window.service.native.open('https://github.com/webcatalog/webcatalog-engine');
+            }}
+          >
             <ListItemText secondary={t('Preference.WebCatalogEngineIntro')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
           <Divider />
-          <ListItem button onClick={async () => await window.service.native.open('https://webcatalogapp.com?utm_source=tidgi_app')}>
+          <ListItem
+            button
+            onClick={async () => {
+              await window.service.native.open('https://webcatalogapp.com?utm_source=tidgi_app');
+            }}
+          >
             <ListItemText primary={<Logo src={webcatalogLogo} alt={t('Preference.WebCatalog')} />} secondary={t('Preference.WebCatalogIntro')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
           <Divider />
-          <ListItem button onClick={async () => await window.service.native.open('https://translatiumapp.com?utm_source=tidgi_app')}>
+          <ListItem
+            button
+            onClick={async () => {
+              await window.service.native.open('https://translatiumapp.com?utm_source=tidgi_app');
+            }}
+          >
             <ListItemText primary={<Logo src={translatiumLogo} alt={t('Preference.Translatium')} />} secondary={t('Preference.TranslatiumIntro')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
         </List>
       </Paper>
diff --git a/src/pages/Preferences/sections/General.tsx b/src/pages/Preferences/sections/General.tsx
index 2cbcacb2..200006e2 100644
--- a/src/pages/Preferences/sections/General.tsx
+++ b/src/pages/Preferences/sections/General.tsx
@@ -1,14 +1,14 @@
+import { Divider, List, ListItemSecondaryAction, MenuItem, Switch } from '@material-ui/core';
+import ChevronRightIcon from '@material-ui/icons/ChevronRight';
 import React from 'react';
 import { Trans, useTranslation } from 'react-i18next';
-import { Divider, Switch, List, ListItemSecondaryAction, MenuItem } from '@material-ui/core';
-import ChevronRightIcon from '@material-ui/icons/ChevronRight';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
-import { usePreferenceObservable } from '@services/preferences/hooks';
 import PopUpMenuItem from '@/components/PopUpMenuItem';
 import { usePromiseValue } from '@/helpers/useServiceValue';
+import { usePreferenceObservable } from '@services/preferences/hooks';
 import { IPreferences } from '@services/preferences/interface';
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 const getThemeString = (theme: IPreferences['themeSource']): string => {
   if (theme === 'light') return 'Light';
@@ -27,16 +27,14 @@ export function General(props: Required<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections.general.ref}>{t('Preference.General')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined || platform === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined || platform === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem>
                 <ListItemText primary={t('Preference.RememberLastVisitState')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.rememberLastPageVisited}
                     onChange={async (event) => {
                       await window.service.preference.set('rememberLastPageVisited', event.target.checked);
@@ -47,20 +45,36 @@ export function General(props: Required<ISectionProps>): JSX.Element {
               </ListItem>
               <Divider />
               <PopUpMenuItem
-                id="theme"
+                id='theme'
                 buttonElement={
                   <ListItem button>
                     <ListItemText primary={t('Preference.Theme')} secondary={getThemeString(preference.themeSource)} />
-                    <ChevronRightIcon color="action" />
+                    <ChevronRightIcon color='action' />
                   </ListItem>
-                }>
-                <MenuItem dense onClick={async () => await window.service.preference.set('themeSource', 'system')}>
+                }
+              >
+                <MenuItem
+                  dense
+                  onClick={async () => {
+                    await window.service.preference.set('themeSource', 'system');
+                  }}
+                >
                   {t('Preference.SystemDefaultTheme')}
                 </MenuItem>
-                <MenuItem dense onClick={async () => await window.service.preference.set('themeSource', 'light')}>
+                <MenuItem
+                  dense
+                  onClick={async () => {
+                    await window.service.preference.set('themeSource', 'light');
+                  }}
+                >
                   {t('Preference.LightTheme')}
                 </MenuItem>
-                <MenuItem dense onClick={async () => await window.service.preference.set('themeSource', 'dark')}>
+                <MenuItem
+                  dense
+                  onClick={async () => {
+                    await window.service.preference.set('themeSource', 'dark');
+                  }}
+                >
                   {t('Preference.DarkTheme')}
                 </MenuItem>
               </PopUpMenuItem>
@@ -69,8 +83,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.ShowSideBar')} secondary={t('Preference.ShowSideBarDetail')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.sidebar}
                     onChange={async (event) => {
                       await window.service.preference.set('sidebar', event.target.checked);
@@ -83,8 +97,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.HideSideBarIcon')} secondary={t('Preference.ShowSideBarDetail')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.hideSideBarIcon}
                     onChange={async (event) => {
                       await window.service.preference.set('hideSideBarIcon', event.target.checked);
@@ -97,8 +111,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.ShowSideBarShortcut')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.sidebarShortcutHints}
                     onChange={async (event) => {
                       await window.service.preference.set('sidebarShortcutHints', event.target.checked);
@@ -113,8 +127,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                     <ListItemText primary={t('Preference.ShowTitleBar')} secondary={t('Preference.ShowTitleBarDetail')} />
                     <ListItemSecondaryAction>
                       <Switch
-                        edge="end"
-                        color="primary"
+                        edge='end'
+                        color='primary'
                         checked={preference.titleBar}
                         onChange={async (event) => {
                           await window.service.preference.set('titleBar', event.target.checked);
@@ -134,8 +148,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                     <ListItemText primary={t('Preference.HideMenuBar')} secondary={t('Preference.HideMenuBarDetail')} />
                     <ListItemSecondaryAction>
                       <Switch
-                        edge="end"
-                        color="primary"
+                        edge='end'
+                        color='primary'
                         checked={preference.hideMenuBar}
                         onChange={async (event) => {
                           await window.service.preference.set('hideMenuBar', event.target.checked);
@@ -151,8 +165,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.AlwaysOnTop')} secondary={t('Preference.AlwaysOnTopDetail')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.alwaysOnTop}
                     onChange={async (event) => {
                       await window.service.preference.set('alwaysOnTop', event.target.checked);
@@ -165,12 +179,12 @@ export function General(props: Required<ISectionProps>): JSX.Element {
               <ListItem>
                 <ListItemText
                   primary={platform === 'win32' ? t('Preference.AttachToTaskbar') : t('Preference.AttachToMenuBar')}
-                  secondary={platform !== 'linux' ? t('Preference.AttachToMenuBarTip') : undefined}
+                  secondary={platform === 'linux' ? undefined : t('Preference.AttachToMenuBarTip')}
                 />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.attachToMenubar}
                     onChange={async (event) => {
                       await window.service.preference.set('attachToMenubar', event.target.checked);
@@ -183,8 +197,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.MenubarAlwaysOnTop')} secondary={t('Preference.MenubarAlwaysOnTopDetail')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.menuBarAlwaysOnTop}
                     onChange={async (event) => {
                       await window.service.preference.set('menuBarAlwaysOnTop', event.target.checked);
@@ -200,7 +214,7 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                     <ListItemText
                       primary={t('Preference.SwipeWithThreeFingersToNavigate')}
                       secondary={
-                        <Trans t={t} i18nKey="Preference.SwipeWithThreeFingersToNavigateDescription">
+                        <Trans t={t} i18nKey='Preference.SwipeWithThreeFingersToNavigateDescription'>
                           Navigate between pages with 3-finger gestures. Swipe left to go back or swipe right to go forward.
                           <br />
                           To enable it, you also need to change
@@ -214,8 +228,8 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                     />
                     <ListItemSecondaryAction>
                       <Switch
-                        edge="end"
-                        color="primary"
+                        edge='end'
+                        color='primary'
                         checked={preference.swipeToNavigate}
                         onChange={async (event) => {
                           await window.service.preference.set('swipeToNavigate', event.target.checked);
diff --git a/src/pages/Preferences/sections/Languages.tsx b/src/pages/Preferences/sections/Languages.tsx
index c7be5dfb..72fe0109 100644
--- a/src/pages/Preferences/sections/Languages.tsx
+++ b/src/pages/Preferences/sections/Languages.tsx
@@ -1,13 +1,13 @@
-import { useTranslation } from 'react-i18next';
 import { Divider, List, ListItemSecondaryAction, MenuItem, Select, Switch } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import { useTranslation } from 'react-i18next';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText, InputLabel } from '../PreferenceComponents';
-import { usePreferenceObservable } from '@services/preferences/hooks';
-import { WindowNames } from '@services/windows/WindowProperties';
 import { hunspellLanguagesMap } from '@/constants/hunspellLanguages';
 import { usePromiseValue } from '@/helpers/useServiceValue';
+import { usePreferenceObservable } from '@services/preferences/hooks';
+import { WindowNames } from '@services/windows/WindowProperties';
+import { InputLabel, ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Languages(props: Partial<ISectionProps> & { languageSelectorOnly?: boolean }): JSX.Element {
   const { t } = useTranslation();
@@ -24,23 +24,22 @@ export function Languages(props: Partial<ISectionProps> & { languageSelectorOnly
       <SectionTitle ref={props.sections?.languages?.ref}>{t('Preference.Languages')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined || platform === undefined || supportedLanguagesMap === undefined || preference.language === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined || platform === undefined || supportedLanguagesMap === undefined || preference.language === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem sx={{ justifyContent: 'space-between' }}>
                 <ListItemText primary={t('Preference.ChooseLanguage')} />
-                <InputLabel sx={{ flex: 1 }} id="demo-simple-select-label">
+                <InputLabel sx={{ flex: 1 }} id='demo-simple-select-label'>
                   {t('Preference.Languages')}
                 </InputLabel>
                 <Select
                   sx={{ flex: 2 }}
-                  labelId="demo-simple-select-label"
+                  labelId='demo-simple-select-label'
                   value={preference.language}
                   onChange={async (event) => {
                     await window.service.preference.set('language', event.target.value);
                   }}
-                  autoWidth>
+                  autoWidth
+                >
                   {Object.keys(supportedLanguagesMap).map((languageID) => (
                     <MenuItem value={languageID} key={languageID}>
                       {supportedLanguagesMap[languageID]}
@@ -55,8 +54,8 @@ export function Languages(props: Partial<ISectionProps> & { languageSelectorOnly
                     <ListItemText primary={t('Preference.SpellCheck')} />
                     <ListItemSecondaryAction>
                       <Switch
-                        edge="end"
-                        color="primary"
+                        edge='end'
+                        color='primary'
                         checked={preference.spellcheck}
                         onChange={async (event) => {
                           await window.service.preference.set('spellcheck', event.target.checked);
@@ -68,12 +67,17 @@ export function Languages(props: Partial<ISectionProps> & { languageSelectorOnly
                   {platform !== 'darwin' && (
                     <>
                       <Divider />
-                      <ListItem button onClick={async () => await window.service.window.open(WindowNames.spellcheck)}>
+                      <ListItem
+                        button
+                        onClick={async () => {
+                          await window.service.window.open(WindowNames.spellcheck);
+                        }}
+                      >
                         <ListItemText
                           primary={t('Preference.SpellCheckLanguages')}
                           secondary={preference.spellcheckLanguages.map((code) => hunspellLanguagesMap[code]).join(' | ')}
                         />
-                        <ChevronRightIcon color="action" />
+                        <ChevronRightIcon color='action' />
                       </ListItem>
                     </>
                   )}
diff --git a/src/pages/Preferences/sections/Miscellaneous.tsx b/src/pages/Preferences/sections/Miscellaneous.tsx
index 4d416a4a..a519a1bd 100644
--- a/src/pages/Preferences/sections/Miscellaneous.tsx
+++ b/src/pages/Preferences/sections/Miscellaneous.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
 import { Divider, List } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
 
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 
 import { WindowNames } from '@services/windows/WindowProperties';
 
@@ -16,24 +16,44 @@ export function Miscellaneous(props: ISectionProps): JSX.Element {
       <SectionTitle ref={props.sections.misc.ref}>{t('Preference.Miscellaneous')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          <ListItem button onClick={async () => await window.service.window.open(WindowNames.about)}>
+          <ListItem
+            button
+            onClick={async () => {
+              await window.service.window.open(WindowNames.about);
+            }}
+          >
             <ListItemText primary={t('ContextMenu.About')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
           <Divider />
-          <ListItem button onClick={async () => await window.service.native.open('https://github.com/tiddly-gittly/TidGi-desktop/')}>
+          <ListItem
+            button
+            onClick={async () => {
+              await window.service.native.open('https://github.com/tiddly-gittly/TidGi-desktop/');
+            }}
+          >
             <ListItemText primary={t('Preference.WebSite')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
           <Divider />
-          <ListItem button onClick={async () => await window.service.native.open('https://github.com/tiddly-gittly/TidGi-desktop/issues')}>
+          <ListItem
+            button
+            onClick={async () => {
+              await window.service.native.open('https://github.com/tiddly-gittly/TidGi-desktop/issues');
+            }}
+          >
             <ListItemText primary={t('Preference.Support')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
           <Divider />
-          <ListItem button onClick={() => window.service.native.quit()}>
+          <ListItem
+            button
+            onClick={() => {
+              window.service.native.quit();
+            }}
+          >
             <ListItemText primary={t('ContextMenu.Quit')} />
-            <ChevronRightIcon color="action" />
+            <ChevronRightIcon color='action' />
           </ListItem>
         </List>
       </Paper>
diff --git a/src/pages/Preferences/sections/Network.tsx b/src/pages/Preferences/sections/Network.tsx
index 4ae0925c..fcbcb992 100644
--- a/src/pages/Preferences/sections/Network.tsx
+++ b/src/pages/Preferences/sections/Network.tsx
@@ -1,9 +1,9 @@
-import { useTranslation } from 'react-i18next';
 import { List } from '@material-ui/core';
+import { useTranslation } from 'react-i18next';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem } from '../PreferenceComponents';
 import { usePreferenceObservable } from '@services/preferences/hooks';
+import { ListItem, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Network(props: ISectionProps): JSX.Element {
   const { t } = useTranslation();
@@ -15,9 +15,7 @@ export function Network(props: ISectionProps): JSX.Element {
       <SectionTitle ref={props.sections.network.ref}>{t('Preference.Network')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem></ListItem>
             </>
diff --git a/src/pages/Preferences/sections/Notifications.tsx b/src/pages/Preferences/sections/Notifications.tsx
index b633e373..6989c2b7 100644
--- a/src/pages/Preferences/sections/Notifications.tsx
+++ b/src/pages/Preferences/sections/Notifications.tsx
@@ -1,15 +1,15 @@
 import { Trans, useTranslation } from 'react-i18next';
 import semver from 'semver';
 
-import TimePicker from '@material-ui/lab/TimePicker';
 import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import TimePicker from '@material-ui/lab/TimePicker';
 
-import type { ISectionProps } from '../useSections';
-import { Link, ListItem, ListItemVertical, ListItemText, Paper, SectionTitle, TextField, TimePickerContainer } from '../PreferenceComponents';
+import { usePromiseValue } from '@/helpers/useServiceValue';
 import { usePreferenceObservable } from '@services/preferences/hooks';
 import { WindowNames } from '@services/windows/WindowProperties';
-import { usePromiseValue } from '@/helpers/useServiceValue';
+import { Link, ListItem, ListItemText, ListItemVertical, Paper, SectionTitle, TextField, TimePickerContainer } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Notifications(props: Required<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -29,42 +29,57 @@ export function Notifications(props: Required<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections.notifications.ref}>{t('Preference.Notifications')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined || platform === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined || platform === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
-              <ListItem button onClick={async () => await window.service.window.open(WindowNames.notifications)}>
+              <ListItem
+                button
+                onClick={async () => {
+                  await window.service.window.open(WindowNames.notifications);
+                }}
+              >
                 <ListItemText primary={t('Preference.NotificationsDetail')} />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
               <ListItemVertical>
                 <ListItemText primary={t('Preference.NotificationsDisableSchedule')} />
                 <TimePickerContainer>
                   <TimePicker
-                    label="from"
+                    label='from'
                     renderInput={(timeProps) => <TextField {...timeProps} />}
                     value={new Date(preference.pauseNotificationsByScheduleFrom)}
-                    onChange={async (d) => await window.service.preference.set('pauseNotificationsByScheduleFrom', (d ?? '').toString())}
-                    onClose={async () => await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: false })}
-                    onOpen={async () => await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: true })}
+                    onChange={async (d) => {
+                      await window.service.preference.set('pauseNotificationsByScheduleFrom', (d ?? '').toString());
+                    }}
+                    onClose={async () => {
+                      await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: false });
+                    }}
+                    onOpen={async () => {
+                      await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: true });
+                    }}
                     disabled={!preference.pauseNotificationsBySchedule}
                   />
                   <TimePicker
-                    label="to"
+                    label='to'
                     renderInput={(timeProps) => <TextField {...timeProps} />}
                     value={new Date(preference.pauseNotificationsByScheduleTo)}
-                    onChange={async (d) => await window.service.preference.set('pauseNotificationsByScheduleTo', (d ?? '').toString())}
-                    onClose={async () => await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: false })}
-                    onOpen={async () => await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: true })}
+                    onChange={async (d) => {
+                      await window.service.preference.set('pauseNotificationsByScheduleTo', (d ?? '').toString());
+                    }}
+                    onClose={async () => {
+                      await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: false });
+                    }}
+                    onOpen={async () => {
+                      await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: true });
+                    }}
                     disabled={!preference.pauseNotificationsBySchedule}
                   />
                 </TimePickerContainer>
                 ({window.Intl.DateTimeFormat().resolvedOptions().timeZone})
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.pauseNotificationsBySchedule}
                     onChange={async (event) => {
                       await window.service.preference.set('pauseNotificationsBySchedule', event.target.checked);
@@ -77,8 +92,8 @@ export function Notifications(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.NotificationsMuteAudio')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.pauseNotificationsMuteAudio}
                     onChange={async (event) => {
                       await window.service.preference.set('pauseNotificationsMuteAudio', event.target.checked);
@@ -88,11 +103,11 @@ export function Notifications(props: Required<ISectionProps>): JSX.Element {
               </ListItem>
               <Divider />
               <ListItem>
-                <ListItemText primary="Show unread count badge" />
+                <ListItemText primary='Show unread count badge' />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.unreadCountBadge}
                     onChange={async (event) => {
                       await window.service.preference.set('unreadCountBadge', event.target.checked);
@@ -109,14 +124,15 @@ export function Notifications(props: Required<ISectionProps>): JSX.Element {
                     title: t('Preference.TestNotification'),
                     body: t('Preference.ItIsWorking'),
                   });
-                }}>
+                }}
+              >
                 <ListItemText
                   primary={t('Preference.TestNotification')}
                   secondary={(() => {
                     // only show this message on macOS Catalina 10.15 & above
                     if (platform === 'darwin' && oSVersion !== undefined && semver.gte(oSVersion, '10.15.0')) {
                       return (
-                        <Trans t={t} i18nKey="Preference.TestNotificationDescription">
+                        <Trans t={t} i18nKey='Preference.TestNotificationDescription'>
                           <span>
                             If notifications dont show up, make sure you enable notifications in
                             <b>macOS Preferences → Notifications → TidGi</b>.
@@ -126,25 +142,25 @@ export function Notifications(props: Required<ISectionProps>): JSX.Element {
                     }
                   })()}
                 />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
               <ListItem>
                 <ListItemText
                   secondary={
-                    <Trans t={t} i18nKey="Preference.HowToEnableNotifications">
+                    <Trans t={t} i18nKey='Preference.HowToEnableNotifications'>
                       <span>
-                        TidGi supports notifications out of the box. But for some cases, to receive notifications, you will need to manually configure
-                        additional web app settings.
+                        TidGi supports notifications out of the box. But for some cases, to receive notifications, you will need to manually configure additional web app settings.
                       </span>
                       <Link
-                        onClick={async () =>
-                          await window.service.native.open('https://github.com/atomery/webcatalog/wiki/How-to-Enable-Notifications-in-Web-Apps')
-                        }
+                        onClick={async () => {
+                          await window.service.native.open('https://github.com/atomery/webcatalog/wiki/How-to-Enable-Notifications-in-Web-Apps');
+                        }}
                         onKeyDown={(event) => {
                           if (event.key !== 'Enter') return;
                           void window.service.native.open('https://github.com/atomery/webcatalog/wiki/How-to-Enable-Notifications-in-Web-Apps');
-                        }}>
+                        }}
+                      >
                         Learn more
                       </Link>
                       <span>.</span>
diff --git a/src/pages/Preferences/sections/Performance.tsx b/src/pages/Preferences/sections/Performance.tsx
index fbc23a31..b32153c7 100644
--- a/src/pages/Preferences/sections/Performance.tsx
+++ b/src/pages/Preferences/sections/Performance.tsx
@@ -1,10 +1,10 @@
+import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
-import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 import { usePreferenceObservable } from '@services/preferences/hooks';
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Performance(props: Required<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -16,16 +16,14 @@ export function Performance(props: Required<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections.performance.ref}>{t('Preference.Performance')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem>
                 <ListItemText primary={t('Preference.HibernateAllUnusedWorkspaces')} secondary={t('Preference.HibernateAllUnusedWorkspacesDescription')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.hibernateUnusedWorkspacesAtLaunch}
                     onChange={async (event) => {
                       await window.service.preference.set('hibernateUnusedWorkspacesAtLaunch', event.target.checked);
@@ -39,8 +37,8 @@ export function Performance(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={t('Preference.hardwareAcceleration')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.useHardwareAcceleration}
                     onChange={async (event) => {
                       await window.service.preference.set('useHardwareAcceleration', event.target.checked);
diff --git a/src/pages/Preferences/sections/PrivacyAndSecurity.tsx b/src/pages/Preferences/sections/PrivacyAndSecurity.tsx
index bafcb592..13f7b690 100644
--- a/src/pages/Preferences/sections/PrivacyAndSecurity.tsx
+++ b/src/pages/Preferences/sections/PrivacyAndSecurity.tsx
@@ -1,11 +1,11 @@
-import React from 'react';
-import { Trans, useTranslation } from 'react-i18next';
 import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import React from 'react';
+import { Trans, useTranslation } from 'react-i18next';
 
-import type { ISectionProps } from '../useSections';
-import { Link, Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 import { usePreferenceObservable } from '@services/preferences/hooks';
+import { Link, ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function PrivacyAndSecurity(props: Required<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -17,16 +17,14 @@ export function PrivacyAndSecurity(props: Required<ISectionProps>): JSX.Element
       <SectionTitle ref={props.sections.privacy.ref}>{t('Preference.PrivacyAndSecurity')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem>
                 <ListItemText primary={t('Preference.ShareBrowsingData')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.shareWorkspaceBrowsingData}
                     onChange={async (event) => {
                       await window.service.preference.set('shareWorkspaceBrowsingData', event.target.checked);
@@ -40,16 +38,17 @@ export function PrivacyAndSecurity(props: Required<ISectionProps>): JSX.Element
                 <ListItemText
                   primary={t('Preference.IgnoreCertificateErrors')}
                   secondary={
-                    <Trans t={t} i18nKey="Preference.IgnoreCertificateErrorsDescription">
-                      <span>Not recommended. </span>
+                    <Trans t={t} i18nKey='Preference.IgnoreCertificateErrorsDescription'>
+                      <span>Not recommended.</span>
                       <Link
-                        onClick={async () =>
-                          await window.service.native.open('https://groups.google.com/a/chromium.org/d/msg/security-dev/mB2KJv_mMzM/ddMteO9RjXEJ')
-                        }
+                        onClick={async () => {
+                          await window.service.native.open('https://groups.google.com/a/chromium.org/d/msg/security-dev/mB2KJv_mMzM/ddMteO9RjXEJ');
+                        }}
                         onKeyDown={(event) => {
                           if (event.key !== 'Enter') return;
                           void window.service.native.open('https://groups.google.com/a/chromium.org/d/msg/security-dev/mB2KJv_mMzM/ddMteO9RjXEJ');
-                        }}>
+                        }}
+                      >
                         Learn more
                       </Link>
                       .
@@ -58,8 +57,8 @@ export function PrivacyAndSecurity(props: Required<ISectionProps>): JSX.Element
                 />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.ignoreCertificateErrors}
                     onChange={async (event) => {
                       await window.service.preference.set('ignoreCertificateErrors', event.target.checked);
@@ -69,15 +68,23 @@ export function PrivacyAndSecurity(props: Required<ISectionProps>): JSX.Element
                 </ListItemSecondaryAction>
               </ListItem>
               <Divider />
-              <ListItem button onClick={async () => await window.service.workspaceView.clearBrowsingDataWithConfirm()}>
+              <ListItem
+                button
+                onClick={async () => {
+                  await window.service.workspaceView.clearBrowsingDataWithConfirm();
+                }}
+              >
                 <ListItemText primary={t('Preference.ClearBrowsingData')} secondary={t('Preference.ClearBrowsingDataDescription')} />
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
               <ListItem
                 button
-                onClick={async () => await window.service.native.open('https://github.com/tiddly-gittly/TidGi-Desktop/blob/master/PrivacyPolicy.md')}>
-                <ListItemText primary="Privacy Policy" />
+                onClick={async () => {
+                  await window.service.native.open('https://github.com/tiddly-gittly/TidGi-Desktop/blob/master/PrivacyPolicy.md');
+                }}
+              >
+                <ListItemText primary='Privacy Policy' />
               </ListItem>
             </>
           )}
diff --git a/src/pages/Preferences/sections/Sync.tsx b/src/pages/Preferences/sections/Sync.tsx
index c233fa1b..c6b20ee0 100644
--- a/src/pages/Preferences/sections/Sync.tsx
+++ b/src/pages/Preferences/sections/Sync.tsx
@@ -1,18 +1,18 @@
+import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
+import TimePicker from '@material-ui/lab/TimePicker';
+import fromUnixTime from 'date-fns/fromUnixTime';
+import setDate from 'date-fns/setDate';
+import setMonth from 'date-fns/setMonth';
+import setYear from 'date-fns/setYear';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
-import fromUnixTime from 'date-fns/fromUnixTime';
-import setYear from 'date-fns/setYear';
-import setMonth from 'date-fns/setMonth';
-import setDate from 'date-fns/setDate';
-import TimePicker from '@material-ui/lab/TimePicker';
-import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 
 import { TokenForm } from '../../../components/TokenForm';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, TextField, TimePickerContainer, ListItem, ListItemText } from '../PreferenceComponents';
 import { usePreferenceObservable } from '@services/preferences/hooks';
 import { WindowNames } from '@services/windows/WindowProperties';
+import { ListItem, ListItemText, Paper, SectionTitle, TextField, TimePickerContainer } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Sync(props: Required<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -24,9 +24,7 @@ export function Sync(props: Required<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections.sync.ref}>{t('Preference.Sync')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem>
                 <TokenForm />
@@ -36,8 +34,8 @@ export function Sync(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={`${t('Preference.SyncBeforeShutdown')} (Mac/Linux)`} secondary={t('Preference.SyncBeforeShutdownDescription')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.syncBeforeShutdown}
                     onChange={async (event) => {
                       await window.service.preference.set('syncBeforeShutdown', event.target.checked);
@@ -50,8 +48,8 @@ export function Sync(props: Required<ISectionProps>): JSX.Element {
                 <ListItemText primary={`${t('Preference.SyncOnlyWhenNoDraft')}`} secondary={t('Preference.SyncOnlyWhenNoDraftDescription')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.syncOnlyWhenNoDraft}
                     onChange={async (event) => {
                       await window.service.preference.set('syncOnlyWhenNoDraft', event.target.checked);
@@ -65,10 +63,10 @@ export function Sync(props: Required<ISectionProps>): JSX.Element {
                 <TimePickerContainer>
                   <TimePicker
                     ampm={false}
-                    openTo="hours"
+                    openTo='hours'
                     views={['hours', 'minutes', 'seconds']}
-                    inputFormat="HH:mm:ss"
-                    mask="__:__:__"
+                    inputFormat='HH:mm:ss'
+                    mask='__:__:__'
                     renderInput={(timeProps) => <TextField {...timeProps} />}
                     value={fromUnixTime(preference.syncDebounceInterval / 1000 + new Date().getTimezoneOffset() * 60)}
                     onChange={async (date) => {
@@ -78,8 +76,12 @@ export function Sync(props: Required<ISectionProps>): JSX.Element {
                       await window.service.preference.set('syncDebounceInterval', utcTime);
                       props.requestRestartCountDown();
                     }}
-                    onClose={async () => await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: false })}
-                    onOpen={async () => await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: true })}
+                    onClose={async () => {
+                      await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: false });
+                    }}
+                    onOpen={async () => {
+                      await window.service.window.updateWindowMeta(WindowNames.preferences, { preventClosingWindow: true });
+                    }}
                   />
                 </TimePickerContainer>
               </ListItem>
diff --git a/src/pages/Preferences/sections/System.tsx b/src/pages/Preferences/sections/System.tsx
index 5606b210..5aa4971e 100644
--- a/src/pages/Preferences/sections/System.tsx
+++ b/src/pages/Preferences/sections/System.tsx
@@ -1,12 +1,12 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
 import { List, MenuItem } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
 
 import PopUpMenuItem from '@/components/PopUpMenuItem';
 import { getOpenAtLoginString, useSystemPreferenceObservable } from '@services/systemPreferences/hooks';
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
 
 export function System(props: ISectionProps): JSX.Element {
   const { t } = useTranslation();
@@ -18,25 +18,39 @@ export function System(props: ISectionProps): JSX.Element {
       <SectionTitle ref={props.sections.system.ref}>{t('Preference.System')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {systemPreference === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {systemPreference === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <PopUpMenuItem
-                id="openAtLogin"
+                id='openAtLogin'
                 buttonElement={
                   <ListItem button>
                     <ListItemText primary={t('Preference.OpenAtLogin')} secondary={getOpenAtLoginString(systemPreference.openAtLogin)} />
-                    <ChevronRightIcon color="action" />
+                    <ChevronRightIcon color='action' />
                   </ListItem>
-                }>
-                <MenuItem dense onClick={async () => await window.service.systemPreference.setSystemPreference('openAtLogin', 'yes')}>
+                }
+              >
+                <MenuItem
+                  dense
+                  onClick={async () => {
+                    await window.service.systemPreference.setSystemPreference('openAtLogin', 'yes');
+                  }}
+                >
                   {t('Yes')}
                 </MenuItem>
-                <MenuItem dense onClick={async () => await window.service.systemPreference.setSystemPreference('openAtLogin', 'yes-hidden')}>
+                <MenuItem
+                  dense
+                  onClick={async () => {
+                    await window.service.systemPreference.setSystemPreference('openAtLogin', 'yes-hidden');
+                  }}
+                >
                   {t('Preference.OpenAtLoginMinimized')}
                 </MenuItem>
-                <MenuItem dense onClick={async () => await window.service.systemPreference.setSystemPreference('openAtLogin', 'no')}>
+                <MenuItem
+                  dense
+                  onClick={async () => {
+                    await window.service.systemPreference.setSystemPreference('openAtLogin', 'no');
+                  }}
+                >
                   {t('No')}
                 </MenuItem>
               </PopUpMenuItem>
diff --git a/src/pages/Preferences/sections/TiddlyWiki.tsx b/src/pages/Preferences/sections/TiddlyWiki.tsx
index 51f71f8d..bb8c1ec5 100644
--- a/src/pages/Preferences/sections/TiddlyWiki.tsx
+++ b/src/pages/Preferences/sections/TiddlyWiki.tsx
@@ -1,12 +1,12 @@
+import useDebouncedCallback from 'beautiful-react-hooks/useDebouncedCallback';
 import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import useDebouncedCallback from 'beautiful-react-hooks/useDebouncedCallback';
 
 import { List } from '@material-ui/core';
 
-import type { ISectionProps } from '../useSections';
 import { useUserInfoObservable } from '@services/auth/hooks';
 import { ListItemText, ListItemVertical, Paper, SectionTitle, TextField } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function TiddlyWiki(props: Partial<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -28,9 +28,7 @@ export function TiddlyWiki(props: Partial<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections?.wiki?.ref}>{t('Preference.TiddlyWiki')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {userInfo === undefined ? (
-            <ListItemVertical>{t('Loading')}</ListItemVertical>
-          ) : (
+          {userInfo === undefined ? <ListItemVertical>{t('Loading')}</ListItemVertical> : (
             <ListItemVertical>
               <ListItemText primary={t('Preference.WikiMetaData')} secondary={t('Preference.WikiMetaDataDescription')} />
               <TextField
diff --git a/src/pages/Preferences/sections/Updates.tsx b/src/pages/Preferences/sections/Updates.tsx
index 68e96b4a..9a1a2d79 100644
--- a/src/pages/Preferences/sections/Updates.tsx
+++ b/src/pages/Preferences/sections/Updates.tsx
@@ -1,13 +1,13 @@
-import { useTranslation } from 'react-i18next';
 import { Divider, List, ListItemSecondaryAction, Switch } from '@material-ui/core';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import { useTranslation } from 'react-i18next';
 
-import type { ISectionProps } from '../useSections';
-import { Paper, SectionTitle, ListItem, ListItemText } from '../PreferenceComponents';
-import { usePreferenceObservable } from '@services/preferences/hooks';
-import { useUpdaterObservable, getUpdaterMessage } from '@services/updater/hooks';
-import { IUpdaterStatus } from '@services/updater/interface';
 import { latestStableUpdateUrl } from '@/constants/urls';
+import { usePreferenceObservable } from '@services/preferences/hooks';
+import { getUpdaterMessage, useUpdaterObservable } from '@services/updater/hooks';
+import { IUpdaterStatus } from '@services/updater/interface';
+import { ListItem, ListItemText, Paper, SectionTitle } from '../PreferenceComponents';
+import type { ISectionProps } from '../useSections';
 
 export function Updates(props: Required<ISectionProps>): JSX.Element {
   const { t } = useTranslation();
@@ -20,33 +20,34 @@ export function Updates(props: Required<ISectionProps>): JSX.Element {
       <SectionTitle ref={props.sections.updates.ref}>{t('Preference.Network')}</SectionTitle>
       <Paper elevation={0}>
         <List dense disablePadding>
-          {preference === undefined || updaterMetaData === undefined ? (
-            <ListItem>{t('Loading')}</ListItem>
-          ) : (
+          {preference === undefined || updaterMetaData === undefined ? <ListItem>{t('Loading')}</ListItem> : (
             <>
               <ListItem
                 button
-                onClick={
-                  updaterMetaData.status === IUpdaterStatus.updateAvailable
-                    ? async () => await window.service.native.open(updaterMetaData.info?.latestReleasePageUrl ?? latestStableUpdateUrl)
-                    : async () => await window.service.updater.checkForUpdates()
-                }
-                disabled={updaterMetaData.status === IUpdaterStatus.checkingForUpdate || updaterMetaData.status === IUpdaterStatus.downloadProgress}>
+                onClick={updaterMetaData.status === IUpdaterStatus.updateAvailable
+                  ? async () => {
+                    await window.service.native.open(updaterMetaData.info?.latestReleasePageUrl ?? latestStableUpdateUrl);
+                  }
+                  : async () => {
+                    await window.service.updater.checkForUpdates();
+                  }}
+                disabled={updaterMetaData.status === IUpdaterStatus.checkingForUpdate || updaterMetaData.status === IUpdaterStatus.downloadProgress}
+              >
                 {updaterMetaData.status !== undefined && (
                   <ListItemText
                     primary={t(`Updater.${updaterMetaData.status}`)}
                     secondary={getUpdaterMessage(updaterMetaData.status, updaterMetaData.info, t)}
                   />
                 )}
-                <ChevronRightIcon color="action" />
+                <ChevronRightIcon color='action' />
               </ListItem>
               <Divider />
               <ListItem>
                 <ListItemText primary={t('Preference.ReceivePreReleaseUpdates')} />
                 <ListItemSecondaryAction>
                   <Switch
-                    edge="end"
-                    color="primary"
+                    edge='end'
+                    color='primary'
                     checked={preference.allowPrerelease}
                     onChange={async (event) => {
                       await window.service.preference.set('allowPrerelease', event.target.checked);
diff --git a/src/pages/Preferences/useSections.ts b/src/pages/Preferences/useSections.ts
index 9dfec398..de6bcda4 100644
--- a/src/pages/Preferences/useSections.ts
+++ b/src/pages/Preferences/useSections.ts
@@ -1,10 +1,14 @@
 import { useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { SvgIconTypeMap } from '@material-ui/core';
+import { OverridableComponent } from '@material-ui/core/OverridableComponent';
 import BuildIcon from '@material-ui/icons/Build';
 import CloudDownloadIcon from '@material-ui/icons/CloudDownload';
 import CodeIcon from '@material-ui/icons/Code';
+import GitHubIcon from '@material-ui/icons/GitHub';
 import LanguageIcon from '@material-ui/icons/Language';
+import MenuBookIcon from '@material-ui/icons/MenuBook';
 import MoreHorizIcon from '@material-ui/icons/MoreHoriz';
 import NotificationsIcon from '@material-ui/icons/Notifications';
 import PowerIcon from '@material-ui/icons/Power';
@@ -13,10 +17,6 @@ import SecurityIcon from '@material-ui/icons/Security';
 import StorefrontIcon from '@material-ui/icons/Storefront';
 import SystemUpdateAltIcon from '@material-ui/icons/SystemUpdateAlt';
 import WidgetsIcon from '@material-ui/icons/Widgets';
-import GitHubIcon from '@material-ui/icons/GitHub';
-import MenuBookIcon from '@material-ui/icons/MenuBook';
-import { OverridableComponent } from '@material-ui/core/OverridableComponent';
-import { SvgIconTypeMap } from '@material-ui/core';
 
 import { PreferenceSections } from '@services/preferences/interface';
 
diff --git a/src/pages/SpellcheckLanguages/index.tsx b/src/pages/SpellcheckLanguages/index.tsx
index dfc428f1..461183b0 100644
--- a/src/pages/SpellcheckLanguages/index.tsx
+++ b/src/pages/SpellcheckLanguages/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
-import styled from 'styled-components';
-import { useTranslation } from 'react-i18next';
 import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
 
 import ButtonRaw from '@material-ui/core/Button';
 import Checkbox from '@material-ui/core/Checkbox';
@@ -10,8 +10,8 @@ import ListItem from '@material-ui/core/ListItem';
 import ListItemIcon from '@material-ui/core/ListItemIcon';
 import ListItemText from '@material-ui/core/ListItemText';
 
-import { hunspellLanguagesMap, HunspellLanguages } from '../../constants/hunspellLanguages';
 import { usePreferenceObservable } from '@services/preferences/hooks';
+import { HunspellLanguages, hunspellLanguagesMap } from '../../constants/hunspellLanguages';
 
 const Root = styled.div`
   display: flex;
@@ -53,7 +53,7 @@ export default function SpellcheckLanguages(): JSX.Element {
   }
   return (
     <Root>
-      <div id="test" data-usage="For spectron automating testing" />
+      <div id='test' data-usage='For spectron automating testing' />
       <Helmet>
         <title>{t('Preference.SpellCheckLanguages')}</title>
       </Helmet>
@@ -72,10 +72,11 @@ export default function SpellcheckLanguages(): JSX.Element {
               } else {
                 void window.service.preference.set('spellcheckLanguages', [...preference.spellcheckLanguages, code]);
               }
-            }}>
+            }}
+          >
             <ListItemIcon>
               <Checkbox
-                edge="start"
+                edge='start'
                 checked={preference.spellcheckLanguages.includes(code)}
                 disabled={preference.spellcheckLanguages.length < 2 && preference.spellcheckLanguages.includes(code)}
               />
@@ -85,10 +86,16 @@ export default function SpellcheckLanguages(): JSX.Element {
         ))}
       </Top>
       <Bottom>
-        <Button color="primary" disabled>
+        <Button color='primary' disabled>
           This Page is Auto Saved
         </Button>
-        <Button onClick={async () => await window.remote.closeCurrentWindow()}>Close</Button>
+        <Button
+          onClick={async () => {
+            await window.remote.closeCurrentWindow();
+          }}
+        >
+          Close
+        </Button>
       </Bottom>
     </Root>
   );
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 4b10d1d4..0d50503b 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,29 +1,36 @@
-import React from 'react';
 import { WindowNames } from '@services/windows/WindowProperties';
+import React from 'react';
 
-import Main from './Main';
 import AboutPage from './About';
 import { AddWorkspace as DialogAddWorkspace } from './AddWorkspace';
 import EditWorkspace from './EditWorkspace';
+import Main from './Main';
 import DialogNotifications from './Notifications';
 import DialogPreferences from './Preferences';
 import SpellcheckLanguages from './SpellcheckLanguages';
 
 export function Pages(): JSX.Element {
   switch (window.meta.windowName) {
-    case WindowNames.about:
+    case WindowNames.about: {
       return <AboutPage />;
-    case WindowNames.addWorkspace:
+    }
+    case WindowNames.addWorkspace: {
       return <DialogAddWorkspace />;
-    case WindowNames.editWorkspace:
+    }
+    case WindowNames.editWorkspace: {
       return <EditWorkspace />;
-    case WindowNames.notifications:
+    }
+    case WindowNames.notifications: {
       return <DialogNotifications />;
-    case WindowNames.preferences:
+    }
+    case WindowNames.preferences: {
       return <DialogPreferences />;
-    case WindowNames.spellcheck:
+    }
+    case WindowNames.spellcheck: {
       return <SpellcheckLanguages />;
-    default:
+    }
+    default: {
       return <Main />;
+    }
   }
 }
diff --git a/src/preload/common/authingPostMessage.ts b/src/preload/common/authingPostMessage.ts
index 23dfc559..9621279d 100644
--- a/src/preload/common/authingPostMessage.ts
+++ b/src/preload/common/authingPostMessage.ts
@@ -1,8 +1,8 @@
 // on production build, if we try to redirect to http://localhost:3012 , we will reach chrome-error://chromewebdata/ , but we can easily get back
 // this happens when we are redirected by OAuth login
-import { context, window as windowService } from './services';
-import { windowName } from './browserViewMetaData';
 import { WindowNames } from '@services/windows/WindowProperties';
+import { windowName } from './browserViewMetaData';
+import { context, window as windowService } from './services';
 
 const CHECK_LOADED_INTERVAL = 500;
 let CHROME_ERROR_PATH: string | undefined;
diff --git a/src/preload/common/browserViewMetaData.ts b/src/preload/common/browserViewMetaData.ts
index f800aca4..4b05e338 100644
--- a/src/preload/common/browserViewMetaData.ts
+++ b/src/preload/common/browserViewMetaData.ts
@@ -1,6 +1,6 @@
-import { contextBridge, ipcRenderer } from 'electron';
 import { MetaDataChannel } from '@/constants/channels';
-import { WindowNames, WindowMeta } from '@services/windows/WindowProperties';
+import { WindowMeta, WindowNames } from '@services/windows/WindowProperties';
+import { contextBridge, ipcRenderer } from 'electron';
 
 const metaDataArguments = process.argv
   .filter((item) => item.startsWith(MetaDataChannel.browserViewMetaData))
diff --git a/src/preload/common/i18n.ts b/src/preload/common/i18n.ts
index 6f72ca42..484c9e1e 100644
--- a/src/preload/common/i18n.ts
+++ b/src/preload/common/i18n.ts
@@ -1,5 +1,5 @@
-import { contextBridge, ipcRenderer } from 'electron';
 import { preloadBindings } from '@services/libs/i18n/preloadBindings';
+import { contextBridge, ipcRenderer } from 'electron';
 
 const i18n = {
   i18nextElectronBackend: preloadBindings(ipcRenderer),
diff --git a/src/preload/common/log.ts b/src/preload/common/log.ts
index af7092b0..9f954440 100644
--- a/src/preload/common/log.ts
+++ b/src/preload/common/log.ts
@@ -1,5 +1,5 @@
-import { contextBridge, ipcRenderer } from 'electron';
 import { WikiChannel } from '@/constants/channels';
+import { contextBridge, ipcRenderer } from 'electron';
 
 export const logMethods = {
   /**
@@ -7,7 +7,7 @@ export const logMethods = {
    * @param messageSetter can be wikiCreationMessageSetter from a useEffect
    * @returns
    */
-  registerWikiCreationMessage: (messageSetter: (message: string) => void): (() => void) => {
+  registerWikiCreationMessage: (messageSetter: (message: string) => void): () => void => {
     const handleNextMessage = (_event: Electron.IpcRendererEvent, message: string): void => {
       messageSetter(message);
     };
diff --git a/src/preload/common/remote.ts b/src/preload/common/remote.ts
index 75dc43ed..b1c72fcb 100644
--- a/src/preload/common/remote.ts
+++ b/src/preload/common/remote.ts
@@ -1,10 +1,10 @@
-import { contextBridge, ipcRenderer, MenuItemConstructorOptions, webFrame } from 'electron';
 import { ViewChannel, WindowChannel } from '@/constants/channels';
 import { rendererMenuItemProxy } from '@services/menu/contextMenu/rendererMenuItemProxy';
 import { IOnContextMenuInfo } from '@services/menu/interface';
+import { contextBridge, ipcRenderer, MenuItemConstructorOptions, webFrame } from 'electron';
 
-import * as service from './services';
 import { windowName } from './browserViewMetaData';
+import * as service from './services';
 
 export const remoteMethods = {
   buildContextMenuAndPopup: async (menus: MenuItemConstructorOptions[], parameters: IOnContextMenuInfo): Promise<() => void> => {
diff --git a/src/preload/common/services.ts b/src/preload/common/services.ts
index 922811a2..16401a11 100644
--- a/src/preload/common/services.ts
+++ b/src/preload/common/services.ts
@@ -7,9 +7,9 @@
 import { createProxy } from 'electron-ipc-cat/client';
 import { AsyncifyProxy } from 'electron-ipc-cat/common';
 
-import { IAuthenticationService, AuthenticationServiceIPCDescriptor } from '@services/auth/interface';
-import { IContextService, ContextServiceIPCDescriptor } from '@services/context/interface';
-import { IGitService, GitServiceIPCDescriptor } from '@services/git/interface';
+import { AuthenticationServiceIPCDescriptor, IAuthenticationService } from '@services/auth/interface';
+import { ContextServiceIPCDescriptor, IContextService } from '@services/context/interface';
+import { GitServiceIPCDescriptor, IGitService } from '@services/git/interface';
 import { IMenuService, MenuServiceIPCDescriptor } from '@services/menu/interface';
 import { INativeService, NativeServiceIPCDescriptor } from '@services/native/interface';
 import { INotificationService, NotificationServiceIPCDescriptor } from '@services/notifications/interface';
diff --git a/src/preload/index.ts b/src/preload/index.ts
index a3cdfc84..433103b8 100644
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -1,6 +1,6 @@
 import 'reflect-metadata';
 import { ipcRenderer } from 'electron';
-import { IServicesWithoutObservables, IServicesWithOnlyObservables } from 'electron-ipc-cat/common';
+import { IServicesWithOnlyObservables, IServicesWithoutObservables } from 'electron-ipc-cat/common';
 
 import './common/test';
 import './common/i18n';
diff --git a/src/preload/view.ts b/src/preload/view.ts
index bf5e2cc0..8454abd0 100644
--- a/src/preload/view.ts
+++ b/src/preload/view.ts
@@ -1,10 +1,10 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
+import { Channels, WorkspaceChannel } from '@/constants/channels';
 import { webFrame } from 'electron';
-import { WorkspaceChannel, Channels } from '@/constants/channels';
 import './wikiOperation';
-import { preference, workspace, workspaceView, menu } from './common/services';
 import { IPossibleWindowMeta, WindowMeta, WindowNames } from '@services/windows/WindowProperties';
 import { browserViewMetaData, windowName } from './common/browserViewMetaData';
+import { menu, preference, workspace, workspaceView } from './common/services';
 
 let handled = false;
 const handleLoaded = (event: string): void => {
@@ -64,11 +64,15 @@ async function executeJavaScriptInBrowserView(): Promise<void> {
 
 if (windowName === WindowNames.view) {
   // try to load as soon as dom is loaded
-  document.addEventListener('DOMContentLoaded', () => handleLoaded('document.on("DOMContentLoaded")'));
+  document.addEventListener('DOMContentLoaded', () => {
+    handleLoaded('document.on("DOMContentLoaded")');
+  });
   // if user navigates between the same website
   // DOMContentLoaded might not be triggered so double check with 'onload'
   // https://github.com/atomery/webcatalog/issues/797
-  window.addEventListener('load', () => handleLoaded('window.on("onload")'));
+  window.addEventListener('load', () => {
+    handleLoaded('window.on("onload")');
+  });
   window.addEventListener('message', async (event?: MessageEvent<{ type?: Channels; workspaceID?: string } | undefined>) => {
     // set workspace to active when its notification is clicked
     if (event?.data?.type === WorkspaceChannel.focusWorkspace) {
diff --git a/src/preload/wikiOperation.ts b/src/preload/wikiOperation.ts
index 0f0c692e..9261ada3 100644
--- a/src/preload/wikiOperation.ts
+++ b/src/preload/wikiOperation.ts
@@ -7,8 +7,8 @@
  *
  * You can use wrapped method in `services/wiki/index.ts` 's `wikiOperation()` instead. Available operations are registered in `src/services/wiki/wikiOperations.ts`
  */
-import { ipcRenderer, webFrame } from 'electron';
 import { WikiChannel } from '@/constants/channels';
+import { ipcRenderer, webFrame } from 'electron';
 
 export const wikiOperations = {
   [WikiChannel.setState]: async (stateKey: string, content: string) => {
@@ -26,13 +26,12 @@ export const wikiOperations = {
  * @param script js statement to be executed, nothing will be returned
  */
 async function executeTWJavaScriptWhenIdle(script: string, options?: { onlyWhenVisible?: boolean }): Promise<void> {
-  const executeHandlerCode =
-    options?.onlyWhenVisible === true
-      ? `
+  const executeHandlerCode = options?.onlyWhenVisible === true
+    ? `
         if (document.visibilityState === 'visible') {
           handler();
         }`
-      : `handler();`;
+    : `handler();`;
   await webFrame.executeJavaScript(`
     new Promise((resolve, reject) => {
       const handler = () => {
@@ -98,8 +97,9 @@ ipcRenderer.on(WikiChannel.syncProgress, async (event, message: string) => {
     { onlyWhenVisible: true },
   );
 });
-ipcRenderer.on(WikiChannel.setState, (_event: Electron.IpcRendererEvent, ...rest: Parameters<typeof wikiOperations[WikiChannel.setState]>) =>
-  wikiOperations[WikiChannel.setState](...rest),
+ipcRenderer.on(
+  WikiChannel.setState,
+  (_event: Electron.IpcRendererEvent, ...rest: Parameters<typeof wikiOperations[WikiChannel.setState]>) => wikiOperations[WikiChannel.setState](...rest),
 );
 ipcRenderer.on(WikiChannel.generalNotification, async (event, message: string) => {
   await executeTWJavaScriptWhenIdle(`
diff --git a/src/renderer.tsx b/src/renderer.tsx
index 1226c92d..ecaa5a73 100644
--- a/src/renderer.tsx
+++ b/src/renderer.tsx
@@ -1,23 +1,23 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 /* eslint-disable promise/always-return */
-import React from 'react';
 import i18n from 'i18next';
-import { ThemeProvider } from 'styled-components';
+import React from 'react';
 import { createRoot } from 'react-dom/client';
+import { ThemeProvider } from 'styled-components';
 
+import CssBaseline from '@material-ui/core/CssBaseline';
 import StyledEngineProvider from '@material-ui/core/StyledEngineProvider';
 import DateFnsUtils from '@material-ui/lab/AdapterDateFns';
 import LocalizationProvider from '@material-ui/lab/LocalizationProvider';
-import CssBaseline from '@material-ui/core/CssBaseline';
 import { I18nextProvider } from 'react-i18next';
 import 'typeface-roboto/index.css';
 
-import { useThemeObservable } from '@services/theme/hooks';
 import { darkTheme, lightTheme } from '@services/theme/defaultTheme';
+import { useThemeObservable } from '@services/theme/hooks';
 import { initI18N } from './i18n';
 import 'electron-ipc-cat/fixContextIsolation';
-import { Pages } from './pages';
 import { RootStyle } from './components/RootStyle';
+import { Pages } from './pages';
 
 function App(): JSX.Element {
   const theme = useThemeObservable();
@@ -41,7 +41,7 @@ function App(): JSX.Element {
 }
 
 void window.remote.setVisualZoomLevelLimits(1, 1);
-const container = document.getElementById('app');
+const container = document.querySelector('#app');
 const root = createRoot(container!);
 root.render(<App />);
 
diff --git a/src/services/auth/hooks.ts b/src/services/auth/hooks.ts
index fd2af089..25a80dae 100644
--- a/src/services/auth/hooks.ts
+++ b/src/services/auth/hooks.ts
@@ -1,8 +1,8 @@
-import { useState, useEffect } from 'react';
-import useObservable from 'beautiful-react-hooks/useObservable';
-import { IUserInfos } from './interface';
-import { SupportedStorageServices } from '@services/types';
 import { IGitUserInfos } from '@services/git/interface';
+import { SupportedStorageServices } from '@services/types';
+import useObservable from 'beautiful-react-hooks/useObservable';
+import { useEffect, useState } from 'react';
+import { IUserInfos } from './interface';
 
 export function useUserInfoObservable(): IUserInfos | undefined {
   const [userInfo, userInfoSetter] = useState<IUserInfos | undefined>();
diff --git a/src/services/auth/index.ts b/src/services/auth/index.ts
index b06463a2..636360da 100644
--- a/src/services/auth/index.ts
+++ b/src/services/auth/index.ts
@@ -1,12 +1,12 @@
 /* eslint-disable @typescript-eslint/require-await */
 /* eslint-disable unicorn/no-null */
-import { debounce } from 'lodash';
-import { injectable } from 'inversify';
-import settings from 'electron-settings';
-import { IAuthingUserInfo, SupportedStorageServices } from '@services/types';
-import { IAuthenticationService, IUserInfos, ServiceBranchTypes, ServiceEmailTypes, ServiceTokenTypes, ServiceUserNameTypes } from './interface';
-import { BehaviorSubject } from 'rxjs';
 import { IGitUserInfos } from '@services/git/interface';
+import { IAuthingUserInfo, SupportedStorageServices } from '@services/types';
+import settings from 'electron-settings';
+import { injectable } from 'inversify';
+import { debounce } from 'lodash';
+import { BehaviorSubject } from 'rxjs';
+import { IAuthenticationService, IUserInfos, ServiceBranchTypes, ServiceEmailTypes, ServiceTokenTypes, ServiceUserNameTypes } from './interface';
 
 const defaultUserInfos = {
   userName: '',
diff --git a/src/services/auth/interface.ts b/src/services/auth/interface.ts
index 381dbb2c..056a57a3 100644
--- a/src/services/auth/interface.ts
+++ b/src/services/auth/interface.ts
@@ -1,9 +1,9 @@
 /* eslint-disable unicorn/no-null */
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { AuthenticationChannel } from '@/constants/channels';
-import { BehaviorSubject } from 'rxjs';
 import { IGitUserInfos } from '@services/git/interface';
 import { SupportedStorageServices } from '@services/types';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
+import { BehaviorSubject } from 'rxjs';
 
 export type ServiceTokenTypes = `${SupportedStorageServices}-token`;
 export const getServiceTokenTypes = (serviceType: SupportedStorageServices): ServiceTokenTypes => `${serviceType}-token`;
@@ -25,13 +25,15 @@ export const getServiceBranchTypes = (serviceType: SupportedStorageServices): Se
 /** Git push: Git commit message branch, you may use different branch for different storage service */
 type BranchRecord = Record<ServiceBranchTypes, string>;
 
-export type IUserInfos = {
-  /** Default UserName in TiddlyWiki, each wiki can have different username, but fallback to this if not specific on */
-  userName: string;
-} & Partial<TokenRecord> &
-  Partial<UserNameRecord> &
-  Partial<EmailRecord> &
-  Partial<BranchRecord>;
+export type IUserInfos =
+  & {
+    /** Default UserName in TiddlyWiki, each wiki can have different username, but fallback to this if not specific on */
+    userName: string;
+  }
+  & Partial<TokenRecord>
+  & Partial<UserNameRecord>
+  & Partial<EmailRecord>
+  & Partial<BranchRecord>;
 
 /**
  * Handle login to Github GitLab Coding.net
diff --git a/src/services/context/index.ts b/src/services/context/index.ts
index 904a5deb..e60c0b0c 100644
--- a/src/services/context/index.ts
+++ b/src/services/context/index.ts
@@ -1,14 +1,14 @@
 /* eslint-disable @typescript-eslint/require-await */
-import { app, net } from 'electron';
-import process from 'process';
-import os from 'os';
 import { isElectronDevelopment } from '@/constants/isElectronDevelopment';
+import { app, net } from 'electron';
 import { injectable } from 'inversify';
+import os from 'os';
+import process from 'process';
 
-import { IContextService, IContext, IPaths, IConstants } from './interface';
-import * as paths from '@/constants/paths';
 import * as appPaths from '@/constants/appPaths';
-import { tiddlywikiLanguagesMap, supportedLanguagesMap } from '@/constants/languages';
+import { supportedLanguagesMap, tiddlywikiLanguagesMap } from '@/constants/languages';
+import * as paths from '@/constants/paths';
+import { IConstants, IContext, IContextService, IPaths } from './interface';
 
 @injectable()
 export class ContextService implements IContextService {
diff --git a/src/services/context/interface.ts b/src/services/context/interface.ts
index d692caee..f57b100c 100644
--- a/src/services/context/interface.ts
+++ b/src/services/context/interface.ts
@@ -1,5 +1,5 @@
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { ContextChannel } from '@/constants/channels';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
 
 export interface IPaths {
   CHROME_ERROR_PATH: string;
diff --git a/src/services/git/gitWorker.ts b/src/services/git/gitWorker.ts
index b14e8229..54a64c60 100644
--- a/src/services/git/gitWorker.ts
+++ b/src/services/git/gitWorker.ts
@@ -1,12 +1,12 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
 import 'source-map-support/register';
-import { expose } from 'threads/worker';
-import { Observable } from 'rxjs';
-import { clone, commitAndSync, GitStep, ILoggerContext, initGit, getModifiedFileList, getRemoteUrl, SyncParameterMissingError } from 'git-sync-js';
-import type { ICommitAndSyncConfigs, IGitLogMessage, IGitUserInfos } from './interface';
-import { defaultGitInfo } from './defaultGitInfo';
 import { WikiChannel } from '@/constants/channels';
 import type { IWorkspace } from '@services/workspaces/interface';
+import { clone, commitAndSync, getModifiedFileList, getRemoteUrl, GitStep, ILoggerContext, initGit, SyncParameterMissingError } from 'git-sync-js';
+import { Observable } from 'rxjs';
+import { expose } from 'threads/worker';
+import { defaultGitInfo } from './defaultGitInfo';
+import type { ICommitAndSyncConfigs, IGitLogMessage, IGitUserInfos } from './interface';
 
 function initWikiGit(wikiFolderPath: string, syncImmediately?: boolean, remoteUrl?: string, userInfo?: IGitUserInfos): Observable<IGitLogMessage> {
   return new Observable<IGitLogMessage>((observer) => {
@@ -25,10 +25,12 @@ function initWikiGit(wikiFolderPath: string, syncImmediately?: boolean, remoteUr
         userInfo,
         defaultGitInfo,
         logger: {
-          debug: (message: string, context: ILoggerContext): unknown =>
-            observer.next({ message, level: 'debug', meta: { callerFunction: 'initWikiGit', ...context } }),
-          warn: (message: string, context: ILoggerContext): unknown =>
-            observer.next({ message, level: 'warn', meta: { callerFunction: 'initWikiGit', ...context } }),
+          debug: (message: string, context: ILoggerContext): void => {
+            observer.next({ message, level: 'debug', meta: { callerFunction: 'initWikiGit', ...context } });
+          },
+          warn: (message: string, context: ILoggerContext): void => {
+            observer.next({ message, level: 'warn', meta: { callerFunction: 'initWikiGit', ...context } });
+          },
           info: (message: GitStep, context: ILoggerContext): void => {
             observer.next({ message, level: 'info', meta: { handler: WikiChannel.createProgress, callerFunction: 'initWikiGit', ...context } });
           },
@@ -41,10 +43,12 @@ function initWikiGit(wikiFolderPath: string, syncImmediately?: boolean, remoteUr
         userInfo,
         defaultGitInfo,
         logger: {
-          debug: (message: string, context: ILoggerContext): unknown =>
-            observer.next({ message, level: 'debug', meta: { callerFunction: 'initWikiGit', ...context } }),
-          warn: (message: string, context: ILoggerContext): unknown =>
-            observer.next({ message, level: 'warn', meta: { callerFunction: 'initWikiGit', ...context } }),
+          debug: (message: string, context: ILoggerContext): void => {
+            observer.next({ message, level: 'debug', meta: { callerFunction: 'initWikiGit', ...context } });
+          },
+          warn: (message: string, context: ILoggerContext): void => {
+            observer.next({ message, level: 'warn', meta: { callerFunction: 'initWikiGit', ...context } });
+          },
           info: (message: GitStep, context: ILoggerContext): void => {
             observer.next({ message, level: 'info', meta: { handler: WikiChannel.createProgress, callerFunction: 'initWikiGit', ...context } });
           },
@@ -52,14 +56,17 @@ function initWikiGit(wikiFolderPath: string, syncImmediately?: boolean, remoteUr
       });
     }
     void task.then(
-      () => observer.complete(),
-      (error) => observer.error(error),
+      () => {
+        observer.complete();
+      },
+      (error) => {
+        observer.error(error);
+      },
     );
   });
 }
 
 /**
- *
  * @param {string} wikiFolderPath
  * @param {string} remoteUrl
  * @param {{ login: string, email: string, accessToken: string }} userInfo
@@ -71,18 +78,24 @@ function commitAndSyncWiki(workspace: IWorkspace, configs: ICommitAndSyncConfigs
       ...configs,
       defaultGitInfo,
       logger: {
-        debug: (message: string, context: ILoggerContext): unknown =>
-          observer.next({ message, level: 'debug', meta: { callerFunction: 'commitAndSync', ...context } }),
-        warn: (message: string, context: ILoggerContext): unknown =>
-          observer.next({ message, level: 'warn', meta: { callerFunction: 'commitAndSync', ...context } }),
+        debug: (message: string, context: ILoggerContext): void => {
+          observer.next({ message, level: 'debug', meta: { callerFunction: 'commitAndSync', ...context } });
+        },
+        warn: (message: string, context: ILoggerContext): void => {
+          observer.next({ message, level: 'warn', meta: { callerFunction: 'commitAndSync', ...context } });
+        },
         info: (message: GitStep, context: ILoggerContext): void => {
           observer.next({ message, level: 'info', meta: { handler: WikiChannel.syncProgress, id: workspace.id, callerFunction: 'commitAndSync', ...context } });
         },
       },
       filesToIgnore: ['.DS_Store'],
     }).then(
-      () => observer.complete(),
-      (error) => observer.error(error),
+      () => {
+        observer.complete();
+      },
+      (error) => {
+        observer.error(error);
+      },
     );
   });
 }
@@ -95,15 +108,23 @@ function cloneWiki(repoFolderPath: string, remoteUrl: string, userInfo: IGitUser
       userInfo,
       defaultGitInfo,
       logger: {
-        debug: (message: string, context: ILoggerContext): unknown => observer.next({ message, level: 'debug', meta: { callerFunction: 'clone', ...context } }),
-        warn: (message: string, context: ILoggerContext): unknown => observer.next({ message, level: 'warn', meta: { callerFunction: 'clone', ...context } }),
+        debug: (message: string, context: ILoggerContext): void => {
+          observer.next({ message, level: 'debug', meta: { callerFunction: 'clone', ...context } });
+        },
+        warn: (message: string, context: ILoggerContext): void => {
+          observer.next({ message, level: 'warn', meta: { callerFunction: 'clone', ...context } });
+        },
         info: (message: GitStep, context: ILoggerContext): void => {
           observer.next({ message, level: 'info', meta: { handler: WikiChannel.createProgress, callerFunction: 'clone', ...context } });
         },
       },
     }).then(
-      () => observer.complete(),
-      (error) => observer.error(error),
+      () => {
+        observer.complete();
+      },
+      (error) => {
+        observer.error(error);
+      },
     );
   });
 }
diff --git a/src/services/git/index.ts b/src/services/git/index.ts
index 894d6ca1..b2d315b0 100644
--- a/src/services/git/index.ts
+++ b/src/services/git/index.ts
@@ -1,51 +1,60 @@
-import { ipcMain, dialog, net, shell } from 'electron';
-import { injectable, inject } from 'inversify';
-import { compact } from 'lodash';
+import { dialog, ipcMain, net, shell } from 'electron';
 import {
   AssumeSyncError,
   CantSyncGitNotInitializedError,
   CantSyncInSpecialGitStateAutoFixFailed,
+  getRemoteName,
+  getRemoteUrl,
   GitPullPushError,
   GitStep,
   ModifiedFileList,
   SyncParameterMissingError,
   SyncScriptIsInDeadLoopError,
-  getRemoteName,
-  getRemoteUrl,
 } from 'git-sync-js';
-import { spawn, Worker, ModuleThread } from 'threads';
+import { inject, injectable } from 'inversify';
+import { compact } from 'lodash';
+import { ModuleThread, spawn, Worker } from 'threads';
 
+import { WikiChannel } from '@/constants/channels';
+import type { IAuthenticationService, ServiceBranchTypes } from '@services/auth/interface';
+import { i18n } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
+import type { INativeService } from '@services/native/interface';
+import type { IPreferenceService } from '@services/preferences/interface';
 import serviceIdentifier from '@services/serviceIdentifier';
 import type { IViewService } from '@services/view/interface';
-import type { IPreferenceService } from '@services/preferences/interface';
-import type { IWindowService } from '@services/windows/interface';
-import type { INativeService } from '@services/native/interface';
-import type { IAuthenticationService, ServiceBranchTypes } from '@services/auth/interface';
 import type { IWikiService } from '@services/wiki/interface';
-import { logger } from '@services/libs/log';
-import { i18n } from '@services/libs/i18n';
-import { ICommitAndSyncConfigs, IGitLogMessage, IGitService, IGitUserInfos } from './interface';
-import { WikiChannel } from '@/constants/channels';
-import { GitWorker } from './gitWorker';
+import type { IWindowService } from '@services/windows/interface';
 import { Observer } from 'rxjs';
+import { GitWorker } from './gitWorker';
+import { ICommitAndSyncConfigs, IGitLogMessage, IGitService, IGitUserInfos } from './interface';
 
+import { LOCAL_GIT_DIRECTORY } from '@/constants/appPaths';
+import { githubDesktopUrl } from '@/constants/urls';
+import { lazyInject } from '@services/container';
+import { WindowNames } from '@services/windows/WindowProperties';
+import { IWorkspace } from '@services/workspaces/interface';
 // @ts-expect-error it don't want .ts
 // eslint-disable-next-line import/no-webpack-loader-syntax
 import workerURL from 'threads-plugin/dist/loader?name=gitWorker!./gitWorker.ts';
-import { LOCAL_GIT_DIRECTORY } from '@/constants/appPaths';
-import { WindowNames } from '@services/windows/WindowProperties';
-import { lazyInject } from '@services/container';
-import { githubDesktopUrl } from '@/constants/urls';
-import { IWorkspace } from '@services/workspaces/interface';
 import { stepWithChanges } from './stepWithChanges';
 
 @injectable()
 export class Git implements IGitService {
-  @lazyInject(serviceIdentifier.Authentication) private readonly authService!: IAuthenticationService;
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.View) private readonly viewService!: IViewService;
-  @lazyInject(serviceIdentifier.NativeService) private readonly nativeService!: INativeService;
+  @lazyInject(serviceIdentifier.Authentication)
+  private readonly authService!: IAuthenticationService;
+
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.View)
+  private readonly viewService!: IViewService;
+
+  @lazyInject(serviceIdentifier.NativeService)
+  private readonly nativeService!: INativeService;
 
   private gitWorker?: ModuleThread<GitWorker>;
 
@@ -73,7 +82,6 @@ export class Git implements IGitService {
   }
 
   /**
-   *
    * @param {string} githubRepoName similar to "linonetwo/wiki", string after "https://com/"
    */
   public async updateGitInfoTiddler(workspace: IWorkspace, githubRepoName: string): Promise<void> {
@@ -91,7 +99,9 @@ export class Git implements IGitService {
               browserView.webContents.send(WikiChannel.addTiddler, '$:/GitHub/Repo', githubRepoName, {
                 type: 'text/vnd.tiddlywiki',
               });
-              ipcMain.once(WikiChannel.addTiddlerDone, () => resolve());
+              ipcMain.once(WikiChannel.addTiddlerDone, () => {
+                resolve();
+              });
             });
           }
         }
@@ -236,7 +246,9 @@ export class Git implements IGitService {
       this.translateAndLogErrorMessage(error as Error);
       reject(error as Error);
     },
-    complete: () => resolve(),
+    complete: () => {
+      resolve();
+    },
   });
 
   private createFailedDialog(message: string, wikiFolderPath: string): void {
@@ -269,7 +281,7 @@ export class Git implements IGitService {
   public async initWikiGit(wikiFolderPath: string, isSyncedWiki?: boolean, isMainWiki?: boolean, remoteUrl?: string, userInfo?: IGitUserInfos): Promise<void> {
     // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
     const syncImmediately = !!isSyncedWiki && !!isMainWiki;
-    return await new Promise<void>((resolve, reject) => {
+    await new Promise<void>((resolve, reject) => {
       this.gitWorker
         ?.initWikiGit(wikiFolderPath, syncImmediately && net.isOnline(), remoteUrl, userInfo)
         .subscribe(this.getWorkerMessageObserver(resolve, reject));
@@ -292,7 +304,9 @@ export class Git implements IGitService {
               hasChanges = true;
             }
           },
-          complete: () => resolve(hasChanges),
+          complete: () => {
+            resolve(hasChanges);
+          },
         });
         return true;
       });
@@ -306,7 +320,7 @@ export class Git implements IGitService {
     if (!net.isOnline()) {
       return;
     }
-    return await new Promise<void>((resolve, reject) => {
+    await new Promise<void>((resolve, reject) => {
       this.gitWorker?.cloneWiki(repoFolderPath, remoteUrl, userInfo).subscribe(this.getWorkerMessageObserver(resolve, reject));
     });
   }
diff --git a/src/services/git/interface.ts b/src/services/git/interface.ts
index 14139980..4dba6997 100644
--- a/src/services/git/interface.ts
+++ b/src/services/git/interface.ts
@@ -1,7 +1,7 @@
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { GitChannel } from '@/constants/channels';
-import { ModifiedFileList } from 'git-sync-js';
 import type { IWorkspace } from '@services/workspaces/interface';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
+import { ModifiedFileList } from 'git-sync-js';
 
 export interface IGitUserInfos extends IGitUserInfosWithoutToken {
   /** Github Login: token */
diff --git a/src/services/libs/bindServiceAndProxy.ts b/src/services/libs/bindServiceAndProxy.ts
index ed5e505a..d322beab 100644
--- a/src/services/libs/bindServiceAndProxy.ts
+++ b/src/services/libs/bindServiceAndProxy.ts
@@ -3,8 +3,8 @@
  */
 import { registerProxy } from 'electron-ipc-cat/server';
 
-import serviceIdentifier from '@services/serviceIdentifier';
 import { container } from '@services/container';
+import serviceIdentifier from '@services/serviceIdentifier';
 
 import { Authentication } from '@services/auth';
 import { ContextService } from '@services/context';
@@ -45,10 +45,10 @@ import type { IUpdaterService } from '@services/updater/interface';
 import { UpdaterServiceIPCDescriptor } from '@services/updater/interface';
 import type { IViewService } from '@services/view/interface';
 import { ViewServiceIPCDescriptor } from '@services/view/interface';
-import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
-import { WikiGitWorkspaceServiceIPCDescriptor } from '@services/wikiGitWorkspace/interface';
 import type { IWikiService } from '@services/wiki/interface';
 import { WikiServiceIPCDescriptor } from '@services/wiki/interface';
+import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
+import { WikiGitWorkspaceServiceIPCDescriptor } from '@services/wikiGitWorkspace/interface';
 import type { IWindowService } from '@services/windows/interface';
 import { WindowServiceIPCDescriptor } from '@services/windows/interface';
 import type { IWorkspaceService } from '@services/workspaces/interface';
diff --git a/src/services/libs/formatDate.ts b/src/services/libs/formatDate.ts
index 35f323eb..be2e3bf7 100644
--- a/src/services/libs/formatDate.ts
+++ b/src/services/libs/formatDate.ts
@@ -1,4 +1,4 @@
-import { format, isTomorrow, isToday } from 'date-fns';
+import { format, isToday, isTomorrow } from 'date-fns';
 
 export const formatDate = (date: Date): string => {
   if (isToday(date)) {
diff --git a/src/services/libs/getFromRenderer.ts b/src/services/libs/getFromRenderer.ts
index 765087da..87160c78 100644
--- a/src/services/libs/getFromRenderer.ts
+++ b/src/services/libs/getFromRenderer.ts
@@ -1,5 +1,5 @@
-import { ipcMain, BrowserView, BrowserWindow } from 'electron';
 import { Channels } from '@/constants/channels';
+import { BrowserView, BrowserWindow, ipcMain } from 'electron';
 
 /**
  * Get data from a BrowserView
@@ -11,6 +11,8 @@ export default async function getFromRenderer<T>(channel: Channels, viewToGetDat
   const ipcToken = String(Math.random());
   viewToGetData.webContents.send(channel, { ipcToken });
   return await new Promise((resolve) => {
-    ipcMain.once(`${channel}-${ipcToken}`, (_event, data: T) => resolve(data));
+    ipcMain.once(`${channel}-${ipcToken}`, (_event, data: T) => {
+      resolve(data);
+    });
   });
 }
diff --git a/src/services/libs/getViewBounds.ts b/src/services/libs/getViewBounds.ts
index b2faded0..8552e736 100644
--- a/src/services/libs/getViewBounds.ts
+++ b/src/services/libs/getViewBounds.ts
@@ -21,15 +21,15 @@ export default async function getViewBounds(
     return {
       x,
       y: y + FIND_IN_PAGE_HEIGHT,
-      height: height !== undefined ? height : contentSize[1] - FIND_IN_PAGE_HEIGHT,
-      width: width !== undefined ? width : contentSize[0] - x,
+      height: height === undefined ? contentSize[1] - FIND_IN_PAGE_HEIGHT : height,
+      width: width === undefined ? contentSize[0] - x : width,
     };
   }
 
   return {
     x,
     y,
-    height: height !== undefined ? height : contentSize[1],
-    width: width !== undefined ? width : contentSize[0] - x,
+    height: height === undefined ? contentSize[1] : height,
+    width: width === undefined ? contentSize[0] - x : width,
   };
 }
diff --git a/src/services/libs/i18n/index.ts b/src/services/libs/i18n/index.ts
index 55d13f3e..a72edb86 100644
--- a/src/services/libs/i18n/index.ts
+++ b/src/services/libs/i18n/index.ts
@@ -1,17 +1,17 @@
-import path from 'path';
+import { isElectronDevelopment } from '@/constants/isElectronDevelopment';
 import i18next, { TFuncKey, TOptions } from 'i18next';
 import Backend from 'i18next-fs-backend';
-import { isElectronDevelopment } from '@/constants/isElectronDevelopment';
+import path from 'path';
 
 import { LOCALIZATION_FOLDER } from '@/constants/paths';
+import { clearMainBindings, mainBindings } from './i18nMainBindings';
 import changeToDefaultLanguage from './useDefaultLanguage';
-import { mainBindings, clearMainBindings } from './i18nMainBindings';
 
 // Workaround for https://github.com/isaachinman/next-i18next/issues/1781
 declare module 'i18next' {
   interface TFunction {
     // eslint-disable-next-line @typescript-eslint/prefer-function-type
-    <TKeys extends TFuncKey = string, TInterpolationMap extends object = { [key: string]: any }>(
+    <TKeys extends TFuncKey = string, TInterpolationMap extends object = Record<string, any>>(
       key: TKeys,
       options?: TOptions<TInterpolationMap> | string,
     ): string;
diff --git a/src/services/libs/i18n/preloadBindings.ts b/src/services/libs/i18n/preloadBindings.ts
index 2f6fc679..8ee91ed0 100644
--- a/src/services/libs/i18n/preloadBindings.ts
+++ b/src/services/libs/i18n/preloadBindings.ts
@@ -1,12 +1,12 @@
 /* eslint-disable unicorn/prevent-abbreviations */
-import { IpcRenderer, IpcRendererEvent } from 'electron';
 import { I18NChannels } from '@/constants/channels';
+import { IpcRenderer, IpcRendererEvent } from 'electron';
 import { IReadWriteFileRequest } from './types';
 
 /** This is the code that will go into the preload.js file
  *  in order to set up the contextBridge api
  */
-export const preloadBindings = function (ipcRenderer: IpcRenderer): {
+export const preloadBindings = function(ipcRenderer: IpcRenderer): {
   onLanguageChange: (callback: (language: { lng: string }) => unknown) => void;
   onReceive: (channel: I18NChannels, callback: (readWriteFileArgs: IReadWriteFileRequest) => void) => void;
   send: (channel: I18NChannels, readWriteFileArgs: IReadWriteFileRequest) => Promise<void>;
@@ -22,7 +22,9 @@ export const preloadBindings = function (ipcRenderer: IpcRenderer): {
       const validChannels = [I18NChannels.readFileResponse, I18NChannels.writeFileResponse];
       if (validChannels.includes(channel)) {
         // Deliberately strip event as it includes "sender"
-        ipcRenderer.on(channel, (_event: IpcRendererEvent, arguments_: IReadWriteFileRequest) => callback(arguments_));
+        ipcRenderer.on(channel, (_event: IpcRendererEvent, arguments_: IReadWriteFileRequest) => {
+          callback(arguments_);
+        });
       }
     },
     onLanguageChange: (callback: (language: { lng: string }) => unknown) => {
diff --git a/src/services/libs/i18n/requestChangeLanguage.ts b/src/services/libs/i18n/requestChangeLanguage.ts
index e0e246c2..1743c2e9 100644
--- a/src/services/libs/i18n/requestChangeLanguage.ts
+++ b/src/services/libs/i18n/requestChangeLanguage.ts
@@ -1,11 +1,11 @@
-import type { IWindowService } from '@services/windows/interface';
-import type { IViewService } from '@services/view/interface';
-import type { IMenuService } from '@services/menu/interface';
-import type { IWikiService } from '@services/wiki/interface';
 import { I18NChannels } from '@/constants/channels';
+import { supportedLanguagesMap, tiddlywikiLanguagesMap } from '@/constants/languages';
 import { container } from '@services/container';
+import type { IMenuService } from '@services/menu/interface';
 import serviceIdentifier from '@services/serviceIdentifier';
-import { tiddlywikiLanguagesMap, supportedLanguagesMap } from '@/constants/languages';
+import type { IViewService } from '@services/view/interface';
+import type { IWikiService } from '@services/wiki/interface';
+import type { IWindowService } from '@services/windows/interface';
 import { logger } from '../log';
 import { i18n } from '.';
 
@@ -31,7 +31,14 @@ export async function requestChangeLanguage(newLanguage: string): Promise<void>
     // change tiddlywiki language
     new Promise<unknown>((resolve, reject) => {
       const tiddlywikiLanguageName = tiddlywikiLanguagesMap[newLanguage];
-      if (tiddlywikiLanguageName !== undefined) {
+      if (tiddlywikiLanguageName === undefined) {
+        const errorMessage = `When click language menu "${newLanguage}", there is no corresponding tiddlywiki language registered`;
+        logger.error(errorMessage, {
+          supportedLanguagesMap,
+          tiddlywikiLanguagesMap,
+        });
+        reject(new Error(errorMessage));
+      } else {
         if (viewCount === 0) {
           return;
         }
@@ -40,13 +47,6 @@ export async function requestChangeLanguage(newLanguage: string): Promise<void>
           tasks.push(wikiService.setWikiLanguage(view, workspaceID, tiddlywikiLanguageName));
         });
         void Promise.all(tasks).then(resolve, reject);
-      } else {
-        const errorMessage = `When click language menu "${newLanguage}", there is no corresponding tiddlywiki language registered`;
-        logger.error(errorMessage, {
-          supportedLanguagesMap,
-          tiddlywikiLanguagesMap,
-        });
-        reject(new Error(errorMessage));
       }
     }),
     // update menu
diff --git a/src/services/libs/log/index.ts b/src/services/libs/log/index.ts
index b6e1fa18..1e675c4d 100644
--- a/src/services/libs/log/index.ts
+++ b/src/services/libs/log/index.ts
@@ -1,5 +1,5 @@
-import winston, { format } from 'winston';
 import { LOG_FOLDER } from '@/constants/appPaths';
+import winston, { format } from 'winston';
 import RendererTransport from './rendererTransport';
 import 'winston-daily-rotate-file';
 
@@ -20,39 +20,39 @@ export type ILogLevels = keyof typeof levels;
 const logger = (
   process.env.NODE_ENV === 'test'
     ? Object.assign(console, {
-        emerg: console.error.bind(console),
-        alert: console.error.bind(console),
-        crit: console.error.bind(console),
-        warning: console.warn.bind(console),
-        notice: console.log.bind(console),
-        debug: console.log.bind(console),
-      })
+      emerg: console.error.bind(console),
+      alert: console.error.bind(console),
+      crit: console.error.bind(console),
+      warning: console.warn.bind(console),
+      notice: console.log.bind(console),
+      debug: console.log.bind(console),
+    })
     : winston.createLogger({
-        levels,
-        transports: [
-          new winston.transports.Console(),
-          new winston.transports.DailyRotateFile({
-            filename: 'TidGi-%DATE%.log',
-            datePattern: 'YYYY-MM-DD',
-            zippedArchive: false,
-            maxSize: '20mb',
-            maxFiles: '14d',
-            dirname: LOG_FOLDER,
-            level: 'debug',
-          }),
-          new RendererTransport(),
-        ],
-        exceptionHandlers: [
-          new winston.transports.DailyRotateFile({
-            filename: 'TidGi-Exception-%DATE%.log',
-            datePattern: 'YYYY-MM-DD',
-            zippedArchive: false,
-            maxSize: '20mb',
-            maxFiles: '14d',
-            dirname: LOG_FOLDER,
-          }),
-        ],
-        format: format.combine(format.timestamp(), format.json()),
-      })
+      levels,
+      transports: [
+        new winston.transports.Console(),
+        new winston.transports.DailyRotateFile({
+          filename: 'TidGi-%DATE%.log',
+          datePattern: 'YYYY-MM-DD',
+          zippedArchive: false,
+          maxSize: '20mb',
+          maxFiles: '14d',
+          dirname: LOG_FOLDER,
+          level: 'debug',
+        }),
+        new RendererTransport(),
+      ],
+      exceptionHandlers: [
+        new winston.transports.DailyRotateFile({
+          filename: 'TidGi-Exception-%DATE%.log',
+          datePattern: 'YYYY-MM-DD',
+          zippedArchive: false,
+          maxSize: '20mb',
+          maxFiles: '14d',
+          dirname: LOG_FOLDER,
+        }),
+      ],
+      format: format.combine(format.timestamp(), format.json()),
+    })
 ) as winston.Logger;
 export { logger };
diff --git a/src/services/libs/log/rendererTransport.ts b/src/services/libs/log/rendererTransport.ts
index d29138ae..abb90483 100644
--- a/src/services/libs/log/rendererTransport.ts
+++ b/src/services/libs/log/rendererTransport.ts
@@ -1,8 +1,8 @@
 /* eslint-disable global-require */
 import Transport from 'winston-transport';
 
-import { wikiOperations } from '@services/wiki/wikiOperations';
 import { WikiChannel } from '@/constants/channels';
+import { wikiOperations } from '@services/wiki/wikiOperations';
 
 export interface IInfo {
   /** which method or handler function we are logging for */
diff --git a/src/services/libs/log/wikiOutput.ts b/src/services/libs/log/wikiOutput.ts
index 12bc718e..a24bd7c2 100644
--- a/src/services/libs/log/wikiOutput.ts
+++ b/src/services/libs/log/wikiOutput.ts
@@ -1,10 +1,10 @@
-import path from 'path';
 import fs from 'fs-extra';
+import path from 'path';
 
 import { LOG_FOLDER } from '@/constants/appPaths';
 
 export function getWikiLogFilePath(wikiName: string): string {
-  const logFileName = wikiName.replace(/["*/:<>?\\|]/g, '_');
+  const logFileName = wikiName.replaceAll(/["*/:<>?\\|]/g, '_');
   const logFilePath = path.join(LOG_FOLDER, `${logFileName}.log`);
   return logFilePath;
 }
diff --git a/src/services/libs/url.ts b/src/services/libs/url.ts
index eb0b2989..fe23e9e0 100644
--- a/src/services/libs/url.ts
+++ b/src/services/libs/url.ts
@@ -1,7 +1,6 @@
 import { defaultServerIP } from '@/constants/urls';
 import { internalIpV4 } from '@/helpers/ip';
 import { logger } from './log';
-import type { IWorkspace } from '@services/workspaces/interface';
 
 /**
  * get wiki address with local machine ip, so QR code will be correct, instead of get `0.0.0.0`
@@ -23,9 +22,7 @@ export function replaceUrlPortWithSettingPort(originalUrl: string, newPort: numb
     return parsedUrl.toString();
   } catch (error) {
     logger.error(
-      `Failed to replaceUrlPortWithSettingPort for originalUrl ${originalUrl} to newPort ${newPort} , fallback to originalUrl. Error: ${
-        (error as Error).message
-      }`,
+      `Failed to replaceUrlPortWithSettingPort for originalUrl ${originalUrl} to newPort ${newPort} , fallback to originalUrl. Error: ${(error as Error).message}`,
     );
     return originalUrl;
   }
diff --git a/src/services/menu/buildLanguageMenu.ts b/src/services/menu/buildLanguageMenu.ts
index 0b8e90e4..1cd2852b 100644
--- a/src/services/menu/buildLanguageMenu.ts
+++ b/src/services/menu/buildLanguageMenu.ts
@@ -1,9 +1,9 @@
-import serviceIdentifier from '@services/serviceIdentifier';
 import { container } from '@services/container';
+import serviceIdentifier from '@services/serviceIdentifier';
 
-import type { IPreferenceService } from '@services/preferences/interface';
-import type { IMenuService, DeferredMenuItemConstructorOptions } from '@services/menu/interface';
 import { supportedLanguagesKNames, supportedLanguagesMap } from '@/constants/languages';
+import type { DeferredMenuItemConstructorOptions, IMenuService } from '@services/menu/interface';
+import type { IPreferenceService } from '@services/preferences/interface';
 
 /**
  * Register languages into language menu, call this function after container init
diff --git a/src/services/menu/contextMenu/contextMenuBuilder.ts b/src/services/menu/contextMenu/contextMenuBuilder.ts
index 66c214fc..b1de5e8a 100644
--- a/src/services/menu/contextMenu/contextMenuBuilder.ts
+++ b/src/services/menu/contextMenu/contextMenuBuilder.ts
@@ -5,7 +5,7 @@
 /* eslint-disable class-methods-use-this */
 /* eslint-disable no-param-reassign */
 import { isMac } from '@/helpers/system';
-import { clipboard, shell, Menu, MenuItem, WebContents } from 'electron';
+import { clipboard, Menu, MenuItem, shell, WebContents } from 'electron';
 import i18next from 'i18next';
 import { IOnContextMenuInfo } from '../interface';
 
@@ -217,7 +217,9 @@ export default class ContextMenuBuilder {
       corrections.forEach((correction: string) => {
         const item = new MenuItem({
           label: correction,
-          click: () => this.webContents.replaceMisspelling(correction),
+          click: () => {
+            this.webContents.replaceMisspelling(correction);
+          },
         });
         menu.append(item);
       });
@@ -240,7 +242,9 @@ export default class ContextMenuBuilder {
     if (isMac) {
       const lookUpDefinition = new MenuItem({
         label: this.stringTable.lookUpDefinition({ word: truncateString(menuInfo.selectionText) }),
-        click: () => this.webContents.showDefinitionForSelection(),
+        click: () => {
+          this.webContents.showDefinitionForSelection();
+        },
       });
       menu.append(lookUpDefinition);
     }
@@ -267,7 +271,9 @@ export default class ContextMenuBuilder {
     if (menuInfo.srcURL === undefined) return menu;
     const copyImageUrl = new MenuItem({
       label: this.stringTable.copyImageUrl(),
-      click: () => clipboard.writeText(menuInfo.srcURL!),
+      click: () => {
+        clipboard.writeText(menuInfo.srcURL!);
+      },
     });
     menu.append(copyImageUrl);
     return menu;
@@ -282,7 +288,9 @@ export default class ContextMenuBuilder {
         label: this.stringTable.cut(),
         accelerator: 'CommandOrControl+X',
         enabled: menuInfo?.editFlags?.canCut,
-        click: () => this.webContents.cut(),
+        click: () => {
+          this.webContents.cut();
+        },
       }),
     );
     return menu;
@@ -297,7 +305,9 @@ export default class ContextMenuBuilder {
         label: this.stringTable.copy(),
         accelerator: 'CommandOrControl+C',
         enabled: menuInfo?.editFlags?.canCopy,
-        click: () => this.webContents.copy(),
+        click: () => {
+          this.webContents.copy();
+        },
       }),
     );
     return menu;
@@ -312,7 +322,9 @@ export default class ContextMenuBuilder {
         label: this.stringTable.paste(),
         accelerator: 'CommandOrControl+V',
         enabled: menuInfo?.editFlags?.canPaste,
-        click: () => this.webContents.paste(),
+        click: () => {
+          this.webContents.paste();
+        },
       }),
     );
     return menu;
@@ -335,7 +347,9 @@ export default class ContextMenuBuilder {
     }
     const inspect = new MenuItem({
       label: this.stringTable.inspectElement(),
-      click: () => this.webContents.inspectElement(menuInfo.x, menuInfo.y),
+      click: () => {
+        this.webContents.inspectElement(menuInfo.x, menuInfo.y);
+      },
     });
     menu.append(inspect);
     return menu;
@@ -350,7 +364,9 @@ export default class ContextMenuBuilder {
     }
     const inspect = new MenuItem({
       label: this.stringTable.developerTools(),
-      click: () => this.webContents.openDevTools(),
+      click: () => {
+        this.webContents.openDevTools();
+      },
     });
     menu.append(inspect);
     return menu;
diff --git a/src/services/menu/index.ts b/src/services/menu/index.ts
index 5e642ebb..51a84df6 100644
--- a/src/services/menu/index.ts
+++ b/src/services/menu/index.ts
@@ -1,46 +1,69 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
 /* eslint-disable @typescript-eslint/require-await */
-import { Menu, MenuItemConstructorOptions, shell, ContextMenuParams, WebContents, MenuItem, app } from 'electron';
-import { debounce, take, drop, reverse, remove, compact } from 'lodash';
-import { injectable } from 'inversify';
-import type { IMenuService, IOnContextMenuInfo } from './interface';
-import { DeferredMenuItemConstructorOptions } from './interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import { lazyInject } from '@services/container';
-import serviceIdentifier from '@services/serviceIdentifier';
 import type { IAuthenticationService } from '@services/auth/interface';
+import { lazyInject } from '@services/container';
 import type { IContextService } from '@services/context/interface';
 import type { IGitService } from '@services/git/interface';
+import { i18n } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
 import type { INativeService } from '@services/native/interface';
 import type { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import type { IUpdaterService } from '@services/updater/interface';
 import type { IViewService } from '@services/view/interface';
-import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
 import type { IWikiService } from '@services/wiki/interface';
+import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
 import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
+import { getWorkspaceMenuTemplate, openWorkspaceTagTiddler } from '@services/workspaces/getWorkspaceMenuTemplate';
 import type { IWorkspaceService } from '@services/workspaces/interface';
 import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import type { IUpdaterService } from '@services/updater/interface';
-import { getWorkspaceMenuTemplate, openWorkspaceTagTiddler } from '@services/workspaces/getWorkspaceMenuTemplate';
-import { logger } from '@services/libs/log';
-import { i18n } from '@services/libs/i18n';
+import { app, ContextMenuParams, Menu, MenuItem, MenuItemConstructorOptions, shell, WebContents } from 'electron';
+import { injectable } from 'inversify';
+import { compact, debounce, drop, remove, reverse, take } from 'lodash';
 import ContextMenuBuilder from './contextMenu/contextMenuBuilder';
 import { IpcSafeMenuItem, mainMenuItemProxy } from './contextMenu/rendererMenuItemProxy';
 import { InsertMenuAfterSubMenuIndexError } from './error';
+import type { IMenuService, IOnContextMenuInfo } from './interface';
+import { DeferredMenuItemConstructorOptions } from './interface';
 
 @injectable()
 export class MenuService implements IMenuService {
-  @lazyInject(serviceIdentifier.Authentication) private readonly authService!: IAuthenticationService;
-  @lazyInject(serviceIdentifier.Context) private readonly contextService!: IContextService;
-  @lazyInject(serviceIdentifier.Git) private readonly gitService!: IGitService;
-  @lazyInject(serviceIdentifier.NativeService) private readonly nativeService!: INativeService;
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
-  @lazyInject(serviceIdentifier.Updater) private readonly updaterService!: IUpdaterService;
-  @lazyInject(serviceIdentifier.View) private readonly viewService!: IViewService;
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.WikiGitWorkspace) private readonly wikiGitWorkspaceService!: IWikiGitWorkspaceService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
+  @lazyInject(serviceIdentifier.Authentication)
+  private readonly authService!: IAuthenticationService;
+
+  @lazyInject(serviceIdentifier.Context)
+  private readonly contextService!: IContextService;
+
+  @lazyInject(serviceIdentifier.Git)
+  private readonly gitService!: IGitService;
+
+  @lazyInject(serviceIdentifier.NativeService)
+  private readonly nativeService!: INativeService;
+
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
+  @lazyInject(serviceIdentifier.Updater)
+  private readonly updaterService!: IUpdaterService;
+
+  @lazyInject(serviceIdentifier.View)
+  private readonly viewService!: IViewService;
+
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.WikiGitWorkspace)
+  private readonly wikiGitWorkspaceService!: IWikiGitWorkspaceService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
 
   private _menuTemplate?: DeferredMenuItemConstructorOptions[];
   private get menuTemplate(): DeferredMenuItemConstructorOptions[] {
@@ -125,23 +148,31 @@ export class MenuService implements IMenuService {
         submenu: [
           {
             label: () => i18n.t('ContextMenu.About'),
-            click: async () => await this.windowService.open(WindowNames.about),
+            click: async () => {
+              await this.windowService.open(WindowNames.about);
+            },
           },
           { type: 'separator' },
           {
             id: 'update',
             label: () => i18n.t('Updater.CheckUpdate'),
-            click: async () => await this.updaterService.checkForUpdates(),
+            click: async () => {
+              await this.updaterService.checkForUpdates();
+            },
           },
           {
             label: () => i18n.t('ContextMenu.Preferences'),
             accelerator: 'CmdOrCtrl+,',
-            click: async () => await this.windowService.open(WindowNames.preferences),
+            click: async () => {
+              await this.windowService.open(WindowNames.preferences);
+            },
           },
           { type: 'separator' },
           {
             label: () => i18n.t('Preference.Notifications'),
-            click: async () => await this.windowService.open(WindowNames.notifications),
+            click: async () => {
+              await this.windowService.open(WindowNames.notifications);
+            },
             accelerator: 'CmdOrCtrl+Shift+N',
           },
           { type: 'separator' },
@@ -192,19 +223,27 @@ export class MenuService implements IMenuService {
         submenu: [
           {
             label: () => i18n.t('ContextMenu.TidGiSupport'),
-            click: async () => await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/issues'),
+            click: async () => {
+              await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/issues');
+            },
           },
           {
             label: () => i18n.t('Menu.ReportBugViaGithub'),
-            click: async () => await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/issues'),
+            click: async () => {
+              await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/issues');
+            },
           },
           {
             label: () => i18n.t('Menu.RequestFeatureViaGithub'),
-            click: async () => await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/issues/new?template=feature.md&title=feature%3A+'),
+            click: async () => {
+              await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/issues/new?template=feature.md&title=feature%3A+');
+            },
           },
           {
             label: () => i18n.t('Menu.LearnMore'),
-            click: async () => await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/'),
+            click: async () => {
+              await shell.openExternal('https://github.com/tiddly-gittly/TidGi-desktop/');
+            },
           },
         ],
       },
@@ -218,8 +257,9 @@ export class MenuService implements IMenuService {
 
   /** Register `on('context-menu', openContextMenuForWindow)` for a window, return an unregister function */
   public async initContextMenuForWindowWebContents(webContents: WebContents): Promise<() => void> {
-    const openContextMenuForWindow = async (event: Electron.Event, parameters: ContextMenuParams): Promise<void> =>
+    const openContextMenuForWindow = async (event: Electron.Event, parameters: ContextMenuParams): Promise<void> => {
       await this.buildContextMenuAndPopup([], parameters, webContents);
+    };
     webContents.on('context-menu', openContextMenuForWindow);
 
     return () => {
@@ -433,7 +473,9 @@ export class MenuService implements IMenuService {
             )),
             {
               label: i18n.t('WorkspaceSelector.Add'),
-              click: async () => await this.windowService.open(WindowNames.addWorkspace),
+              click: async () => {
+                await this.windowService.open(WindowNames.addWorkspace);
+              },
             },
           ],
         }),
@@ -487,25 +529,35 @@ export class MenuService implements IMenuService {
         submenu: [
           {
             label: i18n.t('ContextMenu.Preferences'),
-            click: async () => await this.windowService.open(WindowNames.preferences),
+            click: async () => {
+              await this.windowService.open(WindowNames.preferences);
+            },
           },
           { type: 'separator' },
           {
             label: i18n.t('ContextMenu.About'),
-            click: async () => await this.windowService.open(WindowNames.about),
+            click: async () => {
+              await this.windowService.open(WindowNames.about);
+            },
           },
           {
             label: i18n.t('ContextMenu.TidGiSupport'),
-            click: async () => await shell.openExternal('https://github.com/tiddly-gittly/TidGi-Desktop/issues/new/choose'),
+            click: async () => {
+              await shell.openExternal('https://github.com/tiddly-gittly/TidGi-Desktop/issues/new/choose');
+            },
           },
           {
             label: i18n.t('ContextMenu.TidGiWebsite'),
-            click: async () => await shell.openExternal('https://github.com/tiddly-gittly/TidGi-Desktop'),
+            click: async () => {
+              await shell.openExternal('https://github.com/tiddly-gittly/TidGi-Desktop');
+            },
           },
           { type: 'separator' },
           {
             label: i18n.t('ContextMenu.Quit'),
-            click: () => app.quit(),
+            click: () => {
+              app.quit();
+            },
           },
         ],
       }),
@@ -521,7 +573,9 @@ export class MenuService implements IMenuService {
       // we are going to prepend items, so inverse first, so order will remain
       reverse(menuItems)
         .map((menuItem) => new MenuItem(menuItem))
-        .forEach((menuItem) => menu.insert(0, menuItem));
+        .forEach((menuItem) => {
+          menu.insert(0, menuItem);
+        });
     }
 
     menu.popup();
diff --git a/src/services/menu/interface.ts b/src/services/menu/interface.ts
index 98dc752d..f788d64a 100644
--- a/src/services/menu/interface.ts
+++ b/src/services/menu/interface.ts
@@ -1,8 +1,8 @@
 import { MenuItemConstructorOptions, WebContents } from 'electron';
 
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { MenuChannel } from '@/constants/channels';
 import { WindowNames } from '@services/windows/WindowProperties';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import type { IpcSafeMenuItem } from './contextMenu/rendererMenuItemProxy';
 
 /**
diff --git a/src/services/native/externalApp/app-path/index.ts b/src/services/native/externalApp/app-path/index.ts
index 07570e35..d80a3af3 100644
--- a/src/services/native/externalApp/app-path/index.ts
+++ b/src/services/native/externalApp/app-path/index.ts
@@ -1,7 +1,7 @@
-import { promisify } from 'util';
+import { isDevelopmentOrTest } from '@/constants/environment';
 import { execFile } from 'child_process';
 import path from 'path';
-import { isDevelopmentOrTest } from '@/constants/environment';
+import { promisify } from 'util';
 
 const repoFolder = path.join(__dirname, '..', '..', '..', '..', '..');
 
diff --git a/src/services/native/externalApp/darwin.ts b/src/services/native/externalApp/darwin.ts
index e4b5f1e6..6958116b 100644
--- a/src/services/native/externalApp/darwin.ts
+++ b/src/services/native/externalApp/darwin.ts
@@ -1,15 +1,15 @@
 /* eslint-disable unicorn/no-null */
-import { pathExists } from 'fs-extra';
-import { IFoundEditor } from './found-editor';
-import appPath from './app-path';
 import { logger } from '@services/libs/log';
+import { pathExists } from 'fs-extra';
+import appPath from './app-path';
+import { IFoundEditor } from './found-editor';
 
 /** Represents an external editor on macOS */
 interface IDarwinExternalEditor {
   /**
    * List of bundle identifiers that are used by the app in its multiple
    * versions.
-   **/
+   */
   readonly bundleIdentifiers: string[];
 
   /** Name of the editor. It will be used both as identifier and user-facing. */
@@ -19,7 +19,7 @@ interface IDarwinExternalEditor {
 /**
  * This list contains all the external editors supported on macOS. Add a new
  * entry here to add support for your favorite editor.
- **/
+ */
 const editors: IDarwinExternalEditor[] = [
   {
     name: 'Atom',
@@ -122,7 +122,7 @@ const editors: IDarwinExternalEditor[] = [
 /**
  * This list contains all the external git GUI app supported on macOS. Add a new
  * entry here to add support for your favorite git GUI app.
- **/
+ */
 const gitGUIApp: IDarwinExternalEditor[] = [
   {
     name: 'GitHub Desktop',
diff --git a/src/services/native/externalApp/index.ts b/src/services/native/externalApp/index.ts
index ee970330..52db34a3 100644
--- a/src/services/native/externalApp/index.ts
+++ b/src/services/native/externalApp/index.ts
@@ -1,2 +1,2 @@
-export * from './lookup';
 export * from './launch';
+export * from './lookup';
diff --git a/src/services/native/externalApp/linux.ts b/src/services/native/externalApp/linux.ts
index c8f64461..688f5ab5 100644
--- a/src/services/native/externalApp/linux.ts
+++ b/src/services/native/externalApp/linux.ts
@@ -14,7 +14,7 @@ interface ILinuxExternalEditor {
 /**
  * This list contains all the external editors supported on Linux. Add a new
  * entry here to add support for your favorite editor.
- **/
+ */
 const editors: ILinuxExternalEditor[] = [
   {
     name: 'Atom',
@@ -59,7 +59,7 @@ const editors: ILinuxExternalEditor[] = [
 /**
  * This list contains all the external git GUI app supported on Linux. Add a new
  * entry here to add support for your favorite git GUI app.
- **/
+ */
 const gitGUIApp: ILinuxExternalEditor[] = [
   {
     name: 'GitHub Desktop',
diff --git a/src/services/native/externalApp/lookup.ts b/src/services/native/externalApp/lookup.ts
index 23105aa7..6afebf53 100644
--- a/src/services/native/externalApp/lookup.ts
+++ b/src/services/native/externalApp/lookup.ts
@@ -1,10 +1,10 @@
-import { ExternalEditorError } from './shared';
-import { IFoundEditor } from './found-editor';
-import { getAvailableEditors as getAvailableEditorsDarwin, getAvailableGitGUIApps as getAvailableGitGUIAppsDarwin } from './darwin';
-import { getAvailableEditors as getAvailableEditorsWindows, getAvailableGitGUIApps as getAvailableGitGUIAppsWindows } from './win32';
-import { getAvailableEditors as getAvailableEditorsLinux, getAvailableGitGUIApps as getAvailableGitGUIAppsLinux } from './linux';
-import { logger } from '@services/libs/log';
 import { isLinux, isMac, isWin } from '@/helpers/system';
+import { logger } from '@services/libs/log';
+import { getAvailableEditors as getAvailableEditorsDarwin, getAvailableGitGUIApps as getAvailableGitGUIAppsDarwin } from './darwin';
+import { IFoundEditor } from './found-editor';
+import { getAvailableEditors as getAvailableEditorsLinux, getAvailableGitGUIApps as getAvailableGitGUIAppsLinux } from './linux';
+import { ExternalEditorError } from './shared';
+import { getAvailableEditors as getAvailableEditorsWindows, getAvailableGitGUIApps as getAvailableGitGUIAppsWindows } from './win32';
 
 let editorCache: ReadonlyArray<IFoundEditor<string>> | undefined;
 let gitGUIAppCache: ReadonlyArray<IFoundEditor<string>> | undefined;
diff --git a/src/services/native/externalApp/win32.ts b/src/services/native/externalApp/win32.ts
index 1d64884f..7ad9cec8 100644
--- a/src/services/native/externalApp/win32.ts
+++ b/src/services/native/externalApp/win32.ts
@@ -2,9 +2,9 @@ import * as Path from 'path';
 
 import { enumerateValues, HKEY, RegistryValue, RegistryValueType } from 'registry-js';
 
+import { logger } from '@services/libs/log';
 import { pathExists } from 'fs-extra';
 import { IFoundEditor } from './found-editor';
-import { logger } from '@services/libs/log';
 
 interface IWindowsAppInformation {
   displayName: string;
@@ -19,25 +19,25 @@ interface RegistryKey {
 
 type WindowsExternalEditorPathInfo =
   | {
-      /**
-       * List of lists of path components from the editor's installation folder to
-       * the potential executable shims. Only needed when the install location
-       * registry key is `InstallLocation`.
-       **/
-      readonly executableShimPaths: ReadonlyArray<readonly string[]>;
+    /**
+     * List of lists of path components from the editor's installation folder to
+     * the potential executable shims. Only needed when the install location
+     * registry key is `InstallLocation`.
+     */
+    readonly executableShimPaths: ReadonlyArray<readonly string[]>;
 
-      /**
-       * Registry key with the install location of the app. If not provided,
-       * 'InstallLocation' will be used.
-       **/
-      readonly installLocationRegistryKey?: 'InstallLocation';
-    }
+    /**
+     * Registry key with the install location of the app. If not provided,
+     * 'InstallLocation' will be used.
+     */
+    readonly installLocationRegistryKey?: 'InstallLocation';
+  }
   | {
-      /**
-       * Registry key with the install location of the app.
-       **/
-      readonly installLocationRegistryKey: 'DisplayIcon';
-    };
+    /**
+     * Registry key with the install location of the app.
+     */
+    readonly installLocationRegistryKey: 'DisplayIcon';
+  };
 
 /** Represents an external editor on Windows */
 type WindowsExternalEditor = {
@@ -113,7 +113,7 @@ const executableShimPathsForJetBrainsIDE = (baseName: string): ReadonlyArray<rea
 /**
  * This list contains all the external editors supported on Windows. Add a new
  * entry here to add support for your favorite editor.
- **/
+ */
 const editors: WindowsExternalEditor[] = [
   {
     name: 'Atom',
@@ -321,7 +321,7 @@ const editors: WindowsExternalEditor[] = [
 /**
  * This list contains all the external git GUI app supported on Windows. Add a new
  * entry here to add support for your favorite git GUI app.
- **/
+ */
 const gitGUIApp: WindowsExternalEditor[] = [
   {
     name: 'GitHub Desktop',
@@ -358,8 +358,7 @@ async function findApplication(editor: WindowsExternalEditor) {
       continue;
     }
 
-    const executableShimPaths =
-      editor.installLocationRegistryKey === 'DisplayIcon' ? [installLocation] : editor.executableShimPaths.map((p) => Path.join(installLocation, ...p));
+    const executableShimPaths = editor.installLocationRegistryKey === 'DisplayIcon' ? [installLocation] : editor.executableShimPaths.map((p) => Path.join(installLocation, ...p));
 
     for (const path of executableShimPaths) {
       const exists = await pathExists(path);
diff --git a/src/services/native/hooks.ts b/src/services/native/hooks.ts
index 38fd44f3..6ae27c2d 100644
--- a/src/services/native/hooks.ts
+++ b/src/services/native/hooks.ts
@@ -4,7 +4,9 @@ import { usePromiseValue } from '@/helpers/useServiceValue';
 
 export function useActualIp(homeUrl: string): string | undefined {
   return usePromiseValue<string | undefined, undefined>(
-    async () => (homeUrl ? await window.service.native.getLocalHostUrlWithActualIP(homeUrl) : await Promise.resolve(undefined)),
+    async (): Promise<string | undefined> => {
+      return homeUrl ? await window.service.native.getLocalHostUrlWithActualIP(homeUrl) : void Promise.resolve(undefined);
+    },
     undefined,
     [homeUrl],
   );
diff --git a/src/services/native/index.ts b/src/services/native/index.ts
index 9c5f5ad9..c766ac24 100644
--- a/src/services/native/index.ts
+++ b/src/services/native/index.ts
@@ -1,29 +1,32 @@
 /* eslint-disable @typescript-eslint/require-await */
-import { app, dialog, shell, MessageBoxOptions } from 'electron';
-import { injectable, inject } from 'inversify';
-import { Observable } from 'rxjs';
+import { app, dialog, MessageBoxOptions, shell } from 'electron';
+import { inject, injectable } from 'inversify';
 import path from 'path';
+import { Observable } from 'rxjs';
 
-import type { IWindowService } from '@services/windows/interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import { INativeService } from './interface';
+import { ZX_FOLDER } from '@/constants/paths';
+import { lazyInject } from '@services/container';
+import { ILogLevels, logger } from '@services/libs/log';
+import { getLocalHostUrlWithActualIP } from '@services/libs/url';
 import serviceIdentifier from '@services/serviceIdentifier';
 import { IWikiService, ZxWorkerControlActions } from '@services/wiki/interface';
-import { IWorkspaceService } from '@services/workspaces/interface';
-import { ZX_FOLDER } from '@/constants/paths';
-import { ILogLevels, logger } from '@services/libs/log';
-import { findEditorOrDefault, findGitGUIAppOrDefault, launchExternalEditor } from './externalApp';
-import { reportErrorToGithubWithTemplates } from './reportError';
 import { IZxFileInput } from '@services/wiki/wikiWorker';
-import { ZxNotInitializedError } from './error';
-import { lazyInject } from '@services/container';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
+import { IWorkspaceService } from '@services/workspaces/interface';
 import i18next from 'i18next';
-import { getLocalHostUrlWithActualIP } from '@services/libs/url';
+import { ZxNotInitializedError } from './error';
+import { findEditorOrDefault, findGitGUIAppOrDefault, launchExternalEditor } from './externalApp';
+import { INativeService } from './interface';
+import { reportErrorToGithubWithTemplates } from './reportError';
 
 @injectable()
 export class NativeService implements INativeService {
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
 
   constructor(@inject(serviceIdentifier.Window) private readonly windowService: IWindowService) {}
 
@@ -121,7 +124,7 @@ ${message.message}
 
             break;
           }
-          // No default
+            // No default
         }
       });
     });
@@ -160,7 +163,7 @@ ${message.message}
   }
 
   public async open(uri: string, isDirectory = false): Promise<void> {
-    return isDirectory ? shell.showItemInFolder(uri) : await shell.openExternal(uri);
+    isDirectory ? shell.showItemInFolder(uri) : await shell.openExternal(uri);
   }
 
   public async quit(): Promise<void> {
diff --git a/src/services/native/interface.ts b/src/services/native/interface.ts
index a794dcd0..9f0a6be1 100644
--- a/src/services/native/interface.ts
+++ b/src/services/native/interface.ts
@@ -1,10 +1,10 @@
 import { MessageBoxOptions } from 'electron';
 import { Observable } from 'rxjs';
 
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { NativeChannel } from '@/constants/channels';
-import { WindowNames } from '@services/windows/WindowProperties';
 import { IZxFileInput } from '@services/wiki/wikiWorker';
+import { WindowNames } from '@services/windows/WindowProperties';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
 
 /**
  * Wrap call to electron api, so we won't need remote module in renderer process
@@ -23,10 +23,10 @@ export interface INativeService {
   openInGitGuiApp(filePath: string, editorName?: string | undefined): Promise<boolean>;
   openNewGitHubIssue(error: Error): Promise<void>;
   openPath(filePath: string): Promise<void>;
+  path(method: 'basename' | 'dirname' | 'join', pathString: string | undefined, ...paths: string[]): Promise<string | undefined>;
   pickDirectory(defaultPath?: string): Promise<string[]>;
   pickFile(filters?: Electron.OpenDialogOptions['filters']): Promise<string[]>;
   quit(): void;
-  path(method: 'basename' | 'dirname' | 'join', pathString: string | undefined, ...paths: string[]): Promise<string | undefined>;
   showElectronMessageBox(message: string, type: MessageBoxOptions['type'], WindowName?: WindowNames): Promise<void>;
 }
 export const NativeServiceIPCDescriptor = {
diff --git a/src/services/native/reportError.ts b/src/services/native/reportError.ts
index 81ffd5d2..321ebc58 100644
--- a/src/services/native/reportError.ts
+++ b/src/services/native/reportError.ts
@@ -1,6 +1,6 @@
 import { LOG_FOLDER } from '@/constants/appPaths';
 import serviceIdentifier from '@services/serviceIdentifier';
-import { openNewGitHubIssue, debugInfo } from 'electron-util';
+import { debugInfo, openNewGitHubIssue } from 'electron-util';
 import { INativeService } from './interface';
 
 export function reportErrorToGithubWithTemplates(error: Error): void {
diff --git a/src/services/notifications/index.ts b/src/services/notifications/index.ts
index 79ff4095..602bfbaf 100644
--- a/src/services/notifications/index.ts
+++ b/src/services/notifications/index.ts
@@ -1,19 +1,24 @@
 /* eslint-disable @typescript-eslint/require-await */
+import { lazyInject } from '@services/container';
+import type { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import type { IViewService } from '@services/view/interface';
+import type { IWindowService } from '@services/windows/interface';
 import { Notification, NotificationConstructorOptions } from 'electron';
 import { injectable } from 'inversify';
-import { lazyInject } from '@services/container';
-import serviceIdentifier from '@services/serviceIdentifier';
-import type { IPreferenceService } from '@services/preferences/interface';
-import type { IViewService } from '@services/view/interface';
-import type { INotificationService, IPauseNotificationsInfo } from './interface';
-import type { IWindowService } from '@services/windows/interface';
 import { BehaviorSubject } from 'rxjs';
+import type { INotificationService, IPauseNotificationsInfo } from './interface';
 
 @injectable()
 export class NotificationService implements INotificationService {
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
-  @lazyInject(serviceIdentifier.View) private readonly viewService!: IViewService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
+  @lazyInject(serviceIdentifier.View)
+  private readonly viewService!: IViewService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
 
   private pauseNotificationsInfo?: IPauseNotificationsInfo;
   public pauseNotificationsInfo$: BehaviorSubject<IPauseNotificationsInfo | undefined>;
diff --git a/src/services/notifications/interface.ts b/src/services/notifications/interface.ts
index d2ef3e2f..a867c72d 100644
--- a/src/services/notifications/interface.ts
+++ b/src/services/notifications/interface.ts
@@ -1,6 +1,6 @@
+import { NotificationChannel } from '@/constants/channels';
 import type { NotificationConstructorOptions } from 'electron';
 import { ProxyPropertyType } from 'electron-ipc-cat/common';
-import { NotificationChannel } from '@/constants/channels';
 import { BehaviorSubject } from 'rxjs';
 
 export interface IPauseNotificationsInfo {
diff --git a/src/services/preferences/defaultPreferences.ts b/src/services/preferences/defaultPreferences.ts
index fabafa31..944b187c 100644
--- a/src/services/preferences/defaultPreferences.ts
+++ b/src/services/preferences/defaultPreferences.ts
@@ -1,6 +1,6 @@
 import { app } from 'electron';
-import semver from 'semver';
 import path from 'path';
+import semver from 'semver';
 import { IPreferences } from './interface';
 
 export const defaultPreferences: IPreferences = {
diff --git a/src/services/preferences/index.ts b/src/services/preferences/index.ts
index 4921343d..8abe3f3b 100755
--- a/src/services/preferences/index.ts
+++ b/src/services/preferences/index.ts
@@ -1,33 +1,40 @@
 /* eslint-disable @typescript-eslint/require-await */
-import { BehaviorSubject } from 'rxjs';
-import { injectable } from 'inversify';
 import { dialog, nativeTheme } from 'electron';
-import { debounce } from 'lodash';
 import settings from 'electron-settings';
+import { injectable } from 'inversify';
+import { debounce } from 'lodash';
+import { BehaviorSubject } from 'rxjs';
 
-import serviceIdentifier from '@services/serviceIdentifier';
-import type { IWindowService } from '@services/windows/interface';
-import type { INotificationService } from '@services/notifications/interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import { i18n } from '@services/libs/i18n';
-import { IPreferences, IPreferenceService } from './interface';
-import { defaultPreferences } from './defaultPreferences';
 import { lazyInject } from '@services/container';
+import { i18n } from '@services/libs/i18n';
 import { requestChangeLanguage } from '@services/libs/i18n/requestChangeLanguage';
+import type { INotificationService } from '@services/notifications/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
 import { IWikiService } from '@services/wiki/interface';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
 import { IWorkspaceService } from '@services/workspaces/interface';
-import { WikiChannel } from '@/constants/channels';
-import { WikiStateKey } from '@/constants/wiki';
+import { defaultPreferences } from './defaultPreferences';
+import { IPreferences, IPreferenceService } from './interface';
 
 // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-const debouncedSetPreferenceFile = debounce(async (newPreferences: IPreferences) => await settings.set(`preferences`, { ...newPreferences } as any), 500);
+const debouncedSetPreferenceFile = debounce(async (newPreferences: IPreferences) => {
+  await settings.set(`preferences`, { ...newPreferences } as any);
+}, 500);
 
 @injectable()
 export class Preference implements IPreferenceService {
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.NotificationService) private readonly notificationService!: INotificationService;
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.NotificationService)
+  private readonly notificationService!: INotificationService;
+
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
 
   private cachedPreferences: IPreferences;
   public preference$: BehaviorSubject<IPreferences>;
diff --git a/src/services/preferences/interface.ts b/src/services/preferences/interface.ts
index 1a844a0c..f335bb85 100644
--- a/src/services/preferences/interface.ts
+++ b/src/services/preferences/interface.ts
@@ -1,8 +1,8 @@
 import { ProxyPropertyType } from 'electron-ipc-cat/common';
 
 import { PreferenceChannel } from '@/constants/channels';
-import { BehaviorSubject } from 'rxjs';
 import { HunspellLanguages } from '@/constants/hunspellLanguages';
+import { BehaviorSubject } from 'rxjs';
 
 export interface IPreferences {
   allowPrerelease: boolean;
diff --git a/src/services/systemPreferences/hooks.ts b/src/services/systemPreferences/hooks.ts
index 73a9bf20..1d84ca9a 100644
--- a/src/services/systemPreferences/hooks.ts
+++ b/src/services/systemPreferences/hooks.ts
@@ -1,6 +1,6 @@
 import useObservable from 'beautiful-react-hooks/useObservable';
-import { useState } from 'react';
 import i18n from 'i18next';
+import { useState } from 'react';
 
 import { IUsedElectionSettings } from './interface';
 
diff --git a/src/services/theme/defaultTheme.ts b/src/services/theme/defaultTheme.ts
index 06a984a8..4514c106 100644
--- a/src/services/theme/defaultTheme.ts
+++ b/src/services/theme/defaultTheme.ts
@@ -1,5 +1,5 @@
-import { merge, cloneDeep } from 'lodash';
 import { createMuiTheme, Theme } from '@material-ui/core';
+import { cloneDeep, merge } from 'lodash';
 
 export const lightTheme = merge(cloneDeep(createMuiTheme())) as Theme;
 export const darkTheme = merge(
diff --git a/src/services/theme/index.ts b/src/services/theme/index.ts
index a3c091b1..7eb08c34 100644
--- a/src/services/theme/index.ts
+++ b/src/services/theme/index.ts
@@ -1,16 +1,18 @@
 /* eslint-disable @typescript-eslint/require-await */
-import { BehaviorSubject } from 'rxjs';
 import { nativeTheme } from 'electron';
 import { injectable } from 'inversify';
+import { BehaviorSubject } from 'rxjs';
 
-import type { IPreferenceService } from '@services/preferences/interface';
-import { ITheme, IThemeService } from './interface';
-import serviceIdentifier from '@services/serviceIdentifier';
 import { lazyInject } from '@services/container';
+import type { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import { ITheme, IThemeService } from './interface';
 
 @injectable()
 export class ThemeService implements IThemeService {
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
   public theme$: BehaviorSubject<ITheme>;
 
   constructor() {
diff --git a/src/services/theme/interface.ts b/src/services/theme/interface.ts
index 213665b8..ef37b1be 100644
--- a/src/services/theme/interface.ts
+++ b/src/services/theme/interface.ts
@@ -1,6 +1,6 @@
-import { BehaviorSubject } from 'rxjs';
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { ThemeChannel } from '@/constants/channels';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
+import { BehaviorSubject } from 'rxjs';
 
 export interface ITheme {
   shouldUseDarkColors: boolean;
diff --git a/src/services/updater/hooks.ts b/src/services/updater/hooks.ts
index 57f390be..04f73c83 100644
--- a/src/services/updater/hooks.ts
+++ b/src/services/updater/hooks.ts
@@ -1,6 +1,6 @@
-import { useState } from 'react';
 import useObservable from 'beautiful-react-hooks/useObservable';
 import type { TFunction } from 'i18next';
+import { useState } from 'react';
 
 import { IUpdaterMetaData, IUpdaterStatus } from './interface';
 
diff --git a/src/services/updater/index.ts b/src/services/updater/index.ts
index b7864907..a651ffc3 100644
--- a/src/services/updater/index.ts
+++ b/src/services/updater/index.ts
@@ -1,26 +1,31 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
 /* eslint-disable @typescript-eslint/consistent-type-assertions */
-import { injectable } from 'inversify';
-import semver from 'semver';
-import { BehaviorSubject } from 'rxjs';
-import i18next from 'i18next';
 import { shell } from 'electron';
+import i18next from 'i18next';
+import { injectable } from 'inversify';
 import fetch from 'node-fetch';
+import { BehaviorSubject } from 'rxjs';
+import semver from 'semver';
 
-import serviceIdentifier from '@services/serviceIdentifier';
-import { IContextService } from '@services/context/interface';
 import { lazyInject } from '@services/container';
-import { IUpdaterService, IUpdaterMetaData, IGithubReleaseData, IUpdaterStatus } from './interface';
-import type { IMenuService } from '@services/menu/interface';
+import { IContextService } from '@services/context/interface';
 import { logger } from '@services/libs/log';
+import type { IMenuService } from '@services/menu/interface';
 import { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import { IGithubReleaseData, IUpdaterMetaData, IUpdaterService, IUpdaterStatus } from './interface';
 
 // TODO: use electron-forge 's auto update solution， maybe see https://headspring.com/2020/09/24/building-signing-and-publishing-electron-forge-applications-for-windows/
 @injectable()
 export class Updater implements IUpdaterService {
-  @lazyInject(serviceIdentifier.MenuService) private readonly menuService!: IMenuService;
-  @lazyInject(serviceIdentifier.Context) private readonly contextService!: IContextService;
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
+  @lazyInject(serviceIdentifier.MenuService)
+  private readonly menuService!: IMenuService;
+
+  @lazyInject(serviceIdentifier.Context)
+  private readonly contextService!: IContextService;
+
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
 
   private updaterMetaData = {} as IUpdaterMetaData;
   public updaterMetaData$: BehaviorSubject<IUpdaterMetaData>;
@@ -58,11 +63,11 @@ export class Updater implements IUpdaterService {
     try {
       const latestReleaseData = await (allowPrerelease
         ? fetch('https://api.github.com/repos/tiddly-gittly/TidGi-Desktop/releases?per_page=1')
-            .then(async (response) => await (response.json() as Promise<IGithubReleaseData[]>))
-            .then((json) => json[0])
+          .then(async (response) => await (response.json() as Promise<IGithubReleaseData[]>))
+          .then((json) => json[0])
         : fetch('https://api.github.com/repos/tiddly-gittly/TidGi-Desktop/releases/latest').then(
-            async (response) => await (response.json() as Promise<IGithubReleaseData | undefined>),
-          ));
+          async (response) => await (response.json() as Promise<IGithubReleaseData | undefined>),
+        ));
       if (latestReleaseData === undefined) {
         throw new Error('No release data, latestReleaseData === undefined');
       }
@@ -75,7 +80,9 @@ export class Updater implements IUpdaterService {
         {
           id: 'update',
           label: () => i18next.t('Updater.CheckingFailed'),
-          click: async () => await this.checkForUpdates(),
+          click: async () => {
+            await this.checkForUpdates();
+          },
         },
       ]);
       return;
@@ -90,7 +97,9 @@ export class Updater implements IUpdaterService {
         {
           id: 'update',
           label: () => i18next.t('Updater.UpdateAvailable'),
-          click: async () => await shell.openExternal(latestReleasePageUrl),
+          click: async () => {
+            await shell.openExternal(latestReleasePageUrl);
+          },
         },
       ]);
     } else {
@@ -99,7 +108,9 @@ export class Updater implements IUpdaterService {
         {
           id: 'update',
           label: () => i18next.t('Updater.UpdateNotAvailable'),
-          click: async () => await this.checkForUpdates(),
+          click: async () => {
+            await this.checkForUpdates();
+          },
         },
       ]);
     }
diff --git a/src/services/updater/interface.ts b/src/services/updater/interface.ts
index d0e8cd2e..7730c962 100644
--- a/src/services/updater/interface.ts
+++ b/src/services/updater/interface.ts
@@ -1,6 +1,6 @@
 /* eslint-disable typescript-sort-keys/interface */
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { UpdaterChannel } from '@/constants/channels';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { BehaviorSubject } from 'rxjs';
 
 export enum IUpdaterStatus {
diff --git a/src/services/view/index.ts b/src/services/view/index.ts
index f2f6da59..e9a5e430 100644
--- a/src/services/view/index.ts
+++ b/src/services/view/index.ts
@@ -1,37 +1,46 @@
 /* eslint-disable n/no-callback-literal */
 /* eslint-disable @typescript-eslint/require-await */
 /* eslint-disable @typescript-eslint/consistent-type-assertions */
-import { BrowserView, BrowserWindow, session, ipcMain, WebPreferences } from 'electron';
+import { BrowserView, BrowserWindow, ipcMain, session, WebPreferences } from 'electron';
 import { injectable } from 'inversify';
 
-import serviceIdentifier from '@services/serviceIdentifier';
+import type { IMenuService } from '@services/menu/interface';
 import type { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import type { IWindowService } from '@services/windows/interface';
 import type { IWorkspaceService } from '@services/workspaces/interface';
 import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import type { IWindowService } from '@services/windows/interface';
-import type { IMenuService } from '@services/menu/interface';
 
-import { WindowNames, IBrowserViewMetaData } from '@services/windows/WindowProperties';
-import { i18n } from '@services/libs/i18n';
-import getViewBounds from '@services/libs/getViewBounds';
-import { IWorkspace } from '@services/workspaces/interface';
-import setupViewEventHandlers from './setupViewEventHandlers';
-import getFromRenderer from '@services/libs/getFromRenderer';
-import { ViewChannel, MetaDataChannel, WindowChannel } from '@/constants/channels';
-import { lazyInject } from '@services/container';
-import { IViewService } from './interface';
-import { getLocalHostUrlWithActualIP, replaceUrlPortWithSettingPort } from '@services/libs/url';
-import { logger } from '@services/libs/log';
-import { ViewLoadUrlError } from './error';
+import { MetaDataChannel, ViewChannel, WindowChannel } from '@/constants/channels';
 import { isMac, isWin } from '@/helpers/system';
+import { lazyInject } from '@services/container';
+import getFromRenderer from '@services/libs/getFromRenderer';
+import getViewBounds from '@services/libs/getViewBounds';
+import { i18n } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
+import { getLocalHostUrlWithActualIP, replaceUrlPortWithSettingPort } from '@services/libs/url';
+import { IBrowserViewMetaData, WindowNames } from '@services/windows/WindowProperties';
+import { IWorkspace } from '@services/workspaces/interface';
+import { ViewLoadUrlError } from './error';
+import { IViewService } from './interface';
+import setupViewEventHandlers from './setupViewEventHandlers';
 
 @injectable()
 export class View implements IViewService {
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
-  @lazyInject(serviceIdentifier.MenuService) private readonly menuService!: IMenuService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
+
+  @lazyInject(serviceIdentifier.MenuService)
+  private readonly menuService!: IMenuService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
 
   constructor() {
     this.initIPCHandlers();
@@ -269,8 +278,7 @@ export class View implements IViewService {
       const url = new URL(details.url);
       details.requestHeaders.Origin = url.origin;
       details.requestHeaders.Referer = details.url;
-      details.requestHeaders['User-Agent'] =
-        'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36';
+      details.requestHeaders['User-Agent'] = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36';
       callback({ cancel: false, requestHeaders: details.requestHeaders });
     });
     const browserViewMetaData: IBrowserViewMetaData = { workspaceID: workspace.id };
@@ -320,7 +328,9 @@ export class View implements IViewService {
       shouldPauseNotifications: this.shouldPauseNotifications,
       workspace,
       sharedWebPreferences,
-      loadInitialUrlWithCatch: async () => await this.loadUrlForView(workspace, view, windowName),
+      loadInitialUrlWithCatch: async () => {
+        await this.loadUrlForView(workspace, view, windowName);
+      },
     });
     await this.loadUrlForView(workspace, view, windowName);
   }
@@ -338,9 +348,7 @@ export class View implements IViewService {
     });
     try {
       logger.debug(
-        `loadInitialUrlWithCatch(): view.webContents: ${String(view.webContents)} ${hostReplacedUrl} for windowName ${windowName} for workspace ${
-          workspace.name
-        }`,
+        `loadInitialUrlWithCatch(): view.webContents: ${String(view.webContents)} ${hostReplacedUrl} for windowName ${windowName} for workspace ${workspace.name}`,
         { stack: new Error('debug error, not a real error').stack },
       );
       if (await this.workspaceService.workspaceDidFailLoad(workspace.id)) {
@@ -399,7 +407,7 @@ export class View implements IViewService {
       if (workspace === undefined) {
         logger.error(`workspace is undefined when setActiveView(${windowName}, ${workspaceID})`);
       } else {
-        return await this.addView(workspace, windowName);
+        await this.addView(workspace, windowName);
       }
     } else {
       browserWindow.setBrowserView(view);
diff --git a/src/services/view/interface.ts b/src/services/view/interface.ts
index 65a76c1b..c15a7d79 100644
--- a/src/services/view/interface.ts
+++ b/src/services/view/interface.ts
@@ -1,9 +1,9 @@
-import { BrowserWindow, BrowserView } from 'electron';
+import { BrowserView, BrowserWindow } from 'electron';
 
 import { ViewChannel } from '@/constants/channels';
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
-import { IWorkspace } from '@services/workspaces/interface';
 import { WindowNames } from '@services/windows/WindowProperties';
+import { IWorkspace } from '@services/workspaces/interface';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
 
 /**
  * BrowserView related things, the BrowserView is the webview like frame that renders our wiki website.
diff --git a/src/services/view/setupViewEventHandlers.ts b/src/services/view/setupViewEventHandlers.ts
index f6a622f6..1a538e17 100644
--- a/src/services/view/setupViewEventHandlers.ts
+++ b/src/services/view/setupViewEventHandlers.ts
@@ -1,29 +1,29 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
 /* eslint-disable unicorn/consistent-destructuring */
-import { app, BrowserView, shell, nativeImage, BrowserWindowConstructorOptions, BrowserWindow } from 'electron';
-import path from 'path';
-import fsExtra from 'fs-extra';
+import { app, BrowserView, BrowserWindow, BrowserWindowConstructorOptions, nativeImage, shell } from 'electron';
 import windowStateKeeper from 'electron-window-state';
+import fsExtra from 'fs-extra';
+import path from 'path';
 
-import { IWorkspace } from '@services/workspaces/interface';
-import getViewBounds from '@services/libs/getViewBounds';
-import { extractDomain, isInternalUrl } from '@/helpers/url';
 import { buildResourcePath } from '@/constants/paths';
+import { extractDomain, isInternalUrl } from '@/helpers/url';
+import getViewBounds from '@services/libs/getViewBounds';
+import { IWorkspace } from '@services/workspaces/interface';
 
-import serviceIdentifier from '@services/serviceIdentifier';
-import type { IPreferenceService } from '@services/preferences/interface';
-import type { IWorkspaceService } from '@services/workspaces/interface';
-import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import { IMenuService } from '@services/menu/interface';
-import type { IWindowService } from '@services/windows/interface';
-import { WindowNames, IBrowserViewMetaData, windowDimension } from '@services/windows/WindowProperties';
-import { container } from '@services/container';
+import { SETTINGS_FOLDER } from '@/constants/appPaths';
 import { MetaDataChannel, ViewChannel, WindowChannel } from '@/constants/channels';
+import { isWin } from '@/helpers/system';
+import { container } from '@services/container';
 import { logger } from '@services/libs/log';
 import { getLocalHostUrlWithActualIP, isSameOrigin } from '@services/libs/url';
-import { SETTINGS_FOLDER } from '@/constants/appPaths';
+import { IMenuService } from '@services/menu/interface';
+import type { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import type { IWindowService } from '@services/windows/interface';
+import { IBrowserViewMetaData, windowDimension, WindowNames } from '@services/windows/WindowProperties';
+import type { IWorkspaceService } from '@services/workspaces/interface';
+import type { IWorkspaceViewService } from '@services/workspacesView/interface';
 import { throttle } from 'lodash';
-import { isWin } from '@/helpers/system';
 
 export interface IViewContext {
   loadInitialUrlWithCatch: () => Promise<void>;
@@ -308,12 +308,13 @@ function handleNewWindow(
   parentWebContents: Electron.WebContents,
 ):
   | {
-      action: 'deny';
-    }
+    action: 'deny';
+  }
   | {
-      action: 'allow';
-      overrideBrowserWindowOptions?: Electron.BrowserWindowConstructorOptions | undefined;
-    } {
+    action: 'allow';
+    overrideBrowserWindowOptions?: Electron.BrowserWindowConstructorOptions | undefined;
+  }
+{
   // don't show useless blank page
   if (nextUrl.startsWith('about:blank')) {
     return { action: 'deny' };
@@ -407,9 +408,7 @@ function handleNewWindow(
     }
     parentWebContents.once('did-create-window', (childWindow) => {
       childWindow.setMenuBarVisibility(false);
-      childWindow.webContents.setWindowOpenHandler((details: Electron.HandlerDetails) =>
-        handleNewWindow(details.url, newWindowContext, details.disposition, parentWebContents),
-      );
+      childWindow.webContents.setWindowOpenHandler((details: Electron.HandlerDetails) => handleNewWindow(details.url, newWindowContext, details.disposition, parentWebContents));
       childWindow.webContents.once('will-navigate', async (_event, url) => {
         // if the window is used for the current app, then use default behavior
         let appUrl = (await workspaceService.get(workspace.id))?.homeUrl;
diff --git a/src/services/wiki/index.ts b/src/services/wiki/index.ts
index 4a85f411..58f803a9 100644
--- a/src/services/wiki/index.ts
+++ b/src/services/wiki/index.ts
@@ -1,49 +1,62 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
 /* eslint-disable @typescript-eslint/require-await */
 /* eslint-disable @typescript-eslint/no-dynamic-delete */
-import { injectable } from 'inversify';
 import { delay } from 'bluebird';
-import fs from 'fs-extra';
-import path from 'path';
-import { spawn, Thread, Worker, ModuleThread } from 'threads';
-import type { WorkerEvent } from 'threads/dist/types/master';
 import { BrowserView, dialog, ipcMain, shell } from 'electron';
+import fs from 'fs-extra';
+import { injectable } from 'inversify';
+import path from 'path';
+import { ModuleThread, spawn, Thread, Worker } from 'threads';
+import type { WorkerEvent } from 'threads/dist/types/master';
 
-import serviceIdentifier from '@services/serviceIdentifier';
-import type { IAuthenticationService } from '@services/auth/interface';
-import type { IWindowService } from '@services/windows/interface';
-import type { IViewService } from '@services/view/interface';
-import type { IWorkspaceService, IWorkspace } from '@services/workspaces/interface';
-import type { IGitService, IGitUserInfos } from '@services/git/interface';
-import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import { logger, wikiOutputToFile, refreshOutputFile, getWikiLogFilePath } from '@services/libs/log';
-import { i18n } from '@services/libs/i18n';
-import { lazyInject } from '@services/container';
-import { TIDDLYWIKI_TEMPLATE_FOLDER_PATH, TIDDLERS_PATH, TIDDLYWIKI_PACKAGE_FOLDER } from '@/constants/paths';
-import { updateSubWikiPluginContent, getSubWikiPluginContent, ISubWikiPluginContent } from './plugin/subWikiPlugin';
-import { IWikiService, WikiControlActions } from './interface';
 import { WikiChannel } from '@/constants/channels';
-import { CopyWikiTemplateError, DoubleWikiInstanceError, SubWikiSMainWikiNotExistError, WikiRuntimeError } from './error';
+import { TIDDLERS_PATH, TIDDLYWIKI_PACKAGE_FOLDER, TIDDLYWIKI_TEMPLATE_FOLDER_PATH } from '@/constants/paths';
+import type { IAuthenticationService } from '@services/auth/interface';
+import { lazyInject } from '@services/container';
+import type { IGitService, IGitUserInfos } from '@services/git/interface';
+import { i18n } from '@services/libs/i18n';
+import { getWikiLogFilePath, logger, refreshOutputFile, wikiOutputToFile } from '@services/libs/log';
+import serviceIdentifier from '@services/serviceIdentifier';
 import { SupportedStorageServices } from '@services/types';
+import type { IViewService } from '@services/view/interface';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
+import type { IWorkspace, IWorkspaceService } from '@services/workspaces/interface';
+import type { IWorkspaceViewService } from '@services/workspacesView/interface';
+import { CopyWikiTemplateError, DoubleWikiInstanceError, SubWikiSMainWikiNotExistError, WikiRuntimeError } from './error';
+import { IWikiService, WikiControlActions } from './interface';
+import { getSubWikiPluginContent, ISubWikiPluginContent, updateSubWikiPluginContent } from './plugin/subWikiPlugin';
 import type { WikiWorker } from './wikiWorker';
 
+import { defaultServerIP } from '@/constants/urls';
+import { IPreferenceService } from '@services/preferences/interface';
 // @ts-expect-error it don't want .ts
 // eslint-disable-next-line import/no-webpack-loader-syntax
 import workerURL from 'threads-plugin/dist/loader?name=wikiWorker!./wikiWorker.ts';
 import { IWikiOperations, wikiOperations } from './wikiOperations';
-import { defaultServerIP } from '@/constants/urls';
-import { IPreferenceService } from '@services/preferences/interface';
 
 @injectable()
 export class Wiki implements IWikiService {
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
-  @lazyInject(serviceIdentifier.Authentication) private readonly authService!: IAuthenticationService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.Git) private readonly gitService!: IGitService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
-  @lazyInject(serviceIdentifier.View) private readonly viewService!: IViewService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
+  @lazyInject(serviceIdentifier.Authentication)
+  private readonly authService!: IAuthenticationService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.Git)
+  private readonly gitService!: IGitService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
+
+  @lazyInject(serviceIdentifier.View)
+  private readonly viewService!: IViewService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
 
   public async getSubWikiPluginContent(mainWikiPath: string): Promise<ISubWikiPluginContent[]> {
     return await getSubWikiPluginContent(mainWikiPath);
@@ -92,7 +105,7 @@ export class Wiki implements IWikiService {
     this.wikiWorkers[wikiFolderLocation] = worker;
     refreshOutputFile(wikiFolderLocation);
     const loggerMeta = { worker: 'NodeJSWiki', homePath: wikiFolderLocation };
-    return await new Promise<void>((resolve, reject) => {
+    await new Promise<void>((resolve, reject) => {
       // handle native messages
       Thread.errors(worker).subscribe(async (error) => {
         logger.error(error.message, { ...loggerMeta, ...error });
@@ -147,7 +160,8 @@ export class Wiki implements IWikiService {
                   lastUrl: workspace.lastUrl?.replace?.(`:${tiddlyWikiPort}`, `:${tiddlyWikiPort + 1}`) ?? null,
                 };
                 await this.workspaceService.update(workspaceID, portChange, true);
-                return reject(new WikiRuntimeError(new Error(message.message), wikiFolderLocation, true, { ...workspace, ...portChange }));
+                reject(new WikiRuntimeError(new Error(message.message), wikiFolderLocation, true, { ...workspace, ...portChange }));
+                return;
               }
               reject(new WikiRuntimeError(new Error(message.message), wikiFolderLocation, false));
             }
@@ -192,7 +206,8 @@ export class Wiki implements IWikiService {
       logger.warning(`No wiki for ${wikiFolderLocation}. No running worker, means maybe tiddlywiki server in this workspace failed to start`, {
         function: 'stopWiki',
       });
-      return await Promise.resolve();
+      await Promise.resolve();
+      return;
     }
     clearInterval(this.wikiSyncIntervals[wikiFolderLocation]);
     try {
@@ -617,7 +632,7 @@ export class Wiki implements IWikiService {
   }
 
   public async updateSubWikiPluginContent(mainWikiPath: string, newConfig?: IWorkspace, oldConfig?: IWorkspace): Promise<void> {
-    return updateSubWikiPluginContent(mainWikiPath, newConfig, oldConfig);
+    updateSubWikiPluginContent(mainWikiPath, newConfig, oldConfig);
   }
 
   public wikiOperation<OP extends keyof IWikiOperations>(
@@ -649,7 +664,8 @@ export class Wiki implements IWikiService {
       const onTimeout = (): void => {
         ipcMain.removeListener(WikiChannel.setTiddlerTextDone + workspaceID, onDone);
         clearInterval(intervalHandle);
-        const errorMessage = `setWikiLanguage("${tiddlywikiLanguageName}"), language "${tiddlywikiLanguageName}" in workspaceID ${workspaceID} is too slow to update after ${twLanguageUpdateTimeout}ms.`;
+        const errorMessage =
+          `setWikiLanguage("${tiddlywikiLanguageName}"), language "${tiddlywikiLanguageName}" in workspaceID ${workspaceID} is too slow to update after ${twLanguageUpdateTimeout}ms.`;
         logger.error(errorMessage);
         // no need to reject and show error dialog, otherwise user will rise issue. This happens too frequent.
         // reject(new Error(errorMessage));
diff --git a/src/services/wiki/interface.ts b/src/services/wiki/interface.ts
index d5349729..6390cbe3 100644
--- a/src/services/wiki/interface.ts
+++ b/src/services/wiki/interface.ts
@@ -1,11 +1,11 @@
+import { WikiChannel } from '@/constants/channels';
+import { IGitUserInfos } from '@services/git/interface';
+import { IWorkspace } from '@services/workspaces/interface';
 import type { BrowserView } from 'electron';
 import { ProxyPropertyType } from 'electron-ipc-cat/common';
-import { WikiChannel } from '@/constants/channels';
-import { IWorkspace } from '@services/workspaces/interface';
-import { IGitUserInfos } from '@services/git/interface';
+import { ModuleThread } from 'threads';
 import type { ISubWikiPluginContent } from './plugin/subWikiPlugin';
 import { IWikiOperations } from './wikiOperations';
-import { ModuleThread } from 'threads';
 import type { WikiWorker } from './wikiWorker';
 
 /**
diff --git a/src/services/wiki/plugin/ghPages.ts b/src/services/wiki/plugin/ghPages.ts
index 49261e50..7f1d60ed 100644
--- a/src/services/wiki/plugin/ghPages.ts
+++ b/src/services/wiki/plugin/ghPages.ts
@@ -1,6 +1,6 @@
+import { logger } from '@services/libs/log';
 import fs from 'fs-extra';
 import path from 'path';
-import { logger } from '@services/libs/log';
 
 interface IGhOptions {
   branch?: string;
diff --git a/src/services/wiki/plugin/subWikiPlugin.ts b/src/services/wiki/plugin/subWikiPlugin.ts
index 7a42d7eb..6fb442c5 100644
--- a/src/services/wiki/plugin/subWikiPlugin.ts
+++ b/src/services/wiki/plugin/subWikiPlugin.ts
@@ -1,9 +1,9 @@
-import path from 'path';
-import fs from 'fs-extra';
-import { take, drop, compact } from 'lodash';
+import { TIDDLERS_PATH } from '@/constants/paths';
 import { logger } from '@services/libs/log';
 import { IWorkspace } from '@services/workspaces/interface';
-import { TIDDLERS_PATH } from '@/constants/paths';
+import fs from 'fs-extra';
+import { compact, drop, take } from 'lodash';
+import path from 'path';
 
 const REPLACE_SYSTEM_TIDDLER_SYMBOL = 'search-replace:g[/],[_]search-replace:g[:],[_]';
 const getMatchPart = (tagToMatch: string): string => `kin::to[${tagToMatch}]`;
diff --git a/src/services/wiki/plugin/zxPlugin.ts b/src/services/wiki/plugin/zxPlugin.ts
index a0f10fa7..a19e5ea3 100644
--- a/src/services/wiki/plugin/zxPlugin.ts
+++ b/src/services/wiki/plugin/zxPlugin.ts
@@ -1,6 +1,6 @@
 import type { ITiddlyWiki } from '@tiddlygit/tiddlywiki';
-import vm, { Context } from 'vm';
 import _ from 'lodash';
+import vm, { Context } from 'vm';
 
 export const TW_SCRIPT_SEPARATOR = '/** tw */';
 /**
@@ -48,7 +48,7 @@ export function getTWVmContext(wikiInstance: ITiddlyWiki): ITWVMContext {
     {
       get: (target, propertyName, receiver) => {
         return (...messageArguments: unknown[]): void => {
-          executionResults.push(messageArguments.map((item) => String(item)).join('\n'));
+          executionResults.push(messageArguments.map(String).join('\n'));
         };
       },
     },
diff --git a/src/services/wiki/wikiOperations.ts b/src/services/wiki/wikiOperations.ts
index 8ca58f6d..fd5348a1 100644
--- a/src/services/wiki/wikiOperations.ts
+++ b/src/services/wiki/wikiOperations.ts
@@ -20,11 +20,18 @@ export const wikiOperations = {
     const createWorkspaceWindow = windowService.get(WindowNames.addWorkspace);
     createWorkspaceWindow?.webContents?.send(WikiChannel.createProgress, message);
   },
-  [WikiChannel.syncProgress]: (workspaceID: string, message: string): void => sendToMainWindow(WikiChannel.syncProgress, workspaceID, [message]),
-  [WikiChannel.generalNotification]: (workspaceID: string, message: string): void => sendToMainWindow(WikiChannel.generalNotification, workspaceID, [message]),
-  [WikiChannel.openTiddler]: (workspaceID: string, tiddlerName: string): void => sendToMainWindow(WikiChannel.openTiddler, workspaceID, [tiddlerName]),
-  [WikiChannel.setState]: (workspaceID: string, stateKey: WikiStateKey, content: string): void =>
-    sendToMainWindow(WikiChannel.setState, workspaceID, [stateKey, content]),
+  [WikiChannel.syncProgress]: (workspaceID: string, message: string): void => {
+    sendToMainWindow(WikiChannel.syncProgress, workspaceID, [message]);
+  },
+  [WikiChannel.generalNotification]: (workspaceID: string, message: string): void => {
+    sendToMainWindow(WikiChannel.generalNotification, workspaceID, [message]);
+  },
+  [WikiChannel.openTiddler]: (workspaceID: string, tiddlerName: string): void => {
+    sendToMainWindow(WikiChannel.openTiddler, workspaceID, [tiddlerName]);
+  },
+  [WikiChannel.setState]: (workspaceID: string, stateKey: WikiStateKey, content: string): void => {
+    sendToMainWindow(WikiChannel.setState, workspaceID, [stateKey, content]);
+  },
   // TODO: add more operations here from `src/preload/wikiOperation.ts`
 };
 export type IWikiOperations = typeof wikiOperations;
diff --git a/src/services/wiki/wikiWorker.ts b/src/services/wiki/wikiWorker.ts
index 09fc634e..b5c75cfe 100644
--- a/src/services/wiki/wikiWorker.ts
+++ b/src/services/wiki/wikiWorker.ts
@@ -3,19 +3,19 @@
  */
 import { uninstall } from '@/helpers/installV8Cache';
 import 'source-map-support/register';
-import { expose } from 'threads/worker';
-import path from 'path';
-import { TiddlyWiki, type ITiddlyWiki } from '@tiddlygit/tiddlywiki';
-import { Observable } from 'rxjs';
-import intercept from 'intercept-stdout';
+import { type ITiddlyWiki, TiddlyWiki } from '@tiddlygit/tiddlywiki';
 import { fork } from 'child_process';
-import { tmpdir } from 'os';
 import fs from 'fs';
 import { mkdtemp, writeFile } from 'fs-extra';
+import intercept from 'intercept-stdout';
+import { tmpdir } from 'os';
+import path from 'path';
+import { Observable } from 'rxjs';
+import { expose } from 'threads/worker';
 
-import { fixPath } from '@services/libs/fixPath';
-import { IWikiMessage, WikiControlActions, ZxWorkerControlActions, IZxWorkerMessage } from './interface';
 import { defaultServerIP } from '@/constants/urls';
+import { fixPath } from '@services/libs/fixPath';
+import { IWikiMessage, IZxWorkerMessage, WikiControlActions, ZxWorkerControlActions } from './interface';
 import { executeScriptInTWContext, extractTWContextScripts, getTWVmContext } from './plugin/zxPlugin';
 
 fixPath();
@@ -61,11 +61,11 @@ function startNodeJSWiki({
         `host=${tiddlyWikiHost}`,
         'root-tiddler=$:/core/save/lazy-images',
       ];
-      wikiInstance.hooks.addHook('th-server-command-post-start', function (listenCommand, server) {
-        server.on('error', function (error: Error) {
+      wikiInstance.hooks.addHook('th-server-command-post-start', function(listenCommand, server) {
+        server.on('error', function(error: Error) {
           observer.next({ type: 'control', actions: WikiControlActions.error, message: error.message });
         });
-        server.on('listening', function () {
+        server.on('listening', function() {
           observer.next({
             type: 'control',
             actions: WikiControlActions.booted,
@@ -101,7 +101,7 @@ function executeZxScript(file: IZxFileInput, zxPath: string): Observable<IZxWork
         }
         const execution = fork(zxPath, [filePathToExecute], { silent: true });
 
-        execution.on('close', function (code) {
+        execution.on('close', function(code) {
           observer.next({ type: 'control', actions: ZxWorkerControlActions.ended, message: `child process exited with code ${String(code)}` });
         });
         execution.stdout?.on('data', (stdout: Buffer) => {
diff --git a/src/services/wikiGitWorkspace/index.ts b/src/services/wikiGitWorkspace/index.ts
index 2b63ebc2..01a0121d 100644
--- a/src/services/wikiGitWorkspace/index.ts
+++ b/src/services/wikiGitWorkspace/index.ts
@@ -1,37 +1,52 @@
-import path from 'path';
 import { app, dialog, powerMonitor } from 'electron';
 import { injectable } from 'inversify';
+import path from 'path';
 
+import type { IAuthenticationService } from '@services/auth/interface';
+import { lazyInject } from '@services/container';
+import type { IGitService, IGitUserInfos } from '@services/git/interface';
+import type { INotificationService } from '@services/notifications/interface';
 import serviceIdentifier from '@services/serviceIdentifier';
 import type { IWikiService } from '@services/wiki/interface';
-import type { IGitService, IGitUserInfos } from '@services/git/interface';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
 import type { INewWorkspaceConfig, IWorkspace, IWorkspaceService } from '@services/workspaces/interface';
 import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import type { IWindowService } from '@services/windows/interface';
-import type { IAuthenticationService } from '@services/auth/interface';
-import type { INotificationService } from '@services/notifications/interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import { lazyInject } from '@services/container';
 
-import { logger } from '@services/libs/log';
-import { i18n } from '@services/libs/i18n';
-import { IWikiGitWorkspaceService } from './interface';
-import { InitWikiGitError, InitWikiGitRevertError, InitWikiGitSyncedWikiNoGitUserInfoError } from './error';
-import { SupportedStorageServices } from '@services/types';
-import { hasGit } from 'git-sync-js';
 import { IContextService } from '@services/context/interface';
+import { i18n } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
+import { SupportedStorageServices } from '@services/types';
 import { updateGhConfig } from '@services/wiki/plugin/ghPages';
+import { hasGit } from 'git-sync-js';
+import { InitWikiGitError, InitWikiGitRevertError, InitWikiGitSyncedWikiNoGitUserInfoError } from './error';
+import { IWikiGitWorkspaceService } from './interface';
 
 @injectable()
 export class WikiGitWorkspace implements IWikiGitWorkspaceService {
-  @lazyInject(serviceIdentifier.Authentication) private readonly authService!: IAuthenticationService;
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.Git) private readonly gitService!: IGitService;
-  @lazyInject(serviceIdentifier.Context) private readonly contextService!: IContextService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
-  @lazyInject(serviceIdentifier.NotificationService) private readonly notificationService!: INotificationService;
+  @lazyInject(serviceIdentifier.Authentication)
+  private readonly authService!: IAuthenticationService;
+
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.Git)
+  private readonly gitService!: IGitService;
+
+  @lazyInject(serviceIdentifier.Context)
+  private readonly contextService!: IContextService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
+
+  @lazyInject(serviceIdentifier.NotificationService)
+  private readonly notificationService!: INotificationService;
 
   public registerSyncBeforeShutdown(): void {
     const listener = async (event: Event): Promise<void> => {
diff --git a/src/services/wikiGitWorkspace/interface.ts b/src/services/wikiGitWorkspace/interface.ts
index 3a711e12..4aec1231 100644
--- a/src/services/wikiGitWorkspace/interface.ts
+++ b/src/services/wikiGitWorkspace/interface.ts
@@ -1,7 +1,7 @@
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { WikiGitWorkspaceChannel } from '@/constants/channels';
-import { INewWorkspaceConfig, IWorkspace } from '@services/workspaces/interface';
 import { IGitUserInfos } from '@services/git/interface';
+import { INewWorkspaceConfig, IWorkspace } from '@services/workspaces/interface';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
 
 /**
  * Deal with operations that needs to create a wiki and a git repo at once in a workspace
diff --git a/src/services/windows/index.ts b/src/services/windows/index.ts
index 1c185335..344229d8 100644
--- a/src/services/windows/index.ts
+++ b/src/services/windows/index.ts
@@ -1,32 +1,32 @@
 /* eslint-disable @typescript-eslint/require-await */
 /* eslint-disable @typescript-eslint/no-misused-promises */
 /* eslint-disable @typescript-eslint/consistent-type-assertions */
-import mergeDeep from 'lodash/merge';
-import { BrowserWindow, ipcMain, app, clipboard, BrowserWindowConstructorOptions, Tray, nativeImage, Menu } from 'electron';
-import { injectable } from 'inversify';
-import { menubar, Menubar } from 'menubar';
+import { app, BrowserWindow, BrowserWindowConstructorOptions, clipboard, ipcMain, Menu, nativeImage, Tray } from 'electron';
 import windowStateKeeper, { State as windowStateKeeperState } from 'electron-window-state';
+import { injectable } from 'inversify';
+import mergeDeep from 'lodash/merge';
+import { Menubar, menubar } from 'menubar';
 
-import { IBrowserViewMetaData, WindowNames, windowDimension, WindowMeta } from '@services/windows/WindowProperties';
 import serviceIdentifier from '@services/serviceIdentifier';
+import { IBrowserViewMetaData, windowDimension, WindowMeta, WindowNames } from '@services/windows/WindowProperties';
 
+import { Channels, MetaDataChannel, ViewChannel, WindowChannel } from '@/constants/channels';
+import type { IMenuService } from '@services/menu/interface';
 import type { IPreferenceService } from '@services/preferences/interface';
 import type { IWorkspaceService } from '@services/workspaces/interface';
 import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import type { IMenuService } from '@services/menu/interface';
-import { Channels, WindowChannel, MetaDataChannel, ViewChannel } from '@/constants/channels';
 
-import { i18n } from '@services/libs/i18n';
-import getViewBounds from '@services/libs/getViewBounds';
-import getFromRenderer from '@services/libs/getFromRenderer';
-import { lazyInject } from '@services/container';
-import { IWindowService } from './interface';
+import { SETTINGS_FOLDER } from '@/constants/appPaths';
 import { isTest } from '@/constants/environment';
 import { MENUBAR_ICON_PATH } from '@/constants/paths';
-import { getLocalHostUrlWithActualIP } from '@services/libs/url';
-import { SETTINGS_FOLDER } from '@/constants/appPaths';
-import { IThemeService } from '@services/theme/interface';
 import { isMac } from '@/helpers/system';
+import { lazyInject } from '@services/container';
+import getFromRenderer from '@services/libs/getFromRenderer';
+import getViewBounds from '@services/libs/getViewBounds';
+import { i18n } from '@services/libs/i18n';
+import { getLocalHostUrlWithActualIP } from '@services/libs/url';
+import { IThemeService } from '@services/theme/interface';
+import { IWindowService } from './interface';
 
 @injectable()
 export class Window implements IWindowService {
@@ -35,11 +35,20 @@ export class Window implements IWindowService {
   /** menubar version of main window, if user set openInMenubar to true in preferences */
   private mainWindowMenuBar?: Menubar;
 
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
-  @lazyInject(serviceIdentifier.MenuService) private readonly menuService!: IMenuService;
-  @lazyInject(serviceIdentifier.ThemeService) private readonly themeService!: IThemeService;
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
+
+  @lazyInject(serviceIdentifier.MenuService)
+  private readonly menuService!: IMenuService;
+
+  @lazyInject(serviceIdentifier.ThemeService)
+  private readonly themeService!: IThemeService;
 
   constructor() {
     void this.registerMenu();
@@ -113,7 +122,8 @@ export class Window implements IWindowService {
       if (recreate === true || (typeof recreate === 'function' && existedWindowMeta !== undefined && recreate(existedWindowMeta))) {
         existedWindow.close();
       } else {
-        return existedWindow.show();
+        existedWindow.show();
+        return;
       }
     }
 
@@ -145,8 +155,7 @@ export class Window implements IWindowService {
       autoHideMenuBar: false,
       // hide titleBar should not take effect on setting window
       titleBarStyle: ![WindowNames.main, WindowNames.menuBar].includes(windowName) || (await this.preferenceService.get('titleBar')) ? 'default' : 'hidden',
-      alwaysOnTop:
-        windowName === WindowNames.menuBar ? await this.preferenceService.get('menuBarAlwaysOnTop') : await this.preferenceService.get('alwaysOnTop'),
+      alwaysOnTop: windowName === WindowNames.menuBar ? await this.preferenceService.get('menuBarAlwaysOnTop') : await this.preferenceService.get('alwaysOnTop'),
       webPreferences: {
         devTools: !isTest,
         nodeIntegration: false,
@@ -208,7 +217,8 @@ export class Window implements IWindowService {
           // ensure redux is loaded first
           // if not, redux might not be able catch changes sent from ipcMain
           if (!mainWindow.webContents.isLoading()) {
-            return resolve();
+            resolve();
+            return;
           }
           mainWindow.webContents.once('did-stop-loading', () => {
             resolve();
@@ -371,12 +381,14 @@ export class Window implements IWindowService {
       // `role: 'zoom'` is only supported on macOS
       isMac
         ? {
-            role: 'zoom',
-          }
+          role: 'zoom',
+        }
         : {
-            label: 'Zoom',
-            click: async () => await this.maximize(),
+          label: 'Zoom',
+          click: async () => {
+            await this.maximize();
           },
+        },
       { role: 'resetZoom' },
       { role: 'togglefullscreen' },
       { role: 'close' },
@@ -437,7 +449,9 @@ export class Window implements IWindowService {
       {
         label: () => i18n.t('Menu.Home'),
         accelerator: 'Shift+CmdOrCtrl+H',
-        click: async () => await this.goHome(),
+        click: async () => {
+          await this.goHome();
+        },
         enabled: async () => (await this.workspaceService.countWorkspaces()) > 0,
       },
       {
@@ -553,27 +567,37 @@ export class Window implements IWindowService {
           const contextMenu = Menu.buildFromTemplate([
             {
               label: i18n.t('ContextMenu.OpenTidGi'),
-              click: async () => await this.open(WindowNames.main),
+              click: async () => {
+                await this.open(WindowNames.main);
+              },
             },
             {
               label: i18n.t('ContextMenu.OpenTidGiMenuBar'),
-              click: async () => await menuBar.showWindow(),
+              click: async () => {
+                await menuBar.showWindow();
+              },
             },
             {
               type: 'separator',
             },
             {
               label: i18n.t('ContextMenu.About'),
-              click: async () => await this.open(WindowNames.about),
+              click: async () => {
+                await this.open(WindowNames.about);
+              },
             },
             { type: 'separator' },
             {
               label: i18n.t('ContextMenu.Preferences'),
-              click: async () => await this.open(WindowNames.preferences),
+              click: async () => {
+                await this.open(WindowNames.preferences);
+              },
             },
             {
               label: i18n.t('ContextMenu.Notifications'),
-              click: async () => await this.open(WindowNames.notifications),
+              click: async () => {
+                await this.open(WindowNames.notifications);
+              },
             },
             { type: 'separator' },
             {
diff --git a/src/services/windows/interface.ts b/src/services/windows/interface.ts
index 19e9495c..05203655 100644
--- a/src/services/windows/interface.ts
+++ b/src/services/windows/interface.ts
@@ -1,7 +1,7 @@
 import { Channels, WindowChannel } from '@/constants/channels';
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { BrowserWindow } from 'electron';
-import { WindowNames, WindowMeta } from './WindowProperties';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
+import { WindowMeta, WindowNames } from './WindowProperties';
 
 /**
  * Create and manage window open and destroy, you can get all opened electron window instance here
diff --git a/src/services/workspaces/getWorkspaceMenuTemplate.ts b/src/services/workspaces/getWorkspaceMenuTemplate.ts
index e7ed8696..5f148b73 100644
--- a/src/services/workspaces/getWorkspaceMenuTemplate.ts
+++ b/src/services/workspaces/getWorkspaceMenuTemplate.ts
@@ -1,18 +1,18 @@
-import type { TFunction } from 'i18next';
-import type { MenuItemConstructorOptions } from 'electron';
-import { WindowNames } from '@services/windows/WindowProperties';
-import type { IWindowService } from '@services/windows/interface';
+import { WikiChannel } from '@/constants/channels';
 import type { IAuthenticationService } from '@services/auth/interface';
-import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import type { IWorkspace, IWorkspaceService } from './interface';
+import { IContextService } from '@services/context/interface';
+import { IGitService } from '@services/git/interface';
 import type { INativeService } from '@services/native/interface';
+import { SupportedStorageServices } from '@services/types';
 import type { IViewService } from '@services/view/interface';
 import type { IWikiService } from '@services/wiki/interface';
 import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
-import { IContextService } from '@services/context/interface';
-import { IGitService } from '@services/git/interface';
-import { SupportedStorageServices } from '@services/types';
-import { WikiChannel } from '@/constants/channels';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
+import type { IWorkspaceViewService } from '@services/workspacesView/interface';
+import type { MenuItemConstructorOptions } from 'electron';
+import type { TFunction } from 'i18next';
+import type { IWorkspace, IWorkspaceService } from './interface';
 
 interface IWorkspaceMenuRequiredServices {
   auth: Pick<IAuthenticationService, 'getStorageServiceUserInfo'>;
@@ -41,7 +41,8 @@ export async function openWorkspaceTagTiddler(workspace: IWorkspace, service: IW
   const oldActiveWorkspace = await service.workspace.getActiveWorkspace();
   // if is a new main workspace, active its browser view first
   if (!isSubWiki && idToActive !== null && idToActive !== undefined && oldActiveWorkspace?.id !== idToActive) {
-    return await service.workspaceView.setActiveWorkspaceView(idToActive);
+    await service.workspaceView.setActiveWorkspaceView(idToActive);
+    return;
   }
   // is not a new main workspace
   // open tiddler in the active view
@@ -80,11 +81,15 @@ export async function getWorkspaceMenuTemplate(
     },
     {
       label: t('WorkspaceSelector.RemoveWorkspace'),
-      click: async () => await service.wikiGitWorkspace.removeWorkspace(id),
+      click: async () => {
+        await service.wikiGitWorkspace.removeWorkspace(id);
+      },
     },
     {
       label: t('WorkspaceSelector.OpenWorkspaceFolder'),
-      click: async () => await service.native.open(wikiFolderLocation, true),
+      click: async () => {
+        await service.native.open(wikiFolderLocation, true);
+      },
     },
     {
       label: t('WorkspaceSelector.OpenWorkspaceFolderInEditor'),
@@ -140,7 +145,9 @@ export async function getWorkspaceMenuTemplate(
       },
       {
         label: t('ContextMenu.Reload'),
-        click: async () => await service.view.reloadViewsWebContents(id),
+        click: async () => {
+          await service.view.reloadViewsWebContents(id);
+        },
       },
     );
   }
@@ -150,9 +157,10 @@ export async function getWorkspaceMenuTemplate(
       label: hibernated ? t('WorkspaceSelector.WakeUpWorkspace') : t('WorkspaceSelector.HibernateWorkspace'),
       click: async () => {
         if (hibernated) {
-          return await service.workspaceView.wakeUpWorkspaceView(id);
+          await service.workspaceView.wakeUpWorkspaceView(id);
+          return;
         }
-        return await service.workspaceView.hibernateWorkspaceView(id);
+        await service.workspaceView.hibernateWorkspaceView(id);
       },
     });
   }
diff --git a/src/services/workspaces/hooks.ts b/src/services/workspaces/hooks.ts
index b224c5b7..5ed236ae 100644
--- a/src/services/workspaces/hooks.ts
+++ b/src/services/workspaces/hooks.ts
@@ -1,7 +1,7 @@
-import { useState, useMemo } from 'react';
-import { map } from 'rxjs/operators';
 import useObservable from 'beautiful-react-hooks/useObservable';
-import { IWorkspaceWithMetadata, IWorkspace } from './interface';
+import { useMemo, useState } from 'react';
+import { map } from 'rxjs/operators';
+import { IWorkspace, IWorkspaceWithMetadata } from './interface';
 import { workspaceSorter } from './utils';
 
 export function useWorkspacesListObservable(): IWorkspaceWithMetadata[] | undefined {
diff --git a/src/services/workspaces/index.ts b/src/services/workspaces/index.ts
index 74ea6bae..959b51bc 100644
--- a/src/services/workspaces/index.ts
+++ b/src/services/workspaces/index.ts
@@ -1,33 +1,33 @@
 /* eslint-disable @typescript-eslint/no-unsafe-argument */
 /* eslint-disable @typescript-eslint/require-await */
 /* eslint-disable unicorn/no-null */
-import { injectable } from 'inversify';
 import { app } from 'electron';
 import settings from 'electron-settings';
-import { pickBy, mapValues, debounce } from 'lodash';
+import fsExtra from 'fs-extra';
+import { injectable } from 'inversify';
+import Jimp from 'jimp';
+import { debounce, mapValues, pickBy } from 'lodash';
 import { nanoid } from 'nanoid';
 import path from 'path';
-import fsExtra from 'fs-extra';
-import Jimp from 'jimp';
-import { Observable, BehaviorSubject } from 'rxjs';
+import { BehaviorSubject, Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 
-import serviceIdentifier from '@services/serviceIdentifier';
-import type { IWikiService } from '@services/wiki/interface';
-import type { IViewService } from '@services/view/interface';
-import type { IWorkspaceViewService } from '@services/workspacesView/interface';
-import type { IWindowService } from '@services/windows/interface';
-import type { IMenuService } from '@services/menu/interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
-import { SupportedStorageServices } from '@services/types';
-import { lazyInject } from '@services/container';
-import type { IWorkspaceService, IWorkspace, IWorkspaceMetaData, INewWorkspaceConfig, IWorkspaceWithMetadata } from './interface';
-import { i18n } from '@services/libs/i18n';
 import { defaultServerIP } from '@/constants/urls';
-import { logger } from '@services/libs/log';
-import { workspaceSorter } from './utils';
 import { fixSettingFileWhenError } from '@/helpers/configSetting';
+import { lazyInject } from '@services/container';
+import { i18n } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
+import type { IMenuService } from '@services/menu/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import { SupportedStorageServices } from '@services/types';
+import type { IViewService } from '@services/view/interface';
+import type { IWikiService } from '@services/wiki/interface';
+import type { IWikiGitWorkspaceService } from '@services/wikiGitWorkspace/interface';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
+import type { IWorkspaceViewService } from '@services/workspacesView/interface';
+import type { INewWorkspaceConfig, IWorkspace, IWorkspaceMetaData, IWorkspaceService, IWorkspaceWithMetadata } from './interface';
+import { workspaceSorter } from './utils';
 
 // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
 const debouncedSetSettingFile = debounce(async (workspaces: Record<string, IWorkspace>) => {
@@ -48,12 +48,23 @@ export class Workspace implements IWorkspaceService {
   private workspaces: Record<string, IWorkspace> = {};
   public workspaces$: BehaviorSubject<Record<string, IWorkspaceWithMetadata>>;
 
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.View) private readonly viewService!: IViewService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
-  @lazyInject(serviceIdentifier.WikiGitWorkspace) private readonly wikiGitWorkspaceService!: IWikiGitWorkspaceService;
-  @lazyInject(serviceIdentifier.MenuService) private readonly menuService!: IMenuService;
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.View)
+  private readonly viewService!: IViewService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
+
+  @lazyInject(serviceIdentifier.WikiGitWorkspace)
+  private readonly wikiGitWorkspaceService!: IWikiGitWorkspaceService;
+
+  @lazyInject(serviceIdentifier.MenuService)
+  private readonly menuService!: IMenuService;
 
   constructor() {
     this.workspaces = this.getInitWorkspacesForCache();
@@ -174,9 +185,7 @@ export class Workspace implements IWorkspaceService {
   getInitWorkspacesForCache = (): Record<string, IWorkspace> => {
     const workspacesFromDisk = settings.getSync(`workspaces`) ?? {};
     return typeof workspacesFromDisk === 'object' && !Array.isArray(workspacesFromDisk)
-      ? mapValues(pickBy(workspacesFromDisk, (value) => value !== null) as unknown as Record<string, IWorkspace>, (workspace) =>
-          this.sanitizeWorkspace(workspace),
-        )
+      ? mapValues(pickBy(workspacesFromDisk, (value) => value !== null) as unknown as Record<string, IWorkspace>, (workspace) => this.sanitizeWorkspace(workspace))
       : {};
   };
 
@@ -292,9 +301,11 @@ export class Workspace implements IWorkspaceService {
       const { mainWikiToLink } = this.workspaces[id];
       if (typeof mainWikiToLink !== 'string') {
         throw new TypeError(
-          `mainWikiToLink is null in reactBeforeWorkspaceChanged when try to updateSubWikiPluginContent, workspacesID: ${id}\n${JSON.stringify(
-            this.workspaces,
-          )}`,
+          `mainWikiToLink is null in reactBeforeWorkspaceChanged when try to updateSubWikiPluginContent, workspacesID: ${id}\n${
+            JSON.stringify(
+              this.workspaces,
+            )
+          }`,
         );
       }
       await this.wikiService.updateSubWikiPluginContent(mainWikiToLink, newWorkspaceConfig, {
@@ -319,7 +330,7 @@ export class Workspace implements IWorkspaceService {
       }
     }
     if (currentWorkspaceIndex === 0) {
-      return workspaceList[workspaceList.length - 1];
+      return workspaceList.at(-1);
     }
     return workspaceList[currentWorkspaceIndex - 1];
   };
@@ -368,7 +379,6 @@ export class Workspace implements IWorkspaceService {
   }
 
   /**
-   *
    * @param id workspace id
    * @param sourcePicturePath image path, could be an image in app's resource folder or temp folder, we will copy it into app data folder
    */
@@ -396,7 +406,8 @@ export class Workspace implements IWorkspaceService {
     // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
     if (currentPicturePath) {
       try {
-        return await fsExtra.remove(currentPicturePath);
+        await fsExtra.remove(currentPicturePath);
+        return;
       } catch (error) {
         console.error(error);
       }
diff --git a/src/services/workspaces/interface.ts b/src/services/workspaces/interface.ts
index fe64b655..4d7f3dbb 100644
--- a/src/services/workspaces/interface.ts
+++ b/src/services/workspaces/interface.ts
@@ -1,8 +1,8 @@
-import { Observable, BehaviorSubject } from 'rxjs';
-import { SetOptional } from 'type-fest';
-import { ProxyPropertyType } from 'electron-ipc-cat/common';
 import { WorkspaceChannel } from '@/constants/channels';
 import { SupportedStorageServices } from '@services/types';
+import { ProxyPropertyType } from 'electron-ipc-cat/common';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { SetOptional } from 'type-fest';
 
 export interface IWorkspace {
   /**
diff --git a/src/services/workspacesView/index.ts b/src/services/workspacesView/index.ts
index 9b0cf700..6721adbe 100644
--- a/src/services/workspacesView/index.ts
+++ b/src/services/workspacesView/index.ts
@@ -1,40 +1,57 @@
 /* eslint-disable unicorn/no-null */
 /* eslint-disable @typescript-eslint/require-await */
 /* eslint-disable unicorn/consistent-destructuring */
-import { app, session, dialog } from 'electron';
-import { injectable } from 'inversify';
 import { delay, mapSeries } from 'bluebird';
+import { app, dialog, session } from 'electron';
+import { injectable } from 'inversify';
 
-import serviceIdentifier from '@services/serviceIdentifier';
-import { i18n } from '@services/libs/i18n';
-import type { IViewService } from '@services/view/interface';
-import type { IWorkspaceService, IWorkspace } from '@services/workspaces/interface';
-import type { IWindowService } from '@services/windows/interface';
-import type { IMenuService } from '@services/menu/interface';
-import { WindowNames } from '@services/windows/WindowProperties';
-import type { IPreferenceService } from '@services/preferences/interface';
-import { logger } from '@services/libs/log';
-import type { IAuthenticationService } from '@services/auth/interface';
-import type { IGitService } from '@services/git/interface';
-import type { IWikiService } from '@services/wiki/interface';
-import type { IInitializeWorkspaceOptions, IWorkspaceViewService } from './interface';
-import { lazyInject } from '@services/container';
-import { SupportedStorageServices } from '@services/types';
-import { WorkspaceFailedToLoadError } from './error';
 import { WikiChannel } from '@/constants/channels';
 import { tiddlywikiLanguagesMap } from '@/constants/languages';
+import type { IAuthenticationService } from '@services/auth/interface';
+import { lazyInject } from '@services/container';
+import type { IGitService } from '@services/git/interface';
+import { i18n } from '@services/libs/i18n';
+import { logger } from '@services/libs/log';
+import type { IMenuService } from '@services/menu/interface';
+import type { IPreferenceService } from '@services/preferences/interface';
+import serviceIdentifier from '@services/serviceIdentifier';
+import { SupportedStorageServices } from '@services/types';
+import type { IViewService } from '@services/view/interface';
+import type { IWikiService } from '@services/wiki/interface';
+import type { IWindowService } from '@services/windows/interface';
+import { WindowNames } from '@services/windows/WindowProperties';
+import type { IWorkspace, IWorkspaceService } from '@services/workspaces/interface';
+import { WorkspaceFailedToLoadError } from './error';
+import type { IInitializeWorkspaceOptions, IWorkspaceViewService } from './interface';
 
 @injectable()
 export class WorkspaceView implements IWorkspaceViewService {
-  @lazyInject(serviceIdentifier.Authentication) private readonly authService!: IAuthenticationService;
-  @lazyInject(serviceIdentifier.View) private readonly viewService!: IViewService;
-  @lazyInject(serviceIdentifier.Git) private readonly gitService!: IGitService;
-  @lazyInject(serviceIdentifier.Wiki) private readonly wikiService!: IWikiService;
-  @lazyInject(serviceIdentifier.Workspace) private readonly workspaceService!: IWorkspaceService;
-  @lazyInject(serviceIdentifier.Window) private readonly windowService!: IWindowService;
-  @lazyInject(serviceIdentifier.Preference) private readonly preferenceService!: IPreferenceService;
-  @lazyInject(serviceIdentifier.MenuService) private readonly menuService!: IMenuService;
-  @lazyInject(serviceIdentifier.WorkspaceView) private readonly workspaceViewService!: IWorkspaceViewService;
+  @lazyInject(serviceIdentifier.Authentication)
+  private readonly authService!: IAuthenticationService;
+
+  @lazyInject(serviceIdentifier.View)
+  private readonly viewService!: IViewService;
+
+  @lazyInject(serviceIdentifier.Git)
+  private readonly gitService!: IGitService;
+
+  @lazyInject(serviceIdentifier.Wiki)
+  private readonly wikiService!: IWikiService;
+
+  @lazyInject(serviceIdentifier.Workspace)
+  private readonly workspaceService!: IWorkspaceService;
+
+  @lazyInject(serviceIdentifier.Window)
+  private readonly windowService!: IWindowService;
+
+  @lazyInject(serviceIdentifier.Preference)
+  private readonly preferenceService!: IPreferenceService;
+
+  @lazyInject(serviceIdentifier.MenuService)
+  private readonly menuService!: IMenuService;
+
+  @lazyInject(serviceIdentifier.WorkspaceView)
+  private readonly workspaceViewService!: IWorkspaceViewService;
 
   constructor() {
     void this.registerMenu();
@@ -67,12 +84,14 @@ export class WorkspaceView implements IWorkspaceViewService {
       const hibernateUnusedWorkspacesAtLaunch = await this.preferenceService.get('hibernateUnusedWorkspacesAtLaunch');
       if ((hibernateUnusedWorkspacesAtLaunch || workspace.hibernateWhenUnused) && !workspace.active) {
         logger.debug(
-          `initializeWorkspaceView() quit because ${JSON.stringify({
-            followHibernateSettingWhenInit,
-            'workspace.hibernateWhenUnused': workspace.hibernateWhenUnused,
-            'workspace.active': workspace.active,
-            hibernateUnusedWorkspacesAtLaunch,
-          })}`,
+          `initializeWorkspaceView() quit because ${
+            JSON.stringify({
+              followHibernateSettingWhenInit,
+              'workspace.hibernateWhenUnused': workspace.hibernateWhenUnused,
+              'workspace.active': workspace.active,
+              hibernateUnusedWorkspacesAtLaunch,
+            })
+          }`,
         );
         if (!workspace.hibernated) {
           await this.workspaceService.update(workspace.id, { hibernated: true });
@@ -294,9 +313,11 @@ export class WorkspaceView implements IWorkspaceViewService {
       throw new Error(`Workspace id ${nextWorkspaceID} does not exist. When setActiveWorkspaceView().`);
     }
     logger.debug(
-      `Set active workspace oldActiveWorkspace.id: ${oldActiveWorkspace?.id ?? 'undefined'} nextWorkspaceID: ${nextWorkspaceID} newWorkspace.isSubWiki ${String(
-        newWorkspace.isSubWiki,
-      )}`,
+      `Set active workspace oldActiveWorkspace.id: ${oldActiveWorkspace?.id ?? 'undefined'} nextWorkspaceID: ${nextWorkspaceID} newWorkspace.isSubWiki ${
+        String(
+          newWorkspace.isSubWiki,
+        )
+      }`,
     );
     if (newWorkspace.isSubWiki && typeof newWorkspace.mainWikiID === 'string') {
       logger.debug(`${nextWorkspaceID} is a subwiki, set its main wiki ${newWorkspace.mainWikiID} to active instead.`);
@@ -397,9 +418,9 @@ export class WorkspaceView implements IWorkspaceViewService {
           message: i18n.t('Preference.ClearBrowsingDataMessage'),
           cancelId: 1,
         })
-        .then(({ response }) => {
+        .then(async ({ response }) => {
           if (response === 0) {
-            return this.clearBrowsingData();
+            await this.clearBrowsingData();
           }
         })
         .catch(console.error);
@@ -409,7 +430,11 @@ export class WorkspaceView implements IWorkspaceViewService {
   public async clearBrowsingData(): Promise<void> {
     await session.defaultSession.clearStorageData();
     const workspaces = await this.workspaceService.getWorkspaces();
-    await Promise.all(Object.keys(workspaces).map(async (id) => await session.fromPartition(`persist:${id}`).clearStorageData()));
+    await Promise.all(
+      Object.keys(workspaces).map(async (id) => {
+        await session.fromPartition(`persist:${id}`).clearStorageData();
+      }),
+    );
 
     // shared session
     await session.fromPartition('persist:shared').clearStorageData();
@@ -453,9 +478,11 @@ export class WorkspaceView implements IWorkspaceViewService {
     const menuBarBrowserViewWebContent = menuBarWindow?.getBrowserView()?.webContents;
     /* eslint-disable @typescript-eslint/strict-boolean-expressions */
     logger.info(
-      `realignActiveWorkspaceView: id ${workspaceToRealign?.id ?? 'undefined'} mainWindow: ${String(!!mainBrowserViewWebContent)} menuBarWindow: ${String(
-        !!menuBarBrowserViewWebContent,
-      )}`,
+      `realignActiveWorkspaceView: id ${workspaceToRealign?.id ?? 'undefined'} mainWindow: ${String(!!mainBrowserViewWebContent)} menuBarWindow: ${
+        String(
+          !!menuBarBrowserViewWebContent,
+        )
+      }`,
     );
     if (workspaceToRealign === undefined) {
       logger.warn('realignActiveWorkspaceView: no active workspace');
diff --git a/webpack.main.config.js b/webpack.main.config.js
index dba7681b..a4a1ce9f 100644
--- a/webpack.main.config.js
+++ b/webpack.main.config.js
@@ -60,13 +60,12 @@ module.exports = {
     __filename: true,
     __dirname: true,
   },
-  cache:
-    process.platform === 'darwin'
-      ? {
-          type: 'filesystem',
-          buildDependencies: {
-            config: [__filename],
-          },
-        }
-      : undefined,
+  cache: process.platform === 'darwin'
+    ? {
+      type: 'filesystem',
+      buildDependencies: {
+        config: [__filename],
+      },
+    }
+    : undefined,
 };
diff --git a/webpack.plugins.js b/webpack.plugins.js
index adcafd2d..f4acdae8 100644
--- a/webpack.plugins.js
+++ b/webpack.plugins.js
@@ -50,8 +50,8 @@ exports.main = _.compact([
   }),
   process.env.NODE_ENV === 'production' ? undefined : new WebpackBar(),
   process.env.NODE_ENV === 'production'
-    ? // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-      new BundleAnalyzerPlugin({ generateStatsFile: true, analyzerMode: 'disabled', statsFilename: '../../out/webpack-stats-main.json' })
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+    ? new BundleAnalyzerPlugin({ generateStatsFile: true, analyzerMode: 'disabled', statsFilename: '../../out/webpack-stats-main.json' })
     : undefined,
 ]);
 
@@ -78,7 +78,7 @@ exports.renderer = _.compact([
   // ),
   process.env.NODE_ENV === 'production' ? undefined : new WebpackBar(),
   process.env.NODE_ENV === 'production'
-    ? // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-      new BundleAnalyzerPlugin({ generateStatsFile: true, analyzerMode: 'disabled', statsFilename: '../../out/webpack-stats-renderer.json' })
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+    ? new BundleAnalyzerPlugin({ generateStatsFile: true, analyzerMode: 'disabled', statsFilename: '../../out/webpack-stats-renderer.json' })
     : undefined,
 ]);
diff --git a/webpack.rules.js b/webpack.rules.js
index 08b4e00b..68fb96e9 100644
--- a/webpack.rules.js
+++ b/webpack.rules.js
@@ -25,86 +25,86 @@ module.exports = [
   // eslint-disable-next-line no-constant-condition
   false && isDevelopmentOrTest
     ? {
-        test: /\.(t|j)sx?$/,
-        exclude: /(node_modules|\.webpack)/,
-        use: {
-          loader: 'esbuild-loader',
-          options: {
-            loader: 'tsx', // Or 'ts' if you don't need tsx
-            target: 'esnext',
-            // tsconfigRaw: ts.readConfigFile('tsconfig.json', ts.sys.readFile.bind(ts.sys)),
-            tsconfigRaw: JSON5.parse(fs.readFileSync('./tsconfig.json')),
-          },
+      test: /\.(t|j)sx?$/,
+      exclude: /(node_modules|\.webpack)/,
+      use: {
+        loader: 'esbuild-loader',
+        options: {
+          loader: 'tsx', // Or 'ts' if you don't need tsx
+          target: 'esnext',
+          // tsconfigRaw: ts.readConfigFile('tsconfig.json', ts.sys.readFile.bind(ts.sys)),
+          tsconfigRaw: JSON5.parse(fs.readFileSync('./tsconfig.json')),
         },
-      }
+      },
+    }
     : {
-        test: /\.(t|j)sx?$/,
-        exclude: /(node_modules|\.webpack)/,
-        use: {
-          loader: 'ts-loader',
-          options: {
-            transpileOnly: true,
-            getCustomTransformers: () => ({
-              before: [
-                styledComponentsTransformerFactory(),
-                // lodash
-                tsImportPluginFactory({
-                  style: false,
-                  libraryName: 'lodash',
-                  libraryDirectory: null,
-                  camel2DashComponentName: false,
-                }),
-                // material-ui
-                tsImportPluginFactory({
-                  libraryName: '@material-ui/core',
-                  libraryDirectory: '',
-                  camel2DashComponentName: false,
-                }),
-                // svg-icons
-                // FIXME: will cause `FolderIcon is not defined`, which cannot reproduce in MacOS and dev mode https://github.com/tiddly-gittly/TidGi-Desktop/issues/88
-                // tsImportPluginFactory({
-                //   libraryDirectory: (importName) => {
-                //     const stringVec = importName
-                //       .split(/([A-Z][a-z]+|\d*)/)
-                //       .filter((s) => s.length)
-                //       .map((s) => s.toLocaleLowerCase());
+      test: /\.(t|j)sx?$/,
+      exclude: /(node_modules|\.webpack)/,
+      use: {
+        loader: 'ts-loader',
+        options: {
+          transpileOnly: true,
+          getCustomTransformers: () => ({
+            before: [
+              styledComponentsTransformerFactory(),
+              // lodash
+              tsImportPluginFactory({
+                style: false,
+                libraryName: 'lodash',
+                libraryDirectory: null,
+                camel2DashComponentName: false,
+              }),
+              // material-ui
+              tsImportPluginFactory({
+                libraryName: '@material-ui/core',
+                libraryDirectory: '',
+                camel2DashComponentName: false,
+              }),
+              // svg-icons
+              // FIXME: will cause `FolderIcon is not defined`, which cannot reproduce in MacOS and dev mode https://github.com/tiddly-gittly/TidGi-Desktop/issues/88
+              // tsImportPluginFactory({
+              //   libraryDirectory: (importName) => {
+              //     const stringVec = importName
+              //       .split(/([A-Z][a-z]+|\d*)/)
+              //       .filter((s) => s.length)
+              //       .map((s) => s.toLocaleLowerCase());
 
-                //     return stringVec.reduce((accumulator, current, index) => {
-                //       if (index > 1) {
-                //         return `${accumulator}-${current}`;
-                //       } else if (index === 1) {
-                //         return `${accumulator}/${current}`;
-                //       }
-                //       return accumulator + current;
-                //     }, '');
-                //   },
-                //   libraryName: '@material-ui/icons',
-                //   style: false,
-                //   camel2DashComponentName: false,
-                // }),
-                // RXJS
-                tsImportPluginFactory([
-                  {
-                    libraryDirectory: '../_esm5/internal/operators',
-                    libraryName: 'rxjs/operators',
-                    camel2DashComponentName: false,
-                    transformToDefaultImport: false,
-                  },
-                  {
-                    libraryDirectory: '../_esm5/internal/observable',
-                    libraryName: 'rxjs',
-                    camel2DashComponentName: false,
-                    transformToDefaultImport: false,
-                  },
-                ]),
-              ],
-            }),
-            compilerOptions: {
-              module: 'esnext',
-            },
+              //     return stringVec.reduce((accumulator, current, index) => {
+              //       if (index > 1) {
+              //         return `${accumulator}-${current}`;
+              //       } else if (index === 1) {
+              //         return `${accumulator}/${current}`;
+              //       }
+              //       return accumulator + current;
+              //     }, '');
+              //   },
+              //   libraryName: '@material-ui/icons',
+              //   style: false,
+              //   camel2DashComponentName: false,
+              // }),
+              // RXJS
+              tsImportPluginFactory([
+                {
+                  libraryDirectory: '../_esm5/internal/operators',
+                  libraryName: 'rxjs/operators',
+                  camel2DashComponentName: false,
+                  transformToDefaultImport: false,
+                },
+                {
+                  libraryDirectory: '../_esm5/internal/observable',
+                  libraryName: 'rxjs',
+                  camel2DashComponentName: false,
+                  transformToDefaultImport: false,
+                },
+              ]),
+            ],
+          }),
+          compilerOptions: {
+            module: 'esnext',
           },
         },
       },
+    },
   {
     test: /\.(woff(2)?|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
     type: 'asset/resource',