diff --git a/package-lock.json b/package-lock.json index 52477127..05b338a7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8259,8 +8259,7 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "aproba": { "version": "1.2.0", @@ -8281,16 +8280,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, - "optional": true, "requires": { - "balanced-match": "^1.0.0", + "balanced-match": "1.0.0", "concat-map": "0.0.1" } }, @@ -8303,20 +8300,17 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -8330,7 +8324,7 @@ "dev": true, "optional": true, "requires": { - "ms": "^2.1.1" + "ms": "2.1.1" } }, "deep-extend": { @@ -8408,7 +8402,7 @@ "dev": true, "optional": true, "requires": { - "safer-buffer": ">= 2.1.2 < 3" + "safer-buffer": "2.1.2" } }, "ignore-walk": { @@ -8417,7 +8411,7 @@ "dev": true, "optional": true, "requires": { - "minimatch": "^3.0.4" + "minimatch": "3.0.4" } }, "inflight": { @@ -8433,8 +8427,7 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -8446,9 +8439,8 @@ "version": "1.0.0", "bundled": true, "dev": true, - "optional": true, "requires": { - "number-is-nan": "^1.0.0" + "number-is-nan": "1.0.1" } }, "isarray": { @@ -8461,16 +8453,14 @@ "version": "3.0.4", "bundled": true, "dev": true, - "optional": true, "requires": { - "brace-expansion": "^1.1.7" + "brace-expansion": "1.1.11" } }, "minimist": { "version": "0.0.8", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "minipass": { "version": "2.3.5", @@ -8494,7 +8484,6 @@ "version": "0.5.1", "bundled": true, "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -8547,8 +8536,8 @@ "dev": true, "optional": true, "requires": { - "abbrev": "1", - "osenv": "^0.1.4" + "abbrev": "1.1.1", + "osenv": "0.1.5" } }, "npm-bundled": { @@ -8563,8 +8552,8 @@ "dev": true, "optional": true, "requires": { - "ignore-walk": "^3.0.1", - "npm-bundled": "^1.0.1" + "ignore-walk": "3.0.1", + "npm-bundled": "1.0.6" } }, "npmlog": { @@ -8582,8 +8571,7 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "object-assign": { "version": "4.1.1", @@ -8617,8 +8605,8 @@ "dev": true, "optional": true, "requires": { - "os-homedir": "^1.0.0", - "os-tmpdir": "^1.0.0" + "os-homedir": "1.0.2", + "os-tmpdir": "1.0.2" } }, "path-is-absolute": { @@ -8680,8 +8668,7 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "safer-buffer": { "version": "2.1.2", @@ -14056,9 +14043,9 @@ } }, "react-sortable-hoc": { - "version": "1.9.1", - "resolved": "https://registry.npmjs.org/react-sortable-hoc/-/react-sortable-hoc-1.9.1.tgz", - "integrity": "sha512-2VeofjRav8+eZeE5Nm/+b8mrA94rQ+gBsqhXi8pRBSjOWNqslU3ZEm+0XhSlfoXJY2lkgHipfYAUuJbDtCixRg==", + "version": "1.10.1", + "resolved": "https://registry.npmjs.org/react-sortable-hoc/-/react-sortable-hoc-1.10.1.tgz", + "integrity": "sha512-eVyv5rrK6qY9bG60bboRY78In7OpdRRg+hxp4QMLIjC/UJaFSU7exTYd0764GtXvBqh+b+faYGzren5/ffRYKw==", "requires": { "@babel/runtime": "7.3.4", "invariant": "2.2.4", diff --git a/package.json b/package.json index 7b728943..4c9f4b34 100644 --- a/package.json +++ b/package.json @@ -95,7 +95,7 @@ "react-router": "^4.3.1", "react-router-dom": "^4.3.1", "react-scrollbar": "^0.5.4", - "react-sortable-hoc": "^1.9.1", + "react-sortable-hoc": "^1.10.1", "react-stack-grid": "^0.7.1", "redux": "^4.0.1", "redux-persist": "^5.10.0", diff --git a/src/components/node/CommentForm/index.tsx b/src/components/node/CommentForm/index.tsx index a6811192..31f57cea 100644 --- a/src/components/node/CommentForm/index.tsx +++ b/src/components/node/CommentForm/index.tsx @@ -1,4 +1,4 @@ -import React, { FC, useCallback, KeyboardEventHandler } from 'react'; +import React, { FC, useCallback, KeyboardEventHandler, useEffect } from 'react'; import { Textarea } from '~/components/input/Textarea'; import { CommentWrapper } from '~/components/containers/CommentWrapper'; import * as styles from './styles.scss'; @@ -14,8 +14,14 @@ import { Group } from '~/components/containers/Group'; import { UPLOAD_SUBJECTS, UPLOAD_TARGETS, UPLOAD_TYPES } from '~/redux/uploads/constants'; import uuid from 'uuid4'; import * as UPLOAD_ACTIONS from '~/redux/uploads/actions'; +import { selectUploads } from '~/redux/uploads/selectors'; +import { IState } from '~/redux/store'; + +const mapStateToProps = (state: IState) => ({ + node: selectNode(state), + uploads: selectUploads(state), +}); -const mapStateToProps = selectNode; const mapDispatchToProps = { nodePostComment: NODE_ACTIONS.nodePostComment, nodeSetCommentData: NODE_ACTIONS.nodeSetCommentData, @@ -28,8 +34,8 @@ type IProps = ReturnType & }; const CommentFormUnconnected: FC = ({ - comment_data, - is_sending_comment, + node: { comment_data, is_sending_comment }, + uploads: { statuses, files }, id, nodePostComment, nodeSetCommentData, @@ -85,6 +91,49 @@ const CommentFormUnconnected: FC = ({ [onSubmit] ); + useEffect(() => { + const temp_ids = (comment_data && comment_data[id] && comment_data[id].temp_ids) || []; + const added_files = temp_ids + .map(temp_uuid => statuses[temp_uuid] && statuses[temp_uuid].uuid) + .map(el => !!el && files[el]) + .filter(el => !!el && !comment_data[id].files.some(file => file.id === el.id)); + + const filtered_temps = temp_ids.filter( + temp_id => + statuses[temp_id] && + statuses[temp_id].uuid && + !added_files.some(file => file.id === statuses[temp_id].uuid) + ); + + console.log({ temp_ids, added_files }); + + // if (added_files.length) { + nodeSetCommentData(id, { + ...comment_data[id], + temp_ids: filtered_temps, + files: [...comment_data[id].files, ...added_files], + }); + // } + + // if (filtered_temps.length) { + // leaving only currently uploading files + // nodeSetCommentData(id, assocPath(['temp_ids'], filtered_temps, comment_data[id])); + // } + + // console.log({ + // statuses, + // temp_ids, + // filtered_temps, + // added_files, + // }); + // Object.entries(statuses).forEach(([id, status]) => { + // if (temp.includes(id) && !!status.uuid && files[status.uuid]) { + // onFileAdd(files[status.uuid]); + // setTemp(temp.filter(el => el !== id)); + // } + // }); + }, [statuses, files]); + const comment = comment_data[id]; return ( @@ -111,6 +160,21 @@ const CommentFormUnconnected: FC = ({ + {comment.temp_ids.map( + temp_id => + statuses[temp_id] && + statuses[temp_id].is_uploading && ( +
{statuses[temp_id].progress}
+ ) + )} + {comment.files.map( + file => + file.name && ( +
+ {file.name} {file.mime} {file.size} +
+ ) + )} ); }; diff --git a/src/components/upload/ImageUpload/index.tsx b/src/components/upload/ImageUpload/index.tsx index 3f6edd72..f90f6156 100644 --- a/src/components/upload/ImageUpload/index.tsx +++ b/src/components/upload/ImageUpload/index.tsx @@ -11,9 +11,7 @@ interface IProps { is_uploading?: boolean; } -const ImageUpload: FC = ({ - thumb, id, progress, is_uploading, -}) => ( +const ImageUpload: FC = ({ thumb, progress, is_uploading }) => (
{thumb &&
}