From 655bbd5a64ed6b195ed4b7f6b15b7ff3800489fc Mon Sep 17 00:00:00 2001
From: Giannis kopanas <jkopanas@gmail.com>
Date: Fri, 1 Dec 2023 01:29:18 +0200
Subject: [PATCH] feat(services): add users to comments
---
editors/demo/src/Editoria/Editoria.js | 7 ++++++-
wax-prosemirror-core/src/Wax.js | 2 ++
wax-prosemirror-core/src/WaxView.js | 2 ++
.../components/ConnectedComment.js | 9 +++++++--
.../components/ui/comments/CommentBox.js | 1 +
.../components/ui/comments/CommentItemList.js | 20 ++++++++++++++++---
6 files changed, 35 insertions(+), 6 deletions(-)
diff --git a/editors/demo/src/Editoria/Editoria.js b/editors/demo/src/Editoria/Editoria.js
index 3a72be1e7..85de6f39e 100644
--- a/editors/demo/src/Editoria/Editoria.js
+++ b/editors/demo/src/Editoria/Editoria.js
@@ -26,6 +26,11 @@ const user = {
username: 'admin',
};
+// const users = [{
+// userId: 'b3cfc28e-0f2e-45b5-b505-e66783d4f946',
+// username: 'admin',
+// }];
+
const Editoria = () => {
const [width] = useWindowSize();
@@ -62,7 +67,7 @@ const Editoria = () => {
/>
</>
),
- [layout, finalConfig],
+ [key, finalConfig, layout],
);
return <>{EditoriaComponent}</>;
};
diff --git a/wax-prosemirror-core/src/Wax.js b/wax-prosemirror-core/src/Wax.js
index 6eed226c9..75749f585 100644
--- a/wax-prosemirror-core/src/Wax.js
+++ b/wax-prosemirror-core/src/Wax.js
@@ -42,6 +42,7 @@ const Wax = forwardRef((props, ref) => {
readonly,
value,
user,
+ users,
onChange,
targetFormat,
scrollMargin,
@@ -80,6 +81,7 @@ const Wax = forwardRef((props, ref) => {
undefined
}
user={user}
+ users={users}
value={value}
>
{({ editor }) => <WaxRender className={className} editor={editor} />}
diff --git a/wax-prosemirror-core/src/WaxView.js b/wax-prosemirror-core/src/WaxView.js
index 5b0112f67..d5d314222 100644
--- a/wax-prosemirror-core/src/WaxView.js
+++ b/wax-prosemirror-core/src/WaxView.js
@@ -38,6 +38,7 @@ const WaxView = forwardRef((props, ref) => {
readonly,
autoFocus,
user,
+ users,
targetFormat,
serializer,
scrollMargin,
@@ -73,6 +74,7 @@ const WaxView = forwardRef((props, ref) => {
dispatchTransaction,
disallowedTools: [],
user,
+ users,
scrollMargin: scrollMargin || 200,
scrollThreshold: scrollThreshold || 200,
attributes: {
diff --git a/wax-prosemirror-services/src/CommentsService/components/ConnectedComment.js b/wax-prosemirror-services/src/CommentsService/components/ConnectedComment.js
index 2c7310e6f..3f8c44cfd 100644
--- a/wax-prosemirror-services/src/CommentsService/components/ConnectedComment.js
+++ b/wax-prosemirror-services/src/CommentsService/components/ConnectedComment.js
@@ -28,7 +28,7 @@ export default ({ comment, top, commentId, recalculateTops }) => {
pmViews,
pmViews: {
main: {
- props: { user },
+ props: { user, users },
},
},
app,
@@ -74,9 +74,14 @@ export default ({ comment, top, commentId, recalculateTops }) => {
const onClickPost = ({ commentValue, title }) => {
setClickPost(true);
+ let currentUser = users.find(u => u.currentUser === true);
+ if (user) {
+ currentUser = user;
+ }
const obj = {
content: commentValue,
- displayName: user.username,
+ displayName: currentUser ? currentUser.username : 'Anonymous',
+ userId: currentUser ? currentUser.userId : '1',
timestamp: Math.floor(Date.now()),
};
diff --git a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentBox.js b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentBox.js
index d93a90699..7059acf11 100644
--- a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentBox.js
+++ b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentBox.js
@@ -133,6 +133,7 @@ CommentBox.propTypes = {
PropTypes.shape({
content: PropTypes.string.isRequired,
displayName: PropTypes.string.isRequired,
+ userId: PropTypes.string,
timestamp: PropTypes.string.number,
}),
),
diff --git a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js
index ef66d305f..ca26962ba 100644
--- a/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js
+++ b/wax-prosemirror-services/src/CommentsService/components/ui/comments/CommentItemList.js
@@ -1,9 +1,9 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useContext } from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { clone, uniqueId } from 'lodash';
import { override, th } from '@pubsweet/ui-toolkit';
-
+import { WaxContext } from 'wax-prosemirror-core';
import CommentItem from './CommentItem';
const Wrapper = styled.div`
@@ -39,6 +39,15 @@ const CommentItemList = props => {
const [items, setItems] = useState(data);
+ const context = useContext(WaxContext);
+ const {
+ pmViews: {
+ main: {
+ props: { users },
+ },
+ },
+ } = context;
+
useEffect(() => {
if (!active) {
const first = clone(data[0]);
@@ -54,6 +63,8 @@ const CommentItemList = props => {
}
}, [active, data]);
+ const displayName = id => users.find(user => user.userId === id);
+
return (
<Wrapper active={active} className={className}>
{title && <CommentTitle>{title}</CommentTitle>}
@@ -61,7 +72,9 @@ const CommentItemList = props => {
<CommentItem
active={active}
content={item.content}
- displayName={item.displayName}
+ displayName={
+ displayName(item.userId)?.displayName || item.displayName
+ }
key={uniqueId('comment-item-')}
timestamp={item.timestamp}
/>
@@ -84,6 +97,7 @@ CommentItemList.propTypes = {
PropTypes.shape({
content: PropTypes.string.isRequired,
displayName: PropTypes.string.isRequired,
+ id: PropTypes.string,
timestamp: PropTypes.number.isRequired,
}),
),
--
GitLab