feat(metadata-sidebar): Pass isLargeFile to MetadataInstanceForm (#3922)

* feat(metadata-sidebar): Pass isLargeFile to MetadataInstanceForm

* feat(metadata-sidebar): update metadata-editor

* feat(metadata-sidebar): update metadata-editor

* feat(metadata-sidebar): update metadata-editor

* feat(metadata-sidebar): Add unit test

* feat(metadata-sidebar): Small updates

* feat(metadata-sidebar): nit updates

Author: kajarosz

package.json

@@ -92,11 +92,7 @@
             "last 2 Edge versions",
             "last 2 iOS versions"
         ],
-        "development": [
-            "last 1 Chrome versions",
-            "last 1 Firefox versions",
-            "last 1 Safari versions"
-        ]
+        "development": ["last 1 Chrome versions", "last 1 Firefox versions", "last 1 Safari versions"]
     },
     "husky": {
         "hooks": {
@@ -134,7 +130,7 @@
         "@box/frontend": "^10.0.0",
         "@box/item-icon": "^0.9.58",
         "@box/languages": "^1.0.0",
-        "@box/metadata-editor": "0.92.0",
+        "@box/metadata-editor": "^0.92.3",
         "@box/react-virtualized": "9.22.3-rc-box.9",
         "@cfaester/enzyme-adapter-react-18": "^0.8.0",
         "@chromatic-com/storybook": "^1.6.1",
@@ -314,7 +310,7 @@
         "@box/box-ai-content-answers": "^0.86.0",
         "@box/cldr-data": ">=34.2.0",
         "@box/item-icon": "^0.9.58",
-        "@box/metadata-editor": "^0.88.1",
+        "@box/metadata-editor": "^0.92.2",
         "@box/react-virtualized": "9.22.3-rc-box.9",
         "@hapi/address": "^2.1.4",
         "axios": "^0.25.0",
@@ -374,8 +370,6 @@
         }
     },
     "msw": {
-        "workerDirectory": [
-            ".storybook/public"
-        ]
+        "workerDirectory": [".storybook/public"]
     }
-}
+}

src/elements/content-sidebar/MetadataInstanceEditor.tsx

@@ -20,6 +20,7 @@ export interface MetadataInstanceEditorProps {
     isBetaLanguageEnabled: boolean;
     isBoxAiSuggestionsEnabled: boolean;
     isDeleteButtonDisabled: boolean;
+    isLargeFile: boolean;
     isUnsavedChangesModalOpen: boolean;
     onCancel: () => void;
     onDelete: (metadataInstance: MetadataTemplateInstance) => void;
@@ -42,6 +43,7 @@ const MetadataInstanceEditor: React.FC<MetadataInstanceEditorProps> = ({
     isBetaLanguageEnabled,
     isBoxAiSuggestionsEnabled,
     isDeleteButtonDisabled,
+    isLargeFile,
     isUnsavedChangesModalOpen,
     onCancel,
     onDelete,
@@ -58,6 +60,7 @@ const MetadataInstanceEditor: React.FC<MetadataInstanceEditorProps> = ({
             isAiSuggestionsFeatureEnabled={isBoxAiSuggestionsEnabled}
             isBetaLanguageEnabled={isBetaLanguageEnabled}
             isDeleteButtonDisabled={isDeleteButtonDisabled}
+            isLargeFile={isLargeFile}
             isUnsavedChangesModalOpen={isUnsavedChangesModalOpen}
             onCancel={onCancel}
             onDelete={onDelete}

src/elements/content-sidebar/MetadataSidebarRedesign.tsx

@@ -44,6 +44,7 @@ import { convertTemplateToTemplateInstance } from './utils/convertTemplateToTemp
 import { isExtensionSupportedForMetadataSuggestions } from './utils/isExtensionSupportedForMetadataSuggestions';
 import { metadataTaxonomyFetcher, metadataTaxonomyNodeAncestorsFetcher } from './fetchers/metadataTaxonomyFetcher';
 import { useMetadataSidebarFilteredTemplates } from './hooks/useMetadataSidebarFilteredTemplates';
+import { isFileLargerThan } from './utils/isFileLargerThan';
 
 const MARK_NAME_JS_READY = `${ORIGIN_METADATA_SIDEBAR_REDESIGN}_${EVENT_JS_READY}`;
 
@@ -109,6 +110,9 @@ function MetadataSidebarRedesign({
     const isBoxAiSuggestionsEnabled: boolean = useFeatureEnabled('metadata.aiSuggestions.enabled');
     const isBetaLanguageEnabled: boolean = useFeatureEnabled('metadata.betaLanguage.enabled');
 
+    const oneMegaByte = 1000000;
+    const isLargeFile = isFileLargerThan(file, oneMegaByte);
+
     const [editingTemplate, setEditingTemplate] = React.useState<MetadataTemplateInstance | null>(null);
     const [isUnsavedChangesModalOpen, setIsUnsavedChangesModalOpen] = React.useState<boolean>(false);
     const [isDeleteButtonDisabled, setIsDeleteButtonDisabled] = React.useState<boolean>(false);
@@ -289,6 +293,7 @@ function MetadataSidebarRedesign({
                             isBetaLanguageEnabled={isBetaLanguageEnabled}
                             isBoxAiSuggestionsEnabled={isBoxAiSuggestionsEnabled}
                             isDeleteButtonDisabled={isDeleteButtonDisabled}
+                            isLargeFile={isLargeFile}
                             isUnsavedChangesModalOpen={isUnsavedChangesModalOpen}
                             onCancel={handleCancel}
                             onDelete={handleDeleteInstance}

src/elements/content-sidebar/__tests__/MetadataInstanceEditor.test.tsx

@@ -74,6 +74,7 @@ describe('MetadataInstanceEditor', () => {
         isBetaLanguageEnabled: false,
         isBoxAiSuggestionsEnabled: true,
         isDeleteButtonDisabled: false,
+        isLargeFile: false,
         isUnsavedChangesModalOpen: false,
         onCancel: mockOnCancel,
         onDelete: jest.fn(),

src/elements/content-sidebar/__tests__/isFileLargerThan.test.ts

@@ -0,0 +1,15 @@
+import { isFileLargerThan } from '../utils/isFileLargerThan';
+
+describe('isFileLargerThan', () => {
+    test.each([
+        [{ size: 49 }, 50, false],
+        [{ size: 50 }, 50, false],
+        [{ size: 51 }, 50, true],
+        [{}, 50, false],
+        [null, 50, false],
+    ])('Should correctly check if file is larger than benchmark', (file, breakpoint, expected) => {
+        const result = isFileLargerThan(file, breakpoint);
+
+        expect(result).toEqual(expected);
+    });
+});

src/elements/content-sidebar/utils/isFileLargerThan.ts

@@ -0,0 +1,5 @@
+import { type BoxItem } from '../../../common/types/core';
+
+export function isFileLargerThan(file: BoxItem | null, breakpointSizeInBytes: number): boolean {
+    return file ? file.size > breakpointSizeInBytes : false;
+}

yarn.lock

@@ -1528,10 +1528,10 @@
   resolved "https://registry.yarnpkg.com/@box/languages/-/languages-1.1.2.tgz#cd4266b3da62da18560d881e10b429653186be29"
   integrity sha512-d64TGosx+KRmrLZj4CIyLp42LUiEbgBJ8n8cviMQwTJmfU0g+UwZqLjmQZR1j+Q9D64yV4xHzY9K1t5nInWWeQ==
 
-"@box/[email protected].0":
-  version "0.92.0"
-  resolved "https://registry.yarnpkg.com/@box/metadata-editor/-/metadata-editor-0.92.0.tgz#df484131655f35e49e355af2b07340eaaddfe905"
-  integrity sha512-AibiQMlCVV2kTbvhH2ZkgseLjyu89oZkmekuANg6y7tFh0633OVdn0eo5NXaCAASfff6THbH2gxWir7fd/r6tA==
+"@box/metadata-editor@^0.92.3":
+  version "0.92.3"
+  resolved "https://registry.yarnpkg.com/@box/metadata-editor/-/metadata-editor-0.92.3.tgz#7f9d14302598f48e6e6d5e11a62e93b771029622"
+  integrity sha512-mbRjn9P4rZWP/ZZIdFgh3uYnfppduyHAlZ/IEhX0fL4KfSZry0AU2/ja37M1a6ipXuZ1q8xur95nz7zQr0/oSA==
 
 "@box/[email protected]":
   version "9.22.3-rc-box.9"