diff --git a/package.json b/package.json index dcd719f34c..eb57302ba5 100644 --- a/package.json +++ b/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": { @@ -370,8 +366,6 @@ } }, "msw": { - "workerDirectory": [ - ".storybook/public" - ] + "workerDirectory": [".storybook/public"] } } diff --git a/src/elements/content-sidebar/MetadataInstanceEditor.tsx b/src/elements/content-sidebar/MetadataInstanceEditor.tsx index f801d1e1ad..d945a4d33d 100644 --- a/src/elements/content-sidebar/MetadataInstanceEditor.tsx +++ b/src/elements/content-sidebar/MetadataInstanceEditor.tsx @@ -1,5 +1,6 @@ import { AutofillContextProvider, + AutofillContextProviderProps, MetadataInstanceForm, type FormValues, type JSONPatchOperations, @@ -8,27 +9,31 @@ import { import React from 'react'; export interface MetadataInstanceEditorProps { + areAiSuggestionsAvailable: boolean; + fetchSuggestions: AutofillContextProviderProps['fetchSuggestions']; isBoxAiSuggestionsEnabled: boolean; isDeleteButtonDisabled: boolean; isUnsavedChangesModalOpen: boolean; onCancel: () => void; onDelete: (metadataInstance: MetadataTemplateInstance) => void; - template: MetadataTemplateInstance; + onDiscardUnsavedChanges: () => void; onSubmit: (values: FormValues, operations: JSONPatchOperations) => Promise; setIsUnsavedChangesModalOpen: (isUnsavedChangesModalOpen: boolean) => void; - onDiscardUnsavedChanges: () => void; + template: MetadataTemplateInstance; } const MetadataInstanceEditor: React.FC = ({ + areAiSuggestionsAvailable, + fetchSuggestions, isBoxAiSuggestionsEnabled, isDeleteButtonDisabled, isUnsavedChangesModalOpen, + onCancel, onDelete, + onDiscardUnsavedChanges, onSubmit, setIsUnsavedChangesModalOpen, template, - onCancel, - onDiscardUnsavedChanges, }) => { const handleCancel = () => { onCancel(); @@ -36,20 +41,20 @@ const MetadataInstanceEditor: React.FC = ({ return ( Promise.resolve([])} + fetchSuggestions={fetchSuggestions} isAiSuggestionsFeatureEnabled={isBoxAiSuggestionsEnabled} > ); diff --git a/src/elements/content-sidebar/MetadataSidebarRedesign.tsx b/src/elements/content-sidebar/MetadataSidebarRedesign.tsx index 445a9beabd..c53c852569 100644 --- a/src/elements/content-sidebar/MetadataSidebarRedesign.tsx +++ b/src/elements/content-sidebar/MetadataSidebarRedesign.tsx @@ -34,8 +34,9 @@ import { type WithLoggerProps } from '../../common/types/logging'; import messages from '../common/messages'; import './MetadataSidebarRedesign.scss'; -import MetadataInstanceEditor from './MetadataInstanceEditor'; +import MetadataInstanceEditor, { MetadataInstanceEditorProps } from './MetadataInstanceEditor'; import { convertTemplateToTemplateInstance } from './utils/convertTemplateToTemplateInstance'; +import { isExtensionSupportedForMetadataSuggestions } from './utils/isExtensionSupportedForMetadataSuggestions'; const MARK_NAME_JS_READY = `${ORIGIN_METADATA_SIDEBAR_REDESIGN}_${EVENT_JS_READY}`; @@ -172,6 +173,14 @@ function MetadataSidebarRedesign({ api, elementId, fileId, onError, isFeatureEna const showEmptyState = !showLoading && showTemplateInstances && templateInstances.length === 0 && !editingTemplate; const showEditor = !showEmptyState && editingTemplate; const showList = !showEditor && templateInstances.length > 0 && !editingTemplate; + const areAiSuggestionsAvailable = isExtensionSupportedForMetadataSuggestions(file?.extension ?? ''); + const fetchSuggestions = React.useCallback( + async (templateKey, fields) => { + // should use getIntelligenceAPI().extractStructured + return fields; + }, + [], + ); return ( )} {showList && ( diff --git a/src/elements/content-sidebar/__tests__/MetadataInstanceEditor.test.tsx b/src/elements/content-sidebar/__tests__/MetadataInstanceEditor.test.tsx index 45e6be2ad7..86c8d3af1a 100644 --- a/src/elements/content-sidebar/__tests__/MetadataInstanceEditor.test.tsx +++ b/src/elements/content-sidebar/__tests__/MetadataInstanceEditor.test.tsx @@ -49,15 +49,17 @@ describe('MetadataInstanceEditor', () => { }; const defaultProps: MetadataInstanceEditorProps = { + areAiSuggestionsAvailable: true, + fetchSuggestions: jest.fn(), isBoxAiSuggestionsEnabled: true, isDeleteButtonDisabled: false, isUnsavedChangesModalOpen: false, - template: mockMetadataTemplate, onCancel: mockOnCancel, onDelete: jest.fn(), + onDiscardUnsavedChanges: mockOnDiscardUnsavedChanges, onSubmit: jest.fn(), setIsUnsavedChangesModalOpen: mockSetIsUnsavedChangesModalOpen, - onDiscardUnsavedChanges: mockOnDiscardUnsavedChanges, + template: mockMetadataTemplate, }; test('should render MetadataInstanceForm with correct props', () => { diff --git a/src/elements/content-sidebar/stories/tests/MetadataSidebarRedesign-visual.stories.tsx b/src/elements/content-sidebar/stories/tests/MetadataSidebarRedesign-visual.stories.tsx index 7dc5de5eb5..d99de05ff8 100644 --- a/src/elements/content-sidebar/stories/tests/MetadataSidebarRedesign-visual.stories.tsx +++ b/src/elements/content-sidebar/stories/tests/MetadataSidebarRedesign-visual.stories.tsx @@ -339,7 +339,7 @@ export const SwitchEditingTemplateInstances: StoryObj = { args: { features: { diff --git a/src/elements/content-sidebar/utils/isExtensionSupportedForMetadataSuggestions.ts b/src/elements/content-sidebar/utils/isExtensionSupportedForMetadataSuggestions.ts new file mode 100644 index 0000000000..79f361d7ee --- /dev/null +++ b/src/elements/content-sidebar/utils/isExtensionSupportedForMetadataSuggestions.ts @@ -0,0 +1,88 @@ +/** + * @file Metadata suggestions supported extensions + * @author Box + */ + +const SUPPORTED_FILE_EXTENSIONS = new Set([ + // Text-Based Documents + 'as', + 'as3', + 'asm', + 'bat', + 'c', + 'cc', + 'cmake', + 'cpp', + 'cs', + 'css', + 'csv', + 'cxx', + 'diff', + 'doc', + 'docx', + 'erb', + 'gdoc', + 'groovy', + 'gsheet', + 'h', + 'haml', + 'hh', + 'htm', + 'html', + 'java', + 'js', + 'json', + 'less', + 'log', + 'm', + 'make', + 'md', + 'ml', + 'mm', + 'msg', + 'ods', + 'odt', + 'pages', + 'pdf', + 'php', + 'pl', + 'properties', + 'py', + 'rb', + 'rst', + 'rtf', + 'sass', + 'scala', + 'scm', + 'script', + 'sh', + 'sml', + 'sql', + 'txt', + 'vi', + 'vim', + 'webdoc', + 'wpd', + 'xhtml', + 'xls', + 'xlsb', + 'xlsm', + 'xlsx', + 'xml', + 'xsd', + 'xsl', + 'xbd', + 'xdw', + 'yaml', + // Presentations + 'gslide', + 'gslides', + 'key', + 'odp', + 'ppt', + 'pptx', +]); + +export function isExtensionSupportedForMetadataSuggestions(extension: string): boolean { + return SUPPORTED_FILE_EXTENSIONS.has(extension); +} diff --git a/src/test-utils/testing-library.tsx b/src/test-utils/testing-library.tsx index cdf8fc54ca..172c0fb36e 100644 --- a/src/test-utils/testing-library.tsx +++ b/src/test-utils/testing-library.tsx @@ -9,8 +9,16 @@ import { FeatureProvider } from '../elements/common/feature-checking'; jest.unmock('react-intl'); -const Wrapper = ({ children, features = {}, isAiSuggestionsFeatureEnabled = false, fetchSuggestions = () => Promise.resolve([]) }) => ( - +const Wrapper = ({ + children, + features = {}, + isAiSuggestionsFeatureEnabled = false, + fetchSuggestions = () => Promise.resolve([]), +}) => ( + {children}