feat(features): Features as an option (#555)

src/BoxAnnotations.ts

@@ -12,9 +12,14 @@ type Annotator = {
 };
 
 type AnnotationsOptions = {
+    features: Features;
     intl: IntlOptions;
 };
 
+export type Features = {
+    [key: string]: boolean;
+};
+
 type PreviewOptions = {
     file?: {
         permissions?: Permissions;

src/__tests__/BoxAnnotations-test.js

@@ -153,7 +153,8 @@ describe('BoxAnnotations', () => {
     });
 
     describe('getOptions', () => {
-        it.each([undefined, { intl: { messages: { test: 'Hello' } } }])(
+        const features = { enabledFeature: true };
+        test.each([undefined, { features, intl: { messages: { test: 'Hello' } } }])(
             'should return the passed in options when they are %o',
             mockOptions => {
                 loader = new BoxAnnotations(null, mockOptions);

src/common/BaseAnnotator.ts

@@ -1,10 +1,12 @@
+import getProp from 'lodash/get';
 import { IntlShape } from 'react-intl';
 import * as store from '../store';
 import API from '../api';
 import EventEmitter from './EventEmitter';
 import i18n from '../utils/i18n';
 import messages from '../messages';
 import { Event, IntlOptions, LegacyEvent, Permissions } from '../@types';
+import { Features } from '../BoxAnnotations';
 import './BaseAnnotator.scss';
 
 export type Container = string | HTMLElement;
@@ -22,6 +24,7 @@ export type FileOptions = {
 export type Options = {
     apiHost: string;
     container: Container;
+    features?: Features;
     file: {
         id: string;
         file_version: {
@@ -46,11 +49,13 @@ export default class BaseAnnotator extends EventEmitter {
 
     container: Container;
 
+    features: Features;
+
     intl: IntlShape;
 
     store: store.AppStore;
 
-    constructor({ apiHost, container, file, fileOptions, intl, token }: Options) {
+    constructor({ apiHost, container, features, file, fileOptions, intl, token }: Options) {
         super();
 
         const fileOptionsValue = fileOptions?.[file.id];
@@ -71,6 +76,7 @@ export default class BaseAnnotator extends EventEmitter {
         };
 
         this.container = container;
+        this.features = features || {};
         this.intl = i18n.createIntlProvider(intl);
         this.store = store.createStore(initialState, {
             api: new API({ apiHost, token }),
@@ -123,6 +129,10 @@ export default class BaseAnnotator extends EventEmitter {
         this.store.dispatch(store.setIsInitialized());
     }
 
+    public isFeatureEnabled(feature = ''): boolean {
+        return getProp(this.features, feature, false);
+    }
+
     public removeAnnotation = (annotationId: string): void => {
         this.store.dispatch(store.removeAnnotationAction(annotationId));
     };

src/common/__tests__/BaseAnnotator-test.ts

@@ -19,9 +19,11 @@ describe('BaseAnnotator', () => {
     const container = document.createElement('div');
     container.innerHTML = `<div class="inner" />`;
 
+    const features = { enabledFeature: true };
     const defaults = {
         apiHost: 'https://api.box.com',
         container,
+        features,
         file: {
             id: '12345',
             file_version: { id: '98765' },
@@ -135,6 +137,12 @@ describe('BaseAnnotator', () => {
                 );
             },
         );
+
+        test('should set features option', () => {
+            annotator = getAnnotator({ features });
+
+            expect(annotator.features).toEqual(features);
+        });
     });
 
     describe('destroy()', () => {
@@ -251,4 +259,11 @@ describe('BaseAnnotator', () => {
             expect(annotator.store.dispatch).toBeCalledWith(store.toggleAnnotationModeAction('region' as Mode));
         });
     });
+
+    describe('isFeatureEnabled()', () => {
+        test('should return whether feature is enabled or not', () => {
+            expect(annotator.isFeatureEnabled('enabledFeature')).toBe(true);
+            expect(annotator.isFeatureEnabled('notEnabledFeature')).toBe(false);
+        });
+    });
 });

src/document/DocumentAnnotator.ts

@@ -5,6 +5,7 @@ import { centerRegion, isRegion, RegionManager } from '../region';
 import { Event } from '../@types';
 import { getAnnotation } from '../store/annotations';
 import { getSelection } from './docUtil';
+import { HighlightManager } from '../highlight';
 import { Mode, setSelectionAction } from '../store';
 import { scrollToLocation } from '../utils/scroll';
 import './DocumentAnnotator.scss';
@@ -56,6 +57,9 @@ export default class DocumentAnnotator extends BaseAnnotator {
 
         // Lazily instantiate managers as pages are added or re-rendered
         if (managers.size === 0) {
+            if (this.isFeatureEnabled('highlightText')) {
+                managers.add(new HighlightManager({ location: pageNumber, referenceEl: pageReferenceEl }));
+            }
             managers.add(new RegionManager({ location: pageNumber, referenceEl: pageReferenceEl }));
         }
 

src/document/__tests__/DocumentAnnotator-test.ts

@@ -4,6 +4,7 @@ import RegionManager from '../../region/RegionManager';
 import { Annotation, Event } from '../../@types';
 import { annotations as regions } from '../../region/__mocks__/data';
 import { fetchAnnotationsAction, setSelectionAction } from '../../store';
+import { HighlightManager } from '../../highlight';
 import { mockRange } from '../../store/selection/__mocks__/range';
 import { scrollToLocation } from '../../utils/scroll';
 
@@ -129,6 +130,17 @@ describe('DocumentAnnotator', () => {
             expect(managerIterator.next().value).toBeInstanceOf(RegionManager);
         });
 
+        test('should create HighlightManager if feature is enabled', () => {
+            annotator = getAnnotator({ features: { highlightText: true } });
+
+            const managers = annotator.getPageManagers(getPage());
+            const managerIterator = managers.values();
+
+            expect(managers.size).toBe(2);
+            expect(managerIterator.next().value).toBeInstanceOf(HighlightManager);
+            expect(managerIterator.next().value).toBeInstanceOf(RegionManager);
+        });
+
         test('should destroy any existing managers if they are not present in a given page element', () => {
             const mockManager = ({ destroy: jest.fn(), exists: jest.fn(() => false) } as unknown) as RegionManager;