From 148878e00fd14a8119ccf1b6e482810f2f10ea09 Mon Sep 17 00:00:00 2001
From: Johan Sosa <sosa.johan@gmail.com>
Date: Sat, 20 Jan 2024 21:46:42 +0100
Subject: [PATCH] feat(ModalZoom): Added hideButton and opened props

---
 .../src/overlay/ModalZoom/ModalZoom.js        | 40 +++++++++++-------
 packages/components/src/tokens.compiled.js    | 41 +++++++++++++++----
 packages/icons/solid/esm/index.d.ts           |  5 +++
 packages/icons/solid/esm/index.js             |  5 +++
 packages/icons/solid/index.d.ts               |  5 +++
 packages/icons/solid/index.js                 |  5 +++
 packages/icons/src/solid/cursor-player.svg    |  3 ++
 packages/icons/src/solid/download.svg         |  3 ++
 packages/icons/src/solid/message-chat.svg     |  3 ++
 packages/icons/src/solid/open.svg             |  3 ++
 packages/icons/src/solid/search-plus.svg      |  3 ++
 .../src/common/AssetPlayer/AssetPlayer.js     |  5 +++
 12 files changed, 100 insertions(+), 21 deletions(-)
 create mode 100644 packages/icons/src/solid/cursor-player.svg
 create mode 100644 packages/icons/src/solid/download.svg
 create mode 100644 packages/icons/src/solid/message-chat.svg
 create mode 100644 packages/icons/src/solid/open.svg
 create mode 100644 packages/icons/src/solid/search-plus.svg

diff --git a/packages/components/src/overlay/ModalZoom/ModalZoom.js b/packages/components/src/overlay/ModalZoom/ModalZoom.js
index 206790dd0..b3c0418dd 100644
--- a/packages/components/src/overlay/ModalZoom/ModalZoom.js
+++ b/packages/components/src/overlay/ModalZoom/ModalZoom.js
@@ -1,31 +1,42 @@
 import React, { useState, useRef } from 'react';
 import { Portal } from '@mantine/core';
+import { noop } from 'lodash';
 import { RemoveIcon, ZoomInIcon, ZoomOutIcon } from '@bubbles-ui/icons/outline';
 import { TransformComponent, TransformWrapper } from 'react-zoom-pan-pinch';
 import { Box } from '../../layout/Box';
 import { ModalZoomStyles } from './ModalZoom.styles';
 import { MODAL_ZOOM_DEFAULT_PROPS, MODAL_ZOOM_PROP_TYPES } from './ModalZoom.constants';
 
-const ModalZoom = ({ children, canPlay, style }) => {
-  const [open, setOpen] = useState(false);
+const ModalZoom = ({ children, canPlay, opened, hideButton, onClose = noop, style }) => {
+  const [open, setOpen] = useState(opened);
   const center = useRef(null);
 
   const { classes } = ModalZoomStyles({}, { name: 'ModalZoom' });
 
+  React.useEffect(() => {
+    if(opened !== open) {
+      setOpen(opened);
+      center.current?.call();
+    }
+  }, [opened])
+
   return (
     <>
-      <Box
-        style={{ cursor: canPlay && 'pointer', ...style }}
-        onClick={() => {
-          if (!canPlay) return;
-          if (center.current) {
-            center.current.call();
-          }
-          setOpen(true);
-        }}
-      >
-        {children}
-      </Box>
+      {!hideButton && (
+        <Box
+          style={{ cursor: canPlay && 'pointer', ...style }}
+          onClick={() => {
+            if (!canPlay) return;
+            if (center.current) {
+              center.current.call();
+            }
+            setOpen(true);
+          }}
+        >
+          {children}
+        </Box>
+      )}
+
       {open && (
         <Portal zIndex={99999}>
           <Box className={classes.modalWrapper}>
@@ -33,6 +44,7 @@ const ModalZoom = ({ children, canPlay, style }) => {
               className={classes.close}
               onClick={() => {
                 setOpen(false);
+                onClose();
               }}
             >
               <RemoveIcon />
diff --git a/packages/components/src/tokens.compiled.js b/packages/components/src/tokens.compiled.js
index ad11f90d1..c0c8660b3 100644
--- a/packages/components/src/tokens.compiled.js
+++ b/packages/components/src/tokens.compiled.js
@@ -1153,7 +1153,7 @@ export default {
           "y": 0,
           "blur": 4,
           "spread": 0,
-          "color": "#ffffff26",
+          "color": "#ffffff",
           "type": "dropShadow"
         },
         "type": "boxShadow"
@@ -1234,8 +1234,17 @@ export default {
             "type": "color"
           },
           "hover--reverse-transparent": {
-            "value": "#ffffff26",
-            "type": "color"
+            "value": "#ffffff",
+            "type": "color",
+            "$extensions": {
+              "studio.tokens": {
+                "modify": {
+                  "type": "alpha",
+                  "value": "0.15",
+                  "space": "lch"
+                }
+              }
+            }
           },
           "down": {
             "value": "#F1FFBD",
@@ -4930,12 +4939,30 @@ export default {
       "color": {
         "primary": {
           "default": {
-            "value": "#4d535866",
-            "type": "color"
+            "value": "#4D5358",
+            "type": "color",
+            "$extensions": {
+              "studio.tokens": {
+                "modify": {
+                  "type": "alpha",
+                  "value": "0.4",
+                  "space": "lch"
+                }
+              }
+            }
           },
           "hover": {
-            "value": "#4d5358b3",
-            "type": "color"
+            "value": "#4D5358",
+            "type": "color",
+            "$extensions": {
+              "studio.tokens": {
+                "modify": {
+                  "type": "alpha",
+                  "value": "0.7",
+                  "space": "lch"
+                }
+              }
+            }
           },
           "down": {
             "value": "#4D5358",
diff --git a/packages/icons/solid/esm/index.d.ts b/packages/icons/solid/esm/index.d.ts
index d776778fb..12f8ca0de 100644
--- a/packages/icons/solid/esm/index.d.ts
+++ b/packages/icons/solid/esm/index.d.ts
@@ -40,6 +40,7 @@ export { default as ControlsPreviousIcon } from './ControlsPreviousIcon'
 export { default as ControlsRecordIcon } from './ControlsRecordIcon'
 export { default as ControlsRewindIcon } from './ControlsRewindIcon'
 export { default as ControlsStopIcon } from './ControlsStopIcon'
+export { default as CursorPlayerIcon } from './CursorPlayerIcon'
 export { default as CursorIcon } from './CursorIcon'
 export { default as CutStarIcon } from './CutStarIcon'
 export { default as DeleteAlternateIcon } from './DeleteAlternateIcon'
@@ -48,6 +49,7 @@ export { default as DeleteIcon } from './DeleteIcon'
 export { default as DesignShapeMonitorIcon } from './DesignShapeMonitorIcon'
 export { default as DislikeIcon } from './DislikeIcon'
 export { default as DoneSquareAlternateIcon } from './DoneSquareAlternateIcon'
+export { default as DownloadIcon } from './DownloadIcon'
 export { default as EditWriteIcon } from './EditWriteIcon'
 export { default as EditorCenterAlignIcon } from './EditorCenterAlignIcon'
 export { default as EditorHyperlinkIcon } from './EditorHyperlinkIcon'
@@ -99,6 +101,7 @@ export { default as LinkedinIcon } from './LinkedinIcon'
 export { default as LockIcon } from './LockIcon'
 export { default as MapFlagIcon } from './MapFlagIcon'
 export { default as MeetingCameraIcon } from './MeetingCameraIcon'
+export { default as MessageChatIcon } from './MessageChatIcon'
 export { default as MicrophoneOffIcon } from './MicrophoneOffIcon'
 export { default as MicrophoneIcon } from './MicrophoneIcon'
 export { default as MoveToTopIcon } from './MoveToTopIcon'
@@ -106,6 +109,7 @@ export { default as MusicNoteIcon } from './MusicNoteIcon'
 export { default as NavigationMenuIcon } from './NavigationMenuIcon'
 export { default as NoPauseIcon } from './NoPauseIcon'
 export { default as NonEvaluableIcon } from './NonEvaluableIcon'
+export { default as OpenIcon } from './OpenIcon'
 export { default as ParagraphSpacingIcon } from './ParagraphSpacingIcon'
 export { default as PassportIcon } from './PassportIcon'
 export { default as PerformanceMoneyIncreaseIcon } from './PerformanceMoneyIncreaseIcon'
@@ -147,6 +151,7 @@ export { default as PunctuableIcon } from './PunctuableIcon'
 export { default as RatingStarIcon } from './RatingStarIcon'
 export { default as RemoveBoldIcon } from './RemoveBoldIcon'
 export { default as ReorderDownIcon } from './ReorderDownIcon'
+export { default as SearchPlusIcon } from './SearchPlusIcon'
 export { default as SettingMenuHorizontalIcon } from './SettingMenuHorizontalIcon'
 export { default as SettingMenuVerticalIcon } from './SettingMenuVerticalIcon'
 export { default as SettingsIcon } from './SettingsIcon'
diff --git a/packages/icons/solid/esm/index.js b/packages/icons/solid/esm/index.js
index 1ac239198..cc7aabe44 100644
--- a/packages/icons/solid/esm/index.js
+++ b/packages/icons/solid/esm/index.js
@@ -40,6 +40,7 @@ export { default as ControlsPreviousIcon } from './ControlsPreviousIcon.js'
 export { default as ControlsRecordIcon } from './ControlsRecordIcon.js'
 export { default as ControlsRewindIcon } from './ControlsRewindIcon.js'
 export { default as ControlsStopIcon } from './ControlsStopIcon.js'
+export { default as CursorPlayerIcon } from './CursorPlayerIcon.js'
 export { default as CursorIcon } from './CursorIcon.js'
 export { default as CutStarIcon } from './CutStarIcon.js'
 export { default as DeleteAlternateIcon } from './DeleteAlternateIcon.js'
@@ -48,6 +49,7 @@ export { default as DeleteIcon } from './DeleteIcon.js'
 export { default as DesignShapeMonitorIcon } from './DesignShapeMonitorIcon.js'
 export { default as DislikeIcon } from './DislikeIcon.js'
 export { default as DoneSquareAlternateIcon } from './DoneSquareAlternateIcon.js'
+export { default as DownloadIcon } from './DownloadIcon.js'
 export { default as EditWriteIcon } from './EditWriteIcon.js'
 export { default as EditorCenterAlignIcon } from './EditorCenterAlignIcon.js'
 export { default as EditorHyperlinkIcon } from './EditorHyperlinkIcon.js'
@@ -99,6 +101,7 @@ export { default as LinkedinIcon } from './LinkedinIcon.js'
 export { default as LockIcon } from './LockIcon.js'
 export { default as MapFlagIcon } from './MapFlagIcon.js'
 export { default as MeetingCameraIcon } from './MeetingCameraIcon.js'
+export { default as MessageChatIcon } from './MessageChatIcon.js'
 export { default as MicrophoneOffIcon } from './MicrophoneOffIcon.js'
 export { default as MicrophoneIcon } from './MicrophoneIcon.js'
 export { default as MoveToTopIcon } from './MoveToTopIcon.js'
@@ -106,6 +109,7 @@ export { default as MusicNoteIcon } from './MusicNoteIcon.js'
 export { default as NavigationMenuIcon } from './NavigationMenuIcon.js'
 export { default as NoPauseIcon } from './NoPauseIcon.js'
 export { default as NonEvaluableIcon } from './NonEvaluableIcon.js'
+export { default as OpenIcon } from './OpenIcon.js'
 export { default as ParagraphSpacingIcon } from './ParagraphSpacingIcon.js'
 export { default as PassportIcon } from './PassportIcon.js'
 export { default as PerformanceMoneyIncreaseIcon } from './PerformanceMoneyIncreaseIcon.js'
@@ -147,6 +151,7 @@ export { default as PunctuableIcon } from './PunctuableIcon.js'
 export { default as RatingStarIcon } from './RatingStarIcon.js'
 export { default as RemoveBoldIcon } from './RemoveBoldIcon.js'
 export { default as ReorderDownIcon } from './ReorderDownIcon.js'
+export { default as SearchPlusIcon } from './SearchPlusIcon.js'
 export { default as SettingMenuHorizontalIcon } from './SettingMenuHorizontalIcon.js'
 export { default as SettingMenuVerticalIcon } from './SettingMenuVerticalIcon.js'
 export { default as SettingsIcon } from './SettingsIcon.js'
diff --git a/packages/icons/solid/index.d.ts b/packages/icons/solid/index.d.ts
index d776778fb..12f8ca0de 100644
--- a/packages/icons/solid/index.d.ts
+++ b/packages/icons/solid/index.d.ts
@@ -40,6 +40,7 @@ export { default as ControlsPreviousIcon } from './ControlsPreviousIcon'
 export { default as ControlsRecordIcon } from './ControlsRecordIcon'
 export { default as ControlsRewindIcon } from './ControlsRewindIcon'
 export { default as ControlsStopIcon } from './ControlsStopIcon'
+export { default as CursorPlayerIcon } from './CursorPlayerIcon'
 export { default as CursorIcon } from './CursorIcon'
 export { default as CutStarIcon } from './CutStarIcon'
 export { default as DeleteAlternateIcon } from './DeleteAlternateIcon'
@@ -48,6 +49,7 @@ export { default as DeleteIcon } from './DeleteIcon'
 export { default as DesignShapeMonitorIcon } from './DesignShapeMonitorIcon'
 export { default as DislikeIcon } from './DislikeIcon'
 export { default as DoneSquareAlternateIcon } from './DoneSquareAlternateIcon'
+export { default as DownloadIcon } from './DownloadIcon'
 export { default as EditWriteIcon } from './EditWriteIcon'
 export { default as EditorCenterAlignIcon } from './EditorCenterAlignIcon'
 export { default as EditorHyperlinkIcon } from './EditorHyperlinkIcon'
@@ -99,6 +101,7 @@ export { default as LinkedinIcon } from './LinkedinIcon'
 export { default as LockIcon } from './LockIcon'
 export { default as MapFlagIcon } from './MapFlagIcon'
 export { default as MeetingCameraIcon } from './MeetingCameraIcon'
+export { default as MessageChatIcon } from './MessageChatIcon'
 export { default as MicrophoneOffIcon } from './MicrophoneOffIcon'
 export { default as MicrophoneIcon } from './MicrophoneIcon'
 export { default as MoveToTopIcon } from './MoveToTopIcon'
@@ -106,6 +109,7 @@ export { default as MusicNoteIcon } from './MusicNoteIcon'
 export { default as NavigationMenuIcon } from './NavigationMenuIcon'
 export { default as NoPauseIcon } from './NoPauseIcon'
 export { default as NonEvaluableIcon } from './NonEvaluableIcon'
+export { default as OpenIcon } from './OpenIcon'
 export { default as ParagraphSpacingIcon } from './ParagraphSpacingIcon'
 export { default as PassportIcon } from './PassportIcon'
 export { default as PerformanceMoneyIncreaseIcon } from './PerformanceMoneyIncreaseIcon'
@@ -147,6 +151,7 @@ export { default as PunctuableIcon } from './PunctuableIcon'
 export { default as RatingStarIcon } from './RatingStarIcon'
 export { default as RemoveBoldIcon } from './RemoveBoldIcon'
 export { default as ReorderDownIcon } from './ReorderDownIcon'
+export { default as SearchPlusIcon } from './SearchPlusIcon'
 export { default as SettingMenuHorizontalIcon } from './SettingMenuHorizontalIcon'
 export { default as SettingMenuVerticalIcon } from './SettingMenuVerticalIcon'
 export { default as SettingsIcon } from './SettingsIcon'
diff --git a/packages/icons/solid/index.js b/packages/icons/solid/index.js
index b6233ff9a..e653814cf 100644
--- a/packages/icons/solid/index.js
+++ b/packages/icons/solid/index.js
@@ -40,6 +40,7 @@ module.exports.ControlsPreviousIcon = require("./ControlsPreviousIcon.js")
 module.exports.ControlsRecordIcon = require("./ControlsRecordIcon.js")
 module.exports.ControlsRewindIcon = require("./ControlsRewindIcon.js")
 module.exports.ControlsStopIcon = require("./ControlsStopIcon.js")
+module.exports.CursorPlayerIcon = require("./CursorPlayerIcon.js")
 module.exports.CursorIcon = require("./CursorIcon.js")
 module.exports.CutStarIcon = require("./CutStarIcon.js")
 module.exports.DeleteAlternateIcon = require("./DeleteAlternateIcon.js")
@@ -48,6 +49,7 @@ module.exports.DeleteIcon = require("./DeleteIcon.js")
 module.exports.DesignShapeMonitorIcon = require("./DesignShapeMonitorIcon.js")
 module.exports.DislikeIcon = require("./DislikeIcon.js")
 module.exports.DoneSquareAlternateIcon = require("./DoneSquareAlternateIcon.js")
+module.exports.DownloadIcon = require("./DownloadIcon.js")
 module.exports.EditWriteIcon = require("./EditWriteIcon.js")
 module.exports.EditorCenterAlignIcon = require("./EditorCenterAlignIcon.js")
 module.exports.EditorHyperlinkIcon = require("./EditorHyperlinkIcon.js")
@@ -99,6 +101,7 @@ module.exports.LinkedinIcon = require("./LinkedinIcon.js")
 module.exports.LockIcon = require("./LockIcon.js")
 module.exports.MapFlagIcon = require("./MapFlagIcon.js")
 module.exports.MeetingCameraIcon = require("./MeetingCameraIcon.js")
+module.exports.MessageChatIcon = require("./MessageChatIcon.js")
 module.exports.MicrophoneOffIcon = require("./MicrophoneOffIcon.js")
 module.exports.MicrophoneIcon = require("./MicrophoneIcon.js")
 module.exports.MoveToTopIcon = require("./MoveToTopIcon.js")
@@ -106,6 +109,7 @@ module.exports.MusicNoteIcon = require("./MusicNoteIcon.js")
 module.exports.NavigationMenuIcon = require("./NavigationMenuIcon.js")
 module.exports.NoPauseIcon = require("./NoPauseIcon.js")
 module.exports.NonEvaluableIcon = require("./NonEvaluableIcon.js")
+module.exports.OpenIcon = require("./OpenIcon.js")
 module.exports.ParagraphSpacingIcon = require("./ParagraphSpacingIcon.js")
 module.exports.PassportIcon = require("./PassportIcon.js")
 module.exports.PerformanceMoneyIncreaseIcon = require("./PerformanceMoneyIncreaseIcon.js")
@@ -147,6 +151,7 @@ module.exports.PunctuableIcon = require("./PunctuableIcon.js")
 module.exports.RatingStarIcon = require("./RatingStarIcon.js")
 module.exports.RemoveBoldIcon = require("./RemoveBoldIcon.js")
 module.exports.ReorderDownIcon = require("./ReorderDownIcon.js")
+module.exports.SearchPlusIcon = require("./SearchPlusIcon.js")
 module.exports.SettingMenuHorizontalIcon = require("./SettingMenuHorizontalIcon.js")
 module.exports.SettingMenuVerticalIcon = require("./SettingMenuVerticalIcon.js")
 module.exports.SettingsIcon = require("./SettingsIcon.js")
diff --git a/packages/icons/src/solid/cursor-player.svg b/packages/icons/src/solid/cursor-player.svg
new file mode 100644
index 000000000..e46e070f9
--- /dev/null
+++ b/packages/icons/src/solid/cursor-player.svg
@@ -0,0 +1,3 @@
+<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.58401 1.26835C3.68075 1.31887 2.87937 1.7895 2.41116 2.54443C2.22512 2.84438 2.10811 3.15049 2.03741 3.52221L2.01001 3.66621V15.0002V26.3342L2.03741 26.4782C2.10811 26.8499 2.22512 27.156 2.41116 27.456C2.84235 28.1512 3.57729 28.6176 4.39801 28.7169C4.56647 28.7372 4.88473 28.7342 5.06765 28.7104C5.34801 28.674 5.66515 28.5779 5.91001 28.4551C6.01836 28.4008 26.427 17.4681 26.586 17.3792C26.8352 17.2399 27.024 17.0977 27.206 16.9123C27.3665 16.7488 27.418 16.6858 27.5382 16.5059C27.7604 16.1736 27.9029 15.8117 27.9682 15.4142C27.9988 15.2277 27.9988 14.7727 27.9682 14.5862C27.9027 14.1874 27.7611 13.8278 27.5381 13.4942C27.2879 13.12 26.9906 12.8474 26.586 12.6212C26.427 12.5323 6.01836 1.59962 5.91001 1.5453C5.69611 1.43805 5.41281 1.34599 5.16491 1.30314C5.07144 1.28697 4.69479 1.25653 4.66201 1.26248C4.65541 1.26367 4.62031 1.26631 4.58401 1.26835ZM4.57739 2.91663C4.46489 2.93055 4.30808 2.98084 4.21201 3.03382C3.99318 3.15449 3.85136 3.30521 3.74352 3.53174C3.68498 3.65469 3.66216 3.74122 3.64796 3.89421C3.63295 4.0559 3.63295 25.9445 3.64796 26.1062C3.66216 26.2592 3.68498 26.3457 3.74352 26.4687C3.80321 26.5941 3.86803 26.6891 3.94955 26.7708C4.24359 27.0655 4.66406 27.1652 5.05226 27.0324C5.1405 27.0022 7.50872 25.7386 15.4563 21.4812C21.1156 18.4495 25.7784 15.9499 25.818 15.9266C26.0061 15.8157 26.1491 15.6611 26.2451 15.4649C26.3299 15.2915 26.3564 15.163 26.3489 14.9616C26.3419 14.7733 26.3243 14.7011 26.2457 14.5382C26.1479 14.3355 26.0054 14.1828 25.806 14.0672C25.6639 13.9847 5.21874 3.03439 5.14201 2.99962C4.98695 2.92936 4.75277 2.89494 4.57739 2.91663Z" fill="#222B3C"/>
+</svg>
diff --git a/packages/icons/src/solid/download.svg b/packages/icons/src/solid/download.svg
new file mode 100644
index 000000000..5e1a429a3
--- /dev/null
+++ b/packages/icons/src/solid/download.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.03128 0.00137949C8.84052 0.0308059 8.66689 0.192309 8.62782 0.376651C8.61897 0.418418 8.61751 0.981695 8.6174 4.39954L8.61728 8.37385L7.32308 7.0809C6.61127 6.36978 6.01227 5.7761 5.99197 5.76162C5.79206 5.61904 5.52233 5.64427 5.34962 5.82171C5.19183 5.98382 5.16665 6.23996 5.29018 6.42642C5.31859 6.46932 5.68537 6.83952 7.07421 8.22706C8.7085 9.85984 8.82577 9.97539 8.873 9.99957C8.94834 10.0382 9.01864 10.0555 9.10108 10.056C9.19377 10.0565 9.24089 10.0462 9.32288 10.0072L9.39128 9.9747L11.1559 8.20957L12.9206 6.44442L12.9507 6.38322C12.9909 6.30162 13.0043 6.23484 13 6.13842C12.9942 6.00926 12.9503 5.90719 12.8628 5.81876C12.7683 5.72345 12.667 5.67833 12.5341 5.67244C12.4376 5.66817 12.3707 5.68165 12.2893 5.72179L12.2281 5.75195L10.9159 7.06292L9.60368 8.37389L9.60349 4.44276C9.60337 2.17179 9.60056 0.484255 9.59682 0.446822C9.58878 0.366276 9.5689 0.301958 9.53375 0.242738C9.47249 0.139555 9.3778 0.0619532 9.2662 0.0234908C9.21572 0.00608839 9.19019 0.00174677 9.12855 8.35653e-05C9.08694 -0.00103963 9.04316 -0.00045651 9.03128 0.00137949ZM0.372299 13.5914C0.213575 13.6366 0.0839896 13.7636 0.034936 13.9219L0.0182104 13.9759V14.6887C0.0182104 15.4573 0.0185416 15.4655 0.0587752 15.6931C0.210702 16.5529 0.785385 17.3062 1.58061 17.6882C1.86405 17.8243 2.13846 17.9035 2.46981 17.9446C2.56962 17.957 2.85727 17.9575 9.01461 17.9575C15.1743 17.9575 15.4596 17.957 15.5594 17.9446C15.8952 17.9029 16.1647 17.8251 16.4512 17.6871C16.9824 17.4313 17.4079 17.0242 17.6887 16.5031C17.8616 16.1822 17.9642 15.843 18.0054 15.4555C18.0153 15.3622 18.0177 15.2344 18.0197 14.6743C18.0211 14.2767 18.0194 13.9989 18.0155 13.9903C18.0119 13.9824 18.0035 13.9547 17.9969 13.9288C17.978 13.8542 17.9343 13.7824 17.8669 13.7156C17.8182 13.6672 17.7957 13.651 17.7401 13.6244C17.703 13.6065 17.6554 13.5884 17.6345 13.5841C17.5717 13.5713 17.4555 13.5744 17.3919 13.5907C17.2353 13.6308 17.0977 13.7666 17.0489 13.9291C17.0328 13.983 17.0327 13.9846 17.0277 14.6959C17.0244 15.159 17.0199 15.4244 17.0148 15.4535C16.954 15.7977 16.8352 16.0689 16.6384 16.3123C16.5871 16.3759 16.4652 16.5009 16.3982 16.5587C16.2099 16.7213 15.9453 16.857 15.693 16.9205C15.6413 16.9335 15.5601 16.9502 15.5126 16.9576C15.4286 16.9708 15.2486 16.9711 9.01461 16.9711C2.891 16.9711 2.59929 16.9706 2.52021 16.9583C2.41323 16.9416 2.25748 16.9024 2.16892 16.8698C2.06154 16.8303 1.89237 16.7445 1.79661 16.6809C1.42821 16.4361 1.15921 16.0572 1.05459 15.6357C1.00457 15.4342 1.00604 15.4604 1.00103 14.6815C0.996064 13.9085 0.998721 13.9536 0.952274 13.8552C0.891844 13.7272 0.769689 13.6246 0.637331 13.5907C0.56176 13.5714 0.441318 13.5717 0.372299 13.5914ZM0.0180664 14.6743C0.0180664 15.0466 0.0189376 15.1978 0.0200104 15.0104C0.021076 14.823 0.021076 14.5184 0.0200104 14.3336C0.0189376 14.1488 0.0180664 14.3021 0.0180664 14.6743Z" fill="#2F463F"/>
+</svg>
diff --git a/packages/icons/src/solid/message-chat.svg b/packages/icons/src/solid/message-chat.svg
new file mode 100644
index 000000000..50fe8d24e
--- /dev/null
+++ b/packages/icons/src/solid/message-chat.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M1.37693 0.0301801C1.08913 0.0918301 0.871092 0.194916 0.639882 0.37866C0.314046 0.63759 0.0820979 1.03418 0.0189899 1.44026C0.00325791 1.54151 -0.000630085 3.03067 0.00347391 7.39826L0.00892791 13.2213L0.0595079 13.3833C0.0873359 13.4724 0.146646 13.6141 0.191322 13.6983C0.464796 14.2135 0.967986 14.5589 1.52734 14.6154C1.62986 14.6258 2.08521 14.6343 2.53922 14.6343H3.36472L3.36982 16.0968L3.37493 17.5593L3.42175 17.6591C3.52136 17.8714 3.67241 17.9783 3.89716 17.9953C4.00045 18.0031 4.05099 17.9981 4.11709 17.9735C4.17425 17.9522 4.94017 17.3891 6.40948 16.2879L8.61602 14.6343H12.4511C14.9897 14.6343 16.3491 14.6279 16.4725 14.6154C16.8331 14.579 17.1728 14.4234 17.4419 14.1714C17.6152 14.0091 17.7051 13.8932 17.8085 13.6983C17.8908 13.5433 17.9819 13.2685 17.9819 13.1753C17.9819 13.1473 17.99 13.1194 17.9999 13.1133C18.0119 13.1059 18.0179 11.1447 18.0179 7.28814C18.0179 3.97706 18.0112 1.47832 18.0022 1.48386C17.9936 1.48921 17.9811 1.45292 17.9745 1.40324C17.9575 1.27546 17.8702 1.02819 17.7936 0.891192C17.5937 0.53382 17.2376 0.227712 16.8746 0.10119C16.5621 -0.00772785 17.1846 0.000120143 8.98718 0.00174014C2.40757 0.00301814 1.4877 0.00645614 1.37693 0.0301801ZM1.4623 1.18891C1.33405 1.25301 1.23678 1.35385 1.17679 1.4849L1.13377 1.57886L1.13834 7.32806L1.14293 13.0773L1.18321 13.159C1.23899 13.2722 1.35841 13.3886 1.47593 13.4443L1.57493 13.4913L2.83493 13.5003L4.09493 13.5093L4.18493 13.5572C4.30285 13.62 4.39695 13.7198 4.45369 13.8423L4.49957 13.9413L4.49975 15.1247L4.49993 16.3082L6.33181 14.9345C7.33934 14.1789 8.19185 13.5491 8.22631 13.535C8.27969 13.513 8.88847 13.5079 12.3569 13.5003L16.4249 13.4913L16.5239 13.4443C16.6414 13.3886 16.7609 13.2722 16.8166 13.159L16.8569 13.0773L16.8615 7.32806L16.8661 1.57886L16.8231 1.4849C16.7631 1.35385 16.6658 1.25301 16.5376 1.18891L16.4282 1.13426H8.99993H1.57167L1.4623 1.18891ZM0.00881991 7.30826C0.00881991 10.5109 0.0108899 11.8211 0.0134279 10.2198C0.0159659 8.61845 0.0159659 5.9981 0.0134279 4.39676C0.0108899 2.79545 0.00881991 4.10561 0.00881991 7.30826ZM2.96093 8.64658C2.79999 8.69306 2.66798 8.80707 2.59634 8.96151C2.55694 9.04647 2.55258 9.07617 2.5592 9.21477C2.56534 9.3434 2.57522 9.38618 2.61383 9.45152C2.67869 9.56123 2.78186 9.65665 2.88893 9.70588L2.97893 9.74726L5.85893 9.75261C7.96199 9.75652 8.76793 9.75243 8.84642 9.73742C9.31819 9.64726 9.45943 9.03108 9.07555 8.73795C8.91412 8.61469 9.11844 8.62208 5.92315 8.62403C3.79624 8.62532 3.01392 8.63128 2.96093 8.64658ZM10.6829 8.64728C10.5626 8.68561 10.5023 8.72465 10.4169 8.81962C10.3183 8.92927 10.2779 9.03902 10.2779 9.19697C10.278 9.4165 10.4268 9.63458 10.63 9.71296C10.7157 9.746 10.7969 9.74726 12.8339 9.74726H14.9489L15.0331 9.70837C15.1591 9.65015 15.2698 9.53841 15.3263 9.41241C15.3691 9.3171 15.3747 9.28448 15.3691 9.16495C15.3645 9.06542 15.3511 9.00482 15.3208 8.94626C15.2619 8.83236 15.1484 8.72155 15.0407 8.67281L14.9489 8.63126L12.8519 8.62783C11.1957 8.62509 10.7398 8.62919 10.6829 8.64728ZM2.99412 10.9628C2.83923 10.9939 2.68247 11.1157 2.59796 11.2707C2.54729 11.3636 2.55073 11.6648 2.60357 11.7633C2.65563 11.8602 2.77276 11.9731 2.87609 12.0259L2.96093 12.0693H5.08493C7.13081 12.0693 7.2122 12.068 7.29787 12.035C7.41083 11.9914 7.53161 11.8804 7.59287 11.764C7.63423 11.6854 7.6406 11.6517 7.64064 11.5113C7.64066 11.377 7.63362 11.336 7.59953 11.272C7.53617 11.1529 7.4408 11.0583 7.32883 11.0033L7.22693 10.9533L5.14793 10.9505C4.00448 10.949 3.03527 10.9545 2.99412 10.9628ZM8.91612 10.963C8.74429 10.997 8.60274 11.1151 8.52201 11.2919C8.48066 11.3825 8.4751 11.4153 8.48068 11.5349C8.48536 11.6351 8.4987 11.6956 8.52905 11.7543C8.58796 11.8682 8.70147 11.979 8.80915 12.0277L8.90093 12.0693H10.0529C11.1916 12.0693 11.2059 12.0688 11.2881 12.0308C11.6195 11.8776 11.7293 11.4589 11.5125 11.175C11.434 11.0722 11.3045 10.9897 11.1815 10.9641C11.0688 10.9406 9.03411 10.9397 8.91612 10.963ZM12.7261 10.9657C12.6089 10.9924 12.4681 11.0932 12.3957 11.2023C12.2308 11.4507 12.2869 11.7813 12.5247 11.9629C12.6786 12.0804 12.6731 12.0799 13.8709 12.0743L14.9489 12.0693L15.0407 12.0277C15.1484 11.979 15.2619 11.8682 15.3208 11.7543C15.3511 11.6957 15.3645 11.6351 15.3691 11.5356C15.3747 11.4167 15.369 11.3832 15.3274 11.2905C15.2696 11.1618 15.1616 11.051 15.0389 10.9946L14.9489 10.9533L13.8779 10.9503C13.2025 10.9484 12.7771 10.9541 12.7261 10.9657Z" fill="#7E8795"/>
+</svg>
diff --git a/packages/icons/src/solid/open.svg b/packages/icons/src/solid/open.svg
new file mode 100644
index 000000000..349c05ed7
--- /dev/null
+++ b/packages/icons/src/solid/open.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.9561 0.937788C9.84784 0.961092 9.73794 1.04667 9.68401 1.14968C9.64924 1.2161 9.64137 1.25134 9.64163 1.33948C9.64183 1.4076 9.64389 1.42361 9.65791 1.46594C9.70033 1.59396 9.80648 1.69531 9.9411 1.73628C9.97557 1.74677 10.0643 1.74737 12.0299 1.75036L14.0826 1.75348L10.0296 5.74048C7.80044 7.93333 5.96362 9.74291 5.94777 9.76177C5.88323 9.8386 5.85487 9.92826 5.85994 10.0395C5.86513 10.1534 5.89809 10.2268 5.98117 10.3095C6.06307 10.391 6.15064 10.4266 6.26856 10.4263C6.35929 10.4261 6.41508 10.4102 6.48746 10.364C6.51541 10.3461 7.63067 9.25259 10.6005 6.33114L14.6751 2.32281L14.6781 4.34514C14.681 6.25751 14.6817 6.36943 14.6917 6.40348C14.724 6.51278 14.7978 6.60531 14.8977 6.66181C15.0022 6.72089 15.1695 6.72187 15.278 6.66404C15.3852 6.60691 15.4691 6.49907 15.4893 6.39228C15.4957 6.35823 15.4976 7.10497 15.5001 10.6973L15.5031 15.0435L15.5038 10.2375C15.5041 7.59418 15.5028 4.49053 15.5007 3.34048L15.4971 1.24948L15.481 1.20547C15.4574 1.14089 15.4307 1.09934 15.3799 1.04863C15.3292 0.99792 15.2877 0.971136 15.2231 0.94755L15.1791 0.931476L12.5871 0.930438C10.3861 0.92955 9.98922 0.93066 9.9561 0.937788ZM1.3611 4.08506C1.02326 4.12043 0.723956 4.3369 0.585806 4.64577C0.5594 4.70481 0.543434 4.75108 0.52277 4.82848L0.509156 4.87948L0.507326 9.97647C0.505994 13.7067 0.507302 15.0855 0.512204 15.1185C0.54119 15.3132 0.637628 15.5017 0.782264 15.6463C0.92165 15.7857 1.08221 15.8704 1.29181 15.9152C1.33322 15.924 1.76957 15.925 6.3831 15.9269C10.012 15.9284 11.4459 15.9271 11.4891 15.9224C11.8139 15.8868 12.0918 15.6962 12.2414 15.4065C12.302 15.289 12.3322 15.1838 12.3442 15.0488C12.3486 14.9995 12.35 13.9408 12.3488 11.6235L12.3471 8.26948L12.3336 8.23048C12.2854 8.09138 12.1831 7.99194 12.0501 7.95476C11.9878 7.93736 11.8904 7.93736 11.8281 7.95476C11.6919 7.99282 11.5839 8.10068 11.5415 8.24104C11.5317 8.27349 11.5309 8.4695 11.5281 11.6415L11.5251 15.0075L11.5118 15.0324C11.4956 15.0626 11.4605 15.0927 11.4321 15.1006C11.4186 15.1043 9.63978 15.1064 6.42041 15.1064C1.92528 15.1065 1.4275 15.1056 1.40741 15.0972C1.37791 15.0849 1.34726 15.0551 1.3335 15.0255C1.32268 15.0022 1.32236 14.8594 1.32223 10.0048C1.32213 5.82617 1.32343 5.00493 1.33019 4.98878C1.34331 4.95748 1.37052 4.92974 1.40286 4.91468L1.4331 4.9006L4.77307 4.90054C8.48639 4.90047 8.16243 4.90433 8.2551 4.85905C8.40389 4.78635 8.48637 4.65455 8.48637 4.48948C8.48637 4.30431 8.37931 4.1578 8.1981 4.09499L8.1591 4.08148L4.7841 4.08076C2.92785 4.08036 1.3875 4.0823 1.3611 4.08506Z" fill="#0C1F22"/>
+</svg>
diff --git a/packages/icons/src/solid/search-plus.svg b/packages/icons/src/solid/search-plus.svg
new file mode 100644
index 000000000..dbc79b9e3
--- /dev/null
+++ b/packages/icons/src/solid/search-plus.svg
@@ -0,0 +1,3 @@
+<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M7.79795 1.5C6.55241 1.49986 5.33481 1.86909 4.29912 2.56099C3.26344 3.25289 2.4562 4.23638 1.97949 5.38708C1.50278 6.53778 1.37801 7.804 1.62097 9.02561C1.86393 10.2472 2.4637 11.3694 3.34442 12.2501C4.22515 13.1308 5.34728 13.7306 6.56889 13.9735C7.7905 14.2165 9.05673 14.0917 10.2074 13.615C10.9683 13.2998 11.6561 12.8401 12.2348 12.2653C12.2399 12.2598 12.2451 12.2543 12.2505 12.2489C12.2558 12.2436 12.2612 12.2384 12.2667 12.2334C12.5505 11.9475 12.8076 11.6336 13.0335 11.2954C13.7254 10.2597 14.0946 9.04209 14.0945 7.79656C14.0943 6.12666 13.4309 4.52522 12.2501 3.34442C11.0693 2.16363 9.46784 1.50018 7.79795 1.5ZM13.2993 12.5907C13.5027 12.3573 13.6917 12.1103 13.865 11.8509C14.6668 10.6507 15.0947 9.23977 15.0945 7.79645C15.0943 5.86137 14.3255 4.00562 12.9572 2.63732C11.5889 1.26901 9.73313 0.500214 7.79806 0.5C6.35473 0.499841 4.94377 0.927702 3.74362 1.72947C2.54347 2.53124 1.60804 3.67091 1.05563 5.00434C0.503216 6.33777 0.358638 7.80507 0.640179 9.22068C0.921719 10.6363 1.61673 11.9366 2.63732 12.9572C3.65791 13.9778 4.95823 14.6728 6.37383 14.9543C7.78943 15.2359 9.25673 15.0913 10.5902 14.5389C11.3243 14.2347 11.9997 13.8145 12.5923 13.2979L17.5222 18.2285C17.7174 18.4238 18.034 18.4238 18.2293 18.2286C18.4246 18.0333 18.4246 17.7167 18.2293 17.5215L13.2993 12.5907ZM7.75075 3.875C8.0269 3.875 8.25075 4.09886 8.25075 4.375V7.25H11.1258C11.4019 7.25 11.6258 7.47386 11.6258 7.75C11.6258 8.02614 11.4019 8.25 11.1258 8.25H8.25075V11.125C8.25075 11.4011 8.0269 11.625 7.75075 11.625C7.47461 11.625 7.25075 11.4011 7.25075 11.125V8.25H4.37575C4.09961 8.25 3.87575 8.02614 3.87575 7.75C3.87575 7.47386 4.09961 7.25 4.37575 7.25H7.25075V4.375C7.25075 4.09886 7.47461 3.875 7.75075 3.875Z" fill="white"/>
+</svg>
\ No newline at end of file
diff --git a/packages/leemons/src/common/AssetPlayer/AssetPlayer.js b/packages/leemons/src/common/AssetPlayer/AssetPlayer.js
index efe2c7ab2..7889054a4 100644
--- a/packages/leemons/src/common/AssetPlayer/AssetPlayer.js
+++ b/packages/leemons/src/common/AssetPlayer/AssetPlayer.js
@@ -252,6 +252,11 @@ const AssetPlayer = ({
     },
     { name: 'AssetPlayer' },
   );
+
+  console.log('AssetPlayer -> URL:', url);
+  console.log('AssetPlayer -> fileType:', fileType);
+  console.log('AssetPlayer -> media:', media);
+
   return (
     <Box className={classes.rootWrapper}>
       <Box className={classes.root} ref={rootRef}>