diff --git a/.eslintignore b/.eslintignore index 7cdff179..6b0e422c 100644 --- a/.eslintignore +++ b/.eslintignore @@ -2,5 +2,5 @@ node_modules **/.next/** **/_next/** **/dist/** -./packages/client/src/tiptap/next.config.js +.eslintrc.js ./packages/client/src/tiptap/wrappers/mind/mind-elixir/iconfont/iconfont.js diff --git a/.eslintrc.client.js b/.eslintrc.client.js index f2cdd8c3..22bd7626 100644 --- a/.eslintrc.client.js +++ b/.eslintrc.client.js @@ -1,17 +1,15 @@ module.exports = { parser: '@typescript-eslint/parser', - parserOptions: { - ecmaVersion: 8, - sourceType: 'module', - ecmaFeatures: { - impliedStrict: true, - experimentalObjectRestSpread: true, - }, - allowImportExportEverywhere: true, - project: ['./packages/client/tsconfig.json'], - }, plugins: ['@typescript-eslint', 'react-hooks'], extends: ['eslint:recommended', 'plugin:react/recommended', 'plugin:@typescript-eslint/recommended', 'prettier'], + overrides: [ + { + files: ['*.ts', '*.tsx', '.js', '.jsx'], + parserOptions: { + project: ['./packages/client/tsconfig.json'], + }, + }, + ], settings: { react: { version: 'detect', diff --git a/package.json b/package.json index c328fbaf..59f1c61e 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "author": "fantasticit", "scripts": { "clean": "npx rimraf ./node_modules ./packages/**/node_modules", - "dev": "concurrently \"pnpm:dev:*\"", + "dev": "concurrently 'pnpm:dev:*'", "dev:server": "pnpm run --dir packages/server dev", "dev:client": "pnpm run --dir packages/client dev", "build": "pnpm build:server && pnpm build:client", @@ -14,17 +14,18 @@ "build:config": "pnpm run --dir packages/config build", "build:server": "pnpm run --dir packages/server build", "build:client": "pnpm run --dir packages/client build", - "start": "concurrently \"pnpm:start:*\"", + "start": "concurrently 'pnpm:start:*'", "start:server": "pnpm run --dir packages/server start", "start:client": "pnpm run --dir packages/client start", "pm2": "pnpm run pm2:server && pnpm run pm2:client", "pm2:server": "pnpm run --dir packages/server pm2", "pm2:client": "pnpm run --dir packages/client pm2", + "lint": "concurrently 'pnpm:lint:*'", "lint:client": "eslint --fix './packages/client/**/*.{ts,tsx,js,jsx}' -c '.eslintrc.client.js'", "lint:server": "eslint --fix './packages/server/src/*.{ts,js}' -c '.eslintrc.server.js'", - "format": "concurrently \"pnpm:format:*\"", - "format:ts": "prettier --write --parser typescript \"packages/**/*.{ts,tsx,js,jsx}\"", - "format:css": "stylelint --fix --formatter verbose --allow-empty-input \"packages/**/*.{css,scss,sass}\"", + "format": "concurrently 'pnpm:format:*'", + "format:ts": "prettier --write --parser typescript 'packages/**/*.{ts,tsx,js,jsx}'", + "format:css": "stylelint --fix --formatter verbose --allow-empty-input 'packages/**/*.{css,scss,sass}'", "prepare": "husky install", "precommit": "lint-staged" }, @@ -62,6 +63,12 @@ }, "lint-staged": { "*.{ts,tsx,js,jsx}": "prettier --write", + "./packages/client/**/*.{ts,tsx,js,jsx}": [ + "eslint --fix -c '.eslintrc.client.js'" + ], + "./packages/server/src/*.{ts,js}": [ + "eslint --fix -c '.eslintrc.server.js'" + ], "*.{css,scss,sass}": " stylelint --fix --formatter verbose --allow-empty-input" } } \ No newline at end of file diff --git a/packages/client/next.config.js b/packages/client/next.config.js index b5536209..8609c764 100644 --- a/packages/client/next.config.js +++ b/packages/client/next.config.js @@ -1,14 +1,16 @@ -/* eslint-disable */ +/* eslint-env es6 */ +const semi = require('@douyinfe/semi-next').default({}); const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); const { getConfig } = require('@think/config'); const config = getConfig(); -const nextConfig = require('@douyinfe/semi-next').default({})({ +/** @type {import('next').NextConfig} */ +const nextConfig = semi({ assetPrefix: config.assetPrefix, env: { - SERVER_API_URL: config?.client?.apiUrl, - COLLABORATION_API_URL: config?.client?.collaborationUrl, - ENABLE_ALIYUN_OSS: !!config?.oss?.aliyun?.accessKeyId, + SERVER_API_URL: config.client.apiUrl, + COLLABORATION_API_URL: config.client.collaborationUrl, + ENABLE_ALIYUN_OSS: !!config.oss.aliyun.accessKeyId, }, webpack: (config, { dev, isServer }) => { config.resolve.plugins.push(new TsconfigPathsPlugin()); diff --git a/packages/client/src/components/document/editor/editor.tsx b/packages/client/src/components/document/editor/editor.tsx index 21a0e9e0..5a899fc5 100644 --- a/packages/client/src/components/document/editor/editor.tsx +++ b/packages/client/src/components/document/editor/editor.tsx @@ -37,7 +37,6 @@ interface IProps { } export const Editor: React.FC = ({ user: currentUser, documentId, authority, className, style }) => { - if (!currentUser) return null; const $hasShowUserSettingModal = useRef(false); const { users, addUser, updateUser } = useCollaborationDocument(documentId); const [status, setStatus] = useState('connecting'); @@ -64,7 +63,7 @@ export const Editor: React.FC = ({ user: currentUser, documentId, author }, }, }); - }, [documentId, currentUser.token]); + }, [documentId, currentUser, toggleLoading]); const editor = useEditor({ editable: authority && authority.editable, extensions: [ @@ -77,7 +76,9 @@ export const Editor: React.FC = ({ user: currentUser, documentId, author try { const title = transaction.doc.content.firstChild.content.firstChild.textContent; triggerChangeDocumentTitle(title); - } catch (e) {} + } catch (e) { + // + } }, 50), }); const [mentionUsersSettingVisible, toggleMentionUsersSettingVisible] = useToggle(false); @@ -98,7 +99,7 @@ export const Editor: React.FC = ({ user: currentUser, documentId, author destoryProvider(provider, 'EDITOR'); destoryIndexdbProvider(documentId); }; - }, []); + }, [documentId, provider]); useEffect(() => { if (!editor) return; @@ -157,7 +158,7 @@ export const Editor: React.FC = ({ user: currentUser, documentId, author Router.events.off('routeChangeStart', handler); window.removeEventListener('unload', handler); }; - }, [editor, users, currentUser]); + }, [editor, users, currentUser, toggleMentionUsersSettingVisible]); useEffect(() => { const listener = (event: KeyboardEvent) => { diff --git a/packages/client/src/components/document/editor/index.tsx b/packages/client/src/components/document/editor/index.tsx index b11bb67e..406c3af2 100644 --- a/packages/client/src/components/document/editor/index.tsx +++ b/packages/client/src/components/document/editor/index.tsx @@ -27,7 +27,6 @@ interface IProps { } export const DocumentEditor: React.FC = ({ documentId }) => { - if (!documentId) return null; const { width: windowWith } = useWindowSize(); const { width, fontSize } = useDocumentStyle(); const editorWrapClassNames = useMemo(() => { @@ -42,7 +41,7 @@ export const DocumentEditor: React.FC = ({ documentId }) => { Router.push({ pathname: `/wiki/${document.wikiId}/document/${documentId}`, }); - }, [document]); + }, [document, documentId]); const DocumentTitle = ( <> diff --git a/packages/client/src/components/document/reader/editor.tsx b/packages/client/src/components/document/reader/editor.tsx index 1b9bbd4c..e43cf288 100644 --- a/packages/client/src/components/document/reader/editor.tsx +++ b/packages/client/src/components/document/reader/editor.tsx @@ -49,7 +49,7 @@ export const Editor: React.FC = ({ user, documentId, document, children }, }, }); - }, [documentId, user.token]); + }, [documentId, user, toggleLoading]); const editor = useEditor({ editable: false, extensions: [ @@ -68,7 +68,7 @@ export const Editor: React.FC = ({ user, documentId, document, children return () => { destoryProvider(provider, 'READER'); }; - }, []); + }, [provider]); return ( = ({ documentId, hideLogo = hasCancel: false, maskClosable: false, onOk() { - const $input = document.querySelector('#js-share-document-password') as HTMLInputElement; + const $input = document.querySelector('#js-share-document-password'); query($input.value); }, }); diff --git a/packages/client/src/components/image-viewer.tsx b/packages/client/src/components/image-viewer.tsx index 4e25c693..e9c4a832 100644 --- a/packages/client/src/components/image-viewer.tsx +++ b/packages/client/src/components/image-viewer.tsx @@ -12,7 +12,7 @@ export const ImageViewer: React.FC = ({ container, containerSelector }) if (!el) { return null; } - const viewer = new Viewer(el as HTMLElement, { inline: false }); + const viewer = new Viewer(el, { inline: false }); const io = new MutationObserver(() => { viewer.update(); }); diff --git a/packages/client/src/components/message/index.tsx b/packages/client/src/components/message/index.tsx index a030ccf8..90fe1ddb 100644 --- a/packages/client/src/components/message/index.tsx +++ b/packages/client/src/components/message/index.tsx @@ -117,25 +117,32 @@ const MessageBox = () => { Notification.info({ title: '消息通知', content: ( - - -
- - {msg.title} - -
- - + <> +
+ + {msg.title} + +
+
+ + + + 查看详情 + + + +
+ ), - duration: 3, + showClose: true, onHookClose() { readMessage(msg.id); }, diff --git a/packages/client/src/tiptap/menubar.tsx b/packages/client/src/tiptap/menubar.tsx index ff836efc..a77c1867 100644 --- a/packages/client/src/tiptap/menubar.tsx +++ b/packages/client/src/tiptap/menubar.tsx @@ -43,11 +43,7 @@ import { Iframe } from './menus/iframe'; import { Table } from './menus/table'; import { Mind } from './menus/mind'; -export const MenuBar: React.FC<{ editor: any }> = ({ editor }) => { - if (!editor) { - return null; - } - +const _MenuBar: React.FC<{ editor: any }> = ({ editor }) => { return (
@@ -87,8 +83,8 @@ export const MenuBar: React.FC<{ editor: any }> = ({ editor }) => { -
+ @@ -107,11 +103,11 @@ export const MenuBar: React.FC<{ editor: any }> = ({ editor }) => { ); }; -export const CommentMenuBar: React.FC<{ editor: any }> = ({ editor }) => { - if (!editor) { - return null; - } +export const MenuBar = React.memo(_MenuBar, (prevProps, nextProps) => { + return prevProps.editor === nextProps.editor; +}); +const _CommentMenuBar: React.FC<{ editor: any }> = ({ editor }) => { return ( <> @@ -135,3 +131,7 @@ export const CommentMenuBar: React.FC<{ editor: any }> = ({ editor }) => { ); }; + +export const CommentMenuBar = React.memo(_CommentMenuBar, (prevProps, nextProps) => { + return prevProps.editor === nextProps.editor; +}); diff --git a/packages/client/src/tiptap/menus/background-color/index.tsx b/packages/client/src/tiptap/menus/background-color/index.tsx index 3246012a..8ff80163 100644 --- a/packages/client/src/tiptap/menus/background-color/index.tsx +++ b/packages/client/src/tiptap/menus/background-color/index.tsx @@ -9,10 +9,6 @@ import { ColorPicker } from '../_components/color-picker'; export const BackgroundColor: React.FC<{ editor: Editor }> = ({ editor }) => { const { backgroundColor } = editor.getAttributes('textStyle'); - if (!editor) { - return null; - } - return ( { diff --git a/packages/client/src/tiptap/menus/bold/index.tsx b/packages/client/src/tiptap/menus/bold/index.tsx index 6c10c658..16c32fdf 100644 --- a/packages/client/src/tiptap/menus/bold/index.tsx +++ b/packages/client/src/tiptap/menus/bold/index.tsx @@ -6,10 +6,6 @@ import { Tooltip } from 'components/tooltip'; import { isTitleActive } from 'tiptap/prose-utils'; export const Bold: React.FC<{ editor: Editor }> = ({ editor }) => { - if (!editor) { - return null; - } - return (