box-ui-elements 23.4.0-beta.36 → 23.4.0-beta.38

package/i18n/zh-CN.properties

@@ -92,6 +92,8 @@ be.breadcrumb.breadcrumbLabel = 阶层连结
 be.cancel = 取消
 # Label for choose action.
 be.choose = 选择
+# Aria label for the clear selection button.
+be.clearSelection = Clear selection
 # Label for close action.
 be.close = 关闭
 # Icon title for a Box item of type folder that has collaborators
@@ -602,6 +604,8 @@ be.noActivity = 没有要显示的活动
 be.noActivityAnnotationPrompt = 将鼠标指针悬停在预览上，然后使用底部的控件为文件添加批注。
 # Message shown in
 be.noActivityCommentPrompt = 评论并用 @ 通知相关人员。
+# Text shown to indicate the number of files selected
+be.numFilesSelected =  {numSelected, plural, =0 {0 files selected} one {1 file selected} other {# files selected} } 
 # Label for open action.
 be.open = 打开
 # Next page button tooltip

package/i18n/zh-TW.js

@@ -302,7 +302,7 @@ export default {
   "be.noActivity": "沒有可顯示的活動",
   "be.noActivityAnnotationPrompt": "將游標停留在預覽上方，並使用底部的控制項為檔案新增註解。",
   "be.noActivityCommentPrompt": "留言並「@提及」人員來通知人員。",
-  "be.numFilesSelected": " {numSelected, plural, =0 {0 files selected} one {1 file selected} other {# files selected} } ",
+  "be.numFilesSelected": "{numSelected, plural, =0 {0 files selected} one {1 file selected} other {# files selected} } ",
   "be.open": "開啟",
   "be.pagination.nextPage": "下一頁",
   "be.pagination.nextPageButton": "下一步",

package/i18n/zh-TW.properties

@@ -92,6 +92,8 @@ be.breadcrumb.breadcrumbLabel = 階層連結
 be.cancel = 取消
 # Label for choose action.
 be.choose = 選擇
+# Aria label for the clear selection button.
+be.clearSelection = Clear selection
 # Label for close action.
 be.close = 關閉
 # Icon title for a Box item of type folder that has collaborators
@@ -602,6 +604,8 @@ be.noActivity = 沒有可顯示的活動
 be.noActivityAnnotationPrompt = 將游標停留在預覽上方，並使用底部的控制項為檔案新增註解。
 # Message shown in
 be.noActivityCommentPrompt = 留言並「@提及」人員來通知人員。
+# Text shown to indicate the number of files selected
+be.numFilesSelected =  {numSelected, plural, =0 {0 files selected} one {1 file selected} other {# files selected} } 
 # Label for open action.
 be.open = 開啟
 # Next page button tooltip

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "box-ui-elements",
-    "version": "23.4.0-beta.36",
+    "version": "23.4.0-beta.38",
     "description": "Box UI Elements",
     "author": "Box (https://www.box.com/)",
     "license": "SEE LICENSE IN LICENSE",
@@ -130,7 +130,7 @@
         "@babel/types": "^7.24.7",
         "@box/blueprint-web": "12.43.0",
         "@box/blueprint-web-assets": "4.61.5",
-        "@box/box-ai-agent-selector": "^0.48.5",
+        "@box/box-ai-agent-selector": "^0.52.0",
         "@box/box-ai-content-answers": "^0.124.1",
         "@box/box-item-type-selector": "^0.61.12",
         "@box/cldr-data": "^34.2.0",
@@ -299,7 +299,7 @@
     "peerDependencies": {
         "@box/blueprint-web": "12.43.0",
         "@box/blueprint-web-assets": "4.61.5",
-        "@box/box-ai-agent-selector": "^0.48.5",
+        "@box/box-ai-agent-selector": "^0.52.0",
         "@box/box-ai-content-answers": "^0.124.1",
         "@box/box-item-type-selector": "^0.61.12",
         "@box/cldr-data": ">=34.2.0",

package/src/common/types/metadata.js

@@ -87,14 +87,15 @@ type MetadataType = {
     global?: MetadataSkillsTemplate,
 };
 
+type MetadataCascadePolicyConfiguration = {
+    agent: string,
+};
+
 type MetadataCascadePolicy = {
     canEdit?: boolean,
     id?: string,
     cascadePolicyType?: string,
-};
-
-type MetadataCascadePolicyConfiguration = {
-    agent: string,
+    cascadePolicyConfiguration?: MetadataCascadePolicyConfiguration,
 };
 
 type MetadataCascadingPolicyData = {

package/src/elements/content-explorer/stories/tests/MetadataView-visual.stories.tsx

@@ -5,45 +5,61 @@ import ContentExplorer from '../../ContentExplorer';
 import { DEFAULT_HOSTNAME_API } from '../../../../constants';
 import { mockMetadata, mockSchema } from '../../../common/__mocks__/mockMetadata';
 
-const EID = '0';
-const templateName = 'templateName';
-const metadataSource = `enterprise_${EID}.${templateName}`;
-const metadataSourceFieldName = `metadata.${metadataSource}`;
+// The intent behind relying on mockMetadata is to allow a developer to paste in their own metadata template schema for use with live API calls.
+const { scope: templateScope, templateKey } = mockSchema;
 
-const metadataQuery = {
-    from: metadataSource,
-
-    // // Filter items in the folder by existing metadata key
-    // query: 'key = :arg1',
-    //
-    // // Display items with value
-    // query_params: { arg1: 'value' },
+const metadataScopeAndKey = `${templateScope}.${templateKey}`;
+const metadataFieldNamePrefix = `metadata.${metadataScopeAndKey}`;
 
-    ancestor_folder_id: '313259567207',
+// This is the body of the metadata query API call.
+// https://developer.box.com/guides/metadata/queries/syntax/
+const metadataQuery = {
+    from: metadataScopeAndKey,
+    ancestor_folder_id: '0',
+    sort_by: [
+        {
+            field_key: `${metadataFieldNamePrefix}.${mockSchema.fields[0].key}`, // Default to sorting by the first field in the schema
+            direction: 'asc',
+        },
+    ],
     fields: [
-        `${metadataSourceFieldName}.name`,
-        `${metadataSourceFieldName}.industry`,
-        `${metadataSourceFieldName}.last_contacted_at`,
-        `${metadataSourceFieldName}.role`,
+        // Default to returning all fields in the metadata template schema, and name as a standalone (non-metadata) field
+        ...mockSchema.fields.map(field => `${metadataFieldNamePrefix}.${field.key}`),
+        'name',
     ],
 };
 
+// Used for metadata view v1
 const fieldsToShow = [
-    { key: `${metadataSourceFieldName}.name`, canEdit: false, displayName: 'Alias' },
-    { key: `${metadataSourceFieldName}.industry`, canEdit: true },
-    { key: `${metadataSourceFieldName}.last_contacted_at`, canEdit: true },
-    { key: `${metadataSourceFieldName}.role`, canEdit: true },
+    { key: `${metadataFieldNamePrefix}.name`, canEdit: false, displayName: 'Alias' },
+    { key: `${metadataFieldNamePrefix}.industry`, canEdit: true },
+    { key: `${metadataFieldNamePrefix}.last_contacted_at`, canEdit: true },
+    { key: `${metadataFieldNamePrefix}.role`, canEdit: true },
+];
+
+// Used for metadata view v2
+const columns = [
+    {
+        // Always include the name column
+        textValue: 'Name',
+        id: 'name',
+        type: 'string',
+        allowSorting: true,
+        minWidth: 150,
+        maxWidth: 150,
+    },
+    ...mockSchema.fields.map(field => ({
+        textValue: field.displayName,
+        id: `${metadataFieldNamePrefix}.${field.key}`,
+        type: field.type,
+        allowSorting: true,
+        minWidth: 150,
+        maxWidth: 150,
+    })),
 ];
 
-const columns = mockSchema.fields.map(field => ({
-    textValue: field.displayName,
-    id: `${metadataSourceFieldName}.${field.key}`,
-    type: field.type,
-    allowSorting: true,
-    minWidth: 150,
-    maxWidth: 150,
-}));
-const defaultView = 'metadata'; // Required prop to paint the metadata view. If not provided, you'll get regular folder view.
+// Switches ContentExplorer to use Metadata View over standard, folder-based view.
+const defaultView = 'metadata';
 
 type Story = StoryObj<typeof ContentExplorer>;
 
@@ -55,7 +71,7 @@ export const metadataView: Story = {
     },
 };
 
-export const withNewMetadataView: Story = {
+export const metadataViewV2: Story = {
     args: {
         metadataViewProps: {
             columns,

package/src/elements/content-preview/PreviewNavigation.js

@@ -123,7 +123,6 @@ const PreviewNavigationWithoutRouter = ({
             {hasLeftNavigation && (
                 <PlainButton
                     className="bcpr-navigate-left"
-                    data-testid="preview-navigation-left"
                     onClick={() => {
                         handleInternalNavigation();
                         onNavigateLeft();
@@ -137,7 +136,6 @@ const PreviewNavigationWithoutRouter = ({
             {hasRightNavigation && (
                 <PlainButton
                     className="bcpr-navigate-right"
-                    data-testid="preview-navigation-right"
                     onClick={() => {
                         handleInternalNavigation();
                         onNavigateRight();

package/src/elements/content-preview/__tests__/PreviewNavigation.test.js

@@ -78,8 +78,8 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 const collection = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j'];
                 renderComponentWithRouter({ collection, currentIndex });
 
-                const leftButton = screen.queryByTestId('preview-navigation-left');
-                const rightButton = screen.queryByTestId('preview-navigation-right');
+                const leftButton = screen.queryByRole('button', { name: 'Previous File' });
+                const rightButton = screen.queryByRole('button', { name: 'Next File' });
 
                 if (expectLeft) {
                     expect(leftButton).toBeInTheDocument();
@@ -103,7 +103,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 historyMock: historyMockDefault,
             });
 
-            const leftButton = screen.getByTestId('preview-navigation-left');
+            const leftButton = screen.getByRole('button', { name: 'Previous File' });
             expect(leftButton).toBeInTheDocument();
 
             await user.click(leftButton);
@@ -121,7 +121,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 historyMock: historyMockDefault,
             });
 
-            const rightButton = screen.getByTestId('preview-navigation-right');
+            const rightButton = screen.getByRole('button', { name: 'Next File' });
             expect(rightButton).toBeInTheDocument();
 
             await user.click(rightButton);
@@ -139,7 +139,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 historyMock: deeplinkedMetadataHistoryMock,
             });
 
-            const rightButton = screen.getByTestId('preview-navigation-right');
+            const rightButton = screen.getByRole('button', { name: 'Next File' });
             expect(rightButton).toBeInTheDocument();
 
             await user.click(rightButton);
@@ -157,7 +157,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 historyMock: deeplinkedMetadataHistoryMock,
             });
 
-            const leftButton = screen.getByTestId('preview-navigation-left');
+            const leftButton = screen.getByRole('button', { name: 'Previous File' });
             expect(leftButton).toBeInTheDocument();
 
             await user.click(leftButton);
@@ -172,8 +172,8 @@ describe('elements/content-preview/PreviewNavigation', () => {
         test('should render correctly without router', () => {
             renderComponentWithoutRouter({ currentIndex: 1 });
 
-            expect(screen.getByTestId('preview-navigation-left')).toBeInTheDocument();
-            expect(screen.getByTestId('preview-navigation-right')).toBeInTheDocument();
+            expect(screen.getByRole('button', { name: 'Previous File' })).toBeInTheDocument();
+            expect(screen.getByRole('button', { name: 'Next File' })).toBeInTheDocument();
         });
 
         test('should call internalSidebarNavigationHandler when left navigation button is clicked', async () => {
@@ -188,7 +188,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 internalSidebarNavigation: mockInternalSidebarNavigation,
             });
 
-            const leftButton = screen.getByTestId('preview-navigation-left');
+            const leftButton = screen.getByRole('button', { name: 'Previous File' });
             await user.click(leftButton);
 
             expect(mockNavigationHandler).toHaveBeenCalledTimes(1);
@@ -209,7 +209,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 internalSidebarNavigation: mockInternalSidebarNavigation,
             });
 
-            const rightButton = screen.getByTestId('preview-navigation-right');
+            const rightButton = screen.getByRole('button', { name: 'Next File' });
             await user.click(rightButton);
 
             expect(mockNavigationHandler).toHaveBeenCalledTimes(1);
@@ -229,7 +229,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 internalSidebarNavigation: mockInternalSidebarNavigation,
             });
 
-            const leftButton = screen.getByTestId('preview-navigation-left');
+            const leftButton = screen.getByRole('button', { name: 'Previous File' });
             await user.click(leftButton);
 
             expect(mockNavigationHandler).toHaveBeenCalledTimes(1);
@@ -252,7 +252,7 @@ describe('elements/content-preview/PreviewNavigation', () => {
                 internalSidebarNavigation: mockInternalSidebarNavigation,
             });
 
-            const rightButton = screen.getByTestId('preview-navigation-right');
+            const rightButton = screen.getByRole('button', { name: 'Next File' });
             await user.click(rightButton);
 
             expect(mockNavigationHandler).toHaveBeenCalledTimes(1);