@imposium-hub/components 2.14.11 → 2.15.0-0

package/src/components/publish-wizard/PublishWizard.tsx

@@ -1,6 +1,8 @@
 import * as React from 'react';
 import { CrMPublishUI } from './publish/CrMPublishUI';
 import Button from '../button/Button';
+import ChangeReportTree from '../change-report/ChangeReportTree';
+import { IChangeReportSection } from '../../constants/snippets';
 import SelectField from '../select-field/SelectField';
 import HRule from '../h-rule/HRule';
 import {
@@ -72,6 +74,7 @@ interface IPublishWizardProps {
     publishData: any;
     onDeleteBatch?: (batchId: string) => any;
     onBackBtn?: () => void;
+    auditLogEnabled?: boolean;
 }
 
 export interface ICredential {
@@ -98,6 +101,8 @@ interface IPublishWizardState {
     nextStep: boolean;
     publishError: string;
     selectedCreatives: string[];
+    changeReport: IChangeReportSection[] | null;
+    publishNotes: string;
 }
 
 interface IBigButtonProps {
@@ -126,8 +131,12 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
             publishData: { unpublished_changes }
         } = props;
 
-        const screenIndex =
-            unpublished_changes === undefined || unpublished_changes === true ? 0 : 1;
+        const hasReviewStep = !!props.auditLogEnabled;
+        const screenIndex = hasReviewStep
+            ? 0
+            : unpublished_changes === undefined || unpublished_changes === true
+            ? 0
+            : 1;
 
         this.state = {
             compositions: [],
@@ -145,28 +154,46 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
             next: false,
             nextStep: false,
             publishError: null,
-            selectedCreatives: []
+            selectedCreatives: [],
+            changeReport: null,
+            publishNotes: ''
         };
         this.emailWorkflow = React.createRef();
         this.hiddenFileInputRef = React.createRef();
     }
 
     public componentDidUpdate(prevProps, prevState) {
-        // If we just finished publushing, and we're on the first screen still go to the second screen
+        const hasReviewStep = !!this.props.auditLogEnabled;
+        // If we just finished publishing, advance from the Publish screen to the Distribution screen
+        const publishScreenIndex = hasReviewStep ? 1 : 0;
+        const distributionScreenIndex = hasReviewStep ? 2 : 1;
         if (
             prevProps.publishData.publishing &&
             !this.props.publishData.publishing &&
-            this.state.screenIndex === 0 &&
+            this.state.screenIndex === publishScreenIndex &&
             !this.state.publishError
         ) {
             this.setState({
-                screenIndex: 1
+                screenIndex: distributionScreenIndex
             });
         }
     }
 
     public componentDidMount() {
-        const { story, api, handleError, activeComposition } = this.props;
+        const { story, api, handleError, activeComposition, auditLogEnabled } = this.props;
+
+        if (auditLogEnabled) {
+            api.getAuditLog(story.id)
+                .then((entries) => {
+                    const currentEntry = entries?.[0];
+                    const report = currentEntry?.id === 'current' ? currentEntry.changes : null;
+                    this.setState({ changeReport: report });
+                })
+                .catch(() => {
+                    this.setState({ changeReport: null });
+                });
+        }
+
         // Pull in all of the access creds for the composition dropdown
         api.getAssets({ type: ASSET_TYPES.VIDEO_COMPOSITION }, story.id)
             .then((res) => {
@@ -303,12 +330,14 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
             handleError,
             fromCrM
         } = this.props;
+        const hasReviewStep = !!this.props.auditLogEnabled;
+        const distributionScreenIndex = hasReviewStep ? 2 : 1;
 
         if (fromCrM) {
             this.props
                 .publishVersion(api, id, this.state.selectedCreatives)
                 .then(() => {
-                    this.setState({ screenIndex: 1 });
+                    this.setState({ screenIndex: distributionScreenIndex });
                 })
                 .catch((e) => {
                     this.setState({ publishError: e });
@@ -317,7 +346,7 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
             this.props.publishVersion(api, id).catch((e) => {
                 handleError(e);
             });
-            this.setState({ screenIndex: 1 });
+            this.setState({ screenIndex: distributionScreenIndex });
         }
     }
 
@@ -353,12 +382,7 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
     }
 
     private getErrorCopyForCrMPublish() {
-        const { story, project, fromCrM } = this.props;
-
-        if (!fromCrM) {
-            return null;
-        }
-
+        const { story, project } = this.props;
         const variables = story ? story.acts[project.actId].inventory : {};
         const varLength = variables ? Object.keys(variables).length : 0;
 
@@ -374,12 +398,35 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
         const { fromCrM, story } = this.props;
         const { publishing } = this.props.publishData;
         const disabledForCrM = this.shouldDisablePublishButtonForCrM();
+        const hasReviewStep = !!this.props.auditLogEnabled;
+        const publishScreenIndex = hasReviewStep ? 1 : 0;
+        const distributionScreenIndex = hasReviewStep ? 2 : 1;
         const lowerButtons = [];
 
-        // publish and skip buttons
-        if (screenIndex === 0) {
-            // publish
-
+        if (hasReviewStep && screenIndex === 0) {
+            // Review Changes step: Skip and Publish buttons (no Back)
+            lowerButtons.push(
+                <Button
+                    tooltip={copy.publish.btnSkip}
+                    key='btn-skip'
+                    size={'large'}
+                    onClick={() => this.setState({ screenIndex: distributionScreenIndex })}
+                    color='primary'>
+                    {copy.publish.btnSkip}
+                </Button>
+            );
+            lowerButtons.push(
+                <Button
+                    tooltip={copy.publish.btnPublish}
+                    size={'large'}
+                    key='btn-publish-review'
+                    onClick={() => this.setState({ screenIndex: publishScreenIndex })}
+                    color='primary'>
+                    {copy.publish.btnPublish}
+                </Button>
+            );
+        } else if (screenIndex === publishScreenIndex) {
+            // Publish step: Publish and Skip buttons
             const projectType = story.creativeId
                 ? CRM_INTEGRATED_PROJECT_TYPES.SINGLE_CREATIVE
                 : CRM_INTEGRATED_PROJECT_TYPES.MULTI_CREATIVE;
@@ -406,13 +453,13 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                     tooltip={copy.publish.btnSkip}
                     key='btn-skip'
                     size={'large'}
-                    onClick={() => this.setState({ screenIndex: 1 })}
+                    onClick={() => this.setState({ screenIndex: distributionScreenIndex })}
                     color='primary'>
                     {copy.publish.btnSkip}
                 </Button>
             );
         } else {
-            // display button when emailworkflow downloading state is true to close the modal
+            // Distribution and sub-screens: Back button (and Done/Finish if applicable)
             if (done || error) {
                 lowerButtons.push(
                     <Button
@@ -426,9 +473,10 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                 );
             }
 
-            const backIndex = screenIndex === 1 ? 0 : 1;
+            // Back button: from distribution → go to 0 (Review Changes ON) or 0 (Publish OFF)
+            // from sub-screens → go back to distribution
+            const backIndex = screenIndex === distributionScreenIndex ? 0 : distributionScreenIndex;
 
-            // back button
             lowerButtons.push(
                 <Button
                     tooltip={copy.publish.btnBack}
@@ -455,7 +503,6 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                 </Button>
             );
 
-            // reimport after column align
             if (error) {
                 lowerButtons.push(
                     <Button
@@ -474,6 +521,32 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
         return lowerButtons;
     }
 
+    private renderReviewChanges() {
+        const { changeReport, publishNotes } = this.state;
+        return (
+            <div className='publish-wizard-step publish-wizard-step--review'>
+                <h2>{copy.publish.reviewChangesStepTitle}</h2>
+                <HRule />
+                <p>{copy.publish.reviewChangesDescription}</p>
+                <ChangeReportTree
+                    sections={changeReport}
+                    defaultExpanded={true}
+                    emptyMessage={copy.publish.noChangesMessage}
+                    loadingMessage={copy.publish.loadingChangesMessage}
+                />
+                <div className='publish-notes-wrapper'>
+                    <label className='publish-notes-label'>{copy.publish.publishNotesLabel}</label>
+                    <textarea
+                        className='publish-notes-textarea'
+                        value={publishNotes}
+                        onChange={(e) => this.setState({ publishNotes: e.target.value })}
+                        placeholder={copy.publish.publishNotesPlaceholder}
+                    />
+                </div>
+            </div>
+        );
+    }
+
     private renderPublish() {
         const { fromCrM, story } = this.props;
         const { publishing } = this.props.publishData;
@@ -483,7 +556,6 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
         const projectType = story.creativeId
             ? CRM_INTEGRATED_PROJECT_TYPES.SINGLE_CREATIVE
             : CRM_INTEGRATED_PROJECT_TYPES.MULTI_CREATIVE;
-
         const error = errorCopy ? (
             <p className='publish-error'>
                 <span className='icon'>{ICON_EXCLAIMATION_TRIANGLE}</span>&nbsp;&nbsp;{errorCopy}
@@ -597,6 +669,7 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                             selectedComposition={selectedComposition}
                             publishDataset={publishDataset}
                             creativeManagerBaseUrl={creativeManagerBaseUrl}
+                            hasReviewStep={!!this.props.auditLogEnabled}
                         />
                     </div>
                 </div>
@@ -607,7 +680,10 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
     private nextClickHandler = () => {
         this.setState({ nextStep: true, error: false });
 
-        if (this.state.screenIndex === 7 || this.state.screenIndex === 8) {
+        const hasReviewStep = !!this.props.auditLogEnabled;
+        const exportIndex = hasReviewStep ? 8 : 7;
+        const crmExportIndex = hasReviewStep ? 9 : 8;
+        if (this.state.screenIndex === exportIndex || this.state.screenIndex === crmExportIndex) {
             this.emailWorkflow.current.getWrappedInstance().proceedWithExport();
         }
     };
@@ -660,6 +736,8 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
             })?.name || '';
 
         const variables = story ? story.acts[project.actId].inventory : {};
+        const hasReviewStep = !!this.props.auditLogEnabled;
+
         return (
             <div className='publish-wizard'>
                 <div className='publish-wizard-header'>
@@ -668,20 +746,26 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                 </div>
                 {/* <PaneErrorBoundry>*/}
                 <div>
-                    {screenIndex === 0 && this.renderPublish()}
-                    {screenIndex === 1 && this.renderDistributionOptions()}
-                    {screenIndex === 2 && (
+                    {hasReviewStep && screenIndex === 0 && this.renderReviewChanges()}
+                    {screenIndex === (hasReviewStep ? 1 : 0) && this.renderPublish()}
+                    {screenIndex === (hasReviewStep ? 2 : 1) && this.renderDistributionOptions()}
+                    {screenIndex === (hasReviewStep ? 3 : 2) && (
                         <WebpageHosted
                             story={story}
                             compositionId={selectedComposition}
                             accessKey={accessKey}
                         />
                     )}
-                    {(screenIndex === 3 || screenIndex === 7 || screenIndex === 8) && (
+                    {(screenIndex === (hasReviewStep ? 4 : 3) ||
+                        screenIndex === (hasReviewStep ? 8 : 7) ||
+                        screenIndex === (hasReviewStep ? 9 : 8)) && (
                         <EmailWorkflow
-                            isCrM={screenIndex === 8}
-                            isExport={screenIndex === 7 || screenIndex === 8}
-                            isEmail={screenIndex === 3}
+                            isCrM={screenIndex === (hasReviewStep ? 9 : 8)}
+                            isExport={
+                                screenIndex === (hasReviewStep ? 8 : 7) ||
+                                screenIndex === (hasReviewStep ? 9 : 8)
+                            }
+                            isEmail={screenIndex === (hasReviewStep ? 4 : 3)}
                             api={api}
                             story={story}
                             variables={variables}
@@ -707,7 +791,7 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                             ref={this.emailWorkflow}
                         />
                     )}
-                    {screenIndex === 5 && (
+                    {screenIndex === (hasReviewStep ? 6 : 5) && (
                         <HubSpotFlow
                             handleError={handleError}
                             status={status}
@@ -717,7 +801,7 @@ class PublishWizard extends React.PureComponent<IPublishWizardProps, IPublishWiz
                             compositionId={selectedComposition}
                         />
                     )}
-                    {screenIndex === 6 && <APIIntegration />}
+                    {screenIndex === (hasReviewStep ? 7 : 6) && <APIIntegration />}
                     <br />
                     <HRule />
                     <div className='lower-buttons'>{this.renderLowerButtons()}</div>
@@ -737,7 +821,19 @@ const mapDispatchToProps = (dispatch) => {
     return bindActionCreators({ publishVersion }, dispatch);
 };
 
-export default connect(mapStateToProps, mapDispatchToProps)(PublishWizard);
+const ConnectedPublishWizard = connect(mapStateToProps, mapDispatchToProps)(PublishWizard);
+
+const PublishWizardWithFlag = (props) => {
+    const auditLogEnabled = useFlag('feature.IMPOSIUM_EDITOR.AUDIT_LOG');
+    return (
+        <ConnectedPublishWizard
+            {...props}
+            auditLogEnabled={auditLogEnabled}
+        />
+    );
+};
+
+export default PublishWizardWithFlag;
 
 export const BigButton: React.FC<IBigButtonProps> = (p) => (
     <div
@@ -748,7 +844,7 @@ export const BigButton: React.FC<IBigButtonProps> = (p) => (
     </div>
 );
 
-export const TabContent: React.FC<React.PropsWithChildren> = ({ children }) => (
+export const TabContent: React.FC = ({ children }) => (
     <div className='tab-content'>
         <div className='settings-tab'>
             <div className='integration-details'>{children}</div>
@@ -792,8 +888,11 @@ export const DistributeOptions = ({
     onSelectOption,
     selectedComposition,
     publishDataset,
-    creativeManagerBaseUrl
+    creativeManagerBaseUrl,
+    hasReviewStep = false
 }) => {
+    const shift = hasReviewStep ? 1 : 0;
+    const selectOption = (index: number) => onSelectOption(index + shift);
     const isPrerendersEnabled = useFlag('feature.IMPOSIUM_EDITOR.PRERENDERS_CRM_WORKFLOW');
 
     const getCrMLink = (creativeLibraryId: string, creativeId?: string) => {
@@ -812,7 +911,7 @@ export const DistributeOptions = ({
                           {ICON_GLOBE}&nbsp;{copy.publish.btnWebsite}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(2)
+                  onClick: (e) => selectOption(2)
               },
               {
                   label: (
@@ -820,7 +919,7 @@ export const DistributeOptions = ({
                           {ICON_EMAIL}&nbsp;{copy.publish.btnEmail}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(3)
+                  onClick: (e) => selectOption(3)
               },
               {
                   label: (
@@ -828,7 +927,7 @@ export const DistributeOptions = ({
                           {ICON_HUBSPOT}&nbsp;{copy.publish.btnHubspot}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(5)
+                  onClick: (e) => selectOption(5)
               },
               {
                   label: (
@@ -836,7 +935,7 @@ export const DistributeOptions = ({
                           {ICON_PROJECT_DIAGRAM}&nbsp;{copy.publish.btnAPI}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(6)
+                  onClick: (e) => selectOption(6)
               },
               {
                   label: (
@@ -844,7 +943,7 @@ export const DistributeOptions = ({
                           {ICON_DOWNLOAD}&nbsp;{copy.publish.btnExport}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(7)
+                  onClick: (e) => selectOption(7)
               },
               {
                   label: (
@@ -852,7 +951,7 @@ export const DistributeOptions = ({
                           {ICON_IMAGE}&nbsp;{copy.publish.btnCRM}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(8)
+                  onClick: (e) => selectOption(8)
               }
           ]
         : [
@@ -862,7 +961,7 @@ export const DistributeOptions = ({
                           {ICON_DOWNLOAD}&nbsp;{copy.publish.btnRunTestBatch}
                       </span>
                   ),
-                  onClick: (e) => onSelectOption(7)
+                  onClick: (e) => selectOption(7)
               },
               {
                   label: (
@@ -891,7 +990,7 @@ export const DistributeOptions = ({
                     {ICON_IMAGE}&nbsp;{copy.publish.btnCRM}
                 </span>
             ),
-            onClick: (e) => onSelectOption(8),
+            onClick: (e) => selectOption(8),
             style: { width: 'calc(100% - 4px)' }
         });
     }

package/src/components/story-previewer/StoryPreviewer.tsx

@@ -20,7 +20,7 @@ import ImagePlayer from '../players/ImagePlayer';
 import { saveAs } from 'file-saver';
 import MediaVariableField from '../media-variable-field/MediaVariableField';
 import { IExperience } from '../../interfaces/experience';
-import { useResizeDetector } from 'react-resize-detector';
+import ReactResizeDetector from 'react-resize-detector';
 import { ERROR, previewer as copy } from '../../constants/copy';
 import { formattedTime } from '../../Util';
 import Timer from '../../services/Timer';
@@ -30,25 +30,6 @@ import { ICON_DOWNLOAD, ICON_CLIPBOARD } from '../../constants/icons';
 import AudioPlayer from '../players/AudioPlayer';
 import ColorField from '../color-field/ColorField';
 
-const ResizeDetectorWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => {
-    const { width, height, ref } = useResizeDetector<HTMLDivElement>({
-        handleWidth: true,
-        handleHeight: true
-    });
-    return (
-        <div
-            ref={ref}
-            style={{ width: '100%', height: '100%' }}>
-            {React.Children.map(children, (child) => {
-                if (React.isValidElement(child)) {
-                    return React.cloneElement(child, { width, height } as any);
-                }
-                return child;
-            })}
-        </div>
-    );
-};
-
 interface IStoryPreviewerProps {
     api: IImposiumAPI;
     storyId: string;
@@ -805,7 +786,13 @@ class StoryPreviewer extends React.PureComponent<IStoryPreviewerProps, IStoryPre
                 );
             }
 
-            return <ResizeDetectorWrapper>{player}</ResizeDetectorWrapper>;
+            return (
+                <ReactResizeDetector
+                    handleWidth
+                    handleHeight>
+                    {player}
+                </ReactResizeDetector>
+            );
         }
 
         return null;

package/src/components/tabs/Tabs.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useResizeDetector } from 'react-resize-detector';
+import { withResizeDetector } from 'react-resize-detector';
 import ButtonMenu from '../button-menu/ButtonMenu';
 import ButtonMenuItem from '../button-menu/ButtonMenuItem';
 import Button from '../button/Button';
@@ -14,15 +14,15 @@ export interface ITab {
     menuButtons?: JSX.Element;
 }
 
-export interface ITabsProps {
+interface ITabsProps {
     activeTab?: string;
     keepMounted?: boolean;
     options: ITab[];
     onChange(i): void;
-    onClose?(i): void;
+    onClose(i): void;
     tabPadding?: number;
-    width?: number;
-    height?: number;
+    width: number;
+    height: number;
 }
 
 interface ITabsState {
@@ -85,7 +85,7 @@ class Tabs extends React.PureComponent<ITabsProps, ITabsState> {
     }
 
     private renderContent() {
-        const { options, activeTab, keepMounted, width = 0, height = 0 } = this.props;
+        const { options, activeTab, keepMounted, width, height } = this.props;
 
         if (keepMounted) {
             const contentArray = [];
@@ -132,9 +132,7 @@ class Tabs extends React.PureComponent<ITabsProps, ITabsState> {
                     onClick={(e) => {
                         e.preventDefault();
                         e.stopPropagation();
-                        if (this.props.onClose) {
-                            this.props.onClose(key);
-                        }
+                        this.props.onClose(key);
                     }}>
                     {ICON_TIMES}
                 </Button>
@@ -220,19 +218,4 @@ class Tabs extends React.PureComponent<ITabsProps, ITabsState> {
     }
 }
 
-const TabsWithResize: React.FC<Omit<ITabsProps, 'width' | 'height'>> = (props) => {
-    const { width = 0, height = 0, ref } = useResizeDetector<HTMLDivElement>();
-    return (
-        <div
-            ref={ref}
-            style={{ width: '100%', height: '100%' }}>
-            <Tabs
-                {...props}
-                width={width}
-                height={height}
-            />
-        </div>
-    );
-};
-
-export default TabsWithResize;
+export default withResizeDetector(Tabs);

package/src/constants/copy.ts

@@ -147,14 +147,28 @@ export const publish = {
         'Your videos have finished rendering. They will appear in Creative Manager momentarily.',
     renderComplete: 'Render Complete!',
 
+    // review changes
+    reviewChangesStepTitle: 'STEP 1: Review Changes',
+    reviewChangesDescription:
+        'Review the changes made since your last publish. You can publish these changes or skip to distribution.',
+    noChangesMessage: 'No changes detected since last publish.',
+    loadingChangesMessage: 'Loading changes...',
+    publishNotesLabel: 'Publish notes',
+    publishNotesPlaceholder: 'Describe the changes in this version...',
+
+    // change report status labels
+    statusAdded: 'Added',
+    statusRemoved: 'Removed',
+    statusModified: 'Modified',
+
     // publish
-    publishStepTitle: 'STEP 1: Publish your Project',
+    publishStepTitle: 'STEP 2: Publish your Project',
     publishStepTitleFromCrM: 'STEP 1: Publish your Project to selected Creatives',
     publishStepDesc:
         "Your project needs to be published before your changes can be seen. If you haven't made any changes since the last time you published, you can skip to the next step.",
 
     // distribute
-    distributeStepTitle: 'STEP 2: How do you want your users to view their video?',
+    distributeStepTitle: 'STEP 3: How do you want your users to view their video?',
     distributeStepTitleFromCrM: 'STEP 2: Run a test batch or return to Creative Manager?',
     distributeStepDesc:
         'Select which Composition you want to deliver, access credentials you want to use, and distribution channel.',

package/src/constants/snippets.ts

@@ -0,0 +1,25 @@
+export interface IChangeReportNode {
+    label: string;
+    status: 'added' | 'removed' | 'modified';
+    oldValue?: string;
+    newValue?: string;
+    children?: IChangeReportNode[];
+}
+
+export interface IChangeReportSection {
+    section:
+        | 'PROJECT SETTINGS'
+        | 'VARIABLES'
+        | 'SCENES & ENCODING'
+        | 'ASSETS'
+        | 'COMPOSITIONS & LAYERS';
+    nodes: IChangeReportNode[];
+}
+
+export interface IPublishLogEntry {
+    id: string;
+    version: number | null;
+    message: string | null;
+    changes: IChangeReportSection[] | null;
+    date_created: number | null;
+}

package/src/index.ts

@@ -16,7 +16,7 @@ import FieldWrapper from './components/field-wrapper/FieldWrapper';
 import CheckboxField from './components/checkbox-field/CheckboxField';
 import ListField from './components/list-field/ListField';
 import ButtonGroupField from './components/button-group-field/ButtonGroupField';
-import NumberField, { validateNumInput } from './components/number-field/NumberField';
+import NumberField from './components/number-field/NumberField';
 import SelectField from './components/select-field/SelectField';
 import TextField from './components/text-field/TextField';
 import TextAreaField from './components/text-area-field/TextAreaField';
@@ -168,6 +168,8 @@ import TextAreaAutocomplete from './components/text-area-autocomplete/TextAreaAu
 import IconToggle from './components/icon-toggle/IconToggle';
 import { DEFAULT_FONTS } from './constants/fonts';
 import FontField from './components/font-field/FontField';
+import { IChangeReportNode, IChangeReportSection, IPublishLogEntry } from './constants/snippets';
+import ChangeReportTree from './components/change-report/ChangeReportTree';
 
 export {
     ProjectDropdown,
@@ -335,5 +337,8 @@ export {
     IconToggle,
     DEFAULT_FONTS,
     FontField,
-    validateNumInput
+    IChangeReportNode,
+    IChangeReportSection,
+    IPublishLogEntry,
+    ChangeReportTree
 };

package/src/services/API.ts

@@ -164,6 +164,7 @@ export interface IImposiumAPI {
     cancelAllPendingRequests();
     getTTSVoices(params: any);
     getCustomVoice(voiceId: string);
+    getAuditLog(storyId: string): Promise<any | Error>;
     getToken: any;
 }
 
@@ -1917,4 +1918,11 @@ export default class API {
             url: `/text-to-speech/voice?service=ElevenLabs&id=${voiceId}`
         });
     };
+
+    public getAuditLog = (storyId: string): Promise<any | Error> => {
+        return this.doRequest({
+            method: 'GET',
+            url: `/story/${storyId}/audit-log`
+        });
+    };
 }