@selfcommunity/react-ui 0.11.0-alpha.76 → 0.11.0-alpha.78

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.
@@ -150,7 +150,19 @@ function Appearance(inProps) {
150
150
  setLoadingLogo('');
151
151
  setData({});
152
152
  setPreferences((prev) => {
153
- return prev.map((p) => Object.assign({}, p, { value: p.name === name ? preference[name].value : p.value }));
153
+ // Handle both single preference and array of preferences
154
+ if (Array.isArray(preference)) {
155
+ // If it's an array, find the preference with the matching name
156
+ const matchingPref = preference.find((p) => p.name === name);
157
+ if (matchingPref) {
158
+ return prev.map((p) => Object.assign({}, p, { value: p.name === name ? matchingPref.value : p.value }));
159
+ }
160
+ return prev;
161
+ }
162
+ else {
163
+ // Original behavior for single preference
164
+ return prev.map((p) => Object.assign({}, p, { value: p.name === name ? preference[name].value : p.value }));
165
+ }
154
166
  });
155
167
  onCompleteAction();
156
168
  })
@@ -17,3 +17,7 @@ export declare const MEDIA_EMBED_SC_SHARED_EVENT = "sc_shared_event";
17
17
  * MAX_GRID_IMAGES: max number of box rendered in feed preview
18
18
  */
19
19
  export declare const MAX_GRID_IMAGES = 5;
20
+ /**
21
+ * Default delay tracking seconds (fallback if not in the preference)
22
+ */
23
+ export declare const DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS = 3;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.MAX_GRID_IMAGES = exports.MEDIA_EMBED_SC_SHARED_EVENT = exports.MEDIA_EMBED_SC_SHARED_OBJECT = exports.MEDIA_EMBED_SC_LINK_TYPE = exports.MEDIA_TYPE_EVENT = exports.MEDIA_TYPE_EMBED = exports.MEDIA_TYPE_SHARE = exports.MEDIA_TYPE_URL = exports.MEDIA_TYPE_LINK = exports.MEDIA_TYPE_DOCUMENT = exports.MEDIA_TYPE_VIDEO = exports.MEDIA_TYPE_IMAGE = void 0;
3
+ exports.DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS = exports.MAX_GRID_IMAGES = exports.MEDIA_EMBED_SC_SHARED_EVENT = exports.MEDIA_EMBED_SC_SHARED_OBJECT = exports.MEDIA_EMBED_SC_LINK_TYPE = exports.MEDIA_TYPE_EVENT = exports.MEDIA_TYPE_EMBED = exports.MEDIA_TYPE_SHARE = exports.MEDIA_TYPE_URL = exports.MEDIA_TYPE_LINK = exports.MEDIA_TYPE_DOCUMENT = exports.MEDIA_TYPE_VIDEO = exports.MEDIA_TYPE_IMAGE = void 0;
4
4
  exports.MEDIA_TYPE_IMAGE = 'image';
5
5
  exports.MEDIA_TYPE_VIDEO = 'video';
6
6
  exports.MEDIA_TYPE_DOCUMENT = 'doc';
@@ -20,3 +20,7 @@ exports.MEDIA_EMBED_SC_SHARED_EVENT = 'sc_shared_event';
20
20
  * MAX_GRID_IMAGES: max number of box rendered in feed preview
21
21
  */
22
22
  exports.MAX_GRID_IMAGES = 5;
23
+ /**
24
+ * Default delay tracking seconds (fallback if not in the preference)
25
+ */
26
+ exports.DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS = 3;
@@ -7,6 +7,7 @@ const react_waypoint_1 = require("react-waypoint");
7
7
  const react_player_1 = tslib_1.__importDefault(require("react-player"));
8
8
  const material_1 = require("@mui/material");
9
9
  const react_core_1 = require("@selfcommunity/react-core");
10
+ const Media_1 = require("../../constants/Media");
10
11
  const PREFIX = 'SCAutoPlayer';
11
12
  const Root = (0, material_1.styled)(react_waypoint_1.Waypoint, {
12
13
  name: PREFIX,
@@ -21,8 +22,11 @@ function AutoPlayer(props) {
21
22
  const [played, setPlayed] = (0, react_1.useState)(0);
22
23
  const { preferences } = (0, react_core_1.useSCPreferences)();
23
24
  const enableAutoplay = react_core_1.SCPreferences.CONFIGURATIONS_VIDEO_AUTOPLAY_ENABLED in preferences && preferences[react_core_1.SCPreferences.CONFIGURATIONS_VIDEO_AUTOPLAY_ENABLED].value;
25
+ const videoPlayTrackingDelaySeconds = react_core_1.SCPreferences.CONFIGURATIONS_VIDEO_PLAY_TRACKING_DELAY_SECONDS in preferences
26
+ ? preferences[react_core_1.SCPreferences.CONFIGURATIONS_VIDEO_PLAY_TRACKING_DELAY_SECONDS].value
27
+ : Media_1.DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS;
24
28
  (0, react_1.useEffect)(() => {
25
- if (played >= 10 && played <= 11) {
29
+ if (played >= videoPlayTrackingDelaySeconds && played <= videoPlayTrackingDelaySeconds + 1) {
26
30
  onVideoWatch === null || onVideoWatch === void 0 ? void 0 : onVideoWatch();
27
31
  }
28
32
  }, [played]);
@@ -66,8 +66,10 @@ exports.default = (props) => {
66
66
  }
67
67
  setPreview(index);
68
68
  setMediaType(type);
69
- onMediaClick(type === Media_1.MEDIA_TYPE_IMAGE ? images[index] : docs[index]);
70
- }, [images, docs]);
69
+ if (type === Media_1.MEDIA_TYPE_IMAGE) {
70
+ onMediaClick(images[index]);
71
+ }
72
+ }, [gallery, setPreview, setMediaType, images, onMediaClick]);
71
73
  // RENDERING
72
74
  const renderTitle = (o) => {
73
75
  if (!o) {
@@ -133,11 +135,12 @@ exports.default = (props) => {
133
135
  link.click();
134
136
  // Cleanup
135
137
  window.URL.revokeObjectURL(url);
138
+ onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(docs[index]);
136
139
  }
137
140
  catch (error) {
138
141
  utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
139
142
  }
140
- }), []);
143
+ }), [onMediaClick]);
141
144
  const handleIndexChange = (0, react_1.useCallback)((index) => {
142
145
  if (mediaType === Media_1.MEDIA_TYPE_DOCUMENT) {
143
146
  setToolbarButtons((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => handleDownload(index) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "download" }) })));
@@ -161,5 +164,5 @@ exports.default = (props) => {
161
164
  if (medias.length === 0) {
162
165
  return null;
163
166
  }
164
- return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.displayRoot, className) }, { children: [[1, 3, 4].includes(imagesToShow.length) && renderOne(), imagesToShow.length >= 2 && imagesToShow.length < 4 && renderTwo(), imagesToShow.length >= 4 && renderThree(), preview !== -1 && ((0, jsx_runtime_1.jsx)(Lightbox_1.Lightbox, { onClose: handleClose, index: preview, medias: mediaType === Media_1.MEDIA_TYPE_IMAGE ? images : docs, toolbarButtons: toolbarButtons })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.docsWrapper }, { children: docs.map((doc, i) => ((0, jsx_runtime_1.jsx)(DocComponent_1.default, { doc: doc, index: i, openPreviewImage: openPreviewImage, handleDownload: handleDownload }, doc.id))) }))] })));
167
+ return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: (0, classnames_1.default)(classes.displayRoot, className) }, { children: [[1, 3, 4].includes(imagesToShow.length) && renderOne(), imagesToShow.length >= 2 && imagesToShow.length < 4 && renderTwo(), imagesToShow.length >= 4 && renderThree(), preview !== -1 && ((0, jsx_runtime_1.jsx)(Lightbox_1.Lightbox, { onClose: handleClose, index: preview, medias: mediaType === Media_1.MEDIA_TYPE_IMAGE ? images : docs, toolbarButtons: toolbarButtons })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.docsWrapper }, { children: docs.map((doc, i) => ((0, jsx_runtime_1.jsx)(DocComponent_1.default, { doc: doc, index: i, openPreviewImage: openPreviewImage, handleDownload: handleDownload, onMediaClick: onMediaClick }, doc.id))) }))] })));
165
168
  };
@@ -5,6 +5,7 @@ interface DocComponentProps {
5
5
  onDelete?: (id: number) => void;
6
6
  openPreviewImage?: (index: number, type: string) => void;
7
7
  handleDownload?: (id: number) => void;
8
+ onMediaClick?: (media: SCMediaType) => void;
8
9
  }
9
10
  export default function DocComponent(props: DocComponentProps): JSX.Element;
10
11
  export {};
@@ -5,9 +5,11 @@ const material_1 = require("@mui/material");
5
5
  const constants_1 = require("./constants");
6
6
  const react_core_1 = require("@selfcommunity/react-core");
7
7
  const Media_1 = require("../../../constants/Media");
8
+ const badgePdf_1 = require("./badgePdf");
8
9
  const classes = {
9
10
  docRoot: `${constants_1.PREFIX}-doc-root`,
10
- image: `${constants_1.PREFIX}-image`,
11
+ imageWrapper: `${constants_1.PREFIX}-image-wrapper`,
12
+ badgePdf: `${constants_1.PREFIX}-badge-pdf`,
11
13
  textWrapper: `${constants_1.PREFIX}-text-wrapper`,
12
14
  title: `${constants_1.PREFIX}-title`,
13
15
  subtitle: `${constants_1.PREFIX}-subtitle`,
@@ -28,7 +30,7 @@ function formatBytes(bytes, decimals = 2) {
28
30
  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
29
31
  }
30
32
  function DocComponent(props) {
31
- const { doc, index, onDelete, openPreviewImage, handleDownload } = props;
32
- return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.docRoot }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { component: "img", className: classes.image, alt: "pdf preview", src: doc.image_thumbnail ? doc.image_thumbnail.url : doc.image, onClick: () => openPreviewImage === null || openPreviewImage === void 0 ? void 0 : openPreviewImage(index, Media_1.MEDIA_TYPE_DOCUMENT), sx: { cursor: openPreviewImage ? 'pointer' : undefined } }), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.textWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title }, { children: doc.title })), doc.size && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.subtitle }, { children: formatBytes(doc.size) }))] })), (handleDownload || onDelete) && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionWrapper }, { children: [onDelete && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.action, onClick: () => onDelete(doc.id) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "delete" }) }))), handleDownload && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.action, component: react_core_1.Link, to: doc.url, target: "_blank" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "visibility" }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.action, onClick: () => handleDownload(index) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "download" }) }))] }))] })))] })));
33
+ const { doc, index, onDelete, openPreviewImage, handleDownload, onMediaClick } = props;
34
+ return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.docRoot }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ onClick: () => openPreviewImage === null || openPreviewImage === void 0 ? void 0 : openPreviewImage(index, Media_1.MEDIA_TYPE_DOCUMENT), sx: { cursor: openPreviewImage ? 'pointer' : undefined }, className: classes.imageWrapper }, { children: [(0, jsx_runtime_1.jsx)("img", { alt: "pdf preview", src: doc.image_thumbnail ? doc.image_thumbnail.url : doc.image, width: "100%", height: "100%" }), (0, jsx_runtime_1.jsx)("img", { alt: "pdf badge", src: badgePdf_1.BADGE_PDF, className: classes.badgePdf })] })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.textWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.title }, { children: doc.title })), doc.size && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.subtitle }, { children: formatBytes(doc.size) }))] })), (handleDownload || onDelete) && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionWrapper }, { children: [onDelete && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.action, onClick: () => onDelete(doc.id) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "delete" }) }))), handleDownload && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.action, component: react_core_1.Link, to: doc.url, target: "_blank", onClick: () => onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(doc) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "visibility" }) })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.action, onClick: () => handleDownload(index) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "download" }) }))] }))] })))] })));
33
35
  }
34
36
  exports.default = DocComponent;
@@ -0,0 +1 @@
1
+ export declare const BADGE_PDF = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAzNyAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMyLjQ4NjMgMS4zMzk3OEMzNC40MTkxIDEuMzQwMDUgMzUuOTg2MyAyLjkwNjk1IDM1Ljk4NjMgNC44Mzk3OFYxNS4xNzY3QzM1Ljk4NjIgMTcuMTA5NCAzNC40MTkgMTguNjc2NCAzMi40ODYzIDE4LjY3NjdIMVYxLjMzOTc4SDMyLjQ4NjNaIiBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSIjREREREREIi8+CjxwYXRoIGQ9Ik0yNC41NjYxIDE1LjgzOThWNC45MzA2OUgzMS43ODkxVjYuODMyMzNIMjYuODcyNlY5LjQzMTc2SDMxLjMwOTdWMTEuMzMzNEgyNi44NzI2VjE1LjgzOThIMjQuNTY2MVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xOC4yNzAyIDE1LjgzOThIMTQuNDAzVjQuOTMwNjlIMTguMzAyMkMxOS4zOTk1IDQuOTMwNjkgMjAuMzQ0MSA1LjE0OTA5IDIxLjEzNiA1LjU4NTg4QzIxLjkyNzkgNi4wMTkxMiAyMi41MzY5IDYuNjQyMzQgMjIuOTYzIDcuNDU1NTVDMjMuMzkyNyA4LjI2ODc2IDIzLjYwNzYgOS4yNDE3NyAyMy42MDc2IDEwLjM3NDZDMjMuNjA3NiAxMS41MTEgMjMuMzkyNyAxMi40ODc1IDIyLjk2MyAxMy4zMDQzQzIyLjUzNjkgMTQuMTIxIDIxLjkyNDMgMTQuNzQ3OCAyMS4xMjUzIDE1LjE4NDZDMjAuMzI5OSAxNS42MjE0IDE5LjM3ODIgMTUuODM5OCAxOC4yNzAyIDE1LjgzOThaTTE2LjcwOTUgMTMuODYzNkgxOC4xNzQzQzE4Ljg1NjEgMTMuODYzNiAxOS40Mjk2IDEzLjc0MjggMTkuODk0OCAxMy41MDE0QzIwLjM2MzYgMTMuMjU2MyAyMC43MTUyIDEyLjg3ODEgMjAuOTQ5NSAxMi4zNjY4QzIxLjE4NzUgMTEuODUxOSAyMS4zMDY0IDExLjE4NzggMjEuMzA2NCAxMC4zNzQ2QzIxLjMwNjQgOS41Njg0OCAyMS4xODc1IDguOTA5NzQgMjAuOTQ5NSA4LjM5ODM4QzIwLjcxNTIgNy44ODcwMiAyMC4zNjU0IDcuNTEwNiAxOS45MDAyIDcuMjY5MTJDMTkuNDM1IDcuMDI3NjQgMTguODYxNSA2LjkwNjkgMTguMTc5NiA2LjkwNjlIMTYuNzA5NVYxMy44NjM2WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTUuNDQxMSAxNS44Mzk4VjQuOTMwNjlIOS43NDUwOEMxMC41NzI1IDQuOTMwNjkgMTEuMjc3NCA1LjA4ODcyIDExLjg1OTggNS40MDQ3N0MxMi40NDIyIDUuNzE3MjcgMTIuODg2MSA2LjE1MjI5IDEzLjE5MTUgNi43MDk4MUMxMy41MDA0IDcuMjYzNzkgMTMuNjU0OSA3LjkwMyAxMy42NTQ5IDguNjI3NDNDMTMuNjU0OSA5LjM1MTg2IDEzLjQ5ODYgOS45OTEwNiAxMy4xODYxIDEwLjU0NUMxMi44NzM2IDExLjA5OSAxMi40MjA5IDExLjUzMDUgMTEuODI3OCAxMS44Mzk0QzExLjIzODMgMTIuMTQ4NCAxMC41MjQ2IDEyLjMwMjkgOS42ODY0OCAxMi4zMDI5SDYuOTQzMjNWMTAuNDU0NUg5LjMxMzYyQzkuNzU3NTEgMTAuNDU0NSAxMC4xMjMzIDEwLjM3ODEgMTAuNDEwOSAxMC4yMjU0QzEwLjcwMjEgMTAuMDY5MiAxMC45MTg3IDkuODU0MzUgMTEuMDYwOCA5LjU4MDkxQzExLjIwNjQgOS4zMDM5MiAxMS4yNzkyIDguOTg2MDkgMTEuMjc5MiA4LjYyNzQzQzExLjI3OTIgOC4yNjUyMSAxMS4yMDY0IDcuOTQ5MTYgMTEuMDYwOCA3LjY3OTI3QzEwLjkxODcgNy40MDU4NCAxMC43MDIxIDcuMTk0NTQgMTAuNDEwOSA3LjA0NTRDMTAuMTE5NyA2Ljg5MjcgOS43NTA0IDYuODE2MzUgOS4zMDI5NiA2LjgxNjM1SDcuNzQ3NTZWMTUuODM5OEg1LjQ0MTFaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K";
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.BADGE_PDF = void 0;
4
+ exports.BADGE_PDF = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAzNyAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMyLjQ4NjMgMS4zMzk3OEMzNC40MTkxIDEuMzQwMDUgMzUuOTg2MyAyLjkwNjk1IDM1Ljk4NjMgNC44Mzk3OFYxNS4xNzY3QzM1Ljk4NjIgMTcuMTA5NCAzNC40MTkgMTguNjc2NCAzMi40ODYzIDE4LjY3NjdIMVYxLjMzOTc4SDMyLjQ4NjNaIiBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSIjREREREREIi8+CjxwYXRoIGQ9Ik0yNC41NjYxIDE1LjgzOThWNC45MzA2OUgzMS43ODkxVjYuODMyMzNIMjYuODcyNlY5LjQzMTc2SDMxLjMwOTdWMTEuMzMzNEgyNi44NzI2VjE1LjgzOThIMjQuNTY2MVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xOC4yNzAyIDE1LjgzOThIMTQuNDAzVjQuOTMwNjlIMTguMzAyMkMxOS4zOTk1IDQuOTMwNjkgMjAuMzQ0MSA1LjE0OTA5IDIxLjEzNiA1LjU4NTg4QzIxLjkyNzkgNi4wMTkxMiAyMi41MzY5IDYuNjQyMzQgMjIuOTYzIDcuNDU1NTVDMjMuMzkyNyA4LjI2ODc2IDIzLjYwNzYgOS4yNDE3NyAyMy42MDc2IDEwLjM3NDZDMjMuNjA3NiAxMS41MTEgMjMuMzkyNyAxMi40ODc1IDIyLjk2MyAxMy4zMDQzQzIyLjUzNjkgMTQuMTIxIDIxLjkyNDMgMTQuNzQ3OCAyMS4xMjUzIDE1LjE4NDZDMjAuMzI5OSAxNS42MjE0IDE5LjM3ODIgMTUuODM5OCAxOC4yNzAyIDE1LjgzOThaTTE2LjcwOTUgMTMuODYzNkgxOC4xNzQzQzE4Ljg1NjEgMTMuODYzNiAxOS40Mjk2IDEzLjc0MjggMTkuODk0OCAxMy41MDE0QzIwLjM2MzYgMTMuMjU2MyAyMC43MTUyIDEyLjg3ODEgMjAuOTQ5NSAxMi4zNjY4QzIxLjE4NzUgMTEuODUxOSAyMS4zMDY0IDExLjE4NzggMjEuMzA2NCAxMC4zNzQ2QzIxLjMwNjQgOS41Njg0OCAyMS4xODc1IDguOTA5NzQgMjAuOTQ5NSA4LjM5ODM4QzIwLjcxNTIgNy44ODcwMiAyMC4zNjU0IDcuNTEwNiAxOS45MDAyIDcuMjY5MTJDMTkuNDM1IDcuMDI3NjQgMTguODYxNSA2LjkwNjkgMTguMTc5NiA2LjkwNjlIMTYuNzA5NVYxMy44NjM2WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTUuNDQxMSAxNS44Mzk4VjQuOTMwNjlIOS43NDUwOEMxMC41NzI1IDQuOTMwNjkgMTEuMjc3NCA1LjA4ODcyIDExLjg1OTggNS40MDQ3N0MxMi40NDIyIDUuNzE3MjcgMTIuODg2MSA2LjE1MjI5IDEzLjE5MTUgNi43MDk4MUMxMy41MDA0IDcuMjYzNzkgMTMuNjU0OSA3LjkwMyAxMy42NTQ5IDguNjI3NDNDMTMuNjU0OSA5LjM1MTg2IDEzLjQ5ODYgOS45OTEwNiAxMy4xODYxIDEwLjU0NUMxMi44NzM2IDExLjA5OSAxMi40MjA5IDExLjUzMDUgMTEuODI3OCAxMS44Mzk0QzExLjIzODMgMTIuMTQ4NCAxMC41MjQ2IDEyLjMwMjkgOS42ODY0OCAxMi4zMDI5SDYuOTQzMjNWMTAuNDU0NUg5LjMxMzYyQzkuNzU3NTEgMTAuNDU0NSAxMC4xMjMzIDEwLjM3ODEgMTAuNDEwOSAxMC4yMjU0QzEwLjcwMjEgMTAuMDY5MiAxMC45MTg3IDkuODU0MzUgMTEuMDYwOCA5LjU4MDkxQzExLjIwNjQgOS4zMDM5MiAxMS4yNzkyIDguOTg2MDkgMTEuMjc5MiA4LjYyNzQzQzExLjI3OTIgOC4yNjUyMSAxMS4yMDY0IDcuOTQ5MTYgMTEuMDYwOCA3LjY3OTI3QzEwLjkxODcgNy40MDU4NCAxMC43MDIxIDcuMTk0NTQgMTAuNDEwOSA3LjA0NTRDMTAuMTE5NyA2Ljg5MjcgOS43NTA0IDYuODE2MzUgOS4zMDI5NiA2LjgxNjM1SDcuNzQ3NTZWMTUuODM5OEg1LjQ0MTFaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K';
@@ -21,7 +21,7 @@ const classes = {
21
21
  const Root = (0, material_1.styled)(material_1.Box, {
22
22
  name: constants_1.PREFIX,
23
23
  slot: 'DisplayRoot'
24
- })(({ theme }) => ({}));
24
+ })(() => ({}));
25
25
  exports.default = (_a) => {
26
26
  var { className, medias = [], onMediaClick = null } = _a, rest = tslib_1.__rest(_a, ["className", "medias", "onMediaClick"]);
27
27
  // MEMO
@@ -29,5 +29,7 @@ exports.default = (_a) => {
29
29
  if (_medias.length === 0) {
30
30
  return null;
31
31
  }
32
- return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.displayRoot) }, rest, { children: _medias.map((media, i) => ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.sharePreview, onClick: onMediaClick }, { children: media.type === Media_1.MEDIA_TYPE_EVENT || (media.embed && media.embed.embed_type === Media_1.MEDIA_EMBED_SC_SHARED_EVENT) ? ((0, jsx_runtime_1.jsx)(Event_1.default, { event: media.embed.metadata, template: event_1.SCEventTemplateType.DETAIL, variant: "outlined", square: true, hideEventParticipants: true, hideEventPlanner: true, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) })) : ((0, jsx_runtime_1.jsx)(FeedObject_1.default, { feedObjectId: media.embed.metadata.id, feedObjectType: media.embed.metadata.type, variant: 'outlined', template: feedObject_1.SCFeedObjectTemplateType.SHARE, cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST })) }), i))) })));
32
+ return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(className, classes.displayRoot) }, rest, { children: _medias.map((media, i) => ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.sharePreview, onClick: () => {
33
+ onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(media);
34
+ } }, { children: media.type === Media_1.MEDIA_TYPE_EVENT || (media.embed && media.embed.embed_type === Media_1.MEDIA_EMBED_SC_SHARED_EVENT) ? ((0, jsx_runtime_1.jsx)(Event_1.default, { event: media.embed.metadata, template: event_1.SCEventTemplateType.DETAIL, variant: "outlined", square: true, hideEventParticipants: true, hideEventPlanner: true, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) })) : ((0, jsx_runtime_1.jsx)(FeedObject_1.default, { feedObjectId: media.embed.metadata.id, feedObjectType: media.embed.metadata.type, variant: "outlined", template: feedObject_1.SCFeedObjectTemplateType.SHARE, cacheStrategy: utils_1.CacheStrategies.CACHE_FIRST })) }), i))) })));
33
35
  };
@@ -148,7 +148,19 @@ export default function Appearance(inProps) {
148
148
  setLoadingLogo('');
149
149
  setData({});
150
150
  setPreferences((prev) => {
151
- return prev.map((p) => Object.assign({}, p, { value: p.name === name ? preference[name].value : p.value }));
151
+ // Handle both single preference and array of preferences
152
+ if (Array.isArray(preference)) {
153
+ // If it's an array, find the preference with the matching name
154
+ const matchingPref = preference.find((p) => p.name === name);
155
+ if (matchingPref) {
156
+ return prev.map((p) => Object.assign({}, p, { value: p.name === name ? matchingPref.value : p.value }));
157
+ }
158
+ return prev;
159
+ }
160
+ else {
161
+ // Original behavior for single preference
162
+ return prev.map((p) => Object.assign({}, p, { value: p.name === name ? preference[name].value : p.value }));
163
+ }
152
164
  });
153
165
  onCompleteAction();
154
166
  })
@@ -17,3 +17,7 @@ export declare const MEDIA_EMBED_SC_SHARED_EVENT = "sc_shared_event";
17
17
  * MAX_GRID_IMAGES: max number of box rendered in feed preview
18
18
  */
19
19
  export declare const MAX_GRID_IMAGES = 5;
20
+ /**
21
+ * Default delay tracking seconds (fallback if not in the preference)
22
+ */
23
+ export declare const DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS = 3;
@@ -17,3 +17,7 @@ export const MEDIA_EMBED_SC_SHARED_EVENT = 'sc_shared_event';
17
17
  * MAX_GRID_IMAGES: max number of box rendered in feed preview
18
18
  */
19
19
  export const MAX_GRID_IMAGES = 5;
20
+ /**
21
+ * Default delay tracking seconds (fallback if not in the preference)
22
+ */
23
+ export const DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS = 3;
@@ -5,6 +5,7 @@ import { Waypoint } from 'react-waypoint';
5
5
  import ReactPlayer from 'react-player';
6
6
  import { styled } from '@mui/material';
7
7
  import { SCPreferences, useSCPreferences } from '@selfcommunity/react-core';
8
+ import { DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS } from '../../constants/Media';
8
9
  const PREFIX = 'SCAutoPlayer';
9
10
  const Root = styled(Waypoint, {
10
11
  name: PREFIX,
@@ -19,8 +20,11 @@ export default function AutoPlayer(props) {
19
20
  const [played, setPlayed] = useState(0);
20
21
  const { preferences } = useSCPreferences();
21
22
  const enableAutoplay = SCPreferences.CONFIGURATIONS_VIDEO_AUTOPLAY_ENABLED in preferences && preferences[SCPreferences.CONFIGURATIONS_VIDEO_AUTOPLAY_ENABLED].value;
23
+ const videoPlayTrackingDelaySeconds = SCPreferences.CONFIGURATIONS_VIDEO_PLAY_TRACKING_DELAY_SECONDS in preferences
24
+ ? preferences[SCPreferences.CONFIGURATIONS_VIDEO_PLAY_TRACKING_DELAY_SECONDS].value
25
+ : DEFAULT_VIDEO_PLAY_TRACKING_DELAY_SECONDS;
22
26
  useEffect(() => {
23
- if (played >= 10 && played <= 11) {
27
+ if (played >= videoPlayTrackingDelaySeconds && played <= videoPlayTrackingDelaySeconds + 1) {
24
28
  onVideoWatch === null || onVideoWatch === void 0 ? void 0 : onVideoWatch();
25
29
  }
26
30
  }, [played]);
@@ -64,8 +64,10 @@ export default (props) => {
64
64
  }
65
65
  setPreview(index);
66
66
  setMediaType(type);
67
- onMediaClick(type === MEDIA_TYPE_IMAGE ? images[index] : docs[index]);
68
- }, [images, docs]);
67
+ if (type === MEDIA_TYPE_IMAGE) {
68
+ onMediaClick(images[index]);
69
+ }
70
+ }, [gallery, setPreview, setMediaType, images, onMediaClick]);
69
71
  // RENDERING
70
72
  const renderTitle = (o) => {
71
73
  if (!o) {
@@ -131,11 +133,12 @@ export default (props) => {
131
133
  link.click();
132
134
  // Cleanup
133
135
  window.URL.revokeObjectURL(url);
136
+ onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(docs[index]);
134
137
  }
135
138
  catch (error) {
136
139
  Logger.error(SCOPE_SC_UI, error);
137
140
  }
138
- }), []);
141
+ }), [onMediaClick]);
139
142
  const handleIndexChange = useCallback((index) => {
140
143
  if (mediaType === MEDIA_TYPE_DOCUMENT) {
141
144
  setToolbarButtons(_jsx(IconButton, Object.assign({ onClick: () => handleDownload(index) }, { children: _jsx(Icon, { children: "download" }) })));
@@ -159,5 +162,5 @@ export default (props) => {
159
162
  if (medias.length === 0) {
160
163
  return null;
161
164
  }
162
- return (_jsxs(Root, Object.assign({ className: classNames(classes.displayRoot, className) }, { children: [[1, 3, 4].includes(imagesToShow.length) && renderOne(), imagesToShow.length >= 2 && imagesToShow.length < 4 && renderTwo(), imagesToShow.length >= 4 && renderThree(), preview !== -1 && (_jsx(Lightbox, { onClose: handleClose, index: preview, medias: mediaType === MEDIA_TYPE_IMAGE ? images : docs, toolbarButtons: toolbarButtons })), _jsx(Stack, Object.assign({ className: classes.docsWrapper }, { children: docs.map((doc, i) => (_jsx(DocComponent, { doc: doc, index: i, openPreviewImage: openPreviewImage, handleDownload: handleDownload }, doc.id))) }))] })));
165
+ return (_jsxs(Root, Object.assign({ className: classNames(classes.displayRoot, className) }, { children: [[1, 3, 4].includes(imagesToShow.length) && renderOne(), imagesToShow.length >= 2 && imagesToShow.length < 4 && renderTwo(), imagesToShow.length >= 4 && renderThree(), preview !== -1 && (_jsx(Lightbox, { onClose: handleClose, index: preview, medias: mediaType === MEDIA_TYPE_IMAGE ? images : docs, toolbarButtons: toolbarButtons })), _jsx(Stack, Object.assign({ className: classes.docsWrapper }, { children: docs.map((doc, i) => (_jsx(DocComponent, { doc: doc, index: i, openPreviewImage: openPreviewImage, handleDownload: handleDownload, onMediaClick: onMediaClick }, doc.id))) }))] })));
163
166
  };
@@ -5,6 +5,7 @@ interface DocComponentProps {
5
5
  onDelete?: (id: number) => void;
6
6
  openPreviewImage?: (index: number, type: string) => void;
7
7
  handleDownload?: (id: number) => void;
8
+ onMediaClick?: (media: SCMediaType) => void;
8
9
  }
9
10
  export default function DocComponent(props: DocComponentProps): JSX.Element;
10
11
  export {};
@@ -3,9 +3,11 @@ import { Box, Icon, IconButton, Stack, styled, Typography } from '@mui/material'
3
3
  import { PREFIX } from './constants';
4
4
  import { Link } from '@selfcommunity/react-core';
5
5
  import { MEDIA_TYPE_DOCUMENT } from '../../../constants/Media';
6
+ import { BADGE_PDF } from './badgePdf';
6
7
  const classes = {
7
8
  docRoot: `${PREFIX}-doc-root`,
8
- image: `${PREFIX}-image`,
9
+ imageWrapper: `${PREFIX}-image-wrapper`,
10
+ badgePdf: `${PREFIX}-badge-pdf`,
9
11
  textWrapper: `${PREFIX}-text-wrapper`,
10
12
  title: `${PREFIX}-title`,
11
13
  subtitle: `${PREFIX}-subtitle`,
@@ -26,6 +28,6 @@ function formatBytes(bytes, decimals = 2) {
26
28
  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
27
29
  }
28
30
  export default function DocComponent(props) {
29
- const { doc, index, onDelete, openPreviewImage, handleDownload } = props;
30
- return (_jsxs(Root, Object.assign({ className: classes.docRoot }, { children: [_jsx(Box, { component: "img", className: classes.image, alt: "pdf preview", src: doc.image_thumbnail ? doc.image_thumbnail.url : doc.image, onClick: () => openPreviewImage === null || openPreviewImage === void 0 ? void 0 : openPreviewImage(index, MEDIA_TYPE_DOCUMENT), sx: { cursor: openPreviewImage ? 'pointer' : undefined } }), _jsxs(Stack, Object.assign({ className: classes.textWrapper }, { children: [_jsx(Typography, Object.assign({ className: classes.title }, { children: doc.title })), doc.size && _jsx(Typography, Object.assign({ className: classes.subtitle }, { children: formatBytes(doc.size) }))] })), (handleDownload || onDelete) && (_jsxs(Stack, Object.assign({ className: classes.actionWrapper }, { children: [onDelete && (_jsx(IconButton, Object.assign({ className: classes.action, onClick: () => onDelete(doc.id) }, { children: _jsx(Icon, { children: "delete" }) }))), handleDownload && (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: classes.action, component: Link, to: doc.url, target: "_blank" }, { children: _jsx(Icon, { children: "visibility" }) })), _jsx(IconButton, Object.assign({ className: classes.action, onClick: () => handleDownload(index) }, { children: _jsx(Icon, { children: "download" }) }))] }))] })))] })));
31
+ const { doc, index, onDelete, openPreviewImage, handleDownload, onMediaClick } = props;
32
+ return (_jsxs(Root, Object.assign({ className: classes.docRoot }, { children: [_jsxs(Box, Object.assign({ onClick: () => openPreviewImage === null || openPreviewImage === void 0 ? void 0 : openPreviewImage(index, MEDIA_TYPE_DOCUMENT), sx: { cursor: openPreviewImage ? 'pointer' : undefined }, className: classes.imageWrapper }, { children: [_jsx("img", { alt: "pdf preview", src: doc.image_thumbnail ? doc.image_thumbnail.url : doc.image, width: "100%", height: "100%" }), _jsx("img", { alt: "pdf badge", src: BADGE_PDF, className: classes.badgePdf })] })), _jsxs(Stack, Object.assign({ className: classes.textWrapper }, { children: [_jsx(Typography, Object.assign({ className: classes.title }, { children: doc.title })), doc.size && _jsx(Typography, Object.assign({ className: classes.subtitle }, { children: formatBytes(doc.size) }))] })), (handleDownload || onDelete) && (_jsxs(Stack, Object.assign({ className: classes.actionWrapper }, { children: [onDelete && (_jsx(IconButton, Object.assign({ className: classes.action, onClick: () => onDelete(doc.id) }, { children: _jsx(Icon, { children: "delete" }) }))), handleDownload && (_jsxs(_Fragment, { children: [_jsx(IconButton, Object.assign({ className: classes.action, component: Link, to: doc.url, target: "_blank", onClick: () => onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(doc) }, { children: _jsx(Icon, { children: "visibility" }) })), _jsx(IconButton, Object.assign({ className: classes.action, onClick: () => handleDownload(index) }, { children: _jsx(Icon, { children: "download" }) }))] }))] })))] })));
31
33
  }
@@ -0,0 +1 @@
1
+ export declare const BADGE_PDF = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAzNyAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMyLjQ4NjMgMS4zMzk3OEMzNC40MTkxIDEuMzQwMDUgMzUuOTg2MyAyLjkwNjk1IDM1Ljk4NjMgNC44Mzk3OFYxNS4xNzY3QzM1Ljk4NjIgMTcuMTA5NCAzNC40MTkgMTguNjc2NCAzMi40ODYzIDE4LjY3NjdIMVYxLjMzOTc4SDMyLjQ4NjNaIiBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSIjREREREREIi8+CjxwYXRoIGQ9Ik0yNC41NjYxIDE1LjgzOThWNC45MzA2OUgzMS43ODkxVjYuODMyMzNIMjYuODcyNlY5LjQzMTc2SDMxLjMwOTdWMTEuMzMzNEgyNi44NzI2VjE1LjgzOThIMjQuNTY2MVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xOC4yNzAyIDE1LjgzOThIMTQuNDAzVjQuOTMwNjlIMTguMzAyMkMxOS4zOTk1IDQuOTMwNjkgMjAuMzQ0MSA1LjE0OTA5IDIxLjEzNiA1LjU4NTg4QzIxLjkyNzkgNi4wMTkxMiAyMi41MzY5IDYuNjQyMzQgMjIuOTYzIDcuNDU1NTVDMjMuMzkyNyA4LjI2ODc2IDIzLjYwNzYgOS4yNDE3NyAyMy42MDc2IDEwLjM3NDZDMjMuNjA3NiAxMS41MTEgMjMuMzkyNyAxMi40ODc1IDIyLjk2MyAxMy4zMDQzQzIyLjUzNjkgMTQuMTIxIDIxLjkyNDMgMTQuNzQ3OCAyMS4xMjUzIDE1LjE4NDZDMjAuMzI5OSAxNS42MjE0IDE5LjM3ODIgMTUuODM5OCAxOC4yNzAyIDE1LjgzOThaTTE2LjcwOTUgMTMuODYzNkgxOC4xNzQzQzE4Ljg1NjEgMTMuODYzNiAxOS40Mjk2IDEzLjc0MjggMTkuODk0OCAxMy41MDE0QzIwLjM2MzYgMTMuMjU2MyAyMC43MTUyIDEyLjg3ODEgMjAuOTQ5NSAxMi4zNjY4QzIxLjE4NzUgMTEuODUxOSAyMS4zMDY0IDExLjE4NzggMjEuMzA2NCAxMC4zNzQ2QzIxLjMwNjQgOS41Njg0OCAyMS4xODc1IDguOTA5NzQgMjAuOTQ5NSA4LjM5ODM4QzIwLjcxNTIgNy44ODcwMiAyMC4zNjU0IDcuNTEwNiAxOS45MDAyIDcuMjY5MTJDMTkuNDM1IDcuMDI3NjQgMTguODYxNSA2LjkwNjkgMTguMTc5NiA2LjkwNjlIMTYuNzA5NVYxMy44NjM2WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTUuNDQxMSAxNS44Mzk4VjQuOTMwNjlIOS43NDUwOEMxMC41NzI1IDQuOTMwNjkgMTEuMjc3NCA1LjA4ODcyIDExLjg1OTggNS40MDQ3N0MxMi40NDIyIDUuNzE3MjcgMTIuODg2MSA2LjE1MjI5IDEzLjE5MTUgNi43MDk4MUMxMy41MDA0IDcuMjYzNzkgMTMuNjU0OSA3LjkwMyAxMy42NTQ5IDguNjI3NDNDMTMuNjU0OSA5LjM1MTg2IDEzLjQ5ODYgOS45OTEwNiAxMy4xODYxIDEwLjU0NUMxMi44NzM2IDExLjA5OSAxMi40MjA5IDExLjUzMDUgMTEuODI3OCAxMS44Mzk0QzExLjIzODMgMTIuMTQ4NCAxMC41MjQ2IDEyLjMwMjkgOS42ODY0OCAxMi4zMDI5SDYuOTQzMjNWMTAuNDU0NUg5LjMxMzYyQzkuNzU3NTEgMTAuNDU0NSAxMC4xMjMzIDEwLjM3ODEgMTAuNDEwOSAxMC4yMjU0QzEwLjcwMjEgMTAuMDY5MiAxMC45MTg3IDkuODU0MzUgMTEuMDYwOCA5LjU4MDkxQzExLjIwNjQgOS4zMDM5MiAxMS4yNzkyIDguOTg2MDkgMTEuMjc5MiA4LjYyNzQzQzExLjI3OTIgOC4yNjUyMSAxMS4yMDY0IDcuOTQ5MTYgMTEuMDYwOCA3LjY3OTI3QzEwLjkxODcgNy40MDU4NCAxMC43MDIxIDcuMTk0NTQgMTAuNDEwOSA3LjA0NTRDMTAuMTE5NyA2Ljg5MjcgOS43NTA0IDYuODE2MzUgOS4zMDI5NiA2LjgxNjM1SDcuNzQ3NTZWMTUuODM5OEg1LjQ0MTFaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K";
@@ -0,0 +1 @@
1
+ export const BADGE_PDF = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAzNyAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMyLjQ4NjMgMS4zMzk3OEMzNC40MTkxIDEuMzQwMDUgMzUuOTg2MyAyLjkwNjk1IDM1Ljk4NjMgNC44Mzk3OFYxNS4xNzY3QzM1Ljk4NjIgMTcuMTA5NCAzNC40MTkgMTguNjc2NCAzMi40ODYzIDE4LjY3NjdIMVYxLjMzOTc4SDMyLjQ4NjNaIiBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSIjREREREREIi8+CjxwYXRoIGQ9Ik0yNC41NjYxIDE1LjgzOThWNC45MzA2OUgzMS43ODkxVjYuODMyMzNIMjYuODcyNlY5LjQzMTc2SDMxLjMwOTdWMTEuMzMzNEgyNi44NzI2VjE1LjgzOThIMjQuNTY2MVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xOC4yNzAyIDE1LjgzOThIMTQuNDAzVjQuOTMwNjlIMTguMzAyMkMxOS4zOTk1IDQuOTMwNjkgMjAuMzQ0MSA1LjE0OTA5IDIxLjEzNiA1LjU4NTg4QzIxLjkyNzkgNi4wMTkxMiAyMi41MzY5IDYuNjQyMzQgMjIuOTYzIDcuNDU1NTVDMjMuMzkyNyA4LjI2ODc2IDIzLjYwNzYgOS4yNDE3NyAyMy42MDc2IDEwLjM3NDZDMjMuNjA3NiAxMS41MTEgMjMuMzkyNyAxMi40ODc1IDIyLjk2MyAxMy4zMDQzQzIyLjUzNjkgMTQuMTIxIDIxLjkyNDMgMTQuNzQ3OCAyMS4xMjUzIDE1LjE4NDZDMjAuMzI5OSAxNS42MjE0IDE5LjM3ODIgMTUuODM5OCAxOC4yNzAyIDE1LjgzOThaTTE2LjcwOTUgMTMuODYzNkgxOC4xNzQzQzE4Ljg1NjEgMTMuODYzNiAxOS40Mjk2IDEzLjc0MjggMTkuODk0OCAxMy41MDE0QzIwLjM2MzYgMTMuMjU2MyAyMC43MTUyIDEyLjg3ODEgMjAuOTQ5NSAxMi4zNjY4QzIxLjE4NzUgMTEuODUxOSAyMS4zMDY0IDExLjE4NzggMjEuMzA2NCAxMC4zNzQ2QzIxLjMwNjQgOS41Njg0OCAyMS4xODc1IDguOTA5NzQgMjAuOTQ5NSA4LjM5ODM4QzIwLjcxNTIgNy44ODcwMiAyMC4zNjU0IDcuNTEwNiAxOS45MDAyIDcuMjY5MTJDMTkuNDM1IDcuMDI3NjQgMTguODYxNSA2LjkwNjkgMTguMTc5NiA2LjkwNjlIMTYuNzA5NVYxMy44NjM2WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTUuNDQxMSAxNS44Mzk4VjQuOTMwNjlIOS43NDUwOEMxMC41NzI1IDQuOTMwNjkgMTEuMjc3NCA1LjA4ODcyIDExLjg1OTggNS40MDQ3N0MxMi40NDIyIDUuNzE3MjcgMTIuODg2MSA2LjE1MjI5IDEzLjE5MTUgNi43MDk4MUMxMy41MDA0IDcuMjYzNzkgMTMuNjU0OSA3LjkwMyAxMy42NTQ5IDguNjI3NDNDMTMuNjU0OSA5LjM1MTg2IDEzLjQ5ODYgOS45OTEwNiAxMy4xODYxIDEwLjU0NUMxMi44NzM2IDExLjA5OSAxMi40MjA5IDExLjUzMDUgMTEuODI3OCAxMS44Mzk0QzExLjIzODMgMTIuMTQ4NCAxMC41MjQ2IDEyLjMwMjkgOS42ODY0OCAxMi4zMDI5SDYuOTQzMjNWMTAuNDU0NUg5LjMxMzYyQzkuNzU3NTEgMTAuNDU0NSAxMC4xMjMzIDEwLjM3ODEgMTAuNDEwOSAxMC4yMjU0QzEwLjcwMjEgMTAuMDY5MiAxMC45MTg3IDkuODU0MzUgMTEuMDYwOCA5LjU4MDkxQzExLjIwNjQgOS4zMDM5MiAxMS4yNzkyIDguOTg2MDkgMTEuMjc5MiA4LjYyNzQzQzExLjI3OTIgOC4yNjUyMSAxMS4yMDY0IDcuOTQ5MTYgMTEuMDYwOCA3LjY3OTI3QzEwLjkxODcgNy40MDU4NCAxMC43MDIxIDcuMTk0NTQgMTAuNDEwOSA3LjA0NTRDMTAuMTE5NyA2Ljg5MjcgOS43NTA0IDYuODE2MzUgOS4zMDI5NiA2LjgxNjM1SDcuNzQ3NTZWMTUuODM5OEg1LjQ0MTFaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K';
@@ -19,7 +19,7 @@ const classes = {
19
19
  const Root = styled(Box, {
20
20
  name: PREFIX,
21
21
  slot: 'DisplayRoot'
22
- })(({ theme }) => ({}));
22
+ })(() => ({}));
23
23
  export default (_a) => {
24
24
  var { className, medias = [], onMediaClick = null } = _a, rest = __rest(_a, ["className", "medias", "onMediaClick"]);
25
25
  // MEMO
@@ -27,5 +27,7 @@ export default (_a) => {
27
27
  if (_medias.length === 0) {
28
28
  return null;
29
29
  }
30
- return (_jsx(Root, Object.assign({ className: classNames(className, classes.displayRoot) }, rest, { children: _medias.map((media, i) => (_jsx(Box, Object.assign({ className: classes.sharePreview, onClick: onMediaClick }, { children: media.type === MEDIA_TYPE_EVENT || (media.embed && media.embed.embed_type === MEDIA_EMBED_SC_SHARED_EVENT) ? (_jsx(Event, { event: media.embed.metadata, template: SCEventTemplateType.DETAIL, variant: "outlined", square: true, hideEventParticipants: true, hideEventPlanner: true, actions: _jsx(_Fragment, {}) })) : (_jsx(FeedObject, { feedObjectId: media.embed.metadata.id, feedObjectType: media.embed.metadata.type, variant: 'outlined', template: SCFeedObjectTemplateType.SHARE, cacheStrategy: CacheStrategies.CACHE_FIRST })) }), i))) })));
30
+ return (_jsx(Root, Object.assign({ className: classNames(className, classes.displayRoot) }, rest, { children: _medias.map((media, i) => (_jsx(Box, Object.assign({ className: classes.sharePreview, onClick: () => {
31
+ onMediaClick === null || onMediaClick === void 0 ? void 0 : onMediaClick(media);
32
+ } }, { children: media.type === MEDIA_TYPE_EVENT || (media.embed && media.embed.embed_type === MEDIA_EMBED_SC_SHARED_EVENT) ? (_jsx(Event, { event: media.embed.metadata, template: SCEventTemplateType.DETAIL, variant: "outlined", square: true, hideEventParticipants: true, hideEventPlanner: true, actions: _jsx(_Fragment, {}) })) : (_jsx(FeedObject, { feedObjectId: media.embed.metadata.id, feedObjectType: media.embed.metadata.type, variant: "outlined", template: SCFeedObjectTemplateType.SHARE, cacheStrategy: CacheStrategies.CACHE_FIRST })) }), i))) })));
31
33
  };