-
-
-
+
-
-
-
-
-
-
@@ -223,4 +303,6 @@ class SearchView extends Component {
}
}
-export {SearchView as default, SearchView, SearchSettingsView};
+const SearchViewWithObserver = observer(SearchView);
+
+export {SearchViewWithObserver as SearchView, SearchSettingsView};
diff --git a/apps/common/mobile/lib/view/collaboration/Comments.jsx b/apps/common/mobile/lib/view/collaboration/Comments.jsx
index 96d87328f..e76f84edc 100644
--- a/apps/common/mobile/lib/view/collaboration/Comments.jsx
+++ b/apps/common/mobile/lib/view/collaboration/Comments.jsx
@@ -4,6 +4,18 @@ import { f7, Popup, Sheet, Popover, Page, Toolbar, Navbar, NavLeft, NavRight, Na
import { useTranslation } from 'react-i18next';
import {Device} from '../../../utils/device';
+// Utils
+const sliceQuote = (text) => {
+ if (text) {
+ let sliced = text.slice(0, 100);
+ if (sliced.length < text.length) {
+ sliced += '...';
+ return sliced;
+ }
+ return text;
+ }
+};
+
// Add comment
const AddCommentPopup = inject("storeComments")(observer(props => {
@@ -533,16 +545,6 @@ const ViewComments = ({storeComments, storeAppOptions, onCommentMenuClick, onRes
const viewMode = !storeAppOptions.canComments;
const comments = storeComments.sortComments;
- const sliceQuote = (text) => {
- if (text) {
- let sliced = text.slice(0, 100);
- if (sliced.length < text.length) {
- sliced += '...';
- return sliced;
- }
- return text;
- }
- };
const [clickComment, setComment] = useState();
const [commentActionsOpened, openActionComment] = useState(false);
@@ -633,18 +635,123 @@ const ViewComments = ({storeComments, storeAppOptions, onCommentMenuClick, onRes
const _ViewComments = inject('storeComments', 'storeAppOptions')(observer(ViewComments));
-const CommentList = () => {
- return (
-
-
-
- )
-};
-
-const ViewCommentSheet = ({closeCurComments}) => {
+const CommentList = inject("storeComments", "storeAppOptions")(observer(({storeComments, storeAppOptions, onCommentMenuClick, onResolveComment}) => {
const { t } = useTranslation();
const _t = t('Common.Collaboration', {returnObjects: true});
+ const isAndroid = Device.android;
+ const viewMode = !storeAppOptions.canComments;
+
+ const comments = storeComments.showComments;
+
+ const [currentIndex, setCurrentIndex] = useState(0);
+ const comment = comments[currentIndex];
+
+ const [commentActionsOpened, openActionComment] = useState(false);
+
+ const [reply, setReply] = useState();
+ const [replyActionsOpened, openActionReply] = useState(false);
+
+ const onViewPrevComment = () => {
+ if (currentIndex - 1 < 0) {
+ setCurrentIndex(comments.length - 1);
+ } else {
+ setCurrentIndex(currentIndex - 1);
+ }
+ };
+
+ const onViewNextComment = () => {
+ if (currentIndex + 1 === comments.length) {
+ setCurrentIndex(0);
+ } else {
+ setCurrentIndex(currentIndex + 1);
+ }
+ };
+
+ return (
+
+
+ {!viewMode &&
+ {onCommentMenuClick('addReply', comment);}}>{_t.textAddReply}
+ }
+
+
+
+
+
+
+
+
+
+
+ {isAndroid &&
{comment.userInitials}
}
+
+
{comment.userName}
+
{comment.date}
+
+
+ {!viewMode &&
+
+
{onResolveComment(comment);}}>
+
{openActionComment(true);}}
+ >
+
+ }
+
+ {comment.quote &&
{sliceQuote(comment.quote)}
}
+
+ {comment.replies.length > 0 &&
+
+ {comment.replies.map((reply, indexReply) => {
+ return (
+ -
+
+
+
+
+
+ {isAndroid &&
{reply.userInitials}
}
+
+
{reply.userName}
+
{reply.date}
+
+
+ {!viewMode &&
+
+
{setReply(reply); openActionReply(true);}}
+ >
+
+
+
+ }
+
+
+
+
+
+ )
+ })}
+
+ }
+
+
+
+
+
+ )
+}));
+
+const ViewCommentSheet = ({closeCurComments, onCommentMenuClick, onResolveComment}) => {
useEffect(() => {
f7.sheet.open('#view-comment-sheet');
});
@@ -681,7 +788,6 @@ const ViewCommentSheet = ({closeCurComments}) => {
const swipeEnd = parseInt(touchObj.clientY);
const dist = swipeEnd - stateStartY;
if (isNeedClose) {
- f7.sheet.close('#view-comment-sheet');
closeCurComments();
} else if (stateHeight === '90%' && dist > 20) {
setHeight('45%');
@@ -689,28 +795,21 @@ const ViewCommentSheet = ({closeCurComments}) => {
};
return (
)
};
-const ViewCommentPopover = () => {
+const ViewCommentPopover = ({onCommentMenuClick, onResolveComment}) => {
useEffect(() => {
f7.popover.open('#view-comment-popover', '#btn-coauth');
});
return (
-