@imposium-hub/components 1.45.5 → 1.46.1

package/src/services/Auth0.ts

@@ -1,16 +1,16 @@
 import * as auth0 from 'auth0-js';
 
 export interface IIdentity {
-    accessToken : string;
-    expiry : number;
-    expiresIn : number;
-    idToken : string;
-    tokenType : string;
-    idTokenPayload : any;
+    accessToken: string;
+    expiry: number;
+    expiresIn: number;
+    idToken: string;
+    tokenType: string;
+    idTokenPayload: any;
 }
 
 export default class AuthService {
-    private static readonly IMPOSIUM_APP_DEFAULTS : any = {
+    private static readonly IMPOSIUM_APP_DEFAULTS: any = {
         domain: 'imposium.auth0.com',
         scope: 'openid',
         responseType: 'token id_token',
@@ -18,43 +18,43 @@ export default class AuthService {
     };
 
     // Auth0 JS client
-    private static auth0Client : auth0.WebAuth;
+    private static auth0Client: auth0.WebAuth;
 
     /*
         Initialize the auth0 web client with client ID for a given app-wrapper
      */
-    public static bindToClient = (clientID : string) : void => {
+    public static bindToClient = (clientID: string): void => {
         AuthService.auth0Client = new auth0.WebAuth({
             clientID,
             ...AuthService.IMPOSIUM_APP_DEFAULTS
         });
-    }
+    };
 
     /*
         redirect to auth0 for login
      */
-    public static login = () : void => {
+    public static login = (): void => {
         AuthService.auth0Client.authorize();
-    }
+    };
 
     /*
         Re-direct to auth0 to cancel session & instruct auth0 to redirect back to login
      */
-    public static logout = () : void => {
-        AuthService.auth0Client.logout({returnTo: `${window.location.origin}/auth`});
-    }
+    public static logout = (): void => {
+        AuthService.auth0Client.logout({ returnTo: `${window.location.origin}/auth` });
+    };
 
     /*
         Validate auth0 expiry timestamp
      */
-    public static checkExpiry = (expiry : number) : boolean => (expiry > Date.now().valueOf() / 1000);
+    public static checkExpiry = (expiry: number): boolean => expiry > Date.now().valueOf() / 1000;
 
     /*
         Parse out identity from hash
      */
-    public static parseIdFromHash = (hash : string) : Promise<IIdentity> => {
+    public static parseIdFromHash = (hash: string): Promise<IIdentity> => {
         return new Promise((resolve, reject) => {
-            AuthService.auth0Client.parseHash({options: hash}, (e : Error, id : IIdentity) => {
+            AuthService.auth0Client.parseHash({ options: hash }, (e: Error, id: IIdentity) => {
                 if (!e) {
                     resolve(id);
                 } else {
@@ -62,14 +62,14 @@ export default class AuthService {
                 }
             });
         });
-    }
+    };
 
     /*
         Defer to auth0 web servers to check if users session is valid
      */
-    public static checkSession = () : Promise<IIdentity | Error> => {
+    public static checkSession = (): Promise<IIdentity | Error> => {
         return new Promise((resolve, reject) => {
-            AuthService.auth0Client.checkSession({}, (e : Error, id : IIdentity) => {
+            AuthService.auth0Client.checkSession({}, (e: Error, id: IIdentity) => {
                 if (!e) {
                     resolve(id);
                 } else {
@@ -77,5 +77,5 @@ export default class AuthService {
                 }
             });
         });
-    }
+    };
 }

package/src/services/Session.ts

@@ -1,21 +1,21 @@
 import * as Cookies from 'js-cookie';
-import axios, {AxiosResponse, AxiosError} from 'axios';
-import {IIdentity} from './Auth0';
+import axios, { AxiosResponse, AxiosError } from 'axios';
+import { IIdentity } from './Auth0';
 
 export interface IHubSession {
-    sub : string;
-    organization_id : string;
-    story_id : string;
-    stories_hash : number;
-    orgs_hash : number;
+    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 LAST_ORG_ID_CACHE : string = 'imp_hub_last_org_id';
-    private static readonly SESSION_COOKIE_NAME : string = 'auth_state';
+    private static readonly LAST_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 SESSION_COOKIE_NAME: string = 'auth_state';
 
-    private static readonly FRESH_COOKIE : IHubSession = {
+    private static readonly FRESH_COOKIE: IHubSession = {
         sub: '',
         organization_id: '',
         story_id: '',
@@ -26,37 +26,40 @@ export default class SessionService {
     /*
         Get list of accessible services with themes from Imposium API
     */
-    public static getAccessData = (idToken : string, baseUrl? : string) : Promise<any[]> => {
+    public static getAccessData = (idToken: string, baseUrl?: string): Promise<any[]> => {
         return new Promise((resolve, reject) => {
+            const accessUrl = baseUrl ? `${baseUrl}/access` : SessionService.determineAccessUrl();
 
-            const accessUrl = (baseUrl) ? `${baseUrl}/access` : SessionService.determineAccessUrl();
-
-            axios.get(accessUrl, {headers: {Authorization: `Bearer ${idToken}`}})
-                .then((res : AxiosResponse) => {
-                    resolve((res.data) ? res.data : []);
+            axios
+                .get(accessUrl, { headers: { Authorization: `Bearer ${idToken}` } })
+                .then((res: AxiosResponse) => {
+                    resolve(res.data ? res.data : []);
                 })
-                .catch((e : AxiosError) => {
+                .catch((e: AxiosError) => {
                     reject(e);
                 });
         });
-    }
+    };
 
-    public static getSession = () : IHubSession => Cookies.getJSON(SessionService.SESSION_COOKIE_NAME);
+    public static getSession = (): IHubSession =>
+        Cookies.getJSON(SessionService.SESSION_COOKIE_NAME);
 
-    public static removeSession = () : void => {
-        const domain : string = SessionService.scrapeDomain();
-        Cookies.remove(SessionService.SESSION_COOKIE_NAME, {domain});
-    }
+    public static removeSession = (): void => {
+        const domain: string = SessionService.scrapeDomain();
+        Cookies.remove(SessionService.SESSION_COOKIE_NAME, { domain });
+    };
 
-    public static buildFreshSession = (freshIdentity : IIdentity, freshAccess : any) : void => {
-        const {idTokenPayload: {sub, exp}} = freshIdentity;
-        const {organizations} = freshAccess;
+    public static buildFreshSession = (freshIdentity: IIdentity, freshAccess: any): void => {
+        const {
+            idTokenPayload: { sub, exp }
+        } = freshIdentity;
+        const { organizations } = freshAccess;
 
-        let cachedOrganizationId : string;
-        let cachedStoryId : string;
-        let organizationId : string = '';
-        let activeStoryId : string = '';
-        let activeOrg : any;
+        let cachedOrganizationId: string;
+        let cachedStoryId: string;
+        let organizationId: string = '';
+        let activeStoryId: string = '';
+        let activeOrg: any;
 
         try {
             cachedOrganizationId = localStorage.getItem(SessionService.LAST_ORG_ID_CACHE);
@@ -67,7 +70,7 @@ export default class SessionService {
 
         // Check if org exists in access data fetched from imposium
         if (cachedOrganizationId) {
-            activeOrg = freshAccess.organizations.find((o : any) => (o.id === cachedOrganizationId));
+            activeOrg = freshAccess.organizations.find((o: any) => o.id === cachedOrganizationId);
 
             if (typeof activeOrg === 'object' && activeOrg.hasOwnProperty('id')) {
                 organizationId = cachedOrganizationId;
@@ -79,7 +82,7 @@ export default class SessionService {
         if (
             cachedStoryId &&
             organizationId &&
-            activeOrg.stories.find((s : any) => (s.id === cachedStoryId))
+            activeOrg.stories.find((s: any) => s.id === cachedStoryId)
         ) {
             activeStoryId = cachedStoryId;
         }
@@ -104,7 +107,7 @@ export default class SessionService {
             activeStoryId = organizations[0].stories[0].id;
         }
 
-        const freshSession :IHubSession = {
+        const freshSession: IHubSession = {
             sub,
             organization_id: organizationId,
             story_id: activeStoryId,
@@ -113,19 +116,19 @@ export default class SessionService {
         };
 
         SessionService.storeSession(freshSession, exp);
-    }
+    };
 
-    public static storeSession = (values : any, auth0Expiry : number) : void => {
-        const cookieData : IHubSession = {...SessionService.FRESH_COOKIE, ...values};
-        const domain : string = SessionService.scrapeDomain();
-        const expiry : Date = new Date(auth0Expiry * 1000);
+    public static storeSession = (values: any, auth0Expiry: number): void => {
+        const cookieData: IHubSession = { ...SessionService.FRESH_COOKIE, ...values };
+        const domain: string = SessionService.scrapeDomain();
+        const expiry: Date = new Date(auth0Expiry * 1000);
 
-        Cookies.set(SessionService.SESSION_COOKIE_NAME, cookieData, {domain, expires: expiry});
-    }
+        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};
+    public static updateSession = (values: any, auth0Expiry: number): void => {
+        const prevCookieData: IHubSession = SessionService.getSession();
+        const nextCookieData: IHubSession = { ...prevCookieData, ...values };
 
         if (values.hasOwnProperty('organization_id')) {
             try {
@@ -144,58 +147,65 @@ export default class SessionService {
         }
 
         SessionService.storeSession(nextCookieData, auth0Expiry);
-    }
+    };
 
     /*
         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 generateOrgsHash = (accessData: any): number => {
+        const allOrgIdsStringified: string = accessData.organizations.map((o) => o.id).join('');
 
         return SessionService.string2Hash(allOrgIdsStringified);
-    }
+    };
 
     /*
         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('');
+    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);
-    }
+    };
 
     /*
         Generate hash from string
      */
-    private static string2Hash = (s : string) : number => {
-        let hash : number = 0;
+    private static string2Hash = (s: string): number => {
+        let hash: number = 0;
 
         if (s.length === 0) {
             return hash;
         }
 
         for (let i = 0; i < s.length; i++) {
-            hash = ((hash << 5) - hash) + s.charCodeAt(i);
+            hash = (hash << 5) - hash + s.charCodeAt(i);
             hash |= 0;
         }
 
         return hash;
-    }
+    };
 
     /*
         Determine which domain to assign cookie to
      */
-    private static scrapeDomain = () : string => {
-        const domainParts : string[] = window.location.host.split('.').reverse();
-        return (domainParts.length > 2) ? `.${domainParts[1]}.${domainParts[0].split(':')[0]}` : null;
-    }
+    private static scrapeDomain = (): string => {
+        const domainParts: string[] = window.location.host.split('.').reverse();
+        return domainParts.length > 2 ? `.${domainParts[1]}.${domainParts[0].split(':')[0]}` : null;
+    };
 
     /*
         Figure out which access endpoint to hit based on env
     */
-    private static determineAccessUrl = () : string => {
-        const {location: {hostname, host}} = window;
+    private static determineAccessUrl = (): string => {
+        const {
+            location: { hostname, host }
+        } = window;
 
         if (hostname === 'localhost') {
             return 'https://api/access';
@@ -204,5 +214,5 @@ export default class SessionService {
         } else {
             return 'https://api.imposium.com/access';
         }
-    }
+    };
 }

package/src/services/Storage.ts

@@ -1,27 +1,29 @@
 import * as localForage from 'localforage';
 
 export default class StorageService {
-    public static setItem = (key : string, value : any) : Promise<Error> => {
+    public static setItem = (key: string, value: any): Promise<Error> => {
         return new Promise<any>((resolve, reject) => {
-            localForage.setItem(key, value)
+            localForage
+                .setItem(key, value)
                 .then(() => resolve(null))
-                .catch((e : Error) => {
+                .catch((e: Error) => {
                     console.error('Failed to store key value pair:', e);
                     reject(e);
                 });
         });
-    }
+    };
 
-    public static getItem = (key : string) : Promise<any | Error> => {
+    public static getItem = (key: string): Promise<any | Error> => {
         return new Promise((resolve, reject) => {
-            localForage.getItem(key)
-                .then((value : any) => {
+            localForage
+                .getItem(key)
+                .then((value: any) => {
                     resolve(value);
                 })
-                .catch((e : Error) => {
+                .catch((e: Error) => {
                     console.error('Failed to look up value for key:', e);
                     reject(e);
                 });
         });
-    }
+    };
 }

package/src/services/Timer.ts

@@ -1,29 +1,24 @@
-
 interface ITimerConfig {
-    interval : number;
-    onUpdate(time : number) : void;
+    interval: number;
+    onUpdate(time: number): void;
 }
 
 export default class Timer {
+    private timeInterval: any;
+    private config: any;
+    private startTime: number;
+    public running: boolean;
 
-    private timeInterval : any;
-    private config : any;
-    private startTime : number;
-    public running : boolean;
-
-    constructor(config : ITimerConfig) {
-
+    constructor(config: ITimerConfig) {
         this.config = config;
     }
 
     public stop() {
-
         this.running = false;
         clearInterval(this.timeInterval);
     }
 
     public start() {
-
         this.running = true;
         clearInterval(this.timeInterval);
         this.startTime = Date.now();
@@ -31,7 +26,6 @@ export default class Timer {
     }
 
     private updateTimeElapsed() {
-
         const now = Date.now();
         const timeElapsed = now - this.startTime;
         this.config.onUpdate(timeElapsed);

package/src/utils/routing.ts

@@ -1,6 +1,7 @@
-export const getDemoURL = () : string => {
-
-    const {location: {href}} = window;
+export const getDemoURL = (): string => {
+    const {
+        location: { href }
+    } = window;
 
     if (href.indexOf('localhost') !== -1) {
         return 'http://localhost:3044';

package/src/utils/template-generator.ts

@@ -2,21 +2,21 @@ import axios, { AxiosRequestConfig } from 'axios';
 import { saveAs } from 'file-saver';
 
 export interface ISDKArchiveBody {
-    storyId : string;
-    compositionId : string;
-    accessToken : string;
-    storyName : string;
-    inventory : any;
+    storyId: string;
+    compositionId: string;
+    accessToken: string;
+    storyName: string;
+    inventory: any;
 }
 
-const DEFAULT_GENERATOR_REQ_CONFIG : any = {
+const DEFAULT_GENERATOR_REQ_CONFIG: any = {
     method: 'POST',
     responseType: 'blob',
-    headers: {'Content-Type': 'application/json'}
+    headers: { 'Content-Type': 'application/json' }
 };
 
-export const downloadSDKArchive = (archiveName : string, config : ISDKArchiveBody) : void => {
-    const request : AxiosRequestConfig = {
+export const downloadSDKArchive = (archiveName: string, config: ISDKArchiveBody): void => {
+    const request: AxiosRequestConfig = {
         ...DEFAULT_GENERATOR_REQ_CONFIG,
         url: 'https://template-generator.imposium.com/sdk-archive',
         data: JSON.stringify(config)

package/tsconfig.json

@@ -12,8 +12,8 @@
         "lib": ["es6", "dom", "es2016", "es2017"],
         "declaration": true,
         "moduleResolution": "node",
-        "suppressImplicitAnyIndexErrors": true,
+        "suppressImplicitAnyIndexErrors": true
     },
     "include": ["src"],
     "exclude": ["node_modules", "dist"]
-}
+}

package/.storybook/main.js

@@ -1,16 +0,0 @@
-module.exports = {
-  "stories": [
-    "../src/**/*.stories.mdx",
-    "../src/**/*.stories.@(js|jsx|ts|tsx)"
-  ],
-  "addons": [
-    "@storybook/addon-storysource",
-    "@storybook/addon-docs",
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-actions",
-    "@storybook/addon-interactions",
-    "storybook-dark-mode"
-  ],
-  "framework": "@storybook/react"
-}

package/.storybook/preview-body.html

@@ -1 +0,0 @@
-<div id = 'tooltips'></div>

package/.storybook/preview-head.html

@@ -1,5 +0,0 @@
-<style>
-    .sb-show-main{
-        padding:25px;
-    }
-</style>

package/.storybook/preview.js

@@ -1,11 +0,0 @@
-import '../dist/styles.css';
-
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-  controls: {
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/,
-    },
-  },
-}