fix: file size emotes 2.0 (#2882)

package.json

@@ -37,7 +37,7 @@
     "decentraland-ecs": "^6.6.1-20201020183014.commit-bdc29ef-hotfix",
     "decentraland-experiments": "^1.0.2",
     "decentraland-transactions": "^1.47.0",
-    "decentraland-ui": "^4.11.4",
+    "decentraland-ui": "^4.12.0",
     "ethers": "^5.6.8",
     "file-saver": "^2.0.1",
     "graphql": "^15.8.0",

src/components/ItemEditorPage/LeftPanel/LeftPanel.css

@@ -41,3 +41,7 @@
   -ms-overflow-style: none; /* IE and Edge */
   scrollbar-width: none; /* Firefox */
 }
+
+.LeftPanel .dcl.toast {
+  width: calc(var(--item-editor-panel-width) - 20px);
+}

src/components/Modals/CreateSingleItemModal/ImportStep/ImportStep.tsx

@@ -124,10 +124,6 @@ export default class ImportStep extends React.PureComponent<Props, State> {
    * @param file - The model file.
    */
   handleModelFile = async (file: File): Promise<ModelData> => {
-    if (file.size > MAX_FILE_SIZE) {
-      throw new FileTooBigError()
-    }
-
     const modelPath = file.name
     const contents = {
       [modelPath]: file
@@ -142,6 +138,11 @@ export default class ImportStep extends React.PureComponent<Props, State> {
       }
     }
 
+    const maxFileSize = type === ItemType.EMOTE ? MAX_EMOTE_SIZE : MAX_FILE_SIZE
+    if (file.size > maxFileSize) {
+      throw new FileTooBigError(maxFileSize)
+    }
+
     return { model, contents: proccessedContent, type }
   }
 

src/components/Modals/EmotesV2AnnouncementModal/EmotesV2AnnouncementModal.module.css

@@ -5,7 +5,6 @@
   width: 750px;
   padding: 0;
   margin: 0;
-  background: #3d3b43;
 }
 
 .description {
@@ -14,6 +13,12 @@
   text-align: center;
 }
 
+.video {
+  display: block;
+  height: 250px;
+  object-fit: cover;
+}
+
 :global(.ui.modal > .content).content {
   display: flex;
   flex-direction: column;

src/components/Modals/EmotesV2AnnouncementModal/EmotesV2AnnouncementModal.tsx

@@ -5,10 +5,10 @@ import Modal from 'decentraland-dapps/dist/containers/Modal'
 import { t } from 'decentraland-dapps/dist/modules/translation/utils'
 import { getLocalStorage } from 'decentraland-dapps/dist/lib/localStorage'
 import { LOCALSTORAGE_EMOTES_V2_ANNOUCEMENT } from 'components/CollectionsPage/CollectionsPage'
-import emotesV2Src from 'images/emoteV2.png'
 import styles from './EmotesV2AnnouncementModal.module.css'
 
 const localStorage = getLocalStorage()
+const PUBLIC_URL = process.env.PUBLIC_URL
 
 const EmotesV2AnnouncementModal: React.FC<ModalProps> = ({ name, onClose }) => {
   const handleClose = () => {
@@ -26,7 +26,7 @@ const EmotesV2AnnouncementModal: React.FC<ModalProps> = ({ name, onClose }) => {
     <Modal className={styles.modal} name={name} onClose={handleClose}>
       <ModalNavigation title={t('emotes_v2_announcement_modal.title')} onClose={handleClose} />
       <Modal.Content className={styles.content}>
-        <img src={emotesV2Src} alt={t('emotes_v2_announcement_modal.title')} />
+        <video autoPlay loop className={styles.video} src={`${PUBLIC_URL}/videos/emotes-v2.mp4`} muted preload="auto" />
         <span className={styles.description}>
           {t('emotes_v2_announcement_modal.description', {
             br: () => <br />,

src/modules/item/errors.tsx

@@ -27,12 +27,12 @@ export class ItemTooBigError extends Error {
 }
 
 export class FileTooBigError extends CustomError {
-  constructor() {
+  constructor(maxSize: number = MAX_FILE_SIZE) {
     super(
       t('create_single_item_modal.error.file_too_big', {
         title: createElement('b', null, t('create_single_item_modal.error.file_too_big_title')),
         enter: createElement('br'),
-        size: `${toMB(MAX_FILE_SIZE)}MB`
+        size: `${toMB(maxSize)}MB`
       })
     )
   }

src/modules/translation/languages/en.json

@@ -522,8 +522,8 @@
     "learn_more": "Learn more about Smart Wearables"
   },
   "emotes_v2_announcement_modal": {
-    "title": "Emotes Sounds & Props are Live! 🟢",
-    "description": "<b>Elevate your emotional expression with our Emotes Sounds and Props experience!</b> <br></br>Now, you're not just limited to visuals; you can enrich your emotes with extended props and sounds.",
+    "title": "Emotes 2.0 are Live! 🟢",
+    "description": "<b>Emotes now offer more than movement!</b><br></br>Take advantage of these extended capabilities and enhance your Emotes with with props and sounds for a more expressive experience.",
     "learn_more": "learn more about emotes"
   },
   "use_as_alias_modal": {

src/modules/translation/languages/es.json

@@ -524,8 +524,8 @@
     "learn_more": "Más información sobre la vestimenta interactiva"
   },
   "emotes_v2_announcement_modal": {
-    "title": "¡Sonidos y accesorios para Emotes ya estan disponibles! 🟢",
-    "description": "<b>¡Eleve su expresión emocional con nuestros sonidos y accesorios!</b> <br></br>Ahora, no solo estás limitado a las imágenes, puedes enriquecer tus emotes con accesorios y sonidos extendidos.",
+    "title": "¡Los emotes 2.0 estan disponibles! 🟢",
+    "description": "<b>¡Los emotes ahora ofrecen más que movimiento!</b><br></br>Aproveche estas capacidades extendidas y mejore sus emotes con accesorios y sonidos para una experiencia más expresiva.",
     "learn_more": "Obtenga más información sobre Emotes"
   },
   "use_as_alias_modal": {

src/modules/translation/languages/zh.json

@@ -519,8 +519,8 @@
     "learn_more": "了解有关智能可穿戴设备的更多信息"
   },
   "emotes_v2_announcement_modal": {
-    "title": "情绪声音和道具是活的！🟢",
-    "description": "<b>通过我们的情绪和道具经验来提升您的情感表达！</b> <br></br>现在，您不仅限于视觉效果；您可以通过扩展的道具和声音来丰富自己的情绪。",
+    "title": "情绪2.0是活的！ 🟢",
+    "description": "<b>现在的情绪不仅仅是动作！</b><br></br>利用这些扩展的功能，并通过道具和声音增强您的情绪，以获得更具表现力的体验。",
     "learn_more": "了解有关情感的更多信息"
   },
   "use_as_alias_modal": {