box-ui-elements 15.0.0-beta.7 → 15.0.0

package/src/elements/content-sidebar/versions/__tests__/VersionsSidebarContainer.test.js

@@ -69,6 +69,19 @@ describe('elements/content-sidebar/versions/VersionsSidebarContainer', () => {
         });
     });
 
+    describe('componentDidMount', () => {
+        test('should call onLoad after a successful fetchData() call', async () => {
+            const onLoad = jest.fn();
+            const fetchData = jest.fn(() => Promise.resolve());
+            const instance = getWrapper({ onLoad }).instance();
+
+            instance.fetchData = fetchData;
+
+            await instance.componentDidMount();
+            expect(onLoad).toHaveBeenCalled();
+        });
+    });
+
     describe('handleActionDelete', () => {
         test('should call api endpoint helpers', () => {
             const handleDelete = jest.fn();
@@ -191,16 +204,52 @@ describe('elements/content-sidebar/versions/VersionsSidebarContainer', () => {
         test('should set state to default values with error message', () => {
             const wrapper = getWrapper();
 
-            wrapper.instance().handleFetchError();
+            wrapper.instance().handleFetchError({ status: 500 });
 
-            expect(wrapper.state()).toEqual({
+            expect(wrapper.state()).toMatchObject({
                 error: messages.versionFetchError,
+                errorTitle: messages.versionServerError,
+            });
+        });
+        test('should set state to default values with error upsell message if onUpgradeClick is set', () => {
+            const wrapper = getWrapper({
+                onUpgradeClick: () => {},
+                versionUpsellExperience: 'STATIC_VERSION_HISTORY',
+            });
+
+            wrapper.instance().handleFetchError({ status: 403 });
+
+            expect(wrapper.state()).toEqual({
+                error: messages.versionNotAvailable,
+                errorTitle: messages.versionAccessError,
                 isLoading: false,
                 isWatermarked: false,
                 versionCount: 0,
                 versionLimit: Infinity,
                 versions: [],
             });
+
+            expect(wrapper).toMatchSnapshot();
+        });
+
+        test('should create StaticVersionSidebar if versionUpsellExperience is STATIC_VERSION_HISTORY', () => {
+            const wrapper = getWrapper({
+                onUpgradeClick: () => {},
+                versionUpsellExperience: 'STATIC_VERSION_HISTORY',
+            });
+            wrapper.instance().handleFetchError({ status: 403 });
+
+            expect(wrapper).toMatchSnapshot();
+        });
+
+        test('should create StaticVersionSidebar if versionUpsellExperience is STATIC_VERSION_HISTORY_WITH_PICTURE', () => {
+            const wrapper = getWrapper({
+                onUpgradeClick: () => {},
+                versionUpsellExperience: 'STATIC_VERSION_HISTORY_WITH_PICTURE',
+            });
+            wrapper.instance().handleFetchError({ status: 403 });
+
+            expect(wrapper).toMatchSnapshot();
         });
     });
 

package/src/elements/content-sidebar/versions/__tests__/__snapshots__/VersionsSidebarContainer.test.js.snap

@@ -1,5 +1,80 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`elements/content-sidebar/versions/VersionsSidebarContainer handleFetchError should create StaticVersionSidebar if versionUpsellExperience is STATIC_VERSION_HISTORY 1`] = `
+<StaticVersionsSidebar
+  error={
+    Object {
+      "defaultMessage": "Sorry, version history is not available with your current account plan. To access versioning, select from one of our paid plans.",
+      "id": "be.sidebarVersions.notAvailable",
+    }
+  }
+  errorTitle={
+    Object {
+      "defaultMessage": "You don't have access to versioning",
+      "id": "be.sidebarVersions.accessError",
+    }
+  }
+  isLoading={false}
+  isWatermarked={false}
+  onUpgradeClick={[Function]}
+  parentName=""
+  showUpsellWithPicture={false}
+  versionCount={0}
+  versionLimit={Infinity}
+  versions={Array []}
+/>
+`;
+
+exports[`elements/content-sidebar/versions/VersionsSidebarContainer handleFetchError should create StaticVersionSidebar if versionUpsellExperience is STATIC_VERSION_HISTORY_WITH_PICTURE 1`] = `
+<StaticVersionsSidebar
+  error={
+    Object {
+      "defaultMessage": "Sorry, version history is not available with your current account plan. To access versioning, select from one of our paid plans.",
+      "id": "be.sidebarVersions.notAvailable",
+    }
+  }
+  errorTitle={
+    Object {
+      "defaultMessage": "You don't have access to versioning",
+      "id": "be.sidebarVersions.accessError",
+    }
+  }
+  isLoading={false}
+  isWatermarked={false}
+  onUpgradeClick={[Function]}
+  parentName=""
+  showUpsellWithPicture={true}
+  versionCount={0}
+  versionLimit={Infinity}
+  versions={Array []}
+/>
+`;
+
+exports[`elements/content-sidebar/versions/VersionsSidebarContainer handleFetchError should set state to default values with error upsell message if onUpgradeClick is set 1`] = `
+<StaticVersionsSidebar
+  error={
+    Object {
+      "defaultMessage": "Sorry, version history is not available with your current account plan. To access versioning, select from one of our paid plans.",
+      "id": "be.sidebarVersions.notAvailable",
+    }
+  }
+  errorTitle={
+    Object {
+      "defaultMessage": "You don't have access to versioning",
+      "id": "be.sidebarVersions.accessError",
+    }
+  }
+  isLoading={false}
+  isWatermarked={false}
+  onUpgradeClick={[Function]}
+  parentName=""
+  showUpsellWithPicture={false}
+  versionCount={0}
+  versionLimit={Infinity}
+  versions={Array []}
+/>
+`;
+
 exports[`elements/content-sidebar/versions/VersionsSidebarContainer render should match its snapshot 1`] = `
 <VersionsSidebar
   fileId="12345"

package/src/elements/content-sidebar/versions/flowTypes.js

@@ -4,3 +4,4 @@ import type { BoxItemVersion } from '../../../common/types/core';
 
 export type VersionActionCallback = (versionId: string) => void;
 export type VersionChangeCallback = (version: ?BoxItemVersion, additionalVersionInfo: ?AdditionalVersionInfo) => void;
+export type SidebarLoadCallback = (data: Object) => void;

package/src/elements/content-sidebar/versions/messages.js

@@ -109,6 +109,13 @@ const messages = defineMessages({
         defaultMessage: 'File versions could not be retrieved.',
         description: 'Error message for the versions fetch call.',
     },
+    versionNotAvailable: {
+        id: 'be.sidebarVersions.notAvailable',
+        defaultMessage:
+            'Sorry, version history is not available with your current account plan. To access versioning, select from one of our paid plans.',
+        description:
+            'Error message with upsell for the versions fetch call for users who dont have the version feature.',
+    },
     versionLimitExceeded: {
         id: 'be.sidebarVersions.versionLimitExceeded',
         defaultMessage:
@@ -140,6 +147,16 @@ const messages = defineMessages({
         defaultMessage: 'Server Error',
         description: 'Heading for inline error messages displayed due to a remote server issue.',
     },
+    versionAccessError: {
+        id: 'be.sidebarVersions.accessError',
+        defaultMessage: "You don't have access to versioning",
+        description: 'Heading for inline error messages with upsell.',
+    },
+    versionUpgradeLink: {
+        id: 'be.sidebarVersions.upgradeLink',
+        defaultMessage: 'Upgrade Now',
+        description: 'Text on the upgrade button shown when user does not have access to Version History',
+    },
     versionUploadedBy: {
         id: 'be.sidebarVersions.uploadedBy',
         defaultMessage: 'Uploaded by {name}',
@@ -170,6 +187,17 @@ const messages = defineMessages({
         defaultMessage: 'Retention policy expires on {time}.',
         description: 'Message describing when the version retention policy will expire.',
     },
+    versionUpsell: {
+        defaultMessage:
+            'Sorry, version history is not available with your current account plan. To access versioning, select from one of our paid plans.',
+        description: 'Upgrade message shown when user does not have access to Version History',
+        id: 'be.sidebarVersions.versionUpsell',
+    },
+    upgradeButton: {
+        defaultMessage: 'Upgrade',
+        description: 'Text on the upgrade button shown when user does not have access to Version History',
+        id: 'be.sidebarVersions.upgradeButton',
+    },
 });
 
 export default messages;

package/src/features/classification/constants.js

@@ -17,12 +17,14 @@ const ACCESS_POLICY_RESTRICTION: {
     EXTERNAL_COLLAB: 'externalCollab',
     FTP: 'ftp',
     SHARED_LINK: 'sharedLink',
+    WATERMARK: 'watermark',
 } = {
     SHARED_LINK: 'sharedLink',
     DOWNLOAD: 'download',
     EXTERNAL_COLLAB: 'externalCollab',
     APP: 'app',
     FTP: 'ftp',
+    WATERMARK: 'watermark',
 };
 
 const DOWNLOAD_CONTROL: {

package/src/features/classification/flowTypes.js

@@ -1,4 +1,5 @@
 // @flow
+import * as React from 'react';
 import type { MessageDescriptor } from 'react-intl';
 
 import {
@@ -44,17 +45,22 @@ type SharedLinkRestrictions = {
     accessLevel: SharedLinkAccessLevel,
 };
 
+type watermarkApplied = {
+    enabled?: boolean,
+};
+
 type Controls = {
     app?: ApplicationRestriction,
     download?: DownloadRestrictions,
     externalCollab?: ExternalCollabRestriction,
     sharedLink?: SharedLinkRestrictions,
+    watermark?: watermarkApplied,
 };
 
 type ControlsFormat = $Values<typeof SECURITY_CONTROLS_FORMAT>;
 
 type MessageItem = {
-    message: MessageDescriptor,
+    message: MessageDescriptor | React.Node,
     tooltipMessage?: MessageDescriptor,
 };
 

package/src/features/classification/security-controls/SecurityControls.js

@@ -67,8 +67,7 @@ class SecurityControls extends React.Component<Props, State> {
         if (controlsFormat === FULL) {
             items = getFullSecurityControlsMessages(controls, maxAppCount);
         } else {
-            const shortMessage = getShortSecurityControlsMessage(controls);
-            items = shortMessage ? [shortMessage] : [];
+            items = getShortSecurityControlsMessage(controls);
 
             if (items.length && controlsFormat === SHORT_WITH_BTN) {
                 modalItems = getFullSecurityControlsMessages(controls, maxAppCount);
@@ -85,8 +84,8 @@ class SecurityControls extends React.Component<Props, State> {
 
         let itemsList = (
             <ul className="bdl-SecurityControls">
-                {items.map(({ message, tooltipMessage }) => (
-                    <SecurityControlsItem key={message.id} message={message} tooltipMessage={tooltipMessage} />
+                {items.map(({ message, tooltipMessage }, index) => (
+                    <SecurityControlsItem key={index} message={message} tooltipMessage={tooltipMessage} />
                 ))}
             </ul>
         );

package/src/features/classification/security-controls/SecurityControlsItem.js

@@ -13,22 +13,25 @@ type Props = MessageItem;
 
 const ICON_SIZE = 13;
 
-const SecurityControlsItem = ({ message, tooltipMessage }: Props) => (
-    <li className="bdl-SecurityControlsItem">
-        <FormattedMessage {...message} />
-        {tooltipMessage && (
-            <Tooltip
-                className="bdl-SecurityControlsItem-tooltip"
-                text={<FormattedMessage {...tooltipMessage} />}
-                position="middle-right"
-                isTabbable={false}
-            >
-                <span className="bdl-SecurityControlsItem-tooltipIcon">
-                    <IconInfo color={bdlBoxBlue} width={ICON_SIZE} height={ICON_SIZE} />
-                </span>
-            </Tooltip>
-        )}
-    </li>
-);
+const SecurityControlsItem = ({ message, tooltipMessage }: Props) => {
+    return (
+        <li className="bdl-SecurityControlsItem">
+            {/* $FlowFixMe */}
+            {React.isValidElement(message) ? message : <FormattedMessage {...message} />}
+            {tooltipMessage && (
+                <Tooltip
+                    className="bdl-SecurityControlsItem-tooltip"
+                    text={<FormattedMessage {...tooltipMessage} />}
+                    position="middle-right"
+                    isTabbable={false}
+                >
+                    <span className="bdl-SecurityControlsItem-tooltipIcon">
+                        <IconInfo color={bdlBoxBlue} width={ICON_SIZE} height={ICON_SIZE} />
+                    </span>
+                </Tooltip>
+            )}
+        </li>
+    );
+};
 
 export default SecurityControlsItem;

package/src/features/classification/security-controls/SecurityControlsItem.scss

@@ -13,6 +13,10 @@
         font-style: normal;
         content: '\2022';
     }
+
+    .support-link {
+        color: $bdl-box-blue;
+    }
 }
 
 .bdl-SecurityControlsItem-tooltipContent {

package/src/features/classification/security-controls/SecurityControlsModal.js

@@ -53,8 +53,8 @@ const SecurityControlsModal = ({
                 <p className="bdl-SecurityControlsModal-definition">{definition}</p>
             </Label>
             <ul className="bdl-SecurityControlsModal-controlsItemList">
-                {modalItems.map(({ message, tooltipMessage }) => (
-                    <SecurityControlsItem key={message.id} message={message} tooltipMessage={tooltipMessage} />
+                {modalItems.map(({ message, tooltipMessage }, index) => (
+                    <SecurityControlsItem key={index} message={message} tooltipMessage={tooltipMessage} />
                 ))}
             </ul>
             <ModalActions>

package/src/features/classification/security-controls/__tests__/SecurityControlsItem.test.js

@@ -1,4 +1,6 @@
 import React from 'react';
+import { FormattedMessage } from 'react-intl';
+
 import SecurityControlsItem from '../SecurityControlsItem';
 import Tooltip from '../../../../components/tooltip';
 import IconInfo from '../../../../icons/general/IconInfo';
@@ -33,4 +35,12 @@ describe('features/classification/security-controls/SecurityControlsItem', () =>
         expect(wrapper.find(Tooltip).length).toBe(0);
         expect(wrapper.find(IconInfo).length).toBe(0);
     });
+
+    test('should render message as if it is a valid element and not render FormattedMessage', () => {
+        const messageElement = <div>Test Element</div>;
+        wrapper.setProps({ message: messageElement });
+
+        expect(wrapper).toMatchSnapshot();
+        expect(wrapper.find(FormattedMessage).length).toBe(0);
+    });
 });

package/src/features/classification/security-controls/__tests__/__snapshots__/SecurityControls.test.js.snap

@@ -6,7 +6,7 @@ exports[`features/classification/security-controls/SecurityControls should rende
     className="bdl-SecurityControls"
   >
     <SecurityControlsItem
-      key="boxui.securityControls.sharingCollabOnly"
+      key="0"
       message={
         Object {
           "defaultMessage": "Shared links allowed for collaborators only.",
@@ -15,7 +15,7 @@ exports[`features/classification/security-controls/SecurityControls should rende
       }
     />
     <SecurityControlsItem
-      key="boxui.securityControls.externalCollabDomainList"
+      key="1"
       message={
         Object {
           "defaultMessage": "External collaboration limited to approved domains.",
@@ -24,7 +24,7 @@ exports[`features/classification/security-controls/SecurityControls should rende
       }
     />
     <SecurityControlsItem
-      key="boxui.securityControls.desktopDownloadOwners"
+      key="2"
       message={
         Object {
           "defaultMessage": "Download restricted on Box Drive, except Owners/Co-Owners.",
@@ -33,7 +33,7 @@ exports[`features/classification/security-controls/SecurityControls should rende
       }
     />
     <SecurityControlsItem
-      key="boxui.securityControls.appDownloadWhitelist"
+      key="3"
       message={
         Object {
           "defaultMessage": "Only select applications are allowed: {appNames}",
@@ -54,7 +54,7 @@ exports[`features/classification/security-controls/SecurityControls should rende
     className="bdl-SecurityControls"
   >
     <SecurityControlsItem
-      key="boxui.securityControls.shortAllRestrictions"
+      key="0"
       message={
         Object {
           "defaultMessage": "Sharing, download and app restrictions apply",
@@ -120,7 +120,7 @@ exports[`features/classification/security-controls/SecurityControls should rende
     className="bdl-SecurityControls"
   >
     <SecurityControlsItem
-      key="boxui.securityControls.shortAllRestrictions"
+      key="0"
       message={
         Object {
           "defaultMessage": "Sharing, download and app restrictions apply",

package/src/features/classification/security-controls/__tests__/__snapshots__/SecurityControlsItem.test.js.snap

@@ -35,3 +35,38 @@ exports[`features/classification/security-controls/SecurityControlsItem should r
   </Tooltip>
 </li>
 `;
+
+exports[`features/classification/security-controls/SecurityControlsItem should render message as if it is a valid element and not render FormattedMessage 1`] = `
+<li
+  className="bdl-SecurityControlsItem"
+>
+  <div>
+    Test Element
+  </div>
+  <Tooltip
+    className="bdl-SecurityControlsItem-tooltip"
+    constrainToScrollParent={false}
+    constrainToWindow={true}
+    isDisabled={false}
+    isTabbable={false}
+    position="middle-right"
+    text={
+      <FormattedMessage
+        defaultMessage="message2"
+        id="id2"
+      />
+    }
+    theme="default"
+  >
+    <span
+      className="bdl-SecurityControlsItem-tooltipIcon"
+    >
+      <IconInfo
+        color="#0061d5"
+        height={13}
+        width={13}
+      />
+    </span>
+  </Tooltip>
+</li>
+`;

package/src/features/classification/security-controls/__tests__/__snapshots__/SecurityControlsModal.test.js.snap

@@ -51,7 +51,7 @@ exports[`features/classification/security-controls/SecurityControlsModal should
     className="bdl-SecurityControlsModal-controlsItemList"
   >
     <SecurityControlsItem
-      key="msg1"
+      key="0"
       message={
         Object {
           "defaultMessage": "message1",
@@ -60,7 +60,7 @@ exports[`features/classification/security-controls/SecurityControlsModal should
       }
     />
     <SecurityControlsItem
-      key="msg2"
+      key="1"
       message={
         Object {
           "defaultMessage": "message2",

package/src/features/classification/security-controls/__tests__/__snapshots__/utils.test.js.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`features/classification/security-controls/utils getFullSecurityControlsMessages() should include correct message when watermark is applied 1`] = `
+<FormattedCompMessage
+  description="Bullet point that summarizes watermarking applied to classification"
+  id="boxui.securityControls.watermarkingAppliedWithLink"
+>
+  Watermarking will be applied, click
+   
+  <Link
+    className="support-link"
+    href="https://support.box.com/hc/en-us/articles/360044195253"
+    target="_blank"
+  >
+    here
+  </Link>
+   
+  more details on Watermarking
+</FormattedCompMessage>
+`;

package/src/features/classification/security-controls/__tests__/utils.test.js

@@ -25,69 +25,75 @@ describe('features/classification/security-controls/utils', () => {
 
     describe('getShortSecurityControlsMessage()', () => {
         test('should return null when there are no restrictions', () => {
-            expect(getShortSecurityControlsMessage({})).toBeNull();
+            expect(getShortSecurityControlsMessage({})).toEqual([]);
         });
 
         test('should not return messages when shared link restriction has a "public" access level', () => {
             accessPolicy = { sharedLink: { accessLevel: PUBLIC } };
-            expect(getShortSecurityControlsMessage(accessPolicy)).toBeNull();
+            expect(getShortSecurityControlsMessage(accessPolicy)).toEqual([]);
         });
 
-        test('should return all restrictions message when all restrictions are present', () => {
-            accessPolicy = { sharedLink: {}, download: {}, externalCollab: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortAllRestrictions);
+        test('should return correct message when all restrictions are present', () => {
+            accessPolicy = { sharedLink: {}, download: {}, externalCollab: {}, app: {}, watermark: {} };
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortAllRestrictions);
+            expect(getShortSecurityControlsMessage(accessPolicy)[1].message).toBe(messages.shortWatermarking);
         });
 
         test('should return all restrictions message when download, app and either shared link, or external collab restrictions are present', () => {
             accessPolicy = { sharedLink: {}, download: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortAllRestrictions);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortAllRestrictions);
             accessPolicy = { externalCollab: {}, download: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortAllRestrictions);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortAllRestrictions);
         });
 
         test('should return correct message when download and either shared link, or external collab restrictions are present', () => {
             accessPolicy = { sharedLink: {}, download: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharingDownload);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharingDownload);
             accessPolicy = { externalCollab: {}, download: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharingDownload);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharingDownload);
         });
 
         test('should return correct message when app and either shared link, or external collab restrictions are present', () => {
             accessPolicy = { sharedLink: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharingApp);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharingApp);
             accessPolicy = { externalCollab: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharingApp);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharingApp);
         });
 
         test('should return correct message when app and download restrictions are present', () => {
             accessPolicy = { download: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortDownloadApp);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortDownloadApp);
         });
 
         test('should return correct message when there are shared link or external collab restrictions', () => {
             accessPolicy = { sharedLink: {}, externalCollab: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharing);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharing);
 
             accessPolicy = { sharedLink: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharing);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharing);
 
             accessPolicy = { externalCollab: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortSharing);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortSharing);
         });
 
         test('should return correct message when there is a download restriction', () => {
             accessPolicy = { download: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortDownload);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortDownload);
         });
 
         test('should return correct message when there is a download restriction', () => {
             accessPolicy = { app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).message).toBe(messages.shortApp);
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortApp);
+        });
+
+        test('should return correct message when there is a watermark restriction', () => {
+            accessPolicy = { watermark: {} };
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].message).toBe(messages.shortWatermarking);
         });
 
         test('should not return tooltipMessage', () => {
             accessPolicy = { sharedLink: {}, download: {}, externalCollab: {}, app: {} };
-            expect(getShortSecurityControlsMessage(accessPolicy).tooltipMessage).toBeUndefined();
+            expect(getShortSecurityControlsMessage(accessPolicy)[0].tooltipMessage).toBeUndefined();
         });
     });
 
@@ -112,6 +118,20 @@ describe('features/classification/security-controls/utils', () => {
             ]);
         });
 
+        test('should include correct message when watermark is applied', () => {
+            accessPolicy = {
+                watermark: {
+                    enabled: true,
+                },
+            };
+            const { message: formattedCompMessage } = getFullSecurityControlsMessages(accessPolicy)[0];
+            const { props: formattedCompMessageProps = {} } = formattedCompMessage;
+            const expectedMessageId = 'boxui.securityControls.watermarkingAppliedWithLink';
+
+            expect(formattedCompMessageProps.id).toEqual(expectedMessageId);
+            expect(formattedCompMessage).toMatchSnapshot();
+        });
+
         test('should include correct message when external collab is blocked', () => {
             accessPolicy = {
                 externalCollab: {

package/src/features/classification/security-controls/messages.js

@@ -24,6 +24,11 @@ const messages = defineMessages({
             'Short summary displayed for classification when an application download restriction is applied to it',
         id: 'boxui.securityControls.shortApp',
     },
+    shortWatermarking: {
+        defaultMessage: 'Watermarking applies',
+        description: 'Short summary displayed for classification when watermarking is applied to it',
+        id: 'boxui.securityControls.shortWatermarking',
+    },
     shortSharingDownload: {
         defaultMessage: 'Sharing and download restrictions apply',
         description: