@selfcommunity/react-ui 0.7.0-alpha.354 → 0.7.0-alpha.356

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 (18) hide show
  1. package/lib/cjs/components/AccountDataPortability/AccountDataPortability.js +3 -1
  2. package/lib/cjs/components/Notification/ContributionFollow/ContributionFollow.js +0 -2
  3. package/lib/cjs/components/PrivateMessageEditor/MessageMediaUploader/index.js +7 -7
  4. package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.d.ts +1 -0
  5. package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js +15 -5
  6. package/lib/cjs/shared/MessageChunkUploader/index.js +6 -2
  7. package/lib/cjs/utils/thumbnailCoverter.d.ts +7 -2
  8. package/lib/cjs/utils/thumbnailCoverter.js +85 -48
  9. package/lib/esm/components/AccountDataPortability/AccountDataPortability.js +3 -1
  10. package/lib/esm/components/Notification/ContributionFollow/ContributionFollow.js +0 -2
  11. package/lib/esm/components/PrivateMessageEditor/MessageMediaUploader/index.js +8 -8
  12. package/lib/esm/components/PrivateMessageThreadItem/PrivateMessageThreadItem.d.ts +1 -0
  13. package/lib/esm/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js +15 -5
  14. package/lib/esm/shared/MessageChunkUploader/index.js +7 -3
  15. package/lib/esm/utils/thumbnailCoverter.d.ts +7 -2
  16. package/lib/esm/utils/thumbnailCoverter.js +81 -46
  17. package/lib/umd/react-ui.js +1 -1
  18. package/package.json +5 -5
package/lib/cjs/components/AccountDataPortability/AccountDataPortability.js CHANGED
@@ -165,7 +165,9 @@ function AccountDataPortability(inProps) {
165
165
  ul: (chunks) => react_1.default.createElement("ul", null, chunks)
166
166
  } })),
167
167
  react_1.default.createElement(lab_1.LoadingButton, { size: "small", loading: (dataPortability && dataPortability.computing) || loading, disabled: !dataPortability ||
168
- (dataPortability && (dataPortability.computing || (0, date_fns_1.differenceInHours)(new Date(), (0, date_fns_1.parseISO)(dataPortability.requested_at.toString())) < 24)), loadingPosition: "start", startIcon: react_1.default.createElement(Icon_1.default, null, "folder_open"), variant: "outlined", className: classes.createButton, onClick: handleCreateDataPortabilityFile }, (dataPortability && dataPortability.computing) || loading ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.accountDataPortability.createLoadingButton", defaultMessage: "ui.accountDataPortability.createLoadingButton" })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.accountDataPortability.createButton", defaultMessage: "ui.accountDataPortability.createButton" }))),
168
+ (dataPortability &&
169
+ (dataPortability.computing ||
170
+ (dataPortability.requested_at && (0, date_fns_1.differenceInHours)(new Date(), (0, date_fns_1.parseISO)(dataPortability.requested_at.toString())) < 24))), loadingPosition: "start", startIcon: react_1.default.createElement(Icon_1.default, null, "folder_open"), variant: "outlined", className: classes.createButton, onClick: handleCreateDataPortabilityFile }, (dataPortability && dataPortability.computing) || loading ? (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.accountDataPortability.createLoadingButton", defaultMessage: "ui.accountDataPortability.createLoadingButton" })) : (react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.accountDataPortability.createButton", defaultMessage: "ui.accountDataPortability.createButton" }))),
169
171
  dataPortability && !dataPortability.computing && dataPortability.generated_at && (react_1.default.createElement(lab_1.LoadingButton, { size: "small", loading: downloadingDataPortability, loadingPosition: "start", startIcon: react_1.default.createElement(Icon_1.default, null, "cloud_download_outlined"), variant: 'outlined', className: classes.downloadButton, onClick: handleDownloadDataPortabilityFile },
170
172
  react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.accountDataPortability.downloadButton", defaultMessage: "ui.accountDataPortability.downloadButton" }))),
171
173
  react_1.default.createElement("br", null),
package/lib/cjs/components/Notification/ContributionFollow/ContributionFollow.js CHANGED
@@ -61,8 +61,6 @@ function ContributionFollowNotification(props) {
61
61
  b: (...chunks) => react_1.default.createElement("strong", null, chunks)
62
62
  })), secondary: react_1.default.createElement(react_1.default.Fragment, null,
63
63
  template === types_1.SCNotificationObjectTemplateType.SNIPPET && (react_1.default.createElement(react_1.default.Fragment, null,
64
- ":",
65
- ' ',
66
64
  react_1.default.createElement(react_core_1.Link, { to: scRoutingContext.url(react_core_1.SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], (0, contribution_1.getRouteData)(notificationObject[contributionType])) },
67
65
  react_1.default.createElement(material_1.Typography, { variant: "body2", className: classes.contributionText }, (0, contribution_1.getContributionSnippet)(notificationObject[contributionType]))))),
68
66
  (template === types_1.SCNotificationObjectTemplateType.DETAIL || template === types_1.SCNotificationObjectTemplateType.SNIPPET) && (react_1.default.createElement("div", null,
package/lib/cjs/components/PrivateMessageEditor/MessageMediaUploader/index.js CHANGED
@@ -101,12 +101,8 @@ function MessageMediaUploader(props) {
101
101
  onTouchStart: mouseEnter,
102
102
  onTouchMove: mouseLeave
103
103
  });
104
- const filterBySizeAndType = (file, index, files) => {
105
- if (files.length > 1) {
106
- return files.every((obj) => obj.type.startsWith(types_1.SCMessageFileType.IMAGE) || obj.type.startsWith(types_1.SCMessageFileType.VIDEO) || obj.type.startsWith(types_1.SCMessageFileType.PDF));
107
- }
108
- return (file.size < MAX_FILE_SIZE &&
109
- (file.type.startsWith(types_1.SCMessageFileType.IMAGE) || file.type.startsWith(types_1.SCMessageFileType.VIDEO) || file.type.startsWith(types_1.SCMessageFileType.PDF)));
104
+ const filterBySizeAndType = (file) => {
105
+ return file.size < MAX_FILE_SIZE;
110
106
  };
111
107
  /**
112
108
  * Renders root object
@@ -133,7 +129,11 @@ function MessageMediaUploader(props) {
133
129
  previews.map((item, index) => {
134
130
  var _a;
135
131
  return (react_1.default.createElement(react_1.default.Fragment, { key: index }, 'file' in item && (react_1.default.createElement(material_1.ListItem, Object.assign({ className: classes.previewItem, key: (_a = item.id) !== null && _a !== void 0 ? _a : item.file_uuid }, getMouseEvents(() => handleMouseEnter(item.file_uuid), () => handleMouseLeave(item.file_uuid))),
136
- 'video_url' in item ? (react_1.default.createElement("video", { src: item.video_url })) : (react_1.default.createElement("img", { src: item.file.type.startsWith(types_1.SCMessageFileType.PDF) && !item.file_url ? thumbnailCoverter_1.pdfImagePlaceholder : item.file_url })),
132
+ 'video_url' in item ? (react_1.default.createElement("video", { src: item.video_url })) : (react_1.default.createElement("img", { src: item.file.type.startsWith(types_1.SCMessageFileType.PDF) && !item.file_url
133
+ ? thumbnailCoverter_1.pdfImagePlaceholder
134
+ : !item.file_url
135
+ ? thumbnailCoverter_1.documentPlaceholder
136
+ : item.file_url })),
137
137
  react_1.default.createElement(material_1.ImageListItemBar, { className: (0, classnames_1.default)(classes.previewActions, { [classes.progress]: item.completed }), title: typeof item.completed !== 'undefined' &&
138
138
  item.completed !== 0 && react_1.default.createElement(material_1.Typography, { textAlign: "center" }, `${Math.round(item.completed)}%`), actionIcon: react_1.default.createElement(react_1.default.Fragment, null, isHovered[item.file_uuid] && Object.keys(uploading).length === 0 && (react_1.default.createElement(material_1.IconButton, { onClick: () => handleClear(item.file_uuid), size: "small" },
139
139
  react_1.default.createElement(Icon_1.default, null, "delete")))) }),
package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.d.ts CHANGED
@@ -60,6 +60,7 @@ export interface PrivateMessageThreadItemProps {
60
60
  |img|.SCPrivateMessageThreadItem-img|Styles applied to the img element.|
61
61
  |document|.SCPrivateMessageThreadItem-document|Styles applied to the message file element.|
62
62
  |video|.SCPrivateMessageThreadItem-video|Styles applied to the message video element.|
63
+ |other|.SCPrivateMessageThreadItem-other|Styles applied to other media type element.|
63
64
  |messageTime|.SCPrivateMessageThreadItem-message-time|Styles applied to the thread message time element.|
64
65
  |menuItem|.SCPrivateMessageThreadItem-menu-item|Styles applied to the thread message menu item element.|
65
66
  |dialogRoot|.SCPrivateMessageThreadItem-dialog-root|Styles applied to dialog root element.|
package/lib/cjs/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js CHANGED
@@ -18,12 +18,15 @@ const Lightbox_1 = tslib_1.__importDefault(require("../../shared/Lightbox"));
18
18
  const AutoPlayer_1 = tslib_1.__importDefault(require("../../shared/AutoPlayer"));
19
19
  const notistack_1 = require("notistack");
20
20
  const constants_1 = require("./constants");
21
+ const thumbnailCoverter_1 = require("../../utils/thumbnailCoverter");
21
22
  const classes = {
22
23
  root: `${constants_1.PREFIX}-root`,
23
24
  text: `${constants_1.PREFIX}-text`,
24
25
  img: `${constants_1.PREFIX}-img`,
25
26
  document: `${constants_1.PREFIX}-document`,
26
27
  video: `${constants_1.PREFIX}-video`,
28
+ other: `${constants_1.PREFIX}-other`,
29
+ iconButton: `${constants_1.PREFIX}-icon-button`,
27
30
  messageTime: `${constants_1.PREFIX}-message-time`,
28
31
  menuItem: `${constants_1.PREFIX}-menu-item`,
29
32
  downloadButton: `${constants_1.PREFIX}-download-button`,
@@ -60,6 +63,7 @@ const Root = (0, styles_1.styled)(material_1.ListItem, {
60
63
  |img|.SCPrivateMessageThreadItem-img|Styles applied to the img element.|
61
64
  |document|.SCPrivateMessageThreadItem-document|Styles applied to the message file element.|
62
65
  |video|.SCPrivateMessageThreadItem-video|Styles applied to the message video element.|
66
+ |other|.SCPrivateMessageThreadItem-other|Styles applied to other media type element.|
63
67
  |messageTime|.SCPrivateMessageThreadItem-message-time|Styles applied to the thread message time element.|
64
68
  |menuItem|.SCPrivateMessageThreadItem-menu-item|Styles applied to the thread message menu item element.|
65
69
  |dialogRoot|.SCPrivateMessageThreadItem-dialog-root|Styles applied to dialog root element.|
@@ -127,19 +131,25 @@ function PrivateMessageThreadItem(inProps) {
127
131
  case type.startsWith(types_1.SCMessageFileType.VIDEO):
128
132
  section = (react_1.default.createElement(material_1.Box, { className: (0, classnames_1.default)(classes.img, classes.video) },
129
133
  react_1.default.createElement("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }),
130
- react_1.default.createElement(material_1.IconButton, { onClick: () => setOpenDialog(true) },
131
- react_1.default.createElement(Icon_1.default, null, "play_circle_outline"))));
134
+ !(0, thumbnailCoverter_1.isSupportedVideoFormat)(m.file.filename) ? (react_1.default.createElement(material_1.Button, { onClick: () => handleDownload(m.file), className: classes.iconButton },
135
+ react_1.default.createElement(Icon_1.default, null, "download"))) : (react_1.default.createElement(material_1.IconButton, { onClick: () => setOpenDialog(true) },
136
+ react_1.default.createElement(Icon_1.default, null, "play_circle_outline")))));
132
137
  break;
133
138
  case type.startsWith(types_1.SCMessageFileType.DOCUMENT):
134
- section = (react_1.default.createElement(material_1.Box, { className: classes.document },
135
- react_1.default.createElement("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }),
139
+ section = (react_1.default.createElement(material_1.Box, { className: m.file.filename.endsWith('.pdf') ? classes.document : classes.other },
140
+ m.file.filename.endsWith('.pdf') && react_1.default.createElement("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }),
136
141
  react_1.default.createElement(material_1.Button, { onClick: () => handleDownload(m.file) },
137
142
  react_1.default.createElement(Icon_1.default, null, "download"),
138
143
  react_1.default.createElement(material_1.Typography, null, m.file.filename),
139
144
  react_1.default.createElement(material_1.Typography, null, (0, sizeCoverter_1.bytesToSize)(m.file.filesize)))));
140
145
  break;
141
146
  default:
142
- section = react_1.default.createElement(Icon_1.default, null, "hide_image");
147
+ // section = <Icon>hide_image</Icon>;
148
+ section = (react_1.default.createElement(material_1.Box, { className: classes.other },
149
+ react_1.default.createElement(material_1.Button, { onClick: () => handleDownload(m.file) },
150
+ react_1.default.createElement(Icon_1.default, null, "download"),
151
+ react_1.default.createElement(material_1.Typography, null, m.file.filename),
152
+ react_1.default.createElement(material_1.Typography, null, (0, sizeCoverter_1.bytesToSize)(m.file.filesize)))));
143
153
  break;
144
154
  }
145
155
  }
package/lib/cjs/shared/MessageChunkUploader/index.js CHANGED
@@ -94,7 +94,7 @@ exports.default = (props) => {
94
94
  });
95
95
  };
96
96
  const generateImageThumbnail = (callBack, item, fileUrl) => {
97
- callBack(fileUrl, item.file.name)
97
+ callBack(fileUrl, item)
98
98
  .then((file) => {
99
99
  uploadThumbnail(item, file);
100
100
  })
@@ -107,7 +107,11 @@ exports.default = (props) => {
107
107
  });
108
108
  };
109
109
  (0, chunked_uploady_1.useItemFinishListener)((item) => {
110
- const callBack = item.file.type.startsWith(types_1.SCMessageFileType.DOCUMENT) ? thumbnailCoverter_1.pdfToJpeg : thumbnailCoverter_1.createVideoThumbnail;
110
+ const callBack = item.file.type.startsWith(types_1.SCMessageFileType.VIDEO)
111
+ ? thumbnailCoverter_1.createVideoThumbnail
112
+ : item.file.type.startsWith(types_1.SCMessageFileType.AUDIO)
113
+ ? thumbnailCoverter_1.createAudioThumbnail
114
+ : thumbnailCoverter_1.createDocumentThumbnail;
111
115
  const formData = new FormData();
112
116
  formData.append('uuid', chunkStateRef.current.chunks[item.id].file_uuid);
113
117
  formData.append('filename', chunkStateRef.current.chunks[item.id].file.name);
package/lib/cjs/utils/thumbnailCoverter.d.ts CHANGED
@@ -1,4 +1,9 @@
1
1
  export declare const pdfImagePlaceholder = "data:image/png;base64,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";
2
- export declare function pdfToJpeg(url: any, fileName: any): Promise<unknown>;
2
+ export declare const videoPlaceholder = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAAsTAAALEwEAmpwYAAACYUlEQVR4nO3cvWoUURjG8T/YrGAROzFi5Q1oa+Fd2Jp02tiGpPcCvAE/+mxAvIpEsfILBat0ogtJsBKfsDA2h4zuTDL7vjvn+cHTHrLPO3POptgDZmZmZmZmZmZmZmZmZmZpXAU2gT3gM3ACaEVy0vzN0+YzrLFCLgM7wCxBkbqgzD/LNjAhuevAQYLCNFDeATdJ6gZwmKAkDZzD5rOm23beJihHS8pBtu1oJ0EpWnLmZ8J53AOeAx+bvATu9P22M6YDVwtm1nz2Li4B94E3LWv+Bh51HcBmgjIUlI0FO7oCPAa+LbDmfAh3uwxgL0ERCsruf7q5BjwBfnRc91WXAXxNUISCMv9n7Sy3gKfAr57rfu8ygOMERSgoR2f08Rr4cwFrL0yVpzTUuq1UeUoeAB5A+FMpvwHxxchbUHw58hkw/pSGWreVKk/JA8ADCH8q5Tcgvhh5C4ovRz4Dxp/SUOu2UuUpeQB4AOFPpfwGxBcjb0Hx5chnwPhTGmrdVqo8JQ8ADyD8qZTfgPhi5C0ovhz5DBh/SkOt20qVp+QB4AGEP5XyGxBfjLwFxZcjnwHjT2modVup8pQ8ADyA8KdSfgPii5G3oPhyVMMZcJSgBNX8I70vCYpQUD5l+JnqNEERqvmH2hsJilBQHmS4qqDWyzp+9rjKbJHLOh7Sw3aCQrTkbHH+62qeAe+BD8AL4HbfxSYjv6pMRfazXdg0t17RlWXrJL60bz9BSarx0r6/Js2ZMBvZgbuVcdv5l7XmK+q0+Ydlla61OW7+5t3mq+ZKXdxqZmZmZmZmZmZmZmZmZkZ3p+uwFZYL7fr1AAAAAElFTkSuQmCC";
3
+ export declare const documentPlaceholder = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAuUlEQVR4nO3WQQpCMRRD0axCxP0vSRRXExE6EMHBl5e09uVCcSiHBi2Q/isKzw3AeQcIATwAXJyQ6uwYiiH3t0/pzNSQE4Cr42YohsCFoQFiwdAEkWNohLySYdwQGWYGRIKZBSnHOP7Zj7zNtoCw4gtnx0BGuZHimGl1mxaLz7cCaTctVwyk241Q9Cv1WSDtpuWKgXS7EeathbUeja4YyCg3UhwzrVGmVRwzrVGmteq0uMj5uW0gCeaeAHHCuEhTlUIAAAAASUVORK5CYII=";
4
+ export declare const audioPlaceHolder = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABVElEQVR4nO3Xu0rEUBDG8b8PoJUXrAT3EWxsrOztLHwISwtRK1sVS7e1tbQWLBWs3EJ8BhsFr4WMBKaQRV3WnJlkwnwwBAI5OT/OJSeQiRUxqjtgvgsQ8caIlkWbrhgxhAy+XWcLv8MVMgPceo2MGELwxIgxxA0jDhAXjDhBzDHiCKlihvGGmGGagJhgmoIUx1gfUcapQYmXlkydg2arII30QxLSwRFZB/rAAbAJzEWFPAwt2BdgH5iMBnn8ZQd6Ba6A5egQ0TrsCuQoEuQZWAE2gFPgIyrkaejeArAHnAOrkSHjRhKiyRHRTABvXZhaa/p8KMgisAWcAGfANfAZDbIEvP/x0at2Lo9+1G5gd8TXu/rnDgHZHgE5jgLp6Tr4CXEPTEda7D09yV4CN8AFsANM1elAW7bfUpGEaHJECkdyamlyahWO5NTSSMvq3+kMJINzvgAzxLJFazyrgQAAAABJRU5ErkJggg==";
5
+ export declare function isSupportedVideoFormat(filename: any): boolean;
6
+ export declare function createAudioThumbnail(file: any): Promise<unknown>;
7
+ export declare function createDocumentThumbnail(url: any, file: any): Promise<unknown>;
3
8
  export declare function createThumbnail(file: any): Promise<unknown>;
4
- export declare function createVideoThumbnail(file: any, fileName: any): Promise<unknown>;
9
+ export declare function createVideoThumbnail(fileUrl: any, file: any): Promise<unknown>;
package/lib/cjs/utils/thumbnailCoverter.js CHANGED
@@ -1,47 +1,79 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.createVideoThumbnail = exports.createThumbnail = exports.pdfToJpeg = exports.pdfImagePlaceholder = void 0;
3
+ exports.createVideoThumbnail = exports.createThumbnail = exports.createDocumentThumbnail = exports.createAudioThumbnail = exports.isSupportedVideoFormat = exports.audioPlaceHolder = exports.documentPlaceholder = exports.videoPlaceholder = exports.pdfImagePlaceholder = void 0;
4
+ const types_1 = require("@selfcommunity/types");
4
5
  exports.pdfImagePlaceholder = 'data:image/png;base64,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';
6
+ exports.videoPlaceholder = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAAsTAAALEwEAmpwYAAACYUlEQVR4nO3cvWoUURjG8T/YrGAROzFi5Q1oa+Fd2Jp02tiGpPcCvAE/+mxAvIpEsfILBat0ogtJsBKfsDA2h4zuTDL7vjvn+cHTHrLPO3POptgDZmZmZmZmZmZmZmZmZmZpXAU2gT3gM3ACaEVy0vzN0+YzrLFCLgM7wCxBkbqgzD/LNjAhuevAQYLCNFDeATdJ6gZwmKAkDZzD5rOm23beJihHS8pBtu1oJ0EpWnLmZ8J53AOeAx+bvATu9P22M6YDVwtm1nz2Li4B94E3LWv+Bh51HcBmgjIUlI0FO7oCPAa+LbDmfAh3uwxgL0ERCsruf7q5BjwBfnRc91WXAXxNUISCMv9n7Sy3gKfAr57rfu8ygOMERSgoR2f08Rr4cwFrL0yVpzTUuq1UeUoeAB5A+FMpvwHxxchbUHw58hkw/pSGWreVKk/JA8ADCH8q5Tcgvhh5C4ovRz4Dxp/SUOu2UuUpeQB4AOFPpfwGxBcjb0Hx5chnwPhTGmrdVqo8JQ8ADyD8qZTfgPhi5C0ovhz5DBh/SkOt20qVp+QB4AGEP5XyGxBfjLwFxZcjnwHjT2modVup8pQ8ADyA8KdSfgPii5G3oPhyVMMZcJSgBNX8I70vCYpQUD5l+JnqNEERqvmH2hsJilBQHmS4qqDWyzp+9rjKbJHLOh7Sw3aCQrTkbHH+62qeAe+BD8AL4HbfxSYjv6pMRfazXdg0t17RlWXrJL60bz9BSarx0r6/Js2ZMBvZgbuVcdv5l7XmK+q0+Ydlla61OW7+5t3mq+ZKXdxqZmZmZmZmZmZmZmZmZkZ3p+uwFZYL7fr1AAAAAElFTkSuQmCC';
7
+ exports.documentPlaceholder = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAuUlEQVR4nO3WQQpCMRRD0axCxP0vSRRXExE6EMHBl5e09uVCcSiHBi2Q/isKzw3AeQcIATwAXJyQ6uwYiiH3t0/pzNSQE4Cr42YohsCFoQFiwdAEkWNohLySYdwQGWYGRIKZBSnHOP7Zj7zNtoCw4gtnx0BGuZHimGl1mxaLz7cCaTctVwyk241Q9Cv1WSDtpuWKgXS7EeathbUeja4YyCg3UhwzrVGmVRwzrVGmteq0uMj5uW0gCeaeAHHCuEhTlUIAAAAASUVORK5CYII=';
8
+ exports.audioPlaceHolder = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABVElEQVR4nO3Xu0rEUBDG8b8PoJUXrAT3EWxsrOztLHwISwtRK1sVS7e1tbQWLBWs3EJ8BhsFr4WMBKaQRV3WnJlkwnwwBAI5OT/OJSeQiRUxqjtgvgsQ8caIlkWbrhgxhAy+XWcLv8MVMgPceo2MGELwxIgxxA0jDhAXjDhBzDHiCKlihvGGmGGagJhgmoIUx1gfUcapQYmXlkydg2arII30QxLSwRFZB/rAAbAJzEWFPAwt2BdgH5iMBnn8ZQd6Ba6A5egQ0TrsCuQoEuQZWAE2gFPgIyrkaejeArAHnAOrkSHjRhKiyRHRTABvXZhaa/p8KMgisAWcAGfANfAZDbIEvP/x0at2Lo9+1G5gd8TXu/rnDgHZHgE5jgLp6Tr4CXEPTEda7D09yV4CN8AFsANM1elAW7bfUpGEaHJECkdyamlyahWO5NTSSMvq3+kMJINzvgAzxLJFazyrgQAAAABJRU5ErkJggg==';
5
9
  const MAX_WIDTH = 1920;
6
- function dataURLtoFile(dataUrl, fileName) {
10
+ function isSupportedVideoFormat(filename) {
11
+ const extension = filename.split('.').pop().toLowerCase();
12
+ const supportedFormats = ['mp4', 'webm', 'ogv', 'mp3', 'm3u8', 'mpd'];
13
+ return supportedFormats.includes(extension);
14
+ }
15
+ exports.isSupportedVideoFormat = isSupportedVideoFormat;
16
+ function dataURLtoFile(dataUrl, file) {
7
17
  let arr = dataUrl.split(','), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
8
- const _fileName = fileName.endsWith('.pdf') ? fileName.replace(/\.pdf$/, '.jpeg') : fileName;
18
+ const _fileName = file.file && file.file.type.startsWith(types_1.SCMessageFileType.DOCUMENT) ? file.file.name.replace(/(\.[^.]+)$/, '.jpeg') : file.name;
9
19
  while (n--) {
10
20
  u8arr[n] = bstr.charCodeAt(n);
11
21
  }
12
22
  return new File([u8arr], _fileName, { type: mime });
13
23
  }
14
- function pdfToJpeg(url, fileName) {
24
+ function createAudioThumbnail(file) {
25
+ return new Promise(function (resolve, reject) {
26
+ try {
27
+ resolve(dataURLtoFile(exports.audioPlaceHolder, file));
28
+ }
29
+ catch (e) {
30
+ reject(e);
31
+ console.log(e);
32
+ }
33
+ });
34
+ }
35
+ exports.createAudioThumbnail = createAudioThumbnail;
36
+ function createDocumentThumbnail(url, file) {
15
37
  const pdfjsLib = require('pdfjs-dist/webpack');
16
38
  return new Promise(function (resolve, reject) {
17
39
  try {
18
- const canvas = document.createElement('canvas');
19
- const ctx = canvas.getContext('2d');
20
- // Load the PDF file
21
- pdfjsLib
22
- .getDocument(url)
23
- .promise.then((pdf) => {
24
- // Get the first page of the PDF
25
- return pdf.getPage(1);
26
- })
27
- .then((page) => {
28
- // Set the canvas dimensions to match the PDF page dimensions
29
- const viewport = page.getViewport({ scale: 1 });
30
- canvas.width = viewport.width;
31
- canvas.height = viewport.height;
32
- // Render the PDF page onto the canvas
33
- const renderContext = {
34
- canvasContext: ctx,
35
- viewport: viewport
36
- };
37
- return page.render(renderContext).promise;
38
- })
39
- .then(() => {
40
- // Convert the canvas to an image
41
- const thumbnailUrl = canvas.toDataURL('image/jpeg', 1);
42
- // Resolve the Promise with the generated value
43
- resolve(dataURLtoFile(thumbnailUrl, fileName));
44
- });
40
+ if (!file.file.name.endsWith('.pdf')) {
41
+ resolve(dataURLtoFile(exports.documentPlaceholder, file));
42
+ }
43
+ else {
44
+ const canvas = document.createElement('canvas');
45
+ const ctx = canvas.getContext('2d');
46
+ // Load the PDF file
47
+ pdfjsLib
48
+ .getDocument(url)
49
+ .promise.then((pdf) => {
50
+ // Get the first page of the PDF
51
+ return pdf.getPage(1);
52
+ })
53
+ .then((page) => {
54
+ // Set the canvas dimensions to match the PDF page dimensions
55
+ const viewport = page.getViewport({ scale: 1 });
56
+ canvas.width = viewport.width;
57
+ canvas.height = viewport.height;
58
+ // Render the PDF page onto the canvas
59
+ const renderContext = {
60
+ canvasContext: ctx,
61
+ viewport: viewport
62
+ };
63
+ return page.render(renderContext).promise;
64
+ })
65
+ .then(() => {
66
+ // Convert the canvas to an image
67
+ const thumbnailUrl = canvas.toDataURL('image/jpeg', 1);
68
+ // Resolve the Promise with the generated value
69
+ resolve(dataURLtoFile(thumbnailUrl, file));
70
+ })
71
+ .catch((error) => {
72
+ console.error('Error converting PDF to JPEG:', error);
73
+ reject(error);
74
+ return Promise.reject(error);
75
+ });
76
+ }
45
77
  }
46
78
  catch (e) {
47
79
  reject(e);
@@ -49,7 +81,7 @@ function pdfToJpeg(url, fileName) {
49
81
  }
50
82
  });
51
83
  }
52
- exports.pdfToJpeg = pdfToJpeg;
84
+ exports.createDocumentThumbnail = createDocumentThumbnail;
53
85
  function createThumbnail(file) {
54
86
  return new Promise(function (resolve, reject) {
55
87
  try {
@@ -67,7 +99,7 @@ function createThumbnail(file) {
67
99
  ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
68
100
  const thumbnailData = canvas.toDataURL('image/jpeg', 0.5);
69
101
  // Resolve the Promise with the generated value
70
- resolve(dataURLtoFile(thumbnailData, file.name));
102
+ resolve(dataURLtoFile(thumbnailData, file));
71
103
  };
72
104
  img.src = event.target.result;
73
105
  };
@@ -81,25 +113,30 @@ function createThumbnail(file) {
81
113
  });
82
114
  }
83
115
  exports.createThumbnail = createThumbnail;
84
- function createVideoThumbnail(file, fileName) {
116
+ function createVideoThumbnail(fileUrl, file) {
85
117
  return new Promise(function (resolve, reject) {
86
118
  try {
87
119
  const video = document.createElement('video');
88
- video.src = file;
120
+ video.src = fileUrl;
89
121
  video.crossOrigin = '*';
90
- video.addEventListener('seeked', function () {
91
- const canvas = document.createElement('canvas');
92
- canvas.width = MAX_WIDTH;
93
- //to keep aspect ratio
94
- const scaleSize = MAX_WIDTH / video.videoWidth;
95
- canvas.height = video.videoHeight * scaleSize;
96
- const ctx = canvas.getContext('2d');
97
- // Draw the canvas
98
- ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
99
- const thumbnailUrl = canvas.toDataURL('image/jpeg', 0.5);
100
- // Resolve the Promise with the generated value
101
- resolve(dataURLtoFile(thumbnailUrl, fileName));
102
- });
122
+ if (!isSupportedVideoFormat(file.file.name)) {
123
+ resolve(dataURLtoFile(exports.videoPlaceholder, file));
124
+ }
125
+ else {
126
+ video.addEventListener('seeked', function () {
127
+ const canvas = document.createElement('canvas');
128
+ canvas.width = MAX_WIDTH;
129
+ //to keep aspect ratio
130
+ const scaleSize = MAX_WIDTH / video.videoWidth;
131
+ canvas.height = video.videoHeight * scaleSize;
132
+ const ctx = canvas.getContext('2d');
133
+ // Draw the canvas
134
+ ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
135
+ const thumbnailUrl = canvas.toDataURL('image/jpeg', 0.5);
136
+ // Resolve the Promise with the generated value
137
+ resolve(dataURLtoFile(thumbnailUrl, file));
138
+ });
139
+ }
103
140
  video.currentTime = 1;
104
141
  }
105
142
  catch (e) {
package/lib/esm/components/AccountDataPortability/AccountDataPortability.js CHANGED
@@ -163,7 +163,9 @@ export default function AccountDataPortability(inProps) {
163
163
  ul: (chunks) => React.createElement("ul", null, chunks)
164
164
  } })),
165
165
  React.createElement(LoadingButton, { size: "small", loading: (dataPortability && dataPortability.computing) || loading, disabled: !dataPortability ||
166
- (dataPortability && (dataPortability.computing || differenceInHours(new Date(), parseISO(dataPortability.requested_at.toString())) < 24)), loadingPosition: "start", startIcon: React.createElement(Icon, null, "folder_open"), variant: "outlined", className: classes.createButton, onClick: handleCreateDataPortabilityFile }, (dataPortability && dataPortability.computing) || loading ? (React.createElement(FormattedMessage, { id: "ui.accountDataPortability.createLoadingButton", defaultMessage: "ui.accountDataPortability.createLoadingButton" })) : (React.createElement(FormattedMessage, { id: "ui.accountDataPortability.createButton", defaultMessage: "ui.accountDataPortability.createButton" }))),
166
+ (dataPortability &&
167
+ (dataPortability.computing ||
168
+ (dataPortability.requested_at && differenceInHours(new Date(), parseISO(dataPortability.requested_at.toString())) < 24))), loadingPosition: "start", startIcon: React.createElement(Icon, null, "folder_open"), variant: "outlined", className: classes.createButton, onClick: handleCreateDataPortabilityFile }, (dataPortability && dataPortability.computing) || loading ? (React.createElement(FormattedMessage, { id: "ui.accountDataPortability.createLoadingButton", defaultMessage: "ui.accountDataPortability.createLoadingButton" })) : (React.createElement(FormattedMessage, { id: "ui.accountDataPortability.createButton", defaultMessage: "ui.accountDataPortability.createButton" }))),
167
169
  dataPortability && !dataPortability.computing && dataPortability.generated_at && (React.createElement(LoadingButton, { size: "small", loading: downloadingDataPortability, loadingPosition: "start", startIcon: React.createElement(Icon, null, "cloud_download_outlined"), variant: 'outlined', className: classes.downloadButton, onClick: handleDownloadDataPortabilityFile },
168
170
  React.createElement(FormattedMessage, { id: "ui.accountDataPortability.downloadButton", defaultMessage: "ui.accountDataPortability.downloadButton" }))),
169
171
  React.createElement("br", null),
package/lib/esm/components/Notification/ContributionFollow/ContributionFollow.js CHANGED
@@ -59,8 +59,6 @@ export default function ContributionFollowNotification(props) {
59
59
  b: (...chunks) => React.createElement("strong", null, chunks)
60
60
  })), secondary: React.createElement(React.Fragment, null,
61
61
  template === SCNotificationObjectTemplateType.SNIPPET && (React.createElement(React.Fragment, null,
62
- ":",
63
- ' ',
64
62
  React.createElement(Link, { to: scRoutingContext.url(SCRoutes[`${notificationObject[contributionType]['type'].toUpperCase()}_ROUTE_NAME`], getRouteData(notificationObject[contributionType])) },
65
63
  React.createElement(Typography, { variant: "body2", className: classes.contributionText }, getContributionSnippet(notificationObject[contributionType]))))),
66
64
  (template === SCNotificationObjectTemplateType.DETAIL || template === SCNotificationObjectTemplateType.SNIPPET) && (React.createElement("div", null,
package/lib/esm/components/PrivateMessageEditor/MessageMediaUploader/index.js CHANGED
@@ -11,7 +11,7 @@ import Widget from '../../Widget';
11
11
  import MessageChunkUploader from '../../../shared/MessageChunkUploader';
12
12
  import UploadDropZone from '@rpldy/upload-drop-zone';
13
13
  import { FormattedMessage } from 'react-intl';
14
- import { pdfImagePlaceholder } from '../../../utils/thumbnailCoverter';
14
+ import { documentPlaceholder, pdfImagePlaceholder } from '../../../utils/thumbnailCoverter';
15
15
  import classNames from 'classnames';
16
16
  import { bytesToSize } from '../../../utils/sizeCoverter';
17
17
  import { PREFIX } from '../constants';
@@ -98,12 +98,8 @@ export default function MessageMediaUploader(props) {
98
98
  onTouchStart: mouseEnter,
99
99
  onTouchMove: mouseLeave
100
100
  });
101
- const filterBySizeAndType = (file, index, files) => {
102
- if (files.length > 1) {
103
- return files.every((obj) => obj.type.startsWith(SCMessageFileType.IMAGE) || obj.type.startsWith(SCMessageFileType.VIDEO) || obj.type.startsWith(SCMessageFileType.PDF));
104
- }
105
- return (file.size < MAX_FILE_SIZE &&
106
- (file.type.startsWith(SCMessageFileType.IMAGE) || file.type.startsWith(SCMessageFileType.VIDEO) || file.type.startsWith(SCMessageFileType.PDF)));
101
+ const filterBySizeAndType = (file) => {
102
+ return file.size < MAX_FILE_SIZE;
107
103
  };
108
104
  /**
109
105
  * Renders root object
@@ -130,7 +126,11 @@ export default function MessageMediaUploader(props) {
130
126
  previews.map((item, index) => {
131
127
  var _a;
132
128
  return (React.createElement(React.Fragment, { key: index }, 'file' in item && (React.createElement(ListItem, Object.assign({ className: classes.previewItem, key: (_a = item.id) !== null && _a !== void 0 ? _a : item.file_uuid }, getMouseEvents(() => handleMouseEnter(item.file_uuid), () => handleMouseLeave(item.file_uuid))),
133
- 'video_url' in item ? (React.createElement("video", { src: item.video_url })) : (React.createElement("img", { src: item.file.type.startsWith(SCMessageFileType.PDF) && !item.file_url ? pdfImagePlaceholder : item.file_url })),
129
+ 'video_url' in item ? (React.createElement("video", { src: item.video_url })) : (React.createElement("img", { src: item.file.type.startsWith(SCMessageFileType.PDF) && !item.file_url
130
+ ? pdfImagePlaceholder
131
+ : !item.file_url
132
+ ? documentPlaceholder
133
+ : item.file_url })),
134
134
  React.createElement(ImageListItemBar, { className: classNames(classes.previewActions, { [classes.progress]: item.completed }), title: typeof item.completed !== 'undefined' &&
135
135
  item.completed !== 0 && React.createElement(Typography, { textAlign: "center" }, `${Math.round(item.completed)}%`), actionIcon: React.createElement(React.Fragment, null, isHovered[item.file_uuid] && Object.keys(uploading).length === 0 && (React.createElement(IconButton, { onClick: () => handleClear(item.file_uuid), size: "small" },
136
136
  React.createElement(Icon, null, "delete")))) }),
package/lib/esm/components/PrivateMessageThreadItem/PrivateMessageThreadItem.d.ts CHANGED
@@ -60,6 +60,7 @@ export interface PrivateMessageThreadItemProps {
60
60
  |img|.SCPrivateMessageThreadItem-img|Styles applied to the img element.|
61
61
  |document|.SCPrivateMessageThreadItem-document|Styles applied to the message file element.|
62
62
  |video|.SCPrivateMessageThreadItem-video|Styles applied to the message video element.|
63
+ |other|.SCPrivateMessageThreadItem-other|Styles applied to other media type element.|
63
64
  |messageTime|.SCPrivateMessageThreadItem-message-time|Styles applied to the thread message time element.|
64
65
  |menuItem|.SCPrivateMessageThreadItem-menu-item|Styles applied to the thread message menu item element.|
65
66
  |dialogRoot|.SCPrivateMessageThreadItem-dialog-root|Styles applied to dialog root element.|
package/lib/esm/components/PrivateMessageThreadItem/PrivateMessageThreadItem.js CHANGED
@@ -16,12 +16,15 @@ import LightBox from '../../shared/Lightbox';
16
16
  import AutoPlayer from '../../shared/AutoPlayer';
17
17
  import { useSnackbar } from 'notistack';
18
18
  import { PREFIX } from './constants';
19
+ import { isSupportedVideoFormat } from '../../utils/thumbnailCoverter';
19
20
  const classes = {
20
21
  root: `${PREFIX}-root`,
21
22
  text: `${PREFIX}-text`,
22
23
  img: `${PREFIX}-img`,
23
24
  document: `${PREFIX}-document`,
24
25
  video: `${PREFIX}-video`,
26
+ other: `${PREFIX}-other`,
27
+ iconButton: `${PREFIX}-icon-button`,
25
28
  messageTime: `${PREFIX}-message-time`,
26
29
  menuItem: `${PREFIX}-menu-item`,
27
30
  downloadButton: `${PREFIX}-download-button`,
@@ -58,6 +61,7 @@ const Root = styled(ListItem, {
58
61
  |img|.SCPrivateMessageThreadItem-img|Styles applied to the img element.|
59
62
  |document|.SCPrivateMessageThreadItem-document|Styles applied to the message file element.|
60
63
  |video|.SCPrivateMessageThreadItem-video|Styles applied to the message video element.|
64
+ |other|.SCPrivateMessageThreadItem-other|Styles applied to other media type element.|
61
65
  |messageTime|.SCPrivateMessageThreadItem-message-time|Styles applied to the thread message time element.|
62
66
  |menuItem|.SCPrivateMessageThreadItem-menu-item|Styles applied to the thread message menu item element.|
63
67
  |dialogRoot|.SCPrivateMessageThreadItem-dialog-root|Styles applied to dialog root element.|
@@ -125,19 +129,25 @@ export default function PrivateMessageThreadItem(inProps) {
125
129
  case type.startsWith(SCMessageFileType.VIDEO):
126
130
  section = (React.createElement(Box, { className: classNames(classes.img, classes.video) },
127
131
  React.createElement("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }),
128
- React.createElement(IconButton, { onClick: () => setOpenDialog(true) },
129
- React.createElement(Icon, null, "play_circle_outline"))));
132
+ !isSupportedVideoFormat(m.file.filename) ? (React.createElement(Button, { onClick: () => handleDownload(m.file), className: classes.iconButton },
133
+ React.createElement(Icon, null, "download"))) : (React.createElement(IconButton, { onClick: () => setOpenDialog(true) },
134
+ React.createElement(Icon, null, "play_circle_outline")))));
130
135
  break;
131
136
  case type.startsWith(SCMessageFileType.DOCUMENT):
132
- section = (React.createElement(Box, { className: classes.document },
133
- React.createElement("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }),
137
+ section = (React.createElement(Box, { className: m.file.filename.endsWith('.pdf') ? classes.document : classes.other },
138
+ m.file.filename.endsWith('.pdf') && React.createElement("img", { src: m.file.thumbnail, loading: "lazy", alt: 'img' }),
134
139
  React.createElement(Button, { onClick: () => handleDownload(m.file) },
135
140
  React.createElement(Icon, null, "download"),
136
141
  React.createElement(Typography, null, m.file.filename),
137
142
  React.createElement(Typography, null, bytesToSize(m.file.filesize)))));
138
143
  break;
139
144
  default:
140
- section = React.createElement(Icon, null, "hide_image");
145
+ // section = <Icon>hide_image</Icon>;
146
+ section = (React.createElement(Box, { className: classes.other },
147
+ React.createElement(Button, { onClick: () => handleDownload(m.file) },
148
+ React.createElement(Icon, null, "download"),
149
+ React.createElement(Typography, null, m.file.filename),
150
+ React.createElement(Typography, null, bytesToSize(m.file.filesize)))));
141
151
  break;
142
152
  }
143
153
  }
package/lib/esm/shared/MessageChunkUploader/index.js CHANGED
@@ -7,7 +7,7 @@ import { useItemProgressListener, useItemStartListener } from '@rpldy/uploady';
7
7
  import React, { useEffect, useRef, useState } from 'react';
8
8
  import { useIntl } from 'react-intl';
9
9
  import messages from '../../messages/common';
10
- import { createThumbnail, createVideoThumbnail, pdfToJpeg } from '../../utils/thumbnailCoverter';
10
+ import { createThumbnail, createVideoThumbnail, createDocumentThumbnail, createAudioThumbnail } from '../../utils/thumbnailCoverter';
11
11
  import { SCOPE_SC_UI } from '../../constants/Errors';
12
12
  import { Logger } from '@selfcommunity/utils';
13
13
  export default (props) => {
@@ -92,7 +92,7 @@ export default (props) => {
92
92
  });
93
93
  };
94
94
  const generateImageThumbnail = (callBack, item, fileUrl) => {
95
- callBack(fileUrl, item.file.name)
95
+ callBack(fileUrl, item)
96
96
  .then((file) => {
97
97
  uploadThumbnail(item, file);
98
98
  })
@@ -105,7 +105,11 @@ export default (props) => {
105
105
  });
106
106
  };
107
107
  useItemFinishListener((item) => {
108
- const callBack = item.file.type.startsWith(SCMessageFileType.DOCUMENT) ? pdfToJpeg : createVideoThumbnail;
108
+ const callBack = item.file.type.startsWith(SCMessageFileType.VIDEO)
109
+ ? createVideoThumbnail
110
+ : item.file.type.startsWith(SCMessageFileType.AUDIO)
111
+ ? createAudioThumbnail
112
+ : createDocumentThumbnail;
109
113
  const formData = new FormData();
110
114
  formData.append('uuid', chunkStateRef.current.chunks[item.id].file_uuid);
111
115
  formData.append('filename', chunkStateRef.current.chunks[item.id].file.name);
package/lib/esm/utils/thumbnailCoverter.d.ts CHANGED
@@ -1,4 +1,9 @@
1
1
  export declare const pdfImagePlaceholder = "data:image/png;base64,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";
2
- export declare function pdfToJpeg(url: any, fileName: any): Promise<unknown>;
2
+ export declare const videoPlaceholder = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAAsTAAALEwEAmpwYAAACYUlEQVR4nO3cvWoUURjG8T/YrGAROzFi5Q1oa+Fd2Jp02tiGpPcCvAE/+mxAvIpEsfILBat0ogtJsBKfsDA2h4zuTDL7vjvn+cHTHrLPO3POptgDZmZmZmZmZmZmZmZmZmZpXAU2gT3gM3ACaEVy0vzN0+YzrLFCLgM7wCxBkbqgzD/LNjAhuevAQYLCNFDeATdJ6gZwmKAkDZzD5rOm23beJihHS8pBtu1oJ0EpWnLmZ8J53AOeAx+bvATu9P22M6YDVwtm1nz2Li4B94E3LWv+Bh51HcBmgjIUlI0FO7oCPAa+LbDmfAh3uwxgL0ERCsruf7q5BjwBfnRc91WXAXxNUISCMv9n7Sy3gKfAr57rfu8ygOMERSgoR2f08Rr4cwFrL0yVpzTUuq1UeUoeAB5A+FMpvwHxxchbUHw58hkw/pSGWreVKk/JA8ADCH8q5Tcgvhh5C4ovRz4Dxp/SUOu2UuUpeQB4AOFPpfwGxBcjb0Hx5chnwPhTGmrdVqo8JQ8ADyD8qZTfgPhi5C0ovhz5DBh/SkOt20qVp+QB4AGEP5XyGxBfjLwFxZcjnwHjT2modVup8pQ8ADyA8KdSfgPii5G3oPhyVMMZcJSgBNX8I70vCYpQUD5l+JnqNEERqvmH2hsJilBQHmS4qqDWyzp+9rjKbJHLOh7Sw3aCQrTkbHH+62qeAe+BD8AL4HbfxSYjv6pMRfazXdg0t17RlWXrJL60bz9BSarx0r6/Js2ZMBvZgbuVcdv5l7XmK+q0+Ydlla61OW7+5t3mq+ZKXdxqZmZmZmZmZmZmZmZmZkZ3p+uwFZYL7fr1AAAAAElFTkSuQmCC";
3
+ export declare const documentPlaceholder = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAuUlEQVR4nO3WQQpCMRRD0axCxP0vSRRXExE6EMHBl5e09uVCcSiHBi2Q/isKzw3AeQcIATwAXJyQ6uwYiiH3t0/pzNSQE4Cr42YohsCFoQFiwdAEkWNohLySYdwQGWYGRIKZBSnHOP7Zj7zNtoCw4gtnx0BGuZHimGl1mxaLz7cCaTctVwyk241Q9Cv1WSDtpuWKgXS7EeathbUeja4YyCg3UhwzrVGmVRwzrVGmteq0uMj5uW0gCeaeAHHCuEhTlUIAAAAASUVORK5CYII=";
4
+ export declare const audioPlaceHolder = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABVElEQVR4nO3Xu0rEUBDG8b8PoJUXrAT3EWxsrOztLHwISwtRK1sVS7e1tbQWLBWs3EJ8BhsFr4WMBKaQRV3WnJlkwnwwBAI5OT/OJSeQiRUxqjtgvgsQ8caIlkWbrhgxhAy+XWcLv8MVMgPceo2MGELwxIgxxA0jDhAXjDhBzDHiCKlihvGGmGGagJhgmoIUx1gfUcapQYmXlkydg2arII30QxLSwRFZB/rAAbAJzEWFPAwt2BdgH5iMBnn8ZQd6Ba6A5egQ0TrsCuQoEuQZWAE2gFPgIyrkaejeArAHnAOrkSHjRhKiyRHRTABvXZhaa/p8KMgisAWcAGfANfAZDbIEvP/x0at2Lo9+1G5gd8TXu/rnDgHZHgE5jgLp6Tr4CXEPTEda7D09yV4CN8AFsANM1elAW7bfUpGEaHJECkdyamlyahWO5NTSSMvq3+kMJINzvgAzxLJFazyrgQAAAABJRU5ErkJggg==";
5
+ export declare function isSupportedVideoFormat(filename: any): boolean;
6
+ export declare function createAudioThumbnail(file: any): Promise<unknown>;
7
+ export declare function createDocumentThumbnail(url: any, file: any): Promise<unknown>;
3
8
  export declare function createThumbnail(file: any): Promise<unknown>;
4
- export declare function createVideoThumbnail(file: any, fileName: any): Promise<unknown>;
9
+ export declare function createVideoThumbnail(fileUrl: any, file: any): Promise<unknown>;