@imposium-hub/components 2.2.5 → 2.2.7

package/dist/styles.css

@@ -346,6 +346,7 @@ body a {
 .assets-paginator .jump-to-wrapper .jump-to-page:disabled {
   color: rgba(223, 223, 223, 0.4);
   background: #1d1d1d;
+  pointer-events: none;
 }
 .assets-paginator .jump-to-wrapper .jump-to-page:disabled:focus {
   background: #1d1d1d;
@@ -942,6 +943,7 @@ body a {
 .ip-table-wrapper .ip-table-pagination .paginator-input:disabled {
   color: rgba(223, 223, 223, 0.4);
   background: #1d1d1d;
+  pointer-events: none;
 }
 .ip-table-wrapper .ip-table-pagination .paginator-input:disabled:focus {
   background: #1d1d1d;
@@ -1039,6 +1041,7 @@ body a {
 .inputMixin:disabled {
   color: rgba(223, 223, 223, 0.4);
   background: #1d1d1d;
+  pointer-events: none;
 }
 .inputMixin:disabled:focus {
   background: #1d1d1d;
@@ -1085,6 +1088,7 @@ body a {
 .form-field textarea:disabled {
   color: rgba(223, 223, 223, 0.4);
   background: #1d1d1d;
+  pointer-events: none;
 }
 .form-field input:disabled:focus,
 .form-field select:disabled:focus,
@@ -1177,6 +1181,7 @@ body a {
 .checkbox-field .checkbox:disabled {
   color: rgba(223, 223, 223, 0.4);
   background: #1d1d1d;
+  pointer-events: none;
 }
 .checkbox-field .checkbox:disabled:focus {
   background: #1d1d1d;
@@ -1210,6 +1215,7 @@ body a {
 .button-group-field .button-group:disabled {
   color: rgba(223, 223, 223, 0.4);
   background: #1d1d1d;
+  pointer-events: none;
 }
 .button-group-field .button-group:disabled:focus {
   background: #1d1d1d;
@@ -2443,6 +2449,12 @@ body a {
   display: inline-block;
   margin-top: 4px;
 }
+.story-viewer .select-wrapper select {
+  padding-right: 18px;
+}
+.story-viewer .select-wrapper .caret {
+  top: -2px;
+}
 .story-viewer .viewer-content {
   position: absolute;
   left: 0px;
@@ -2469,6 +2481,13 @@ body a {
   display: inline-block;
   vertical-align: top;
 }
+.story-viewer .viewer-content .content-header .output select {
+  width: 140px;
+  padding-right: 20px;
+}
+.story-viewer .viewer-content .content-header .output .caret {
+  top: -2px;
+}
 .story-viewer .viewer-content .content-header .right-interface {
   display: inline-block;
   vertical-align: top;

package/dist/styles.less

@@ -1132,7 +1132,7 @@ body{
 		
 		color:fadeout(@textDefault, 60%);
 		background:@inputBackground;
-
+		pointer-events: none;
 		&:focus{
 			background:@inputBackground;
 		}
@@ -2459,6 +2459,14 @@ body{
     .select-wrapper{
         display: inline-block;
         margin-top:4px;
+
+        select {
+            padding-right: 18px;
+        }
+
+        .caret {
+            top: -2px;
+        }
     }
 
     .viewer-content{
@@ -2482,6 +2490,15 @@ body{
                 margin-right:5px;
                 display: inline-block;
                 vertical-align: top;
+
+                select {
+                    width: 140px;
+                    padding-right: 20px;
+                }
+
+                .caret {
+                    top: -2px;
+                }
             }
 
             .right-interface{

package/less/components/form-field.less

@@ -32,7 +32,7 @@
 		
 		color:fadeout(@textDefault, 60%);
 		background:@inputBackground;
-
+		pointer-events: none;
 		&:focus{
 			background:@inputBackground;
 		}

package/less/components/story-previewer.less

@@ -198,6 +198,14 @@
     .select-wrapper{
         display: inline-block;
         margin-top:4px;
+
+        select {
+            padding-right: 18px;
+        }
+
+        .caret {
+            top: -2px;
+        }
     }
 
     .viewer-content{
@@ -221,6 +229,15 @@
                 margin-right:5px;
                 display: inline-block;
                 vertical-align: top;
+
+                select {
+                    width: 140px;
+                    padding-right: 20px;
+                }
+
+                .caret {
+                    top: -2px;
+                }
             }
 
             .right-interface{

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@imposium-hub/components",
-    "version": "2.2.5",
+    "version": "2.2.7",
     "description": "React & Typescript component / asset library for Imposium front-ends",
     "main": "./dist/cjs/index.js",
     "module": "./dist/esm/index.js",

package/src/components/header/Header.tsx

@@ -19,6 +19,7 @@ export interface IHeaderProps {
     onStoryChange?: (story: any) => any;
     logout: (...args) => any;
     auth: any;
+    story: any;
     baseUrl: any;
 }
 
@@ -153,6 +154,7 @@ class ImposiumHeader extends React.PureComponent<IHeaderProps, IHeaderState> {
     public componentDidUpdate(prevProps: Readonly<IHeaderProps>): void {
         const { accessData } = this.state;
         const { activeOrganization } = this.props;
+
         if (activeOrganization !== prevProps.activeOrganization) {
             this.parseAccessData(accessData, activeOrganization);
         }
@@ -298,7 +300,7 @@ class ImposiumHeader extends React.PureComponent<IHeaderProps, IHeaderState> {
     };
 
     public render() {
-        const { email, activeOrganization, activeStory, hideStoryPicker } = this.props;
+        const { email, activeOrganization, activeStory, hideStoryPicker, story } = this.props;
         const {
             accessData,
             showAccountDropdown,
@@ -455,7 +457,9 @@ class ImposiumHeader extends React.PureComponent<IHeaderProps, IHeaderState> {
                             if (showStoriesDropdown === false) this.getAccessData();
                         });
                     }}>
-                    <div className='story-name'>{currentStory ? currentStory.name : ''}</div>
+                    <div className='story-name'>
+                        {currentStory ? currentStory.name : story ? story.name : ''}
+                    </div>
                     {this.renderDropdownChevron(showStoriesDropdown)}
                 </button>
             );
@@ -585,7 +589,8 @@ class ImposiumHeader extends React.PureComponent<IHeaderProps, IHeaderState> {
 
 const mapStateToProps = (state): any => {
     return {
-        auth: state.auth
+        auth: state.auth,
+        story: state.story
     };
 };
 

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

@@ -369,15 +369,15 @@ class EmailWorkflow extends React.PureComponent<IEmailWorkflowProps, IEmailWorkf
         onError(false); // reset the parent error
         this.props
             .importBatchFromCsv(story_id, id, file, accessKey, compositionId, !isExport, isExport)
-            .then(() => {
-                if (this.props.batchJobs.missing.length > 0) {
+            .then((res) => {
+                if (res?.missing_columns) {
                     onError(true); // set the error to true
                 }
 
                 this.setState({ uploadComplete: true, uploading: false });
                 this.getBatch();
 
-                if (isExport && Object.keys(this.props.batchJobs.missing).length === 0) {
+                if (isExport && res?.missing_columns?.length === 0) {
                     this.renderBatch({ id });
                 }
             })
@@ -583,9 +583,7 @@ class EmailWorkflow extends React.PureComponent<IEmailWorkflowProps, IEmailWorkf
 
             // add an empty option to the columns
             colOpts.unshift('');
-
-            const missingColumn = Object.keys(missing).map((m) => missing[m]);
-            const showMissing = missingColumn.join();
+            const showMissing = missing[missing.length - 1].join();
 
             if (colOpts.length < varArray.length) {
                 return (

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

@@ -443,7 +443,8 @@ class StoryPreviewer extends React.PureComponent<IStoryPreviewerProps, IStoryPre
         experienceId,
         triggerJob = false,
         compositionId?: string,
-        useWorkingCopy?: boolean
+        useWorkingCopy?: boolean,
+        fastRender?: boolean
     ) {
         if (!this.timer.running) {
             this.timer.start();
@@ -461,7 +462,12 @@ class StoryPreviewer extends React.PureComponent<IStoryPreviewerProps, IStoryPre
                     },
                     () => {
                         if (triggerJob) {
-                            api.triggerEvent(experienceId, compositionId, useWorkingCopy)
+                            api.triggerEvent(
+                                experienceId,
+                                compositionId,
+                                useWorkingCopy,
+                                fastRender
+                            )
                                 .then((resTrigger) => {
                                     this.setState(
                                         {
@@ -577,8 +583,15 @@ class StoryPreviewer extends React.PureComponent<IStoryPreviewerProps, IStoryPre
     }
 
     private createExperience() {
-        const { storyId, onNotification, onError, api, onExperienceCreated, useWorkingCopy } =
-            this.props;
+        const {
+            storyId,
+            onNotification,
+            onError,
+            api,
+            onExperienceCreated,
+            useWorkingCopy,
+            editor: { fastRender }
+        } = this.props;
 
         const compId = this.getCompId();
 
@@ -603,7 +616,7 @@ class StoryPreviewer extends React.PureComponent<IStoryPreviewerProps, IStoryPre
                                 onExperienceCreated(resExp);
                             }
 
-                            this.getExperience(resExp.id, true, compId, useWorkingCopy);
+                            this.getExperience(resExp.id, true, compId, useWorkingCopy, fastRender);
                         })
                         .catch((e) => {
                             this.resetState();
@@ -920,7 +933,7 @@ class StoryPreviewer extends React.PureComponent<IStoryPreviewerProps, IStoryPre
 
             viewerButtons = (
                 <SelectField
-                    width='200px'
+                    width='225px'
                     options={viewerOpts}
                     value={activeOutput}
                     onChange={this.evtHandlers.toggleOutput}

package/src/services/API.ts

@@ -53,7 +53,12 @@ export interface IImposiumAPI {
     getExperience(experienceId: string, poll: boolean);
     blockByExperience(experienceId: string);
     getExperienceLog(experienceId: string);
-    triggerEvent(experienceId: string, compositionId?: string, useWorkingCopy?: boolean);
+    triggerEvent(
+        experienceId: string,
+        compositionId?: string,
+        useWorkingCopy?: boolean,
+        fastRender?: boolean
+    );
     getBatches(storyId: string, params?: any);
     getBatch(batchId: string, page: number);
     getBatchProgress(batchId: string);
@@ -1094,7 +1099,8 @@ export default class API {
     public triggerEvent = (
         experienceId: string,
         compositionId?: string,
-        useWorkingCopy?: boolean
+        useWorkingCopy?: boolean,
+        fastRender?: boolean
     ): Promise<any | Error> => {
         const route = `/experience/${experienceId}/trigger-event`;
 
@@ -1106,6 +1112,10 @@ export default class API {
                 formData.append('published', 'false');
             }
 
+            if (fastRender) {
+                formData.append('fastRender', 'true');
+            }
+
             return this.doRequest({
                 method: 'POST',
                 url: route,