@seafile/comment-editor 0.0.1-alpha.2 → 0.0.1-alpha.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/basic-sdk/assets/css/layout.css +1 -45
- package/dist/basic-sdk/comment/utils.js +39 -0
- package/dist/basic-sdk/context.js +2 -1
- package/dist/basic-sdk/editor/comment-editor.css +138 -0
- package/dist/basic-sdk/{comment/components → editor}/comment-editor.js +43 -33
- package/dist/basic-sdk/extension/plugins/image/helpers.js +1 -1
- package/dist/basic-sdk/extension/plugins/image/use-copy-image.js +1 -1
- package/dist/basic-sdk/extension/plugins/image/use-upload-image.js +1 -1
- package/dist/basic-sdk/extension/plugins/text-style/menu/index.js +1 -2
- package/dist/basic-sdk/hooks/use-comment.js +16 -183
- package/dist/basic-sdk/index.js +3 -10
- package/dist/index.js +0 -12
- package/dist/pages/seafile-comment-editor.js +34 -14
- package/package.json +1 -1
- package/dist/assets/css/plugin-editor.css +0 -7
- package/dist/assets/css/simple-viewer.css +0 -6
- package/dist/basic-sdk/comment/components/comment-all-participants/index.css +0 -83
- package/dist/basic-sdk/comment/components/comment-all-participants/index.js +0 -67
- package/dist/basic-sdk/comment/components/comment-all-participants/participant-avatar.js +0 -43
- package/dist/basic-sdk/comment/components/comment-context-menu/index.css +0 -16
- package/dist/basic-sdk/comment/components/comment-context-menu/index.js +0 -43
- package/dist/basic-sdk/comment/components/comment-context-menu/menu-item.js +0 -57
- package/dist/basic-sdk/comment/components/comment-delete-popover.js +0 -80
- package/dist/basic-sdk/comment/components/comment-item-collapse-wrapper.js +0 -160
- package/dist/basic-sdk/comment/components/comment-item-content.js +0 -154
- package/dist/basic-sdk/comment/components/comment-item-reply.js +0 -124
- package/dist/basic-sdk/comment/components/comment-item-resolved-reply.js +0 -38
- package/dist/basic-sdk/comment/components/comment-item-wrapper.js +0 -364
- package/dist/basic-sdk/comment/components/comment-list.css +0 -422
- package/dist/basic-sdk/comment/components/comment-list.js +0 -216
- package/dist/basic-sdk/comment/components/comment-operation/index.css +0 -26
- package/dist/basic-sdk/comment/components/comment-operation/index.js +0 -31
- package/dist/basic-sdk/comment/components/comment-participants-editor/index.css +0 -132
- package/dist/basic-sdk/comment/components/comment-participants-editor/index.js +0 -69
- package/dist/basic-sdk/comment/components/comment-participants-editor/searched-collaborators.js +0 -62
- package/dist/basic-sdk/comment/components/comment-participants-editor/selected-participants.js +0 -48
- package/dist/basic-sdk/comment/components/editor-comment.js +0 -183
- package/dist/basic-sdk/comment/components/elements-comment-count/element-comment-count.js +0 -64
- package/dist/basic-sdk/comment/components/elements-comment-count/index.css +0 -29
- package/dist/basic-sdk/comment/components/elements-comment-count/index.js +0 -49
- package/dist/basic-sdk/comment/components/global-comment/global-comment-body-header.js +0 -88
- package/dist/basic-sdk/comment/components/global-comment/global-comment-header.js +0 -89
- package/dist/basic-sdk/comment/components/global-comment/index.css +0 -328
- package/dist/basic-sdk/comment/components/global-comment/index.js +0 -217
- package/dist/basic-sdk/comment/components/index.js +0 -21
- package/dist/basic-sdk/comment/components/style.css +0 -40
- package/dist/basic-sdk/comment/helper.js +0 -184
- package/dist/basic-sdk/comment/hooks/comment-hooks/use-comment-context.js +0 -20
- package/dist/basic-sdk/comment/hooks/comment-hooks/use-comment-list.js +0 -45
- package/dist/basic-sdk/comment/hooks/comment-hooks/use-comment-mount.js +0 -57
- package/dist/basic-sdk/comment/hooks/notification-hooks/index.js +0 -25
- package/dist/basic-sdk/comment/hooks/notification-hooks/use-notification-context.js +0 -20
- package/dist/basic-sdk/comment/hooks/notification-hooks/use-notification-mount.js +0 -70
- package/dist/basic-sdk/comment/hooks/use-participants.js +0 -26
- package/dist/basic-sdk/comment/index.js +0 -21
- package/dist/basic-sdk/comment/reducer/comment-reducer.js +0 -353
- package/dist/basic-sdk/comment/reducer/notification-reducer.js +0 -89
- package/dist/basic-sdk/comment/utils/get-event-transfer.js +0 -77
- package/dist/basic-sdk/comment/utils/index.js +0 -281
- package/dist/basic-sdk/comment/utils/notification-utils.js +0 -62
- package/dist/basic-sdk/layout/comment-layout/index.css +0 -15
- package/dist/basic-sdk/layout/comment-layout/index.js +0 -87
- package/dist/basic-sdk/layout/comment-layout/resize-width/index.css +0 -38
- package/dist/basic-sdk/layout/comment-layout/resize-width/index.js +0 -132
- package/dist/basic-sdk/layout/editor-container.js +0 -32
- package/dist/basic-sdk/layout/index.js +0 -13
- package/dist/basic-sdk/socket/helpers.js +0 -299
- package/dist/basic-sdk/socket/index.js +0 -20
- package/dist/basic-sdk/socket/socket-client.js +0 -211
- package/dist/basic-sdk/socket/socket-manager.js +0 -386
- package/dist/basic-sdk/socket/with-socket-io.js +0 -73
- /package/dist/basic-sdk/comment/{constants/index.js → constants.js} +0 -0
|
@@ -113,48 +113,4 @@
|
|
|
113
113
|
margin: 0 auto;
|
|
114
114
|
padding-top: 20px;
|
|
115
115
|
padding-bottom: 20px;
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
/* article style --> ./sdoc-editor-article.css */
|
|
119
|
-
|
|
120
|
-
.sdoc-editor-container .seafile-block-container {
|
|
121
|
-
position: relative;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
.sdoc-editor-container .seafile-block-container .comment-count {
|
|
125
|
-
position: absolute;
|
|
126
|
-
right: -55px;
|
|
127
|
-
top: 0px;
|
|
128
|
-
border-radius: 4px;
|
|
129
|
-
width: 15px;
|
|
130
|
-
height: 15px;
|
|
131
|
-
line-height: 18px;
|
|
132
|
-
pointer-events: none;
|
|
133
|
-
display: flex;
|
|
134
|
-
align-items: center;
|
|
135
|
-
justify-content: center;
|
|
136
|
-
color: #fff;
|
|
137
|
-
background: rgba(0, 0, 0, .3);
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
.sdoc-editor-container .seafile-block-container .comment-count__btn {
|
|
141
|
-
font-size: 12px;
|
|
142
|
-
transform: scale(.75);
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
.comment-editor-toolbar {
|
|
146
|
-
display: flex;
|
|
147
|
-
justify-content: space-between;
|
|
148
|
-
align-items: center;
|
|
149
|
-
height: 32px;
|
|
150
|
-
user-select: none;
|
|
151
|
-
border-top: 1px solid #e5e6e8;
|
|
152
|
-
z-index: 102;
|
|
153
|
-
margin: 0 8px;
|
|
154
|
-
margin-top: 5px;
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
.comment-editor-menu-group {
|
|
158
|
-
border-right: none;
|
|
159
|
-
padding-left: 0 !important;
|
|
160
|
-
}
|
|
116
|
+
}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.searchCollaborators = void 0;
|
|
7
|
+
var _helper = require("../extension/plugins/mention/helper");
|
|
8
|
+
const searchCollaborators = (collaborators, searchValue, editor) => {
|
|
9
|
+
const validSearchValue = searchValue ? searchValue.trim().toLowerCase() : '';
|
|
10
|
+
const validCollaborators = Array.isArray(collaborators) && collaborators.length > 0 ? collaborators : [];
|
|
11
|
+
if (!validSearchValue) return validCollaborators;
|
|
12
|
+
|
|
13
|
+
// The current character is '@' and the previous character is a null character
|
|
14
|
+
const beforeStr = (0, _helper.getPreCharacters)(editor);
|
|
15
|
+
const isEmptyStr = beforeStr.slice(-2, -1).trim().length === 0;
|
|
16
|
+
if (beforeStr.slice(-1) === '@' && isEmptyStr) {
|
|
17
|
+
return validCollaborators;
|
|
18
|
+
}
|
|
19
|
+
return validCollaborators.filter(collaborator => {
|
|
20
|
+
const {
|
|
21
|
+
name,
|
|
22
|
+
name_pinyin = ''
|
|
23
|
+
} = collaborator;
|
|
24
|
+
if (name.toString().toLowerCase().indexOf(validSearchValue) > -1) return true;
|
|
25
|
+
if (!name_pinyin) return false;
|
|
26
|
+
const validNamePinyin = name_pinyin.toString().toLowerCase();
|
|
27
|
+
const validSearchPinyinValue = validSearchValue.replace(/ |'/g, '');
|
|
28
|
+
|
|
29
|
+
// complete: For example, seatable can be retrieved when searching for sea.
|
|
30
|
+
if (validNamePinyin.indexOf(validSearchPinyinValue) > -1) return true;
|
|
31
|
+
if (validNamePinyin.replace(/'/g, '').indexOf(validSearchPinyinValue) > -1) return true;
|
|
32
|
+
const validNamePinyinList = validNamePinyin.split('\'');
|
|
33
|
+
// acronym: For example, sea table can be retrieved when searching for st.
|
|
34
|
+
const namePinyinAcronym = validNamePinyinList.map(item => item && item.trim() ? item.trim().slice(0, 1) : '');
|
|
35
|
+
if (namePinyinAcronym.join('').indexOf(validSearchPinyinValue) > -1) return true;
|
|
36
|
+
return false;
|
|
37
|
+
});
|
|
38
|
+
};
|
|
39
|
+
exports.searchCollaborators = searchCollaborators;
|
|
@@ -55,8 +55,9 @@ class Context {
|
|
|
55
55
|
this.api = null;
|
|
56
56
|
this.config = null;
|
|
57
57
|
}
|
|
58
|
-
init() {
|
|
58
|
+
init(api) {
|
|
59
59
|
this.initSettings(); // lazy init context class
|
|
60
|
+
this.api = api;
|
|
60
61
|
// const server = this.getSetting('serviceUrl');
|
|
61
62
|
// const token = this.getSetting('accessToken');
|
|
62
63
|
// this.api = new SeafileAPI(server, token);
|
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
.comment-editor-wrapper {
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-direction: column;
|
|
4
|
+
justify-content: center;
|
|
5
|
+
cursor: text;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
.comment-editor-wrapper .comment-editor-container {
|
|
9
|
+
flex: 1;
|
|
10
|
+
display: flex;
|
|
11
|
+
flex-direction: column;
|
|
12
|
+
min-height: 0;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.comment-editor-wrapper .comment-editor-content {
|
|
16
|
+
border: 1px solid #ececec;
|
|
17
|
+
border-radius: 3px;
|
|
18
|
+
transition: border-color .3s ease;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.comment-editor-wrapper .comment-editor-content:focus-within {
|
|
22
|
+
border-color: #ff8e03;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
/* comment-editor */
|
|
26
|
+
.comment-editor-wrapper .comment-editor-content .article.comment-editor {
|
|
27
|
+
width: 100%;
|
|
28
|
+
padding: 8px;
|
|
29
|
+
padding-bottom: 0;
|
|
30
|
+
min-height: 60px;
|
|
31
|
+
max-height: 130px;
|
|
32
|
+
box-shadow: none;
|
|
33
|
+
overflow-y: auto;
|
|
34
|
+
overflow-x: hidden;
|
|
35
|
+
border: none;
|
|
36
|
+
background-color: transparent;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.comment-editor-wrapper .comment-editor-content .article.comment-editor :first-child {
|
|
40
|
+
margin-top: 0 !important;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.comment-editor-wrapper .comment-editor:empty:before {
|
|
44
|
+
content: attr(placeholder);
|
|
45
|
+
opacity: .6;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.comment-editor-wrapper .comment-editor:focus-visible {
|
|
49
|
+
outline: none;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.comment-editor-wrapper .comment-editor:focus {
|
|
53
|
+
border: 1px solid rgba(0, 0, 0, .12);
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.comment-editor-wrapper .comment-editor-user-info {
|
|
57
|
+
display: flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
margin-bottom: 10px;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.comment-editor-wrapper .comment-editor-user-info .comment-editor-user-img {
|
|
63
|
+
height: 30px;
|
|
64
|
+
width: 30px;
|
|
65
|
+
border-radius: 50%;
|
|
66
|
+
overflow: hidden;
|
|
67
|
+
margin-right: 8px;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.comment-editor-wrapper .comment-editor-user-info .comment-editor-user-name {
|
|
71
|
+
flex: 1;
|
|
72
|
+
overflow: hidden;
|
|
73
|
+
text-overflow: ellipsis;
|
|
74
|
+
white-space: nowrap;
|
|
75
|
+
user-select: none;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.comment-editor-wrapper .comment-operations {
|
|
79
|
+
display: flex;
|
|
80
|
+
justify-content: flex-end;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
/* comment-editor-toolbar */
|
|
84
|
+
.comment-editor-wrapper .comment-editor-toolbar {
|
|
85
|
+
display: flex;
|
|
86
|
+
justify-content: space-between;
|
|
87
|
+
align-items: center;
|
|
88
|
+
height: 32px;
|
|
89
|
+
user-select: none;
|
|
90
|
+
z-index: 102;
|
|
91
|
+
margin: 0 8px;
|
|
92
|
+
margin-top: 5px;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.comment-editor-wrapper .comment-editor-toolbar .comment-editor-menu-group {
|
|
96
|
+
border-right: none !important;
|
|
97
|
+
padding-left: 0 !important;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.comment-editor-wrapper .comment-editor-toolbar .menu-group {
|
|
101
|
+
height: 100%;
|
|
102
|
+
padding: 6px 0 6px 8px;
|
|
103
|
+
font-size: 0.75rem;
|
|
104
|
+
border-right: 1px solid #e5e6e8;
|
|
105
|
+
border-radius: 0 !important;
|
|
106
|
+
color: #444;
|
|
107
|
+
display: flex;
|
|
108
|
+
align-items: center;
|
|
109
|
+
justify-content: center;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.comment-editor-wrapper .comment-editor-toolbar .menu-group .menu-group-item {
|
|
113
|
+
width: 24px;
|
|
114
|
+
height: 24px;
|
|
115
|
+
line-height: 24px;
|
|
116
|
+
margin-right: 8px;
|
|
117
|
+
border: none !important;
|
|
118
|
+
color: #444;
|
|
119
|
+
background-color: transparent;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.comment-editor-wrapper .comment-editor-toolbar .menu-group .menu-group-item:disabled {
|
|
123
|
+
color: #BDBDBD;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.comment-editor-wrapper .comment-editor-toolbar .menu-group .menu-group-item:hover {
|
|
127
|
+
background-color: #F2F2F2;
|
|
128
|
+
border-radius: 2px;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.comment-editor-wrapper .comment-editor-toolbar .menu-group .menu-group-item[data-active='true'] {
|
|
132
|
+
color: #eb8205;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
.comment-editor-wrapper .comment-editor-toolbar .menu-group .menu-group-item .sdocfont,
|
|
136
|
+
.sdoc-menu-with-dropdown .sdoc-menu-with-dropdown-icon .sdocfont {
|
|
137
|
+
font-size: 12px;
|
|
138
|
+
}
|
|
@@ -13,23 +13,23 @@ var _slateReact = require("@seafile/slate-react");
|
|
|
13
13
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
14
14
|
var _isHotkey = _interopRequireDefault(require("is-hotkey"));
|
|
15
15
|
var _scrollIntoViewIfNeeded = _interopRequireDefault(require("scroll-into-view-if-needed"));
|
|
16
|
-
var _constants = require("
|
|
17
|
-
var
|
|
18
|
-
var
|
|
19
|
-
var
|
|
20
|
-
var
|
|
21
|
-
var _constants2 = require("
|
|
22
|
-
var _core = require("
|
|
23
|
-
var _renderCommentEditorElement = _interopRequireDefault(require("
|
|
24
|
-
var _commentEditorToolbar = _interopRequireDefault(require("
|
|
25
|
-
var _useComment = require("
|
|
26
|
-
var _useScrollContext = require("
|
|
27
|
-
var
|
|
28
|
-
var
|
|
29
|
-
var
|
|
30
|
-
var
|
|
31
|
-
var
|
|
32
|
-
|
|
16
|
+
var _constants = require("../constants");
|
|
17
|
+
var _useCursors = require("../cursor/use-cursors");
|
|
18
|
+
var _decorates = require("../decorates");
|
|
19
|
+
var _extension = require("../extension");
|
|
20
|
+
var _insertElementDialog = _interopRequireDefault(require("../extension/commons/insert-element-dialog"));
|
|
21
|
+
var _constants2 = require("../extension/constants");
|
|
22
|
+
var _core = require("../extension/core");
|
|
23
|
+
var _renderCommentEditorElement = _interopRequireDefault(require("../extension/render/render-comment-editor-element"));
|
|
24
|
+
var _commentEditorToolbar = _interopRequireDefault(require("../extension/toolbar/comment-editor-toolbar"));
|
|
25
|
+
var _useComment = require("../hooks/use-comment");
|
|
26
|
+
var _useScrollContext = require("../hooks/use-scroll-context");
|
|
27
|
+
var _nodeId = _interopRequireDefault(require("../node-id"));
|
|
28
|
+
var _mdToSlate = _interopRequireDefault(require("../slate-convert/md-to-slate"));
|
|
29
|
+
var _slateToMd = _interopRequireDefault(require("../slate-convert/slate-to-md"));
|
|
30
|
+
var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
|
|
31
|
+
var _eventHandler = _interopRequireDefault(require("../utils/event-handler"));
|
|
32
|
+
require("./comment-editor.css");
|
|
33
33
|
const getSubmitTip = (type, content) => {
|
|
34
34
|
if (content) return 'Save';
|
|
35
35
|
return type === 'comment' ? 'Comment' : 'Reply';
|
|
@@ -37,29 +37,29 @@ const getSubmitTip = (type, content) => {
|
|
|
37
37
|
const DEFAULT_PLACEHOLDER = 'Enter_comment_shift_enter_for_new_line_Enter_to_send';
|
|
38
38
|
const CommentEditor = _ref => {
|
|
39
39
|
let {
|
|
40
|
-
type,
|
|
41
|
-
className,
|
|
42
40
|
content,
|
|
43
|
-
commentContent,
|
|
44
41
|
placeholder = DEFAULT_PLACEHOLDER,
|
|
45
42
|
insertContent,
|
|
43
|
+
// add
|
|
46
44
|
updateContent,
|
|
45
|
+
// edit
|
|
46
|
+
onContentChange,
|
|
47
47
|
setIsEditing,
|
|
48
48
|
hiddenComment,
|
|
49
49
|
hiddenUserInfo,
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
closeComment
|
|
50
|
+
closeComment,
|
|
51
|
+
addParticipants
|
|
53
52
|
} = _ref;
|
|
54
53
|
const commentWrapperRef = (0, _react.useRef)();
|
|
55
54
|
const {
|
|
56
55
|
t
|
|
57
56
|
} = (0, _reactI18next.useTranslation)('sdoc-editor');
|
|
58
57
|
const {
|
|
59
|
-
|
|
58
|
+
className,
|
|
59
|
+
userInfo,
|
|
60
|
+
type
|
|
60
61
|
} = (0, _useComment.useComment)();
|
|
61
62
|
const submitTip = (0, _react.useMemo)(() => getSubmitTip(type, content), [content, type]);
|
|
62
|
-
const userInfo = _context.default.getUserInfo();
|
|
63
63
|
const document = (0, _react.useMemo)(() => {
|
|
64
64
|
const cursor = {};
|
|
65
65
|
let elements = null;
|
|
@@ -99,7 +99,9 @@ const CommentEditor = _ref => {
|
|
|
99
99
|
const onSubmit = (0, _react.useCallback)(event => {
|
|
100
100
|
event && event.stopPropagation();
|
|
101
101
|
const mdString = (0, _slateToMd.default)(editor.children);
|
|
102
|
-
|
|
102
|
+
if (mdString && mdString.trim()) insertContent(mdString);
|
|
103
|
+
// updateValue(mdString);
|
|
104
|
+
|
|
103
105
|
addParticipants(userInfo.username);
|
|
104
106
|
editor.children = [(0, _core.generateEmptyElement)(_constants2.PARAGRAPH, {
|
|
105
107
|
placeholder
|
|
@@ -107,11 +109,13 @@ const CommentEditor = _ref => {
|
|
|
107
109
|
_slate.Transforms.select(editor, _slate.Editor.start(editor, []));
|
|
108
110
|
onContentChange && onContentChange(null);
|
|
109
111
|
closeComment && closeComment();
|
|
110
|
-
}, [editor,
|
|
112
|
+
}, [editor, insertContent, addParticipants, userInfo.username, placeholder, onContentChange, closeComment]);
|
|
111
113
|
const onSubmitByEnterKey = (0, _react.useCallback)(event => {
|
|
112
114
|
if (!_slateReact.ReactEditor.isFocused(editor)) return;
|
|
113
115
|
onSubmit(event);
|
|
114
116
|
}, [editor, onSubmit]);
|
|
117
|
+
|
|
118
|
+
// addEventListener
|
|
115
119
|
(0, _react.useEffect)(() => {
|
|
116
120
|
const eventBus = _eventBus.default.getInstance();
|
|
117
121
|
const unsubscribePostComment = eventBus.subscribe(_constants.INTERNAL_EVENT.COMMENT_EDITOR_POST_COMMENT, onSubmitByEnterKey);
|
|
@@ -141,21 +145,23 @@ const CommentEditor = _ref => {
|
|
|
141
145
|
hiddenComment && hiddenComment(false);
|
|
142
146
|
if (onContentChange) {
|
|
143
147
|
if (editor.children.find(n => _slate.Node.string(n).trim())) {
|
|
148
|
+
console.log(11);
|
|
144
149
|
onContentChange((0, _slateToMd.default)(editor.children));
|
|
145
150
|
} else {
|
|
151
|
+
console.log(22);
|
|
146
152
|
onContentChange(null);
|
|
147
153
|
}
|
|
148
154
|
}
|
|
149
155
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
150
156
|
}, [setIsEditing]);
|
|
157
|
+
|
|
158
|
+
// set editor children
|
|
151
159
|
(0, _react.useEffect)(() => {
|
|
152
160
|
let children = (0, _mdToSlate.default)(content);
|
|
153
|
-
|
|
154
|
-
children = (0, _mdToSlate.default)(commentContent);
|
|
155
|
-
}
|
|
161
|
+
console.log('children', children);
|
|
156
162
|
editor.children = children;
|
|
157
163
|
_slate.Transforms.select(editor, _slate.Editor.end(editor, []));
|
|
158
|
-
}, [editor, content
|
|
164
|
+
}, [editor, content]);
|
|
159
165
|
|
|
160
166
|
// useMount: focus editor
|
|
161
167
|
(0, _react.useEffect)(() => {
|
|
@@ -239,7 +245,9 @@ const CommentEditor = _ref => {
|
|
|
239
245
|
width: "100%"
|
|
240
246
|
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
241
247
|
className: "comment-editor-user-name"
|
|
242
|
-
}, userInfo.name)), /*#__PURE__*/_react.default.createElement(
|
|
248
|
+
}, userInfo.name)), /*#__PURE__*/_react.default.createElement("div", {
|
|
249
|
+
className: "comment-editor-container"
|
|
250
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
243
251
|
className: "comment-editor-content"
|
|
244
252
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
245
253
|
ref: commentEditorContainerRef,
|
|
@@ -276,6 +284,8 @@ const CommentEditor = _ref => {
|
|
|
276
284
|
onSubmit: onSubmit,
|
|
277
285
|
submitBtnText: t(submitTip),
|
|
278
286
|
onCancel: onCancel
|
|
279
|
-
})))
|
|
287
|
+
}))), /*#__PURE__*/_react.default.createElement(_insertElementDialog.default, {
|
|
288
|
+
editor: editor
|
|
289
|
+
}));
|
|
280
290
|
};
|
|
281
291
|
var _default = exports.default = CommentEditor;
|
|
@@ -291,7 +291,7 @@ const handleBase64Image = (editor, path, imgData) => {
|
|
|
291
291
|
const file = new File([blob], `${_slugid.default.nice()}.jpg`, {
|
|
292
292
|
type: unit8Array.mime
|
|
293
293
|
});
|
|
294
|
-
_context.default.uploadLocalImage([file]).then(res => {
|
|
294
|
+
_context.default.api.uploadLocalImage([file]).then(res => {
|
|
295
295
|
const _data = {
|
|
296
296
|
...imgData,
|
|
297
297
|
src: res[0]
|
|
@@ -51,7 +51,7 @@ const useCopyImage = _ref => {
|
|
|
51
51
|
const file = new File([blob], 'downloaded_image.png', {
|
|
52
52
|
type: blob.type
|
|
53
53
|
});
|
|
54
|
-
const imageUrl = await _context.default.uploadLocalImage([file]);
|
|
54
|
+
const imageUrl = await _context.default.api.uploadLocalImage([file]);
|
|
55
55
|
if (imageUrl && imageUrl[0]) {
|
|
56
56
|
updateImageNode(editor, element, imageUrl[0]);
|
|
57
57
|
}
|
|
@@ -42,7 +42,7 @@ const useUploadImage = _ref => {
|
|
|
42
42
|
const uploadCurrentImage = async () => {
|
|
43
43
|
try {
|
|
44
44
|
const fileItem = _imageCache.default.getImage(file_uuid);
|
|
45
|
-
const imageUrl = await _context.default.uploadLocalImage([fileItem]);
|
|
45
|
+
const imageUrl = await _context.default.api.uploadLocalImage([fileItem]);
|
|
46
46
|
if (imageUrl && imageUrl[0]) {
|
|
47
47
|
updateImageNode(editor, element, imageUrl[0]);
|
|
48
48
|
}
|
|
@@ -9,7 +9,6 @@ exports.default = void 0;
|
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _reactI18next = require("react-i18next");
|
|
11
11
|
var _slate = require("@seafile/slate");
|
|
12
|
-
var _commentContextMenu = _interopRequireDefault(require("../../../../comment/components/comment-context-menu"));
|
|
13
12
|
var _constants = require("../../../../constants");
|
|
14
13
|
var _context = _interopRequireDefault(require("../../../../context"));
|
|
15
14
|
var _useColorContext = require("../../../../hooks/use-color-context");
|
|
@@ -156,7 +155,7 @@ const TextStyleMenuList = _ref => {
|
|
|
156
155
|
tipMessage: t('Reduce_font_size')
|
|
157
156
|
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
158
157
|
className: "sdocfont sdoc-reduce-font-size"
|
|
159
|
-
}))), idPrefix &&
|
|
158
|
+
}))), idPrefix && enableSeafileAI && /*#__PURE__*/_react.default.createElement(_aiMenu.AIContextMenu, {
|
|
160
159
|
isRichEditor: isRichEditor
|
|
161
160
|
}));
|
|
162
161
|
};
|
|
@@ -1,207 +1,40 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.useComment = exports.CommentProvider = void 0;
|
|
9
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
var _utils = require("../comment/utils");
|
|
17
|
-
var _toast = _interopRequireDefault(require("../components/toast"));
|
|
18
|
-
var _constants2 = require("../constants");
|
|
19
|
-
var _model = require("../model");
|
|
20
|
-
var _commonUtils = require("../utils/common-utils");
|
|
21
|
-
var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
|
|
9
|
+
require("../assets/css/layout.css");
|
|
10
|
+
require("../assets/css/default.css");
|
|
11
|
+
require("../assets/css/sdoc-editor-article.css");
|
|
12
|
+
require("../assets/css/sdoc-editor-plugins.css");
|
|
13
|
+
require("../assets/css/sdoc-comment-editor-plugin.css");
|
|
14
|
+
require("../assets/css/dropdown-menu.css");
|
|
22
15
|
const CommentContext = /*#__PURE__*/_react.default.createContext(null);
|
|
23
16
|
const CommentProvider = _ref => {
|
|
24
17
|
let {
|
|
25
18
|
children,
|
|
26
|
-
|
|
27
|
-
|
|
19
|
+
type,
|
|
20
|
+
// comment or replay
|
|
21
|
+
userInfo,
|
|
28
22
|
className = '',
|
|
23
|
+
pluginName = '',
|
|
24
|
+
// sdoc or wiki or txt ...
|
|
29
25
|
pluginEventBus,
|
|
30
|
-
pluginEvent
|
|
31
|
-
api,
|
|
32
|
-
onCloseCommentPanel
|
|
26
|
+
pluginEvent
|
|
33
27
|
} = _ref;
|
|
34
|
-
const {
|
|
35
|
-
t
|
|
36
|
-
} = (0, _reactI18next.useTranslation)('sdoc-editor');
|
|
37
28
|
const [collaborators, setCollaborators] = (0, _react.useState)([]);
|
|
38
|
-
const [participants, setParticipants] = (0, _react.useState)([]);
|
|
39
|
-
const [commentType, setCommentType] = (0, _react.useState)(_constants.COMMENT_TYPES.ALL);
|
|
40
|
-
const [commentList, setCommentList] = (0, _react.useState)([]);
|
|
41
|
-
const [commentsInfo, dispatch] = (0, _react.useReducer)(_commentReducer.commentReducer, _commentReducer.initCommentsInfo);
|
|
42
|
-
(0, _useCommentMount.useCommentsMount)(dispatch, api);
|
|
43
|
-
const [notificationsInfo, notificationsDispatch] = (0, _react.useReducer)(_notificationReducer.notificationReducer, _notificationReducer.initNotificationsInfo);
|
|
44
|
-
(0, _notificationHooks.useNotificationsMount)(dispatch, api, collaborators);
|
|
45
|
-
(0, _react.useEffect)(() => {
|
|
46
|
-
if (Object.keys(commentsInfo.element_comments_map).length) {
|
|
47
|
-
editor.element_comments_map = commentsInfo.element_comments_map;
|
|
48
|
-
}
|
|
49
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
50
|
-
}, [commentsInfo.element_comments_map]);
|
|
51
|
-
(0, _react.useEffect)(() => {
|
|
52
|
-
editor.notifications_map = {
|
|
53
|
-
...notificationsInfo.notifications_map
|
|
54
|
-
};
|
|
55
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
56
|
-
}, [notificationsInfo]);
|
|
57
|
-
(0, _react.useEffect)(() => {
|
|
58
|
-
const {
|
|
59
|
-
comment_list
|
|
60
|
-
} = commentsInfo;
|
|
61
|
-
if (commentType === _constants.COMMENT_TYPES.ALL) {
|
|
62
|
-
const commentList = comment_list.map(item => {
|
|
63
|
-
item.replies = item.replies.filter(reply => !['True', 'False'].includes(reply.reply));
|
|
64
|
-
return item;
|
|
65
|
-
});
|
|
66
|
-
setCommentList(commentList);
|
|
67
|
-
} else if (commentType === _constants.COMMENT_TYPES.RESOLVED) {
|
|
68
|
-
const commentList = comment_list.filter(item => item.resolved);
|
|
69
|
-
setCommentList(commentList);
|
|
70
|
-
} else if (commentType === _constants.COMMENT_TYPES.UNRESOLVED) {
|
|
71
|
-
const commentList = comment_list.filter(item => !item.resolved);
|
|
72
|
-
setCommentList(commentList);
|
|
73
|
-
} else if (commentType === _constants.COMMENT_TYPES.DOC) {
|
|
74
|
-
const commentList = comment_list.filter(comment => comment.detail.element_id === _constants.DOC_COMMENT_ELEMENT_ID);
|
|
75
|
-
setCommentList(commentList);
|
|
76
|
-
}
|
|
77
|
-
}, [commentType, commentsInfo]);
|
|
78
|
-
|
|
79
|
-
// Participants
|
|
80
|
-
const updateLocalParticipants = (0, _react.useCallback)(function () {
|
|
81
|
-
let added = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
82
|
-
if (!Array.isArray(added) || added.length === 0) return;
|
|
83
|
-
let newParticipants = participants.slice(0);
|
|
84
|
-
added.forEach(participant => {
|
|
85
|
-
const newParticipant = new _model.User(participant);
|
|
86
|
-
if (!newParticipants.find(item => item.username === newParticipant.username)) {
|
|
87
|
-
newParticipants.push(newParticipant);
|
|
88
|
-
}
|
|
89
|
-
});
|
|
90
|
-
setParticipants(newParticipants);
|
|
91
|
-
}, [participants]);
|
|
92
|
-
const deleteLocalParticipant = (0, _react.useCallback)(email => {
|
|
93
|
-
if (!participants.find(participant => participant.username === email)) return;
|
|
94
|
-
let newParticipants = participants.slice(0);
|
|
95
|
-
newParticipants = newParticipants.filter(participant => participant.username !== email);
|
|
96
|
-
setParticipants(newParticipants);
|
|
97
|
-
}, [participants]);
|
|
98
|
-
const addParticipants = (0, _react.useCallback)(otherEmail => {
|
|
99
|
-
if (participants.find(participant => participant.username === otherEmail)) return;
|
|
100
|
-
api.addParticipants([otherEmail]).then(res => {
|
|
101
|
-
const {
|
|
102
|
-
success
|
|
103
|
-
} = res.data;
|
|
104
|
-
updateLocalParticipants(success);
|
|
105
|
-
}).catch(error => {
|
|
106
|
-
const errorMessage = (0, _commonUtils.getErrorMsg)(error);
|
|
107
|
-
_toast.default.danger(t(errorMessage));
|
|
108
|
-
});
|
|
109
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
110
|
-
}, [updateLocalParticipants, participants]);
|
|
111
|
-
const deleteParticipant = (0, _react.useCallback)(email => {
|
|
112
|
-
if (!participants.find(participant => participant.username === email)) return;
|
|
113
|
-
api.deleteParticipants(email).then(res => {
|
|
114
|
-
let newParticipants = participants.slice(0);
|
|
115
|
-
newParticipants = newParticipants.filter(participant => participant.username !== email);
|
|
116
|
-
setParticipants(newParticipants);
|
|
117
|
-
}).catch(error => {
|
|
118
|
-
const errorMessage = (0, _commonUtils.getErrorMsg)(error);
|
|
119
|
-
_toast.default.danger(t(errorMessage));
|
|
120
|
-
});
|
|
121
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
122
|
-
}, [participants]);
|
|
123
|
-
|
|
124
|
-
// Notifications
|
|
125
|
-
const deleteUnseenNotifications = (0, _react.useCallback)(comment => {
|
|
126
|
-
let unseenCommentIds = [];
|
|
127
|
-
let unseenNotificationKeys = [];
|
|
128
|
-
const commentNotificationKey = (0, _utils.generatorNotificationKey)(comment.id);
|
|
129
|
-
const commentNotification = notificationsInfo.notifications_map[commentNotificationKey];
|
|
130
|
-
if (commentNotification) {
|
|
131
|
-
unseenNotificationKeys.push(commentNotification.key);
|
|
132
|
-
unseenCommentIds.push(commentNotification.id);
|
|
133
|
-
}
|
|
134
|
-
Array.isArray(comment.replies) && comment.replies.forEach(reply => {
|
|
135
|
-
const replyNotificationKey = (0, _utils.generatorNotificationKey)(reply.comment_id, reply.id);
|
|
136
|
-
const replyNotification = notificationsInfo.notifications_map[replyNotificationKey];
|
|
137
|
-
if (replyNotification) {
|
|
138
|
-
unseenNotificationKeys.push(replyNotification.key);
|
|
139
|
-
unseenCommentIds.push(replyNotification.id);
|
|
140
|
-
}
|
|
141
|
-
});
|
|
142
|
-
api.deleteUnseenNotifications(unseenCommentIds).then(res => {
|
|
143
|
-
notificationsDispatch({
|
|
144
|
-
type: _constants.DOC_NOTIFICATION_REDUCER_TYPE.DEL,
|
|
145
|
-
payload: unseenNotificationKeys
|
|
146
|
-
});
|
|
147
|
-
}).catch(error => {
|
|
148
|
-
//
|
|
149
|
-
});
|
|
150
|
-
}, [api, notificationsInfo.notifications_map]);
|
|
151
|
-
|
|
152
|
-
// Mount
|
|
153
|
-
(0, _react.useEffect)(() => {
|
|
154
|
-
// get participants
|
|
155
|
-
api.listParticipants().then(res => {
|
|
156
|
-
const participants = res.data.participant_list;
|
|
157
|
-
updateLocalParticipants(participants);
|
|
158
|
-
}).catch(error => {
|
|
159
|
-
console.log(error);
|
|
160
|
-
});
|
|
161
|
-
|
|
162
|
-
// get collaborators
|
|
163
|
-
api.listRelatedUsers().then(res => {
|
|
164
|
-
const collaborators = [];
|
|
165
|
-
res.data.related_users.forEach(user => {
|
|
166
|
-
const collaborator = new _model.User(user);
|
|
167
|
-
collaborators.push(collaborator);
|
|
168
|
-
});
|
|
169
|
-
setCollaborators(collaborators);
|
|
170
|
-
}).catch(error => {
|
|
171
|
-
console.log(error);
|
|
172
|
-
});
|
|
173
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
174
|
-
}, []);
|
|
175
|
-
|
|
176
|
-
// Listening
|
|
177
|
-
(0, _react.useEffect)(() => {
|
|
178
|
-
const eventBus = _eventBus.default.getInstance();
|
|
179
|
-
const unsubscribeParticipantAdded = eventBus.subscribe(_constants2.INTERNAL_EVENT.PARTICIPANT_ADDED, updateLocalParticipants);
|
|
180
|
-
const unsubscribeParticipantRemoved = eventBus.subscribe(_constants2.INTERNAL_EVENT.PARTICIPANT_REMOVED, deleteLocalParticipant);
|
|
181
|
-
return () => {
|
|
182
|
-
unsubscribeParticipantAdded();
|
|
183
|
-
unsubscribeParticipantRemoved();
|
|
184
|
-
};
|
|
185
|
-
}, [updateLocalParticipants, deleteLocalParticipant]);
|
|
186
29
|
return /*#__PURE__*/_react.default.createElement(CommentContext.Provider, {
|
|
187
30
|
value: {
|
|
188
|
-
|
|
31
|
+
type,
|
|
32
|
+
userInfo,
|
|
189
33
|
className,
|
|
190
|
-
|
|
34
|
+
pluginName,
|
|
191
35
|
pluginEventBus,
|
|
192
36
|
pluginEvent,
|
|
193
|
-
|
|
194
|
-
commentType,
|
|
195
|
-
commentList,
|
|
196
|
-
dispatch,
|
|
197
|
-
setCommentType,
|
|
198
|
-
onCloseCommentPanel,
|
|
199
|
-
collaborators,
|
|
200
|
-
notificationsInfo,
|
|
201
|
-
deleteUnseenNotifications,
|
|
202
|
-
addParticipants,
|
|
203
|
-
deleteParticipant,
|
|
204
|
-
participants
|
|
37
|
+
collaborators
|
|
205
38
|
}
|
|
206
39
|
}, children);
|
|
207
40
|
};
|