@univerjs/docs-thread-comment-ui 0.20.1 → 0.21.0
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/lib/cjs/index.js +717 -2
- package/lib/es/index.js +707 -2
- package/lib/index.js +707 -2
- package/lib/umd/index.js +1 -1
- package/package.json +11 -11
package/lib/es/index.js
CHANGED
|
@@ -1,2 +1,707 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import { BuildTextUtils, CommandType, CustomDecorationType, DependentOn, Disposable, ICommandService, IConfigService, IUniverInstanceService, Inject, Injector, Plugin, SHEET_EDITOR_UNITS, UniverInstanceType, UserManagerService, isInternalEditorID, merge, sequenceExecute } from "@univerjs/core";
|
|
2
|
+
import { DocBackScrollRenderController, DocRenderController, DocSelectionRenderService, addCustomDecorationBySelectionFactory, deleteCustomDecorationFactory } from "@univerjs/docs-ui";
|
|
3
|
+
import { AddCommentMutation, IThreadCommentDataSourceService, ThreadCommentModel, getDT } from "@univerjs/thread-comment";
|
|
4
|
+
import { SetActiveCommentOperation, ThreadCommentPanel, ThreadCommentPanelService, UniverThreadCommentUIPlugin } from "@univerjs/thread-comment-ui";
|
|
5
|
+
import { DOC_INTERCEPTOR_POINT, DocInterceptorService, DocSelectionManagerService, DocSkeletonManagerService, RichTextEditingMutation, SetTextSelectionsOperation } from "@univerjs/docs";
|
|
6
|
+
import { DocumentEditArea, IRenderManagerService, withCurrentTypeOfRenderer } from "@univerjs/engine-render";
|
|
7
|
+
import { ComponentManager, ContextMenuGroup, ContextMenuPosition, IMenuManagerService, ISidebarService, MenuItemType, RibbonInsertGroup, getMenuHiddenObservable, useDependency, useObservable } from "@univerjs/ui";
|
|
8
|
+
import { BehaviorSubject, Observable, debounceTime, filter } from "rxjs";
|
|
9
|
+
import { CommentIcon } from "@univerjs/icons";
|
|
10
|
+
import { useEffect, useMemo, useState } from "react";
|
|
11
|
+
import { jsx } from "react/jsx-runtime";
|
|
12
|
+
|
|
13
|
+
//#region src/common/const.ts
|
|
14
|
+
/**
|
|
15
|
+
* Copyright 2023-present DreamNum Co., Ltd.
|
|
16
|
+
*
|
|
17
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
18
|
+
* you may not use this file except in compliance with the License.
|
|
19
|
+
* You may obtain a copy of the License at
|
|
20
|
+
*
|
|
21
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
22
|
+
*
|
|
23
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
24
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
25
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
26
|
+
* See the License for the specific language governing permissions and
|
|
27
|
+
* limitations under the License.
|
|
28
|
+
*/
|
|
29
|
+
const DOCS_THREAD_COMMENT_PANEL = "univer.doc.thread-comment-panel";
|
|
30
|
+
const PLUGIN_NAME = "DOC_THREAD_COMMENT_UI_PLUGIN";
|
|
31
|
+
const DEFAULT_DOC_SUBUNIT_ID = "default_doc";
|
|
32
|
+
|
|
33
|
+
//#endregion
|
|
34
|
+
//#region src/commands/commands/add-doc-comment.command.ts
|
|
35
|
+
const AddDocCommentComment = {
|
|
36
|
+
id: "docs.command.add-comment",
|
|
37
|
+
type: CommandType.COMMAND,
|
|
38
|
+
async handler(accessor, params) {
|
|
39
|
+
if (!params) return false;
|
|
40
|
+
const { comment: originComment, unitId } = params;
|
|
41
|
+
const comment = await accessor.get(IThreadCommentDataSourceService).addComment(originComment);
|
|
42
|
+
const commandService = accessor.get(ICommandService);
|
|
43
|
+
const doMutation = addCustomDecorationBySelectionFactory(accessor, {
|
|
44
|
+
id: comment.threadId,
|
|
45
|
+
type: CustomDecorationType.COMMENT,
|
|
46
|
+
unitId
|
|
47
|
+
});
|
|
48
|
+
if (doMutation) return (await sequenceExecute([
|
|
49
|
+
{
|
|
50
|
+
id: AddCommentMutation.id,
|
|
51
|
+
params: {
|
|
52
|
+
unitId,
|
|
53
|
+
subUnitId: DEFAULT_DOC_SUBUNIT_ID,
|
|
54
|
+
comment
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
doMutation,
|
|
58
|
+
{
|
|
59
|
+
id: SetActiveCommentOperation.id,
|
|
60
|
+
params: {
|
|
61
|
+
unitId,
|
|
62
|
+
subUnitId: DEFAULT_DOC_SUBUNIT_ID,
|
|
63
|
+
commentId: comment.id
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
], commandService)).result;
|
|
67
|
+
return false;
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
//#endregion
|
|
72
|
+
//#region src/commands/commands/delete-doc-comment.command.ts
|
|
73
|
+
const DeleteDocCommentComment = {
|
|
74
|
+
id: "docs.command.delete-comment",
|
|
75
|
+
type: CommandType.COMMAND,
|
|
76
|
+
async handler(accessor, params) {
|
|
77
|
+
if (!params) return false;
|
|
78
|
+
const { commentId, unitId } = params;
|
|
79
|
+
const commandService = accessor.get(ICommandService);
|
|
80
|
+
const doMutation = deleteCustomDecorationFactory(accessor, {
|
|
81
|
+
id: commentId,
|
|
82
|
+
unitId
|
|
83
|
+
});
|
|
84
|
+
if (doMutation) return (await sequenceExecute([doMutation], commandService)).result;
|
|
85
|
+
return false;
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
//#endregion
|
|
90
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/typeof.js
|
|
91
|
+
function _typeof(o) {
|
|
92
|
+
"@babel/helpers - typeof";
|
|
93
|
+
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
|
|
94
|
+
return typeof o;
|
|
95
|
+
} : function(o) {
|
|
96
|
+
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
|
|
97
|
+
}, _typeof(o);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
//#endregion
|
|
101
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/toPrimitive.js
|
|
102
|
+
function toPrimitive(t, r) {
|
|
103
|
+
if ("object" != _typeof(t) || !t) return t;
|
|
104
|
+
var e = t[Symbol.toPrimitive];
|
|
105
|
+
if (void 0 !== e) {
|
|
106
|
+
var i = e.call(t, r || "default");
|
|
107
|
+
if ("object" != _typeof(i)) return i;
|
|
108
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
109
|
+
}
|
|
110
|
+
return ("string" === r ? String : Number)(t);
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
//#endregion
|
|
114
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/toPropertyKey.js
|
|
115
|
+
function toPropertyKey(t) {
|
|
116
|
+
var i = toPrimitive(t, "string");
|
|
117
|
+
return "symbol" == _typeof(i) ? i : i + "";
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
//#endregion
|
|
121
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/defineProperty.js
|
|
122
|
+
function _defineProperty(e, r, t) {
|
|
123
|
+
return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
124
|
+
value: t,
|
|
125
|
+
enumerable: !0,
|
|
126
|
+
configurable: !0,
|
|
127
|
+
writable: !0
|
|
128
|
+
}) : e[r] = t, e;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
//#endregion
|
|
132
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/decorateParam.js
|
|
133
|
+
function __decorateParam(paramIndex, decorator) {
|
|
134
|
+
return function(target, key) {
|
|
135
|
+
decorator(target, key, paramIndex);
|
|
136
|
+
};
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
//#endregion
|
|
140
|
+
//#region \0@oxc-project+runtime@0.124.0/helpers/decorate.js
|
|
141
|
+
function __decorate(decorators, target, key, desc) {
|
|
142
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
143
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
144
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
145
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
//#endregion
|
|
149
|
+
//#region src/services/doc-thread-comment.service.ts
|
|
150
|
+
let DocThreadCommentService = class DocThreadCommentService extends Disposable {
|
|
151
|
+
get addingComment() {
|
|
152
|
+
return this._addingComment$.getValue();
|
|
153
|
+
}
|
|
154
|
+
constructor(_sidebarService, _threadCommentPanelService) {
|
|
155
|
+
super();
|
|
156
|
+
this._sidebarService = _sidebarService;
|
|
157
|
+
this._threadCommentPanelService = _threadCommentPanelService;
|
|
158
|
+
_defineProperty(this, "_addingComment$", new BehaviorSubject(void 0));
|
|
159
|
+
_defineProperty(this, "addingComment$", this._addingComment$.asObservable());
|
|
160
|
+
this.disposeWithMe(() => {
|
|
161
|
+
this._addingComment$.complete();
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
startAdd(comment) {
|
|
165
|
+
this._addingComment$.next(comment);
|
|
166
|
+
}
|
|
167
|
+
endAdd() {
|
|
168
|
+
this._addingComment$.next(void 0);
|
|
169
|
+
}
|
|
170
|
+
};
|
|
171
|
+
DocThreadCommentService = __decorate([__decorateParam(0, ISidebarService), __decorateParam(1, Inject(ThreadCommentPanelService))], DocThreadCommentService);
|
|
172
|
+
|
|
173
|
+
//#endregion
|
|
174
|
+
//#region src/commands/operations/show-comment-panel.operation.ts
|
|
175
|
+
const ShowCommentPanelOperation = {
|
|
176
|
+
id: "docs.operation.show-comment-panel",
|
|
177
|
+
type: CommandType.OPERATION,
|
|
178
|
+
handler(accessor, params) {
|
|
179
|
+
var _sidebarService$optio;
|
|
180
|
+
const panelService = accessor.get(ThreadCommentPanelService);
|
|
181
|
+
const sidebarService = accessor.get(ISidebarService);
|
|
182
|
+
if (!panelService.panelVisible || ((_sidebarService$optio = sidebarService.options.children) === null || _sidebarService$optio === void 0 ? void 0 : _sidebarService$optio.label) !== "univer.doc.thread-comment-panel") {
|
|
183
|
+
sidebarService.open({
|
|
184
|
+
header: { title: "threadCommentUI.panel.title" },
|
|
185
|
+
children: { label: DOCS_THREAD_COMMENT_PANEL },
|
|
186
|
+
width: 320,
|
|
187
|
+
onClose: () => panelService.setPanelVisible(false)
|
|
188
|
+
});
|
|
189
|
+
panelService.setPanelVisible(true);
|
|
190
|
+
}
|
|
191
|
+
if (params) panelService.setActiveComment(params === null || params === void 0 ? void 0 : params.activeComment);
|
|
192
|
+
return true;
|
|
193
|
+
}
|
|
194
|
+
};
|
|
195
|
+
const ToggleCommentPanelOperation = {
|
|
196
|
+
id: "docs.operation.toggle-comment-panel",
|
|
197
|
+
type: CommandType.OPERATION,
|
|
198
|
+
handler(accessor) {
|
|
199
|
+
var _sidebarService$optio2;
|
|
200
|
+
const panelService = accessor.get(ThreadCommentPanelService);
|
|
201
|
+
const sidebarService = accessor.get(ISidebarService);
|
|
202
|
+
if (!panelService.panelVisible || ((_sidebarService$optio2 = sidebarService.options.children) === null || _sidebarService$optio2 === void 0 ? void 0 : _sidebarService$optio2.label) !== "univer.doc.thread-comment-panel") {
|
|
203
|
+
sidebarService.open({
|
|
204
|
+
header: { title: "threadCommentUI.panel.title" },
|
|
205
|
+
children: { label: DOCS_THREAD_COMMENT_PANEL },
|
|
206
|
+
width: 320,
|
|
207
|
+
onClose: () => panelService.setPanelVisible(false)
|
|
208
|
+
});
|
|
209
|
+
panelService.setPanelVisible(true);
|
|
210
|
+
} else {
|
|
211
|
+
sidebarService.close();
|
|
212
|
+
panelService.setPanelVisible(false);
|
|
213
|
+
panelService.setActiveComment(null);
|
|
214
|
+
}
|
|
215
|
+
return true;
|
|
216
|
+
}
|
|
217
|
+
};
|
|
218
|
+
const StartAddCommentOperation = {
|
|
219
|
+
id: "docs.operation.start-add-comment",
|
|
220
|
+
type: CommandType.OPERATION,
|
|
221
|
+
handler(accessor) {
|
|
222
|
+
var _renderManagerService, _doc$getBody$dataStre, _doc$getBody;
|
|
223
|
+
const panelService = accessor.get(ThreadCommentPanelService);
|
|
224
|
+
const doc = accessor.get(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_DOC);
|
|
225
|
+
const docSelectionManagerService = accessor.get(DocSelectionManagerService);
|
|
226
|
+
const renderManagerService = accessor.get(IRenderManagerService);
|
|
227
|
+
const userManagerService = accessor.get(UserManagerService);
|
|
228
|
+
const docCommentService = accessor.get(DocThreadCommentService);
|
|
229
|
+
const commandService = accessor.get(ICommandService);
|
|
230
|
+
const sidebarService = accessor.get(ISidebarService);
|
|
231
|
+
const textRange = docSelectionManagerService.getActiveTextRange();
|
|
232
|
+
if (!doc || !textRange) return false;
|
|
233
|
+
const docSelectionRenderManager = (_renderManagerService = renderManagerService.getRenderById(doc.getUnitId())) === null || _renderManagerService === void 0 ? void 0 : _renderManagerService.with(DocSelectionRenderService);
|
|
234
|
+
docSelectionRenderManager === null || docSelectionRenderManager === void 0 || docSelectionRenderManager.setReserveRangesStatus(true);
|
|
235
|
+
if (textRange.collapsed) {
|
|
236
|
+
if (panelService.panelVisible) {
|
|
237
|
+
panelService.setPanelVisible(false);
|
|
238
|
+
sidebarService.close();
|
|
239
|
+
} else commandService.executeCommand(ShowCommentPanelOperation.id);
|
|
240
|
+
return true;
|
|
241
|
+
}
|
|
242
|
+
commandService.executeCommand(ShowCommentPanelOperation.id);
|
|
243
|
+
const unitId = doc.getUnitId();
|
|
244
|
+
const dataStream = ((_doc$getBody$dataStre = (_doc$getBody = doc.getBody()) === null || _doc$getBody === void 0 ? void 0 : _doc$getBody.dataStream) !== null && _doc$getBody$dataStre !== void 0 ? _doc$getBody$dataStre : "").slice(textRange.startOffset, textRange.endOffset);
|
|
245
|
+
const text = BuildTextUtils.transform.getPlainText(dataStream);
|
|
246
|
+
const subUnitId = DEFAULT_DOC_SUBUNIT_ID;
|
|
247
|
+
const commentId = "";
|
|
248
|
+
const comment = {
|
|
249
|
+
unitId,
|
|
250
|
+
subUnitId,
|
|
251
|
+
id: commentId,
|
|
252
|
+
ref: text,
|
|
253
|
+
dT: getDT(),
|
|
254
|
+
personId: userManagerService.getCurrentUser().userID,
|
|
255
|
+
text: { dataStream: "\r\n" },
|
|
256
|
+
startOffset: textRange.startOffset,
|
|
257
|
+
endOffset: textRange.endOffset,
|
|
258
|
+
collapsed: true,
|
|
259
|
+
threadId: commentId
|
|
260
|
+
};
|
|
261
|
+
docSelectionRenderManager === null || docSelectionRenderManager === void 0 || docSelectionRenderManager.blur();
|
|
262
|
+
docCommentService.startAdd(comment);
|
|
263
|
+
panelService.setActiveComment({
|
|
264
|
+
unitId,
|
|
265
|
+
subUnitId,
|
|
266
|
+
commentId
|
|
267
|
+
});
|
|
268
|
+
return true;
|
|
269
|
+
}
|
|
270
|
+
};
|
|
271
|
+
|
|
272
|
+
//#endregion
|
|
273
|
+
//#region package.json
|
|
274
|
+
var name = "@univerjs/docs-thread-comment-ui";
|
|
275
|
+
var version = "0.21.0";
|
|
276
|
+
|
|
277
|
+
//#endregion
|
|
278
|
+
//#region src/config/config.ts
|
|
279
|
+
const DOCS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY = "docs-thread-comment-ui.config";
|
|
280
|
+
const configSymbol = Symbol(DOCS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY);
|
|
281
|
+
const defaultPluginConfig = {};
|
|
282
|
+
|
|
283
|
+
//#endregion
|
|
284
|
+
//#region src/controllers/doc-thread-comment-selection.controller.ts
|
|
285
|
+
let DocThreadCommentSelectionController = class DocThreadCommentSelectionController extends Disposable {
|
|
286
|
+
constructor(_threadCommentPanelService, _univerInstanceService, _commandService, _docThreadCommentService, _renderManagerService, _threadCommentModel) {
|
|
287
|
+
super();
|
|
288
|
+
this._threadCommentPanelService = _threadCommentPanelService;
|
|
289
|
+
this._univerInstanceService = _univerInstanceService;
|
|
290
|
+
this._commandService = _commandService;
|
|
291
|
+
this._docThreadCommentService = _docThreadCommentService;
|
|
292
|
+
this._renderManagerService = _renderManagerService;
|
|
293
|
+
this._threadCommentModel = _threadCommentModel;
|
|
294
|
+
this._initSelectionChange();
|
|
295
|
+
this._initActiveCommandChange();
|
|
296
|
+
}
|
|
297
|
+
_initSelectionChange() {
|
|
298
|
+
let lastSelection;
|
|
299
|
+
this.disposeWithMe(this._commandService.onCommandExecuted((commandInfo) => {
|
|
300
|
+
if (commandInfo.id === SetTextSelectionsOperation.id) {
|
|
301
|
+
const { unitId, ranges } = commandInfo.params;
|
|
302
|
+
if (isInternalEditorID(unitId)) return;
|
|
303
|
+
const doc = this._univerInstanceService.getUnit(unitId, UniverInstanceType.UNIVER_DOC);
|
|
304
|
+
const primary = ranges[0];
|
|
305
|
+
if ((lastSelection === null || lastSelection === void 0 ? void 0 : lastSelection.startOffset) === (primary === null || primary === void 0 ? void 0 : primary.startOffset) && (lastSelection === null || lastSelection === void 0 ? void 0 : lastSelection.endOffset) === (primary === null || primary === void 0 ? void 0 : primary.endOffset)) return;
|
|
306
|
+
lastSelection = primary;
|
|
307
|
+
if (primary && doc) {
|
|
308
|
+
const { startOffset, endOffset, collapsed } = primary;
|
|
309
|
+
let customRange;
|
|
310
|
+
if (collapsed) {
|
|
311
|
+
var _doc$getBody;
|
|
312
|
+
customRange = (_doc$getBody = doc.getBody()) === null || _doc$getBody === void 0 || (_doc$getBody = _doc$getBody.customDecorations) === null || _doc$getBody === void 0 ? void 0 : _doc$getBody.find((value) => value.startIndex <= startOffset && value.endIndex >= endOffset - 1);
|
|
313
|
+
} else {
|
|
314
|
+
var _doc$getBody2;
|
|
315
|
+
customRange = (_doc$getBody2 = doc.getBody()) === null || _doc$getBody2 === void 0 || (_doc$getBody2 = _doc$getBody2.customDecorations) === null || _doc$getBody2 === void 0 ? void 0 : _doc$getBody2.find((value) => value.startIndex <= startOffset && value.endIndex >= endOffset - 1);
|
|
316
|
+
}
|
|
317
|
+
if (customRange) {
|
|
318
|
+
const comment = this._threadCommentModel.getComment(unitId, DEFAULT_DOC_SUBUNIT_ID, customRange.id);
|
|
319
|
+
if (comment && !comment.resolved) this._commandService.executeCommand(ShowCommentPanelOperation.id, { activeComment: {
|
|
320
|
+
unitId,
|
|
321
|
+
subUnitId: DEFAULT_DOC_SUBUNIT_ID,
|
|
322
|
+
commentId: customRange.id
|
|
323
|
+
} });
|
|
324
|
+
return;
|
|
325
|
+
}
|
|
326
|
+
}
|
|
327
|
+
if (!this._threadCommentPanelService.activeCommentId) return;
|
|
328
|
+
this._commandService.executeCommand(SetActiveCommentOperation.id);
|
|
329
|
+
}
|
|
330
|
+
}));
|
|
331
|
+
}
|
|
332
|
+
_initActiveCommandChange() {
|
|
333
|
+
this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe((activeComment) => {
|
|
334
|
+
var _this$_docThreadComme;
|
|
335
|
+
if (activeComment) {
|
|
336
|
+
const doc = this._univerInstanceService.getUnit(activeComment.unitId);
|
|
337
|
+
if (doc) {
|
|
338
|
+
var _this$_renderManagerS, _doc$getBody3;
|
|
339
|
+
const backScrollController = (_this$_renderManagerS = this._renderManagerService.getRenderById(activeComment.unitId)) === null || _this$_renderManagerS === void 0 ? void 0 : _this$_renderManagerS.with(DocBackScrollRenderController);
|
|
340
|
+
const customRange = (_doc$getBody3 = doc.getBody()) === null || _doc$getBody3 === void 0 || (_doc$getBody3 = _doc$getBody3.customDecorations) === null || _doc$getBody3 === void 0 ? void 0 : _doc$getBody3.find((range) => range.id === activeComment.commentId);
|
|
341
|
+
if (customRange && backScrollController) backScrollController.scrollToRange({
|
|
342
|
+
startOffset: customRange.startIndex,
|
|
343
|
+
endOffset: customRange.endIndex,
|
|
344
|
+
collapsed: false
|
|
345
|
+
});
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
if (!activeComment || activeComment.commentId !== ((_this$_docThreadComme = this._docThreadCommentService.addingComment) === null || _this$_docThreadComme === void 0 ? void 0 : _this$_docThreadComme.id)) this._docThreadCommentService.endAdd();
|
|
349
|
+
}));
|
|
350
|
+
}
|
|
351
|
+
};
|
|
352
|
+
DocThreadCommentSelectionController = __decorate([
|
|
353
|
+
__decorateParam(0, Inject(ThreadCommentPanelService)),
|
|
354
|
+
__decorateParam(1, IUniverInstanceService),
|
|
355
|
+
__decorateParam(2, ICommandService),
|
|
356
|
+
__decorateParam(3, Inject(DocThreadCommentService)),
|
|
357
|
+
__decorateParam(4, IRenderManagerService),
|
|
358
|
+
__decorateParam(5, Inject(ThreadCommentModel))
|
|
359
|
+
], DocThreadCommentSelectionController);
|
|
360
|
+
|
|
361
|
+
//#endregion
|
|
362
|
+
//#region src/menu/menu.ts
|
|
363
|
+
const shouldDisableAddComment = (accessor) => {
|
|
364
|
+
var _withCurrentTypeOfRen;
|
|
365
|
+
const renderManagerService = accessor.get(IRenderManagerService);
|
|
366
|
+
const docSelectionManagerService = accessor.get(DocSelectionManagerService);
|
|
367
|
+
const skeleton = (_withCurrentTypeOfRen = withCurrentTypeOfRenderer(UniverInstanceType.UNIVER_DOC, DocSkeletonManagerService, accessor.get(IUniverInstanceService), renderManagerService)) === null || _withCurrentTypeOfRen === void 0 ? void 0 : _withCurrentTypeOfRen.getSkeleton();
|
|
368
|
+
const editArea = skeleton === null || skeleton === void 0 ? void 0 : skeleton.getViewModel().getEditArea();
|
|
369
|
+
if (editArea === DocumentEditArea.FOOTER || editArea === DocumentEditArea.HEADER) return true;
|
|
370
|
+
const range = docSelectionManagerService.getActiveTextRange();
|
|
371
|
+
if (range == null || range.collapsed) return true;
|
|
372
|
+
return false;
|
|
373
|
+
};
|
|
374
|
+
function AddDocCommentMenuItemFactory(accessor) {
|
|
375
|
+
return {
|
|
376
|
+
id: StartAddCommentOperation.id,
|
|
377
|
+
type: MenuItemType.BUTTON,
|
|
378
|
+
icon: "CommentIcon",
|
|
379
|
+
title: "threadCommentUI.panel.addComment",
|
|
380
|
+
tooltip: "threadCommentUI.panel.addComment",
|
|
381
|
+
hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC, void 0, SHEET_EDITOR_UNITS),
|
|
382
|
+
disabled$: new Observable(function(subscribe) {
|
|
383
|
+
const observer = accessor.get(DocSelectionManagerService).textSelection$.pipe(debounceTime(16)).subscribe(() => {
|
|
384
|
+
subscribe.next(shouldDisableAddComment(accessor));
|
|
385
|
+
});
|
|
386
|
+
return () => {
|
|
387
|
+
observer.unsubscribe();
|
|
388
|
+
};
|
|
389
|
+
})
|
|
390
|
+
};
|
|
391
|
+
}
|
|
392
|
+
function ToolbarDocCommentMenuItemFactory(accessor) {
|
|
393
|
+
return {
|
|
394
|
+
id: ToggleCommentPanelOperation.id,
|
|
395
|
+
type: MenuItemType.BUTTON,
|
|
396
|
+
icon: "CommentIcon",
|
|
397
|
+
title: "threadCommentUI.panel.addComment",
|
|
398
|
+
tooltip: "threadCommentUI.panel.addComment",
|
|
399
|
+
hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
|
|
400
|
+
};
|
|
401
|
+
}
|
|
402
|
+
|
|
403
|
+
//#endregion
|
|
404
|
+
//#region src/menu/schema.ts
|
|
405
|
+
const menuSchema = {
|
|
406
|
+
[RibbonInsertGroup.MEDIA]: { [ToggleCommentPanelOperation.id]: {
|
|
407
|
+
order: 3,
|
|
408
|
+
menuItemFactory: ToolbarDocCommentMenuItemFactory
|
|
409
|
+
} },
|
|
410
|
+
[ContextMenuPosition.MAIN_AREA]: { [ContextMenuGroup.DATA]: { [StartAddCommentOperation.id]: {
|
|
411
|
+
order: 1,
|
|
412
|
+
menuItemFactory: AddDocCommentMenuItemFactory
|
|
413
|
+
} } }
|
|
414
|
+
};
|
|
415
|
+
|
|
416
|
+
//#endregion
|
|
417
|
+
//#region src/views/doc-thread-comment-panel/index.tsx
|
|
418
|
+
const DocThreadCommentPanel = () => {
|
|
419
|
+
const univerInstanceService = useDependency(IUniverInstanceService);
|
|
420
|
+
const injector = useDependency(Injector);
|
|
421
|
+
const doc = useObservable(useMemo(() => univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_DOC).pipe(filter((doc) => !!doc && !isInternalEditorID(doc.getUnitId()))), [univerInstanceService]));
|
|
422
|
+
const subUnitId$ = useMemo(() => new Observable((sub) => sub.next(DEFAULT_DOC_SUBUNIT_ID)), []);
|
|
423
|
+
const docSelectionManagerService = useDependency(DocSelectionManagerService);
|
|
424
|
+
useObservable(useMemo(() => docSelectionManagerService.textSelection$.pipe(debounceTime(16)), [docSelectionManagerService.textSelection$]));
|
|
425
|
+
const commandService = useDependency(ICommandService);
|
|
426
|
+
const docCommentService = useDependency(DocThreadCommentService);
|
|
427
|
+
const tempComment = useObservable(docCommentService.addingComment$);
|
|
428
|
+
const [commentIds, setCommentIds] = useState([]);
|
|
429
|
+
useEffect(() => {
|
|
430
|
+
var _customRanges$map$fil;
|
|
431
|
+
const set = /* @__PURE__ */ new Set();
|
|
432
|
+
const customRanges = doc === null || doc === void 0 ? void 0 : doc.getCustomDecorations();
|
|
433
|
+
setCommentIds((_customRanges$map$fil = customRanges === null || customRanges === void 0 ? void 0 : customRanges.map((r) => r.id).filter((i) => {
|
|
434
|
+
const hasRepeat = set.has(i);
|
|
435
|
+
set.add(i);
|
|
436
|
+
return !hasRepeat;
|
|
437
|
+
})) !== null && _customRanges$map$fil !== void 0 ? _customRanges$map$fil : []);
|
|
438
|
+
const dispose = commandService.onCommandExecuted((command) => {
|
|
439
|
+
if (command.id === RichTextEditingMutation.id) {
|
|
440
|
+
var _customRanges$map$fil2;
|
|
441
|
+
const set = /* @__PURE__ */ new Set();
|
|
442
|
+
const customRanges = doc === null || doc === void 0 ? void 0 : doc.getCustomDecorations();
|
|
443
|
+
setCommentIds((_customRanges$map$fil2 = customRanges === null || customRanges === void 0 ? void 0 : customRanges.map((r) => r.id).filter((i) => {
|
|
444
|
+
const hasRepeat = set.has(i);
|
|
445
|
+
set.add(i);
|
|
446
|
+
return !hasRepeat;
|
|
447
|
+
})) !== null && _customRanges$map$fil2 !== void 0 ? _customRanges$map$fil2 : []);
|
|
448
|
+
}
|
|
449
|
+
});
|
|
450
|
+
return () => {
|
|
451
|
+
dispose.dispose();
|
|
452
|
+
};
|
|
453
|
+
}, [commandService, doc]);
|
|
454
|
+
if (!doc) return null;
|
|
455
|
+
const isInValidSelection = shouldDisableAddComment(injector);
|
|
456
|
+
const unitId = doc.getUnitId();
|
|
457
|
+
return /* @__PURE__ */ jsx(ThreadCommentPanel, {
|
|
458
|
+
unitId,
|
|
459
|
+
subUnitId$,
|
|
460
|
+
type: UniverInstanceType.UNIVER_DOC,
|
|
461
|
+
onAdd: () => {
|
|
462
|
+
commandService.executeCommand(StartAddCommentOperation.id);
|
|
463
|
+
},
|
|
464
|
+
getSubUnitName: () => "",
|
|
465
|
+
disableAdd: isInValidSelection,
|
|
466
|
+
tempComment,
|
|
467
|
+
onAddComment: (comment) => {
|
|
468
|
+
if (!comment.parentId) {
|
|
469
|
+
const params = {
|
|
470
|
+
unitId,
|
|
471
|
+
range: tempComment,
|
|
472
|
+
comment
|
|
473
|
+
};
|
|
474
|
+
commandService.executeCommand(AddDocCommentComment.id, params);
|
|
475
|
+
docCommentService.endAdd();
|
|
476
|
+
return false;
|
|
477
|
+
}
|
|
478
|
+
return true;
|
|
479
|
+
},
|
|
480
|
+
onDeleteComment: (comment) => {
|
|
481
|
+
if (!comment.parentId) {
|
|
482
|
+
const params = {
|
|
483
|
+
unitId,
|
|
484
|
+
commentId: comment.id
|
|
485
|
+
};
|
|
486
|
+
commandService.executeCommand(DeleteDocCommentComment.id, params);
|
|
487
|
+
return false;
|
|
488
|
+
}
|
|
489
|
+
return true;
|
|
490
|
+
},
|
|
491
|
+
showComments: commentIds
|
|
492
|
+
});
|
|
493
|
+
};
|
|
494
|
+
|
|
495
|
+
//#endregion
|
|
496
|
+
//#region src/controllers/doc-thread-comment-ui.controller.ts
|
|
497
|
+
/**
|
|
498
|
+
* Copyright 2023-present DreamNum Co., Ltd.
|
|
499
|
+
*
|
|
500
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
501
|
+
* you may not use this file except in compliance with the License.
|
|
502
|
+
* You may obtain a copy of the License at
|
|
503
|
+
*
|
|
504
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
505
|
+
*
|
|
506
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
507
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
508
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
509
|
+
* See the License for the specific language governing permissions and
|
|
510
|
+
* limitations under the License.
|
|
511
|
+
*/
|
|
512
|
+
let DocThreadCommentUIController = class DocThreadCommentUIController extends Disposable {
|
|
513
|
+
constructor(_commandService, _menuManagerService, _componentManager) {
|
|
514
|
+
super();
|
|
515
|
+
this._commandService = _commandService;
|
|
516
|
+
this._menuManagerService = _menuManagerService;
|
|
517
|
+
this._componentManager = _componentManager;
|
|
518
|
+
this._initCommands();
|
|
519
|
+
this._initMenus();
|
|
520
|
+
this._initComponents();
|
|
521
|
+
}
|
|
522
|
+
_initCommands() {
|
|
523
|
+
[
|
|
524
|
+
AddDocCommentComment,
|
|
525
|
+
DeleteDocCommentComment,
|
|
526
|
+
ShowCommentPanelOperation,
|
|
527
|
+
StartAddCommentOperation,
|
|
528
|
+
ToggleCommentPanelOperation
|
|
529
|
+
].forEach((command) => {
|
|
530
|
+
this.disposeWithMe(this._commandService.registerCommand(command));
|
|
531
|
+
});
|
|
532
|
+
}
|
|
533
|
+
_initMenus() {
|
|
534
|
+
this._menuManagerService.mergeMenu(menuSchema);
|
|
535
|
+
}
|
|
536
|
+
_initComponents() {
|
|
537
|
+
[[DOCS_THREAD_COMMENT_PANEL, DocThreadCommentPanel], ["CommentIcon", CommentIcon]].forEach(([id, comp]) => {
|
|
538
|
+
this.disposeWithMe(this._componentManager.register(id, comp));
|
|
539
|
+
});
|
|
540
|
+
}
|
|
541
|
+
};
|
|
542
|
+
DocThreadCommentUIController = __decorate([
|
|
543
|
+
__decorateParam(0, ICommandService),
|
|
544
|
+
__decorateParam(1, IMenuManagerService),
|
|
545
|
+
__decorateParam(2, Inject(ComponentManager))
|
|
546
|
+
], DocThreadCommentUIController);
|
|
547
|
+
|
|
548
|
+
//#endregion
|
|
549
|
+
//#region src/controllers/render-controllers/render.controller.ts
|
|
550
|
+
let DocThreadCommentRenderController = class DocThreadCommentRenderController extends Disposable {
|
|
551
|
+
constructor(_context, _docInterceptorService, _threadCommentPanelService, _docRenderController, _univerInstanceService, _threadCommentModel, _commandService) {
|
|
552
|
+
super();
|
|
553
|
+
this._context = _context;
|
|
554
|
+
this._docInterceptorService = _docInterceptorService;
|
|
555
|
+
this._threadCommentPanelService = _threadCommentPanelService;
|
|
556
|
+
this._docRenderController = _docRenderController;
|
|
557
|
+
this._univerInstanceService = _univerInstanceService;
|
|
558
|
+
this._threadCommentModel = _threadCommentModel;
|
|
559
|
+
this._commandService = _commandService;
|
|
560
|
+
this._interceptorViewModel();
|
|
561
|
+
this._initReRender();
|
|
562
|
+
this._initSyncComments();
|
|
563
|
+
}
|
|
564
|
+
_initReRender() {
|
|
565
|
+
this.disposeWithMe(this._threadCommentPanelService.activeCommentId$.subscribe((activeComment) => {
|
|
566
|
+
var _this$_univerInstance;
|
|
567
|
+
if (activeComment) {
|
|
568
|
+
this._docRenderController.reRender(activeComment.unitId);
|
|
569
|
+
return;
|
|
570
|
+
}
|
|
571
|
+
const unitId = (_this$_univerInstance = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) === null || _this$_univerInstance === void 0 ? void 0 : _this$_univerInstance.getUnitId();
|
|
572
|
+
if (unitId) this._docRenderController.reRender(unitId);
|
|
573
|
+
}));
|
|
574
|
+
this.disposeWithMe(this._threadCommentModel.commentUpdate$.subscribe((update) => {
|
|
575
|
+
if (update.type === "resolve") this._docRenderController.reRender(update.unitId);
|
|
576
|
+
}));
|
|
577
|
+
}
|
|
578
|
+
_interceptorViewModel() {
|
|
579
|
+
this._docInterceptorService.intercept(DOC_INTERCEPTOR_POINT.CUSTOM_DECORATION, { handler: (data, pos, next) => {
|
|
580
|
+
if (!data) return next(data);
|
|
581
|
+
const { unitId, index, customDecorations } = pos;
|
|
582
|
+
const { commentId, unitId: commentUnitID } = this._threadCommentPanelService.activeCommentId || {};
|
|
583
|
+
const activeCustomDecoration = customDecorations.find((i) => i.id === commentId);
|
|
584
|
+
const comment = this._threadCommentModel.getComment(unitId, DEFAULT_DOC_SUBUNIT_ID, data.id);
|
|
585
|
+
if (!comment) return next({
|
|
586
|
+
...data,
|
|
587
|
+
show: false
|
|
588
|
+
});
|
|
589
|
+
const isActiveIndex = activeCustomDecoration && index >= activeCustomDecoration.startIndex && index <= activeCustomDecoration.endIndex;
|
|
590
|
+
const isActive = commentUnitID === unitId && data.id === commentId;
|
|
591
|
+
return next({
|
|
592
|
+
...data,
|
|
593
|
+
active: isActive || isActiveIndex,
|
|
594
|
+
show: !comment.resolved
|
|
595
|
+
});
|
|
596
|
+
} });
|
|
597
|
+
}
|
|
598
|
+
_initSyncComments() {
|
|
599
|
+
var _this$_context$unit$g, _this$_context$unit$g2;
|
|
600
|
+
const unitId = this._context.unit.getUnitId();
|
|
601
|
+
const subUnitId = DEFAULT_DOC_SUBUNIT_ID;
|
|
602
|
+
const threadIds = (_this$_context$unit$g = (_this$_context$unit$g2 = this._context.unit.getBody()) === null || _this$_context$unit$g2 === void 0 || (_this$_context$unit$g2 = _this$_context$unit$g2.customDecorations) === null || _this$_context$unit$g2 === void 0 ? void 0 : _this$_context$unit$g2.filter((i) => i.type === CustomDecorationType.COMMENT).map((i) => i.id)) !== null && _this$_context$unit$g !== void 0 ? _this$_context$unit$g : [];
|
|
603
|
+
threadIds.forEach((id) => {
|
|
604
|
+
if (!this._threadCommentModel.getComment(unitId, subUnitId, id)) this._threadCommentModel.addComment(unitId, subUnitId, {
|
|
605
|
+
id,
|
|
606
|
+
threadId: id,
|
|
607
|
+
ref: "",
|
|
608
|
+
dT: "",
|
|
609
|
+
personId: "",
|
|
610
|
+
text: { dataStream: "" },
|
|
611
|
+
unitId,
|
|
612
|
+
subUnitId
|
|
613
|
+
});
|
|
614
|
+
});
|
|
615
|
+
threadIds.length && this._threadCommentModel.syncThreadComments(this._context.unit.getUnitId(), "default_doc", threadIds);
|
|
616
|
+
let prevThreadIds = threadIds.sort();
|
|
617
|
+
this.disposeWithMe(this._commandService.onCommandExecuted((commandInfo) => {
|
|
618
|
+
if (commandInfo.id === RichTextEditingMutation.id) {
|
|
619
|
+
var _this$_context$unit$g3, _this$_context$unit$g4;
|
|
620
|
+
if (commandInfo.params.unitId !== this._context.unit.getUnitId()) return;
|
|
621
|
+
const currentThreadIds = (_this$_context$unit$g3 = (_this$_context$unit$g4 = this._context.unit.getBody()) === null || _this$_context$unit$g4 === void 0 || (_this$_context$unit$g4 = _this$_context$unit$g4.customDecorations) === null || _this$_context$unit$g4 === void 0 ? void 0 : _this$_context$unit$g4.filter((i) => i.type === CustomDecorationType.COMMENT).map((i) => i.id)) !== null && _this$_context$unit$g3 !== void 0 ? _this$_context$unit$g3 : [];
|
|
622
|
+
const currentThreadIdsSorted = currentThreadIds.sort();
|
|
623
|
+
if (JSON.stringify(prevThreadIds) !== JSON.stringify(currentThreadIdsSorted)) {
|
|
624
|
+
const preIds = new Set(prevThreadIds);
|
|
625
|
+
const currentIds = new Set(currentThreadIdsSorted);
|
|
626
|
+
const addIds = /* @__PURE__ */ new Set();
|
|
627
|
+
const deleteIds = /* @__PURE__ */ new Set();
|
|
628
|
+
currentThreadIds.forEach((id) => {
|
|
629
|
+
if (!preIds.has(id)) addIds.add(id);
|
|
630
|
+
});
|
|
631
|
+
prevThreadIds.forEach((id) => {
|
|
632
|
+
if (!currentIds.has(id)) deleteIds.add(id);
|
|
633
|
+
});
|
|
634
|
+
prevThreadIds = currentThreadIdsSorted;
|
|
635
|
+
addIds.forEach((id) => {
|
|
636
|
+
if (!this._threadCommentModel.getComment(unitId, subUnitId, id)) this._threadCommentModel.addComment(unitId, subUnitId, {
|
|
637
|
+
id,
|
|
638
|
+
threadId: id,
|
|
639
|
+
ref: "",
|
|
640
|
+
dT: "",
|
|
641
|
+
personId: "",
|
|
642
|
+
text: { dataStream: "" },
|
|
643
|
+
unitId,
|
|
644
|
+
subUnitId
|
|
645
|
+
});
|
|
646
|
+
});
|
|
647
|
+
this._threadCommentModel.syncThreadComments(unitId, subUnitId, [...addIds]);
|
|
648
|
+
}
|
|
649
|
+
}
|
|
650
|
+
}));
|
|
651
|
+
}
|
|
652
|
+
};
|
|
653
|
+
DocThreadCommentRenderController = __decorate([
|
|
654
|
+
__decorateParam(1, Inject(DocInterceptorService)),
|
|
655
|
+
__decorateParam(2, Inject(ThreadCommentPanelService)),
|
|
656
|
+
__decorateParam(3, Inject(DocRenderController)),
|
|
657
|
+
__decorateParam(4, IUniverInstanceService),
|
|
658
|
+
__decorateParam(5, Inject(ThreadCommentModel)),
|
|
659
|
+
__decorateParam(6, ICommandService)
|
|
660
|
+
], DocThreadCommentRenderController);
|
|
661
|
+
|
|
662
|
+
//#endregion
|
|
663
|
+
//#region src/plugin.ts
|
|
664
|
+
let UniverDocsThreadCommentUIPlugin = class UniverDocsThreadCommentUIPlugin extends Plugin {
|
|
665
|
+
constructor(_config = defaultPluginConfig, _injector, _renderManagerSrv, _configService) {
|
|
666
|
+
super();
|
|
667
|
+
this._config = _config;
|
|
668
|
+
this._injector = _injector;
|
|
669
|
+
this._renderManagerSrv = _renderManagerSrv;
|
|
670
|
+
this._configService = _configService;
|
|
671
|
+
const { menu, ...rest } = merge({}, defaultPluginConfig, this._config);
|
|
672
|
+
if (menu) this._configService.setConfig("menu", menu, { merge: true });
|
|
673
|
+
this._configService.setConfig(DOCS_THREAD_COMMENT_UI_PLUGIN_CONFIG_KEY, rest);
|
|
674
|
+
}
|
|
675
|
+
onStarting() {
|
|
676
|
+
[
|
|
677
|
+
[DocThreadCommentUIController],
|
|
678
|
+
[DocThreadCommentSelectionController],
|
|
679
|
+
[DocThreadCommentService]
|
|
680
|
+
].forEach((dep) => {
|
|
681
|
+
this._injector.add(dep);
|
|
682
|
+
});
|
|
683
|
+
}
|
|
684
|
+
onRendered() {
|
|
685
|
+
this._initRenderModule();
|
|
686
|
+
this._injector.get(DocThreadCommentSelectionController);
|
|
687
|
+
this._injector.get(DocThreadCommentUIController);
|
|
688
|
+
}
|
|
689
|
+
_initRenderModule() {
|
|
690
|
+
[DocThreadCommentRenderController].forEach((dep) => {
|
|
691
|
+
this._renderManagerSrv.registerRenderModule(UniverInstanceType.UNIVER_DOC, dep);
|
|
692
|
+
});
|
|
693
|
+
}
|
|
694
|
+
};
|
|
695
|
+
_defineProperty(UniverDocsThreadCommentUIPlugin, "pluginName", PLUGIN_NAME);
|
|
696
|
+
_defineProperty(UniverDocsThreadCommentUIPlugin, "packageName", name);
|
|
697
|
+
_defineProperty(UniverDocsThreadCommentUIPlugin, "version", version);
|
|
698
|
+
_defineProperty(UniverDocsThreadCommentUIPlugin, "type", UniverInstanceType.UNIVER_DOC);
|
|
699
|
+
UniverDocsThreadCommentUIPlugin = __decorate([
|
|
700
|
+
DependentOn(UniverThreadCommentUIPlugin),
|
|
701
|
+
__decorateParam(1, Inject(Injector)),
|
|
702
|
+
__decorateParam(2, IRenderManagerService),
|
|
703
|
+
__decorateParam(3, IConfigService)
|
|
704
|
+
], UniverDocsThreadCommentUIPlugin);
|
|
705
|
+
|
|
706
|
+
//#endregion
|
|
707
|
+
export { AddDocCommentComment, DeleteDocCommentComment, ShowCommentPanelOperation, StartAddCommentOperation, UniverDocsThreadCommentUIPlugin };
|