@manuscripts/style-guide 1.3.5 → 1.3.6-LEAN-2705

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.
Files changed (110) hide show
  1. package/dist/cjs/components/EditorHeader/EditorHeader.js +3 -11
  2. package/dist/cjs/components/EditorHeader/ProceedView.js +25 -6
  3. package/dist/cjs/components/FileManager/{FileSectionItem/DragLayer.js → DragLayer.js} +12 -10
  4. package/dist/cjs/components/FileManager/FileActions.js +134 -0
  5. package/dist/cjs/components/FileManager/FileContainer.js +39 -0
  6. package/dist/cjs/components/FileManager/FileCreatedDate.js +25 -0
  7. package/dist/cjs/components/FileManager/FileManager.js +14 -125
  8. package/dist/cjs/components/FileManager/FileManagerProvider.js +2 -7
  9. package/dist/cjs/components/FileManager/FileName.js +27 -0
  10. package/dist/cjs/components/FileManager/FileSectionAlert.js +170 -0
  11. package/dist/cjs/components/FileManager/FileTypeIcon.js +22 -0
  12. package/dist/cjs/components/FileManager/{UploadFileArea.js → FileUploader.js} +19 -12
  13. package/dist/cjs/components/FileManager/InlineFilesSection.js +71 -126
  14. package/dist/cjs/components/FileManager/OtherFilesSection.js +101 -0
  15. package/dist/cjs/components/FileManager/SupplementsSection.js +118 -0
  16. package/dist/cjs/components/FileManager/{TooltipDiv.js → Tooltip.js} +8 -3
  17. package/dist/cjs/components/FileManager/util.js +52 -67
  18. package/dist/cjs/components/icons/corrupted-file-icon.js +27 -0
  19. package/dist/cjs/components/icons/document-icon-with-dot.js +1 -1
  20. package/dist/cjs/hooks/use-deep-compare.js +2 -2
  21. package/dist/cjs/hooks/use-files.js +29 -43
  22. package/dist/cjs/index.js +3 -4
  23. package/dist/cjs/lib/capabilities.js +1 -0
  24. package/dist/cjs/lib/files.js +85 -0
  25. package/dist/es/components/EditorHeader/EditorHeader.js +3 -11
  26. package/dist/es/components/EditorHeader/ProceedView.js +26 -7
  27. package/dist/es/components/FileManager/{FileSectionItem/DragLayer.js → DragLayer.js} +12 -10
  28. package/dist/es/components/FileManager/FileActions.js +104 -0
  29. package/dist/es/components/FileManager/FileContainer.js +33 -0
  30. package/dist/es/components/FileManager/FileCreatedDate.js +18 -0
  31. package/dist/es/components/FileManager/FileManager.js +16 -124
  32. package/dist/es/components/FileManager/FileManagerProvider.js +3 -8
  33. package/dist/es/components/FileManager/FileName.js +20 -0
  34. package/dist/es/components/FileManager/FileSectionAlert.js +163 -0
  35. package/dist/es/components/FileManager/FileTypeIcon.js +15 -0
  36. package/dist/es/components/FileManager/{UploadFileArea.js → FileUploader.js} +17 -10
  37. package/dist/es/components/FileManager/InlineFilesSection.js +72 -127
  38. package/dist/es/components/FileManager/OtherFilesSection.js +74 -0
  39. package/dist/es/components/FileManager/SupplementsSection.js +91 -0
  40. package/dist/es/components/FileManager/{TooltipDiv.js → Tooltip.js} +7 -2
  41. package/dist/es/components/FileManager/util.js +47 -65
  42. package/dist/es/components/icons/corrupted-file-icon.js +22 -0
  43. package/dist/es/components/icons/document-icon-with-dot.js +1 -1
  44. package/dist/es/hooks/use-deep-compare.js +2 -2
  45. package/dist/es/hooks/use-files.js +29 -40
  46. package/dist/es/index.js +2 -2
  47. package/dist/es/lib/capabilities.js +1 -0
  48. package/dist/es/lib/files.js +79 -0
  49. package/dist/types/components/EditorHeader/ProceedView.d.ts +0 -1
  50. package/dist/types/components/FileManager/FileActions.d.ts +19 -0
  51. package/dist/types/components/FileManager/FileContainer.d.ts +1 -0
  52. package/dist/types/components/FileManager/FileCreatedDate.d.ts +8 -0
  53. package/dist/types/components/FileManager/FileManager.d.ts +17 -8
  54. package/dist/types/components/FileManager/FileManagerProvider.d.ts +8 -18
  55. package/dist/types/components/FileManager/FileName.d.ts +6 -0
  56. package/dist/types/components/FileManager/FileSectionAlert.d.ts +13 -0
  57. package/dist/types/components/FileManager/{FileSectionItem/FileTypeIcon.d.ts → FileTypeIcon.d.ts} +2 -3
  58. package/dist/types/components/FileManager/FileUploader.d.ts +4 -0
  59. package/dist/types/components/FileManager/InlineFilesSection.d.ts +3 -19
  60. package/dist/types/components/FileManager/OtherFilesSection.d.ts +5 -0
  61. package/dist/types/components/FileManager/SupplementsSection.d.ts +5 -0
  62. package/dist/types/components/FileManager/Tooltip.d.ts +2 -0
  63. package/dist/types/components/FileManager/util.d.ts +8 -12
  64. package/dist/types/components/icons/corrupted-file-icon.d.ts +19 -0
  65. package/dist/types/hooks/use-files.d.ts +4 -6
  66. package/dist/types/index.d.ts +2 -2
  67. package/dist/types/lib/capabilities.d.ts +1 -0
  68. package/dist/types/lib/files.d.ts +24 -0
  69. package/package.json +3 -3
  70. package/dist/cjs/components/FileManager/ConfirmationPopUp.js +0 -90
  71. package/dist/cjs/components/FileManager/DragItemArea.js +0 -28
  72. package/dist/cjs/components/FileManager/FileSectionItem/DraggableFileSectionItem.js +0 -76
  73. package/dist/cjs/components/FileManager/FileSectionItem/FileInfo.js +0 -115
  74. package/dist/cjs/components/FileManager/FileSectionItem/FileSectionItem.js +0 -95
  75. package/dist/cjs/components/FileManager/FileSectionItem/FileSectionUploadItem.js +0 -37
  76. package/dist/cjs/components/FileManager/FileSectionItem/FileTypeIcon.js +0 -53
  77. package/dist/cjs/components/FileManager/FileSectionItem/ItemActions.js +0 -92
  78. package/dist/cjs/components/FileManager/FileSectionItem/ProgressBarUploadItem.js +0 -120
  79. package/dist/cjs/components/FileManager/FileSectionState.js +0 -83
  80. package/dist/cjs/components/FileManager/FilesSection.js +0 -61
  81. package/dist/cjs/components/FileManager/ItemsAction.js +0 -48
  82. package/dist/cjs/lib/inlineFiles.js +0 -92
  83. package/dist/es/components/FileManager/ConfirmationPopUp.js +0 -62
  84. package/dist/es/components/FileManager/DragItemArea.js +0 -21
  85. package/dist/es/components/FileManager/FileSectionItem/DraggableFileSectionItem.js +0 -46
  86. package/dist/es/components/FileManager/FileSectionItem/FileInfo.js +0 -85
  87. package/dist/es/components/FileManager/FileSectionItem/FileSectionItem.js +0 -88
  88. package/dist/es/components/FileManager/FileSectionItem/FileSectionUploadItem.js +0 -30
  89. package/dist/es/components/FileManager/FileSectionItem/FileTypeIcon.js +0 -46
  90. package/dist/es/components/FileManager/FileSectionItem/ItemActions.js +0 -65
  91. package/dist/es/components/FileManager/FileSectionItem/ProgressBarUploadItem.js +0 -113
  92. package/dist/es/components/FileManager/FileSectionState.js +0 -78
  93. package/dist/es/components/FileManager/FilesSection.js +0 -34
  94. package/dist/es/components/FileManager/ItemsAction.js +0 -42
  95. package/dist/es/lib/inlineFiles.js +0 -90
  96. package/dist/types/components/FileManager/ConfirmationPopUp.d.ts +0 -12
  97. package/dist/types/components/FileManager/DragItemArea.d.ts +0 -4
  98. package/dist/types/components/FileManager/FileSectionItem/DraggableFileSectionItem.d.ts +0 -3
  99. package/dist/types/components/FileManager/FileSectionItem/FileInfo.d.ts +0 -19
  100. package/dist/types/components/FileManager/FileSectionItem/FileSectionItem.d.ts +0 -38
  101. package/dist/types/components/FileManager/FileSectionItem/FileSectionUploadItem.d.ts +0 -12
  102. package/dist/types/components/FileManager/FileSectionItem/ItemActions.d.ts +0 -21
  103. package/dist/types/components/FileManager/FileSectionItem/ProgressBarUploadItem.d.ts +0 -4
  104. package/dist/types/components/FileManager/FileSectionState.d.ts +0 -38
  105. package/dist/types/components/FileManager/FilesSection.d.ts +0 -12
  106. package/dist/types/components/FileManager/ItemsAction.d.ts +0 -4
  107. package/dist/types/components/FileManager/TooltipDiv.d.ts +0 -1
  108. package/dist/types/components/FileManager/UploadFileArea.d.ts +0 -9
  109. package/dist/types/lib/inlineFiles.d.ts +0 -11
  110. /package/dist/types/components/FileManager/{FileSectionItem/DragLayer.d.ts → DragLayer.d.ts} +0 -0
@@ -1,88 +0,0 @@
1
- import React from 'react';
2
- import styled from 'styled-components';
3
- import { useDropdown } from '../../../hooks/use-dropdown';
4
- import { DropdownContainer } from '../../Dropdown';
5
- import { CloseOIcon } from '../../icons/';
6
- import DotsIcon from '../../icons/dots-icon';
7
- import { FileInfo } from './FileInfo';
8
- import { FileTypeIcon } from './FileTypeIcon';
9
- import { ItemActions } from './ItemActions';
10
- export const FileSectionItem = ({ fileSection, externalFile, title, showAttachmentName = false, showReplaceAction = true, handleDownload, handleReplace, handleSupplementReplace, dispatch, dragRef, className, style, onClose, isEditor, }) => {
11
- const { isOpen, toggleOpen, wrapperRef } = useDropdown();
12
- const fileExtension = externalFile.name.substring(externalFile.name.lastIndexOf('.') + 1);
13
- const isMainManuscript = externalFile.type.label === 'main-manuscript';
14
- const isSelected = externalFile.id == window.location.hash.substr(1);
15
- return (React.createElement(Item, { ref: dragRef, className: className, style: style },
16
- React.createElement(ItemContainer, { onClick: () => {
17
- window.location.hash =
18
- isEditor && !isSelected ? `#${externalFile.id}` : '#';
19
- if (isSelected) {
20
- window.location.hash = `#${externalFile.id}`;
21
- }
22
- } },
23
- React.createElement(FileTypeIcon, { withDot: isMainManuscript, fileExtension: fileExtension, alt: externalFile.name }),
24
- React.createElement(FileInfo, { fileExtension: fileExtension, fileCreatedDate: externalFile.createdDate, showAttachmentName: showAttachmentName, fileAttachmentName: externalFile.name, title: title, attachmentId: externalFile.id, dispatch: dispatch })),
25
- onClose && (React.createElement(IconCloseButton, { onClick: (e) => {
26
- e.preventDefault();
27
- onClose();
28
- } },
29
- React.createElement(CloseOIcon, { color: '#6E6E6E' }))),
30
- handleDownload && handleReplace && (React.createElement(DropdownContainer, { ref: wrapperRef },
31
- React.createElement(ActionsIcon, { onClick: toggleOpen, type: "button", "aria-label": "Download or Replace", "aria-pressed": isOpen },
32
- React.createElement(DotsIcon, null)),
33
- isOpen && (React.createElement(ItemActions, { fileSection: fileSection, isMainManuscript: isMainManuscript, replaceAttachmentHandler: handleReplace, showReplaceAction: showReplaceAction, downloadAttachmentHandler: handleDownload, handleSupplementReplace: handleSupplementReplace, attachmentId: externalFile.id, fileName: externalFile.name, publicUrl: externalFile.link, hideActionList: toggleOpen, dispatch: dispatch }))))));
34
- };
35
- const IconCloseButton = styled.button `
36
- border: none;
37
- background: transparent;
38
- cursor: pointer;
39
- padding: 0 8px;
40
- align-self: flex-start;
41
- &:hover {
42
- opacity: 0.5;
43
- }
44
- `;
45
- export const ActionsIcon = styled.button `
46
- visibility: hidden;
47
- border: none;
48
- background: transparent;
49
- cursor: pointer;
50
- padding: 0 8px;
51
- &:focus {
52
- outline: none;
53
- }
54
- &:hover svg circle {
55
- fill: #1a9bc7;
56
- }
57
- `;
58
- export const Item = styled.div `
59
- display: flex;
60
- font-family: ${(props) => props.theme.font.family.Lato};
61
- padding: 20px 15px;
62
- cursor: pointer;
63
- box-sizing: border-box;
64
- width: 100%;
65
- position: relative;
66
-
67
- &:hover,
68
- &:focus {
69
- background: #f2fbfc;
70
- }
71
-
72
- &:hover ${ActionsIcon} {
73
- visibility: visible;
74
- }
75
-
76
- ${DropdownContainer} {
77
- position: absolute;
78
- top: 24px;
79
- right: 0;
80
- margin-right: 8px;
81
- }
82
- `;
83
- export const ItemContainer = styled.div `
84
- display: flex;
85
- min-width: calc(100% - 8px);
86
- padding-right: 4px;
87
- box-sizing: border-box;
88
- `;
@@ -1,30 +0,0 @@
1
- import React from 'react';
2
- import styled from 'styled-components';
3
- import { FileInfoContainer, FileName, FileNameContainer } from './FileInfo';
4
- import { Item, ItemContainer } from './FileSectionItem';
5
- import { FileTypeIcon } from './FileTypeIcon';
6
- import { ProgressBarUploadItem } from './ProgressBarUploadItem';
7
- export const FileSectionUploadItem = ({ fileName, isLoading, dragRef, className, style, }) => {
8
- const fileExtension = fileName.substring(fileName.lastIndexOf('.') + 1);
9
- fileName = fileName.substring(0, fileName.lastIndexOf('.'));
10
- return (React.createElement(Item, { ref: dragRef, className: className, style: style },
11
- React.createElement(UploadItemContainer, null,
12
- React.createElement(FileTypeIcon, { withDot: false }),
13
- React.createElement(FileInfoContainer, null,
14
- React.createElement(FileNameContainer, null,
15
- React.createElement(FileName, null, fileName),
16
- React.createElement("div", null,
17
- ".",
18
- fileExtension)),
19
- isLoading && React.createElement(ProgressBarUploadItem, null)))));
20
- };
21
- export const UploadItemContainer = styled(ItemContainer) `
22
- min-width: calc(100% - 16px);
23
- `;
24
- export const ProgressBar = styled.div `
25
- background: #1a9bc7;
26
- opacity: 0.7;
27
- border-radius: 8px 0 0 8px;
28
- width: 20%;
29
- height: 100%;
30
- `;
@@ -1,46 +0,0 @@
1
- import React from 'react';
2
- import ReactTooltip from 'react-tooltip';
3
- import styled from 'styled-components';
4
- import DocumentIconWithDot from '../../icons/document-icon-with-dot';
5
- import UnknownFormatFileIcon from '../../icons/unknown-format-file-icon';
6
- import { TooltipDiv } from '../TooltipDiv';
7
- import { extensionsWithFileTypesMap, fileTypesWithIconMap } from '../util';
8
- export const FileTypeIcon = ({ withDot, fileExtension, alt }) => {
9
- let fileIcon = React.createElement(UnknownFormatFileIcon, null);
10
- if (withDot) {
11
- return (React.createElement(Container, null,
12
- React.createElement(DocumentIconWithDot, null),
13
- React.createElement(TooltipDiv, null,
14
- React.createElement(ReactTooltip, { id: "dot", place: "bottom", effect: "float", className: "tooltip" },
15
- React.createElement("div", null, "Main manuscript. Only one file per submission")))));
16
- }
17
- if (fileExtension) {
18
- const fileType = extensionsWithFileTypesMap.get(fileExtension.toLowerCase());
19
- fileIcon = fileTypesWithIconMap.get(fileType);
20
- }
21
- return React.createElement(Container, null, fileIcon);
22
- };
23
- const Container = styled.div `
24
- width: 40px;
25
- min-width: 40px;
26
- height: 40px;
27
- display: flex;
28
- justify-content: center;
29
- align-items: center;
30
- box-sizing: border-box;
31
- border-radius: 4px;
32
- position: relative;
33
- `;
34
- const Img = styled.img `
35
- width: 100%;
36
- height: 100%;
37
- border-radius: 4px;
38
- `;
39
- const VideoIconContainer = styled.div `
40
- width: 100%;
41
- height: 100%;
42
- position: absolute;
43
- display: flex;
44
- align-items: center;
45
- justify-content: center;
46
- `;
@@ -1,65 +0,0 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
- import React, { useContext, useRef, useState, } from 'react';
11
- import { DropdownList } from '../../Dropdown';
12
- import { PermissionsContext } from '../FileManager';
13
- import { FileManagerContext } from '../FileManagerProvider';
14
- import { actions } from '../FileSectionState';
15
- import { ActionsItem } from '../ItemsAction';
16
- import { FileSectionType } from '../util';
17
- export const ItemActions = ({ fileSection, isMainManuscript, downloadAttachmentHandler, replaceAttachmentHandler, handleSupplementReplace, detachAttachmnetHandler, handleUpdateInline, attachmentId, fileName, publicUrl, hideActionList, dispatch, dropDownClassName, showReplaceAction, }) => {
18
- const can = useContext(PermissionsContext);
19
- const { setMoveFilePopupData } = useContext(FileManagerContext);
20
- const canBeReplaced = showReplaceAction == undefined || showReplaceAction;
21
- const fileInputRef = useRef(null);
22
- const [selectedFile, setSelectedFile] = useState();
23
- const handleChange = (event) => __awaiter(void 0, void 0, void 0, function* () {
24
- if (event && event.target && event.target.files) {
25
- const file = event.target.files[0];
26
- setSelectedFile(file);
27
- if (dispatch) {
28
- dispatch(actions.HANDLE_UPLOAD_ACTION());
29
- }
30
- const result = yield replaceAttachmentHandler(attachmentId, fileName, file);
31
- if (fileSection === FileSectionType.Supplements &&
32
- typeof result === 'object' &&
33
- handleSupplementReplace) {
34
- handleSupplementReplace(result, attachmentId);
35
- }
36
- if (typeof result === 'object' && handleUpdateInline) {
37
- handleUpdateInline(result);
38
- }
39
- if (dispatch) {
40
- dispatch(actions.HANDLE_FINISH_UPLOAD());
41
- }
42
- hideActionList();
43
- }
44
- });
45
- const openFileDialog = () => {
46
- if (fileInputRef && fileInputRef.current) {
47
- fileInputRef.current.click();
48
- }
49
- };
50
- return (React.createElement(DropdownList, { direction: 'right', className: dropDownClassName, width: 200, height: 120, top: 5, onClick: hideActionList },
51
- React.createElement(ActionsItem, { onClick: () => {
52
- publicUrl !== undefined ? downloadAttachmentHandler(publicUrl) : {};
53
- } }, "Download"),
54
- (can === null || can === void 0 ? void 0 : can.replaceFile) && canBeReplaced && (React.createElement(React.Fragment, null,
55
- React.createElement(ActionsItem, { onClick: openFileDialog }, "Replace"),
56
- React.createElement("input", { ref: fileInputRef, type: "file", style: { display: 'none' }, onChange: (e) => handleChange(e), value: '' }))),
57
- (can === null || can === void 0 ? void 0 : can.editArticle) && detachAttachmnetHandler && (React.createElement(ActionsItem, { onClick: () => detachAttachmnetHandler() }, "Detach")),
58
- !isMainManuscript &&
59
- fileSection !== FileSectionType.Inline &&
60
- (can === null || can === void 0 ? void 0 : can.moveFile) && (React.createElement(ActionsItem, { onClick: () => setMoveFilePopupData({ isOpen: true, attachmentId, fileSection }) },
61
- "Move to",
62
- ' ',
63
- (fileSection === FileSectionType.OtherFile && 'Supplements') ||
64
- 'Other files'))));
65
- };
@@ -1,113 +0,0 @@
1
- import React from 'react';
2
- import styled from 'styled-components';
3
- export const ProgressBarUploadItem = () => {
4
- return (React.createElement(LinearProgress, null,
5
- React.createElement(Bar, { className: "bar1" }),
6
- React.createElement(Bar, { className: "bar2" })));
7
- };
8
- export const LinearProgress = styled.div `
9
- background: ${(props) => props.theme.colors.background.tertiary};
10
- opacity: 0.7;
11
- height: 4px;
12
- position: relative;
13
- width: 100%;
14
- margin: 0 auto;
15
- margin-top: 8px;
16
- overflow: hidden;
17
- border-radius: 8px;
18
- animation: start 0.3s ease-in;
19
- `;
20
- export const Bar = styled.div `
21
- position: absolute;
22
- opacity: 0.7;
23
- background: #1a9bc7;
24
- transition: transform 0.2s linear;
25
- position: absolute;
26
- left: 0;
27
- top: 0;
28
- bottom: 0;
29
- width: 100%;
30
-
31
- &.bar1 {
32
- animation: growBar1 2.5s infinite, moveBar1 2.5s infinite;
33
- }
34
-
35
- &.bar2 {
36
- animation: growBar2 2.5s infinite, moveBar2 2.5s infinite;
37
- }
38
-
39
- @keyframes growBar1 {
40
- 0% {
41
- animation-timing-function: linear;
42
- transform: scaleX(0.1);
43
- }
44
- 35% {
45
- animation-timing-function: cubic-bezier(0.3, 0.1, 0.7, 1);
46
- transform: scaleX(0.1);
47
- }
48
- 70% {
49
- animation-timing-function: cubic-bezier(0.2, 0, 0.2, 1.4);
50
- transform: scaleX(0.8);
51
- }
52
- 100% {
53
- transform: scaleX(0.1);
54
- }
55
- }
56
-
57
- @keyframes moveBar1 {
58
- 0% {
59
- left: -105%;
60
- animation-timing-function: linear;
61
- }
62
- 20% {
63
- left: -105%;
64
- animation-timing-function: cubic-bezier(0.5, 0, 0.7, 0.4);
65
- }
66
- 60% {
67
- left: 21%;
68
- animation-timing-function: cubic-bezier(0.3, 0.4, 0.55, 0.9);
69
- }
70
- 80% {
71
- left: 40%;
72
- animation-timing-function: cubic-bezier(0.1, 0.2, 0.3, 0.95);
73
- }
74
- 100% {
75
- left: 90%;
76
- }
77
- }
78
-
79
- @keyframes growBar2 {
80
- 0% {
81
- animation-timing-function: cubic-bezier(0.2, 0, 0.5, 0.4);
82
- transform: scaleX(0.1);
83
- }
84
- 20% {
85
- animation-timing-function: cubic-bezier(0.1, 0.2, 0.6, 1);
86
- transform: scaleX(0.3);
87
- }
88
- 60% {
89
- animation-timing-function: cubic-bezier(0.2, 0, 0.2, 1.4);
90
- transform: scaleX(0.6);
91
- }
92
- 100% {
93
- transform: scaleX(0.1);
94
- }
95
- }
96
- @keyframes moveBar2 {
97
- 0% {
98
- left: -100%;
99
- animation-timing-function: cubic-bezier(0.15, 0, 0.5, 0.4);
100
- }
101
- 25% {
102
- left: -50%;
103
- animation-timing-function: cubic-bezier(0.3, 0.3, 0.8, 0.7);
104
- }
105
- 50% {
106
- left: 45%;
107
- animation-timing-function: cubic-bezier(0.1, 0.6, 0.6, 0.9);
108
- }
109
- 100% {
110
- left: 95%;
111
- }
112
- }
113
- `;
@@ -1,78 +0,0 @@
1
- export const getInitialState = () => ({
2
- uploadedFile: undefined,
3
- isUploadFile: false,
4
- moveToOtherState: undefined,
5
- fileUploadedSuccessfullySection: undefined,
6
- successMessage: '',
7
- isShowSuccessMessage: false,
8
- currentSection: undefined,
9
- });
10
- var ActionTypes;
11
- (function (ActionTypes) {
12
- ActionTypes["UPLOAD_FILE"] = "UploadFile";
13
- ActionTypes["MOVE_FILE"] = "moveFile";
14
- ActionTypes["HANDLE_CANCEL_UPLOAD"] = "handleCancel";
15
- ActionTypes["HANDLE_UPLOAD_ACTION"] = "handleUpload";
16
- ActionTypes["HANDLE_FINISH_UPLOAD"] = "handleFinishUpload";
17
- ActionTypes["HANDLE_SUCCESS_MESSAGE"] = "handleSuccessMessage";
18
- ActionTypes["HANDLE_SUCCESS_MESSAGE_DISMISS"] = "handleSuccessMessageDismiss";
19
- })(ActionTypes || (ActionTypes = {}));
20
- export const reducer = (state, action) => {
21
- switch (action.type) {
22
- case ActionTypes.UPLOAD_FILE: {
23
- return Object.assign(Object.assign({}, state), { uploadedFile: action.uploadFile, currentSection: action.sectionType });
24
- }
25
- case ActionTypes.MOVE_FILE: {
26
- return Object.assign(Object.assign({}, state), { moveToOtherState: {
27
- typeId: action.typeId,
28
- name: action.name,
29
- }, successMessage: action.successMoveMessage, isShowSuccessMessage: false });
30
- }
31
- case ActionTypes.HANDLE_UPLOAD_ACTION: {
32
- return Object.assign(Object.assign({}, state), { isUploadFile: true, isShowSuccessMessage: false, fileUploadedSuccessfullySection: undefined, successMessage: '' });
33
- }
34
- case ActionTypes.HANDLE_CANCEL_UPLOAD: {
35
- return Object.assign({}, state);
36
- }
37
- case ActionTypes.HANDLE_FINISH_UPLOAD: {
38
- return Object.assign(Object.assign({}, state), { isUploadFile: false, uploadedFile: undefined });
39
- }
40
- case ActionTypes.HANDLE_SUCCESS_MESSAGE: {
41
- return Object.assign(Object.assign({}, state), { isShowSuccessMessage: true, successMessage: action.successMessage, fileUploadedSuccessfullySection: action.sectionType });
42
- }
43
- case ActionTypes.HANDLE_SUCCESS_MESSAGE_DISMISS: {
44
- return Object.assign(Object.assign({}, state), { isShowSuccessMessage: false, successMessage: '', fileUploadedSuccessfullySection: undefined });
45
- }
46
- }
47
- return state;
48
- };
49
- export const actions = {
50
- UPLOAD_FILE: (uploadFile, sectionType) => ({
51
- type: ActionTypes.UPLOAD_FILE,
52
- uploadFile,
53
- sectionType,
54
- }),
55
- HANDLE_UPLOAD_ACTION: () => ({
56
- type: ActionTypes.HANDLE_UPLOAD_ACTION,
57
- }),
58
- HANDLE_CANCEL_UPLOAD: () => ({
59
- type: ActionTypes.HANDLE_CANCEL_UPLOAD,
60
- }),
61
- MOVE_FILE: (attachmentId, typeId, name, successMoveMessage) => ({
62
- type: ActionTypes.MOVE_FILE,
63
- typeId,
64
- name,
65
- successMoveMessage,
66
- }),
67
- HANDLE_FINISH_UPLOAD: () => ({
68
- type: ActionTypes.HANDLE_FINISH_UPLOAD,
69
- }),
70
- HANDLE_SUCCESS_MESSAGE: (successMessage, sectionType) => ({
71
- type: ActionTypes.HANDLE_SUCCESS_MESSAGE,
72
- successMessage,
73
- sectionType,
74
- }),
75
- HANDLE_SUCCESS_MESSAGE_DISMISS: () => ({
76
- type: ActionTypes.HANDLE_SUCCESS_MESSAGE_DISMISS,
77
- }),
78
- };
@@ -1,34 +0,0 @@
1
- import React, { useContext, useEffect } from 'react';
2
- import { AlertMessage, AlertMessageType } from '../AlertMessage';
3
- import { PermissionsContext } from './FileManager';
4
- import { FileSectionUploadItem } from './FileSectionItem/FileSectionUploadItem';
5
- import { actions } from './FileSectionState';
6
- import { UploadFileArea } from './UploadFileArea';
7
- import { FileSectionType } from './util';
8
- export const FilesSection = ({ enableDragAndDrop, handleUpload, fileSection, filesItem, dispatch, state, }) => {
9
- let uploadedFileExtension = '';
10
- if (state.uploadedFile) {
11
- uploadedFileExtension = state.uploadedFile.name.substring(state.uploadedFile.name.lastIndexOf('.') + 1);
12
- }
13
- const isSupplementFilesTab = fileSection === FileSectionType.Supplements;
14
- const isOtherFileTab = fileSection === FileSectionType.OtherFile;
15
- const can = useContext(PermissionsContext);
16
- useEffect(() => {
17
- state.uploadedFile &&
18
- fileSection === state.currentSection &&
19
- handleUpload(state.uploadedFile);
20
- }, [state.uploadedFile]);
21
- const handleSuccessMessage = () => {
22
- return (React.createElement(AlertMessage, { type: AlertMessageType.success, hideCloseButton: true, dismissButton: {
23
- text: 'OK',
24
- action: () => dispatch(actions.HANDLE_SUCCESS_MESSAGE_DISMISS()),
25
- } }, state.successMessage));
26
- };
27
- return (React.createElement("div", null,
28
- (can === null || can === void 0 ? void 0 : can.uploadFile) && (React.createElement(React.Fragment, null,
29
- (isOtherFileTab || isSupplementFilesTab) && (React.createElement(UploadFileArea, { handleUploadFile: handleUpload, fileSection: fileSection, dispatch: dispatch })),
30
- state.isUploadFile && state.uploadedFile && (React.createElement(FileSectionUploadItem, { fileName: state.uploadedFile.name, isLoading: state.isUploadFile })))),
31
- state.fileUploadedSuccessfullySection === fileSection &&
32
- handleSuccessMessage(),
33
- filesItem));
34
- };
@@ -1,42 +0,0 @@
1
- import styled from 'styled-components';
2
- export const ActionsBox = styled.ul `
3
- border: 1px solid #e2e2e2;
4
- box-sizing: border-box;
5
- box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.3);
6
- border-radius: 4px;
7
- min-width: 180px;
8
- background: ${(props) => props.theme.colors.background.primary};
9
- margin: 0;
10
- padding: 8px 0;
11
- z-index: 999;
12
- text-align: left;
13
- list-style-type: none;
14
- `;
15
- export const ActionsItem = styled.li `
16
- font-family: ${(props) => props.theme.font.family.Lato};
17
- cursor: pointer;
18
- font-size: 16px;
19
- line-height: 24px;
20
- color: ${(props) => props.theme.colors.text.primary};
21
- list-style: none;
22
- padding: 8px 16px;
23
- &:hover,
24
- &:focus {
25
- background: #f2fbfc;
26
- }
27
- `;
28
- export const ActionsLabel = styled.li `
29
- font-family: ${(props) => props.theme.font.family.Lato};
30
- font-size: 12px;
31
- line-height: 16px;
32
- color: ${(props) => props.theme.colors.text.onLight};
33
- list-style: none;
34
- padding: 8px 16px;
35
- cursor: default;
36
- `;
37
- export const ActionsSeparator = styled.li `
38
- height: 1px;
39
- background: ${(props) => props.theme.colors.background.tertiary};
40
- margin: 8px 0;
41
- cursor: default;
42
- `;
@@ -1,90 +0,0 @@
1
- import { ObjectTypes, } from '@manuscripts/json-schema';
2
- import { hasObjectType } from '@manuscripts/transform';
3
- import { FileType } from '../components/FileManager/util';
4
- const getFigureData = (element, modelMap, attachmentsMap) => {
5
- const attachments = [];
6
- element.containedObjectIDs.map((id) => {
7
- const object = modelMap.get(id);
8
- if (object && object.objectType === ObjectTypes.Figure) {
9
- const figure = object;
10
- if (figure.src) {
11
- const attachment = attachmentsMap.get(figure.src.replace('attachment:', ''));
12
- if (attachment) {
13
- attachment.modelId = id;
14
- attachments.push(attachment);
15
- }
16
- }
17
- }
18
- });
19
- return {
20
- id: element._id,
21
- attachments,
22
- };
23
- };
24
- export default (modelMap, attachments) => {
25
- const files = [];
26
- const attachmentsMap = new Map(attachments.map((attachment) => [attachment.id, attachment]));
27
- const { graphicalAbstractFigureId, figureElement } = getAuxiliaryObjects(modelMap);
28
- if (graphicalAbstractFigureId) {
29
- const element = modelMap.get(graphicalAbstractFigureId);
30
- files.unshift(Object.assign(Object.assign({}, getFigureData(element, modelMap, attachmentsMap)), { label: `Graphical Abstract`, type: FileType.GraphicalAbstract }));
31
- }
32
- figureElement.map((id, index) => {
33
- const element = modelMap.get(id);
34
- files.push(Object.assign(Object.assign({}, getFigureData(element, modelMap, attachmentsMap)), { label: `Figure ${index + 1}`, type: FileType.Figure }));
35
- });
36
- return files;
37
- };
38
- const getAuxiliaryObjects = (modelMap) => {
39
- var _a, _b;
40
- let graphicalAbstractFigureId, figureElementIds = [];
41
- const tableElementIds = [], orderObjects = {};
42
- for (const model of modelMap.values()) {
43
- switch (model.objectType) {
44
- case ObjectTypes.Section: {
45
- const section = model;
46
- if (section.category === 'MPSectionCategory:abstract-graphical') {
47
- graphicalAbstractFigureId = (_a = section.elementIDs) === null || _a === void 0 ? void 0 : _a.find((id) => {
48
- const obj = modelMap.get(id);
49
- return obj && hasObjectType(ObjectTypes.FigureElement)(obj);
50
- });
51
- }
52
- else {
53
- (_b = section.elementIDs) === null || _b === void 0 ? void 0 : _b.map((elementId) => {
54
- const element = modelMap.get(elementId);
55
- if (!element) {
56
- return;
57
- }
58
- switch (element.objectType) {
59
- case ObjectTypes.FigureElement:
60
- figureElementIds.push(element._id);
61
- break;
62
- case ObjectTypes.TableElement:
63
- tableElementIds.push(element._id);
64
- break;
65
- }
66
- });
67
- }
68
- break;
69
- }
70
- case ObjectTypes.ElementsOrder: {
71
- const elementsOrder = model;
72
- orderObjects[elementsOrder.elementType] = elementsOrder;
73
- }
74
- }
75
- }
76
- if (graphicalAbstractFigureId) {
77
- figureElementIds = figureElementIds.filter((id) => id != graphicalAbstractFigureId);
78
- }
79
- return {
80
- graphicalAbstractFigureId,
81
- figureElement: sortAuxiliaryObject(figureElementIds, orderObjects[ObjectTypes.FigureElement]),
82
- tableElement: sortAuxiliaryObject(tableElementIds, orderObjects[ObjectTypes.TableElement]),
83
- };
84
- };
85
- const sortAuxiliaryObject = (auxiliaryObjectIds, orderObject) => {
86
- if (!orderObject) {
87
- return auxiliaryObjectIds;
88
- }
89
- return auxiliaryObjectIds.sort((a, b) => orderObject.elements.indexOf(a) - orderObject.elements.indexOf(b));
90
- };
@@ -1,12 +0,0 @@
1
- import React, { Dispatch } from 'react';
2
- import { Action } from './FileSectionState';
3
- export declare const ConfirmationPopUp: React.FC<{
4
- popupHeader: string;
5
- popUpMessage: string;
6
- isOpen: boolean;
7
- handleClose: () => void;
8
- handleMove: () => void;
9
- }>;
10
- export declare const MoveFilePopup: React.FC<{
11
- dispatch: Dispatch<Action>;
12
- }>;
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- export declare const DragItemArea: React.FC<{
3
- text: string;
4
- }>;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- import { FileSectionItemProps } from './FileSectionItem';
3
- export declare const DraggableFileSectionItem: React.FC<FileSectionItemProps>;
@@ -1,19 +0,0 @@
1
- import React, { Dispatch } from 'react';
2
- import { Action } from '../FileSectionState';
3
- export declare const FileInfo: React.FC<{
4
- showAttachmentName: boolean;
5
- title: string;
6
- fileAttachmentName: string;
7
- fileExtension: string;
8
- attachmentId: string;
9
- fileCreatedDate: Date;
10
- dispatch?: Dispatch<Action>;
11
- }>;
12
- export declare const FileDateContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
13
- export declare const FileInfoContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
14
- export declare const FileNameTitleContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
15
- export declare const FileTitle: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
16
- export declare const FileNameContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
17
- export declare const FileName: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
18
- export declare const FileDate: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
19
- export declare const FileDescription: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
@@ -1,38 +0,0 @@
1
- import React, { CSSProperties, Dispatch } from 'react';
2
- import { DragElementWrapper, DragSourceOptions } from 'react-dnd';
3
- import { Maybe } from '../../SubmissionInspector/types';
4
- import { Replace } from '../FileManager';
5
- import { Action } from '../FileSectionState';
6
- import { FileSectionType } from '../util';
7
- export type FileAttachment = {
8
- id: string;
9
- name: string;
10
- type: FileAttachmentType;
11
- link: string;
12
- createdDate: Date;
13
- };
14
- export type FileAttachmentType = {
15
- id: string;
16
- label?: Maybe<string> | undefined;
17
- };
18
- export interface FileSectionItemProps {
19
- externalFile: FileAttachment;
20
- fileSection: FileSectionType;
21
- title: string;
22
- showAttachmentName?: boolean;
23
- showActions?: boolean;
24
- showReplaceAction?: boolean;
25
- handleDownload?: (url: string) => void;
26
- handleReplace?: Replace;
27
- handleSupplementReplace?: (attachment: FileAttachment, oldAttachmentId: string) => void;
28
- dispatch?: Dispatch<Action>;
29
- dragRef?: DragElementWrapper<DragSourceOptions>;
30
- className?: string;
31
- style?: CSSProperties;
32
- onClose?: () => void;
33
- isEditor?: boolean;
34
- }
35
- export declare const FileSectionItem: React.FC<FileSectionItemProps>;
36
- export declare const ActionsIcon: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
37
- export declare const Item: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
38
- export declare const ItemContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;