@imposium-hub/components 2.3.11-0 → 2.4.0-1

package/src/redux/reducers/asset-uploads.ts

@@ -1,20 +1,63 @@
 import assetUploadsActions from '../actions/asset-uploads';
 
 const initialState: any = {
+    tagByDelimiter: true,
+    delimiter: '_',
+    tagManually: false,
+    manualTags: [],
+    tagByFileName: false,
+    assignToStory: true,
     uploads: []
 };
 
 const assetUploads = (state = initialState, action): any => {
     switch (action.type) {
-        case assetUploadsActions.ADD_UPLOAD:
+        case assetUploadsActions.TOGGLE_TAG_BY_FILENAME:
             return {
                 ...state,
-                uploads: [...state.uploads, action.uploadMeta]
+                tagByFileName: action.toggle
+            };
+        case assetUploadsActions.TOGGLE_TAG_BY_DELIMITER:
+            return {
+                ...state,
+                tagByDelimiter: action.toggle
+            };
+        case assetUploadsActions.SET_DELIMITER:
+            return {
+                ...state,
+                delimiter: action.delimiter
+            };
+        case assetUploadsActions.TOGGLE_MANUAL_TAGGING:
+            return {
+                ...state,
+                tagManually: action.toggle
+            };
+        case assetUploadsActions.ADD_MANUAL_TAG:
+            const newManualTags = [...state.manualTags];
+            newManualTags.push(action.tag);
+            return {
+                ...state,
+                manualTags: newManualTags
+            };
+        case assetUploadsActions.DELETE_MANUAL_TAG:
+            return {
+                ...state,
+                manualTags: state.manualTags.filter((t: string) => t !== action.tag)
             };
-        case assetUploadsActions.UPDATE_UPLOAD:
+        case assetUploadsActions.DELETE_MANUAL_TAGS:
             return {
                 ...state,
-                uploads: action.uploadMetaArray
+                manualTags: []
+            };
+        case assetUploadsActions.TOGGLE_ASSIGN_TO_STORY:
+            return {
+                ...state,
+                assignToStory: action.toggle
+            };
+        case assetUploadsActions.ADD_UPLOAD:
+            return {
+                ...state,
+                uploads: [...state.uploads, action.uploadMeta]
             };
         case assetUploadsActions.UPDATE_PERCENT_UPLOADED:
             const newUploads = state.uploads.map((u: any) => {
@@ -29,19 +72,6 @@ const assetUploads = (state = initialState, action): any => {
                 ...state,
                 uploads: newUploads
             };
-        case assetUploadsActions.ADD_UPLOAD_ASSET_ID:
-            const updateUploads = state.uploads.map((u: any) => {
-                if (u.filename === action.filename) {
-                    return { ...u, assetId: action.assetId };
-                }
-
-                return u;
-            });
-
-            return {
-                ...state,
-                uploads: updateUploads
-            };
         case assetUploadsActions.REMOVE_UPLOAD:
             return {
                 ...state,

package/src/services/API.ts

@@ -123,7 +123,7 @@ export interface IImposiumAPI {
     getPlayerMetrics(storyId: string, start: number, end: number, alias: string);
     getSystemMetrics(storyId: string, start: number, end: number, step: number, alias: string);
     getOrganizations(page: number, itemsPerPage: number): Promise<any[]>;
-    addOrganization(orgName: string, enableCloudfront: boolean, defaultStory?: string);
+    addOrganization(orgName: string);
     cancelExperiencePolling();
     createCompositionAsset(
         storyId: string,
@@ -1430,17 +1430,12 @@ export default class API {
         });
     };
 
-    public addOrganization = (
-        orgName: string,
-        enableCloudfront: boolean,
-        defaultStory?: string
-    ): Promise<any> => {
+    public addOrganization = (orgName: string, defaultStory?: string): Promise<any> => {
         return this.doRequest({
             url: '/account',
             method: 'POST',
             data: {
                 name: orgName,
-                enable_cloudfront: enableCloudfront,
                 initial_story: defaultStory
             }
         });

package/src/services/Auth0.ts

@@ -12,6 +12,7 @@ export interface IIdentity {
 export default class AuthService {
     private static readonly IMPOSIUM_APP_DEFAULTS: any = {
         scope: 'openid',
+        audience: 'https://api.4cinsights.io/',
         responseType: 'token id_token',
         redirectUri: `${window.location.origin}/auth`
     };

package/src/services/Session.ts

@@ -6,23 +6,19 @@ export interface IHubSession {
     sub: string;
     organization_id: string;
     story_id: string;
-    stories_hash: number;
-    orgs_hash: number;
 }
 
 export default class SessionService {
-    private static readonly LAST_STORY_ID_CACHE: string = 'imp_hub_last_story_id';
+    private static readonly LOGIN_STORY_ID_CACHE: string = 'imp_hub_last_story_id-';
 
-    private static readonly LAST_ORG_ID_CACHE: string = 'imp_hub_last_org_id';
+    private static readonly LOGIN_ORG_ID_CACHE: string = 'imp_hub_last_org_id-';
 
     private static readonly SESSION_COOKIE_NAME: string = 'auth_state';
 
     private static readonly FRESH_COOKIE: IHubSession = {
         sub: '',
         organization_id: '',
-        story_id: '',
-        stories_hash: 0,
-        orgs_hash: 0
+        story_id: ''
     };
 
     /*
@@ -65,75 +61,27 @@ export default class SessionService {
         Cookies.remove(SessionService.SESSION_COOKIE_NAME, { domain });
     };
 
-    public static buildFreshSession = (freshIdentity: IIdentity, freshAccess: any): void => {
+    public static buildFreshSession = (
+        freshIdentity: IIdentity,
+        orgId: string = null,
+        storyId: string = null
+    ): void => {
         const {
             idTokenPayload: { sub, exp }
         } = freshIdentity;
-        const { organizations } = freshAccess;
-
-        let cachedOrganizationId: string;
-        let cachedStoryId: string;
-        let organizationId: string = '';
-        let activeStoryId: string = '';
-        let activeOrg: any;
-
-        try {
-            cachedOrganizationId = localStorage.getItem(SessionService.LAST_ORG_ID_CACHE);
-            cachedStoryId = localStorage.getItem(SessionService.LAST_STORY_ID_CACHE);
-        } catch (e) {
-            console.warn('Failed to look up cached hub settings', e);
-        }
-
-        // Check if org exists in access data fetched from imposium
-        if (cachedOrganizationId) {
-            activeOrg = freshAccess.organizations.find((o: any) => o.id === cachedOrganizationId);
-
-            if (typeof activeOrg === 'object' && activeOrg.hasOwnProperty('id')) {
-                organizationId = cachedOrganizationId;
-            }
-        }
 
-        // If the cached org id matched up with an org record, check to see if the cached story id also
-        // matches an existing story
-        if (
-            cachedStoryId &&
-            organizationId &&
-            activeOrg.stories &&
-            activeOrg.stories.find((s: any) => s.id === cachedStoryId)
-        ) {
-            activeStoryId = cachedStoryId;
-        }
+        const freshSession: any = {
+            sub
+        };
 
-        // If the cached org id was missing / not belonging to the current org, use the first org id if possible
-        if (
-            !organizationId &&
-            organizations.length > 0 &&
-            typeof organizations[0] === 'object' &&
-            organizations[0].hasOwnProperty('id')
-        ) {
-            organizationId = organizations[0].id;
+        if (orgId) {
+            freshSession.organization_id = orgId;
         }
 
-        // Same for story id if the cache was missing / belonging to a different org
-        if (
-            !activeStoryId &&
-            organizations &&
-            organizations[0] &&
-            organizations[0].stories.length > 0 &&
-            typeof organizations[0].stories[0] === 'object' &&
-            organizations[0].stories[0].hasOwnProperty('id')
-        ) {
-            activeStoryId = organizations[0].stories[0].id;
+        if (storyId) {
+            freshSession.story_id = storyId;
         }
 
-        const freshSession: IHubSession = {
-            sub,
-            organization_id: organizationId,
-            story_id: activeStoryId,
-            stories_hash: SessionService.generateStoriesHash(freshAccess),
-            orgs_hash: SessionService.generateOrgsHash(freshAccess)
-        };
-
         SessionService.storeSession(freshSession, exp);
     };
 
@@ -145,69 +93,35 @@ export default class SessionService {
         Cookies.set(SessionService.SESSION_COOKIE_NAME, cookieData, { domain, expires: expiry });
     };
 
-    public static updateSession = (values: any, auth0Expiry: number): void => {
-        const prevCookieData: IHubSession = SessionService.getSession();
-        const nextCookieData: IHubSession = { ...prevCookieData, ...values };
-
-        if (values.hasOwnProperty('organization_id')) {
-            try {
-                localStorage.setItem(SessionService.LAST_ORG_ID_CACHE, values.organization_id);
-            } catch (e) {
-                console.warn('Failed to cache last organization id selected', e);
-            }
-        }
-
-        if (values.hasOwnProperty('story_id')) {
-            try {
-                localStorage.setItem(SessionService.LAST_STORY_ID_CACHE, values.story_id);
-            } catch (e) {
-                console.warn('Failed to cache last story id selected', e);
-            }
-        }
-
-        SessionService.storeSession(nextCookieData, auth0Expiry);
+    public static cacheOrgId = (organizationId: string, sub): void => {
+        localStorage.setItem(SessionService.LOGIN_ORG_ID_CACHE + sub, organizationId);
     };
 
-    /*
-        Hash org ids on an account so distributed apps can detected if this state changed (i.e new org got added)
-     */
-    public static generateOrgsHash = (accessData: any): number => {
-        const allOrgIdsStringified: string = accessData.organizations.map((o) => o.id).join('');
+    public static clearCachedOrgId = (sub) => {
+        localStorage.removeItem(SessionService.LOGIN_ORG_ID_CACHE + sub);
+    };
 
-        return SessionService.string2Hash(allOrgIdsStringified);
+    public static getCachedOrgId = (sub): string => {
+        return localStorage.getItem(SessionService.LOGIN_ORG_ID_CACHE + sub);
     };
 
-    /*
-        Hash a combination of story ids & names on an account so distributed apps can detect if this state changed
-     */
-    public static generateStoriesHash = (accessData: any): number => {
-        const allStories: any[] = accessData.organizations.reduce(
-            (p, c) => [...p, ...c.stories],
-            []
-        );
-        const allStoriesStringified: string = allStories
-            .map((story) => `${story.id}${story.name}`)
-            .join('');
-
-        return SessionService.string2Hash(allStoriesStringified);
+    public static cacheStoryId = (storyId: string, sub): void => {
+        localStorage.setItem(SessionService.LOGIN_STORY_ID_CACHE + sub, storyId);
     };
 
-    /*
-        Generate hash from string
-     */
-    private static string2Hash = (s: string): number => {
-        let hash: number = 0;
+    public static clearCachedStoryId = (sub): void => {
+        localStorage.removeItem(SessionService.LOGIN_STORY_ID_CACHE + sub);
+    };
 
-        if (s.length === 0) {
-            return hash;
-        }
+    public static getCachedStoryId = (sub): string => {
+        return localStorage.getItem(SessionService.LOGIN_STORY_ID_CACHE + sub);
+    };
 
-        for (let i = 0; i < s.length; i++) {
-            hash = (hash << 5) - hash + s.charCodeAt(i);
-            hash |= 0;
-        }
+    public static updateSession = (values: any, auth0Expiry: number): void => {
+        const prevCookieData: IHubSession = SessionService.getSession();
+        const nextCookieData: IHubSession = { ...prevCookieData, ...values };
 
-        return hash;
+        SessionService.storeSession(nextCookieData, auth0Expiry);
     };
 
     /*

package/src/utils/assets.ts

@@ -1,11 +1,12 @@
 import { HEADER_HEIGHT, PREVIEW_MAX_HEIGHT, PREVIEW_MAX_WIDTH } from '../constants/assets';
+import { CSSProperties } from 'react';
 
 export const getMediaPreviewStyle = (
     mediaWidth: number,
     mediaHeight: number,
     element: any,
     offsetY: number = 0
-): React.CSSProperties => {
+): CSSProperties => {
     if (!element) {
         return;
     }

package/dist/cjs/components/copy-prop-id-button/CopyPropIdButton.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-interface ICopyPropIdButtonProps {
-    copyPropId: string;
-    onNotification?(e: any): void;
-    onError?(e: any): void;
-}
-declare class CopyPropIdButton extends React.PureComponent<ICopyPropIdButtonProps, undefined> {
-    private clickHandler;
-    private copyPropId;
-    render(): React.JSX.Element;
-}
-export default CopyPropIdButton;

package/dist/cjs/components/copy-prop-id-button/CopyPropIdButton.js

@@ -1,75 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var icons_1 = require("../../constants/icons");
-var Button_1 = __importDefault(require("../button/Button"));
-var copy_1 = require("../../constants/copy");
-var CopyPropIdButton = /** @class */ (function (_super) {
-    __extends(CopyPropIdButton, _super);
-    function CopyPropIdButton() {
-        var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
-        _this.clickHandler = function () { return _this.copyPropId(); };
-        return _this;
-    }
-    CopyPropIdButton.prototype.copyPropId = function () {
-        var _a = this.props, onNotification = _a.onNotification, onError = _a.onError, copyPropId = _a.copyPropId;
-        navigator.clipboard.writeText(copyPropId).then(function () {
-            if (onNotification) {
-                onNotification("Property ID copied to clipboard.");
-            }
-        }, function () {
-            if (onError) {
-                onError('Error copying property ID to clipboard.');
-            }
-        });
-    };
-    CopyPropIdButton.prototype.render = function () {
-        return (react_1.default.createElement(Button_1.default, { tooltip: copy_1.compositions.tooltipPropId, onClick: this.clickHandler, size: 'small', style: 'subtle' }, icons_1.ICON_CLIPBOARD));
-    };
-    return CopyPropIdButton;
-}(react_1.default.PureComponent));
-exports.default = CopyPropIdButton;
-//# sourceMappingURL=CopyPropIdButton.js.map

package/dist/cjs/components/copy-prop-id-button/CopyPropIdButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CopyPropIdButton.js","sourceRoot":"","sources":["../../../../src/components/copy-prop-id-button/CopyPropIdButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAC1B,+CAAuD;AACvD,4DAAsC;AACtC,6CAA4D;AAQ5D;IAA+B,oCAAsD;IAArF;;QACY,kBAAY,GAAG,cAAM,OAAA,KAAI,CAAC,UAAU,EAAE,EAAjB,CAAiB,CAAC;;IA6BnD,CAAC;IA3BW,qCAAU,GAAlB;QACU,IAAA,KAA0C,IAAI,CAAC,KAAK,EAAlD,cAAc,oBAAA,EAAE,OAAO,aAAA,EAAE,UAAU,gBAAe,CAAC;QAC3D,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,IAAI,CAC1C;YACI,IAAI,cAAc,EAAE,CAAC;gBACjB,cAAc,CAAC,kCAAkC,CAAC,CAAC;YACvD,CAAC;QACL,CAAC,EACD;YACI,IAAI,OAAO,EAAE,CAAC;gBACV,OAAO,CAAC,yCAAyC,CAAC,CAAC;YACvD,CAAC;QACL,CAAC,CACJ,CAAC;IACN,CAAC;IAEM,iCAAM,GAAb;QACI,OAAO,CACH,8BAAC,gBAAM,IACH,OAAO,EAAE,mBAAI,CAAC,aAAa,EAC3B,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,QAAQ,IACb,sBAAc,CACV,CACZ,CAAC;IACN,CAAC;IACL,uBAAC;AAAD,CAAC,AA9BD,CAA+B,eAAK,CAAC,aAAa,GA8BjD;AAED,kBAAe,gBAAgB,CAAC"}

package/dist/esm/components/copy-prop-id-button/CopyPropIdButton.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-interface ICopyPropIdButtonProps {
-    copyPropId: string;
-    onNotification?(e: any): void;
-    onError?(e: any): void;
-}
-declare class CopyPropIdButton extends React.PureComponent<ICopyPropIdButtonProps, undefined> {
-    private clickHandler;
-    private copyPropId;
-    render(): React.JSX.Element;
-}
-export default CopyPropIdButton;

package/dist/esm/components/copy-prop-id-button/CopyPropIdButton.js

@@ -1,24 +0,0 @@
-import React from 'react';
-import { ICON_CLIPBOARD } from '../../constants/icons';
-import Button from '../button/Button';
-import { compositions as copy } from '../../constants/copy';
-class CopyPropIdButton extends React.PureComponent {
-    clickHandler = () => this.copyPropId();
-    copyPropId() {
-        const { onNotification, onError, copyPropId } = this.props;
-        navigator.clipboard.writeText(copyPropId).then(() => {
-            if (onNotification) {
-                onNotification(`Property ID copied to clipboard.`);
-            }
-        }, () => {
-            if (onError) {
-                onError('Error copying property ID to clipboard.');
-            }
-        });
-    }
-    render() {
-        return (React.createElement(Button, { tooltip: copy.tooltipPropId, onClick: this.clickHandler, size: 'small', style: 'subtle' }, ICON_CLIPBOARD));
-    }
-}
-export default CopyPropIdButton;
-//# sourceMappingURL=CopyPropIdButton.js.map

package/dist/esm/components/copy-prop-id-button/CopyPropIdButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CopyPropIdButton.js","sourceRoot":"","sources":["../../../../src/components/copy-prop-id-button/CopyPropIdButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,YAAY,IAAI,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAQ5D,MAAM,gBAAiB,SAAQ,KAAK,CAAC,aAAgD;IACzE,YAAY,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;IAEvC,UAAU;QACd,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC3D,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,IAAI,CAC1C,GAAG,EAAE;YACD,IAAI,cAAc,EAAE,CAAC;gBACjB,cAAc,CAAC,kCAAkC,CAAC,CAAC;YACvD,CAAC;QACL,CAAC,EACD,GAAG,EAAE;YACD,IAAI,OAAO,EAAE,CAAC;gBACV,OAAO,CAAC,yCAAyC,CAAC,CAAC;YACvD,CAAC;QACL,CAAC,CACJ,CAAC;IACN,CAAC;IAEM,MAAM;QACT,OAAO,CACH,oBAAC,MAAM,IACH,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,QAAQ,IACb,cAAc,CACV,CACZ,CAAC;IACN,CAAC;CACJ;AAED,eAAe,gBAAgB,CAAC"}

package/src/components/assets/AssetsTableGlobalCell.tsx

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { ICON_GLOBE } from '../../constants/icons';
-
-interface IAssetsTableGlobalCell {
-    cell: any; // React table cell wrapper
-}
-
-const AssetsTableGlobalCell: React.FC<IAssetsTableGlobalCell> = (p: IAssetsTableGlobalCell) => {
-    return (
-        <div className='asset-global-cell'>{p.cell.row.original.story_id ? null : ICON_GLOBE}</div>
-    );
-};
-
-const AssetsTableGlobalCellMemoized = React.memo(AssetsTableGlobalCell);
-export default AssetsTableGlobalCellMemoized;

package/src/components/copy-prop-id-button/CopyPropIdButton.tsx

@@ -1,44 +0,0 @@
-import React from 'react';
-import { ICON_CLIPBOARD } from '../../constants/icons';
-import Button from '../button/Button';
-import { compositions as copy } from '../../constants/copy';
-
-interface ICopyPropIdButtonProps {
-    copyPropId: string;
-    onNotification?(e): void;
-    onError?(e): void;
-}
-
-class CopyPropIdButton extends React.PureComponent<ICopyPropIdButtonProps, undefined> {
-    private clickHandler = () => this.copyPropId();
-
-    private copyPropId() {
-        const { onNotification, onError, copyPropId } = this.props;
-        navigator.clipboard.writeText(copyPropId).then(
-            () => {
-                if (onNotification) {
-                    onNotification(`Property ID copied to clipboard.`);
-                }
-            },
-            () => {
-                if (onError) {
-                    onError('Error copying property ID to clipboard.');
-                }
-            }
-        );
-    }
-
-    public render() {
-        return (
-            <Button
-                tooltip={copy.tooltipPropId}
-                onClick={this.clickHandler}
-                size='small'
-                style='subtle'>
-                {ICON_CLIPBOARD}
-            </Button>
-        );
-    }
-}
-
-export default CopyPropIdButton;