@axinom/mosaic-fe-samples-host 0.2.1-rc.8 → 0.2.1

package/CHANGELOG.md

@@ -3,6 +3,15 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+### [0.2.1](https://dev.azure.com/axinom/CMS/_git/Navy/branchCompare?baseVersion=GT@axinom/mosaic-fe-samples-host@0.2.0&targetVersion=GT@axinom/mosaic-fe-samples-host@0.2.1) (2022-11-10)
+
+
+### Bug Fixes
+
+* fe-sample-host active-profile bug fix ([0e7ffd3](https://dev.azure.com/axinom/CMS/_git/Navy/commit/0e7ffd3b6c4f680ee69b38bd3eae793a6158657a))
+
+
+
 ## [0.2.0](https://dev.azure.com/axinom/CMS/_git/Navy/branchCompare?baseVersion=GT@axinom/mosaic-fe-samples-host@0.1.4&targetVersion=GT@axinom/mosaic-fe-samples-host@0.2.0) (2022-10-17)
 
 

package/dist/ScenarioHost/ScenarioHost.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScenarioHost.d.ts","sourceRoot":"","sources":["../../src/ScenarioHost/ScenarioHost.tsx"],"names":[],"mappings":"AACA,OAAO,KAMN,MAAM,OAAO,CAAC;AAaf,OAAO,EAAa,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAChF,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAa7E,oBAAY,iBAAiB,GAAG;IAC9B,SAAS,EAAE,SAAS,oBAAoB,EAAE,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyOpD,CAAC;AAMF,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,SAAS,oBAAoB,EAAE,CAAC;IAC3C,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC,CAAC;IACnC,YAAY,EAAE,MAAM,eAAe,EAAE,CAAC;IACtC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpE,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,QAAO,kBAUlC,CAAC"}
+{"version":3,"file":"ScenarioHost.d.ts","sourceRoot":"","sources":["../../src/ScenarioHost/ScenarioHost.tsx"],"names":[],"mappings":"AAEA,OAAO,KAMN,MAAM,OAAO,CAAC;AAaf,OAAO,EAAa,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAChF,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAW7E,oBAAY,iBAAiB,GAAG;IAC9B,SAAS,EAAE,SAAS,oBAAoB,EAAE,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA0PpD,CAAC;AAMF,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,SAAS,oBAAoB,EAAE,CAAC;IAC3C,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC,CAAC;IACnC,YAAY,EAAE,MAAM,eAAe,EAAE,CAAC;IACtC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpE,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,QAAO,kBAUlC,CAAC"}

package/dist/common/types/user-settings.d.ts

@@ -1,4 +1,5 @@
-export declare type UserSettings = {
+export interface UserSettings {
     loggerPosition: string;
-};
+    activeProfileId: string | undefined;
+}
 //# sourceMappingURL=user-settings.d.ts.map

package/dist/common/types/user-settings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"user-settings.d.ts","sourceRoot":"","sources":["../../../src/common/types/user-settings.ts"],"names":[],"mappings":"AAAA,oBAAY,YAAY,GAAG;IACzB,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC"}
+{"version":3,"file":"user-settings.d.ts","sourceRoot":"","sources":["../../../src/common/types/user-settings.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,YAAY;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC;CACrC"}

package/dist/common/utils/storage-utils.d.ts

@@ -28,6 +28,4 @@ export declare const setUserSettings: (value: UserSettings) => void;
  * Generate a Short ID with the given length. The ID will be in hexadecimal.
  */
 export declare const generateShortUniqueId: (length?: number) => string;
-export declare const getActiveProfileId: () => string;
-export declare const setActiveProfileId: (value: string | number | boolean | (string | number | boolean)[] | undefined) => void;
 //# sourceMappingURL=storage-utils.d.ts.map

package/dist/common/utils/storage-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"storage-utils.d.ts","sourceRoot":"","sources":["../../../src/common/utils/storage-utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AACzE,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAMtD;;;;;;GAMG;AACH,eAAO,MAAM,+BAA+B,YAkD3C,CAAC;AAEF,eAAO,MAAM,cAAc,QAAO,aAAa,EAE9C,CAAC;AAEF,eAAO,MAAM,eAAe,aAAc,aAAa,EAAE,KAAG,IAO3D,CAAC;AAEF,eAAO,MAAM,WAAW,kBAAmB,aAAa,KAAG,IAe1D,CAAC;AAEF,eAAO,MAAM,kBAAkB,eACpB,aAAa,OACjB,MAAM,MAGZ,CAAC;AAEF,eAAO,MAAM,mBAAmB,YACrB,aAAa,KACrB,eAAe,EAEjB,CAAC;AAEF,eAAO,MAAM,kBAAkB,YACpB,aAAa,OACjB,MAAM,SACJ,OAAO,WACL,MAAM,KACd,IAYF,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,oCAAoC,YAQhD,CAAC;AAEF,eAAO,MAAM,eAAe,QAAO,YAMlC,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,YAAY,KAAG,IAErD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,YAAY,MAAM,WAKnD,CAAC;AAEF,eAAO,MAAM,kBAAkB,QAAO,MAErC,CAAC;AAEF,eAAO,MAAM,kBAAkB,UACtB,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,EAAE,GAAG,SAAS,KAC3E,IAEF,CAAC"}
+{"version":3,"file":"storage-utils.d.ts","sourceRoot":"","sources":["../../../src/common/utils/storage-utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AACzE,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAKtD;;;;;;GAMG;AACH,eAAO,MAAM,+BAA+B,YAkD3C,CAAC;AAEF,eAAO,MAAM,cAAc,QAAO,aAAa,EAE9C,CAAC;AAEF,eAAO,MAAM,eAAe,aAAc,aAAa,EAAE,KAAG,IAO3D,CAAC;AAEF,eAAO,MAAM,WAAW,kBAAmB,aAAa,KAAG,IAe1D,CAAC;AAEF,eAAO,MAAM,kBAAkB,eACpB,aAAa,OACjB,MAAM,MAGZ,CAAC;AAEF,eAAO,MAAM,mBAAmB,YACrB,aAAa,KACrB,eAAe,EAEjB,CAAC;AAEF,eAAO,MAAM,kBAAkB,YACpB,aAAa,OACjB,MAAM,SACJ,OAAO,WACL,MAAM,KACd,IAYF,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,oCAAoC,YAYhD,CAAC;AAEF,eAAO,MAAM,eAAe,QAAO,YAMlC,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,YAAY,KAAG,IAErD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,YAAY,MAAM,WAKnD,CAAC"}

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import React, { isValidElement, createElement, Component, forwardRef, useState, useImperativeHandle, createContext, useContext, useRef, useEffect } from 'react';
+import React, { isValidElement, createElement, Component, forwardRef, useState, useImperativeHandle, createContext, useContext, useRef, useCallback, useEffect } from 'react';
 import { useLocation, Link, Switch, Route, useHistory, NavLink, BrowserRouter } from 'react-router-dom';
 import { Grid, Segment, Header, Select, Button, Divider, List, Tab, Form, Dropdown, Search } from 'semantic-ui-react';
 
@@ -140,7 +140,6 @@ var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
 
 const KEY_PROFILE_DATA = 'AX_PROFILE_DATA';
 const KEY_USER_SETTINGS = 'AX_USER_SETTINGS';
-const KEY_ACTIVE_PROFILE = 'AX_ACTIVE_PROFILE';
 /**
  * The structure of the `ProfileConfig` type maintained in code can undergo several structural changes overtime.
  * However, there may exist objects that were created using prior versions of the type persisted on client local-storages.
@@ -223,10 +222,13 @@ const setProfileVariable = (profile, key, value, comment) => {
  * latest `UserSettings` type in code by substituting reasonable defaults where necessary and eliminating obsolete properties.
  */
 const migrateUserSettingsStructuralChanges = () => {
-    var _a;
+    var _a, _b;
     const existingUserSettings = getUserSettings();
+    const allProfiles = getAllProfiles();
+    const firstProfileId = allProfiles.length > 0 ? allProfiles[0].id : undefined;
     const migratedUserSettings = {
         loggerPosition: (_a = existingUserSettings.loggerPosition) !== null && _a !== void 0 ? _a : '70%',
+        activeProfileId: (_b = existingUserSettings.activeProfileId) !== null && _b !== void 0 ? _b : firstProfileId,
     };
     setUserSettings(migratedUserSettings);
 };
@@ -243,12 +245,6 @@ const setUserSettings = (value) => {
 const generateShortUniqueId = (length = 8) => {
     const randomId = Math.floor(Math.random() * Math.pow(16, length)).toString(16);
     return ('0'.repeat(length - randomId.length) + randomId).toUpperCase();
-};
-const getActiveProfileId = () => {
-    return JSON.parse(localStorage.getItem(KEY_ACTIVE_PROFILE) || '');
-};
-const setActiveProfileId = (value) => {
-    localStorage.setItem(KEY_ACTIVE_PROFILE, JSON.stringify(value));
 };
 
 /**
@@ -297,22 +293,37 @@ const ScenarioHost = ({ scenarios }) => {
     var _a;
     const groupedScenarios = getGroupedScenarios(scenarios);
     const { pathname } = useLocation();
+    const [userSettings] = useState(getUserSettings());
     const [profiles] = useState(getAllProfiles());
-    const [activeProfile, setActiveProfile] = useState(profiles.length > 0 ? profiles[0] : undefined);
+    /**
+     * We read the `activeProfileId` from the UserSettings saved in the local-storage, and check if that exists
+     * in the `profiles` found in the local-storage.
+     *
+     * If there is a match, we return the profile matching to that ID, if not, we either return `undefined`
+     * or return the 1st profile in the array.
+     */
+    const getActiveProfileFromUserSettings = () => {
+        if (profiles.length > 0) {
+            const activeProfileIndex = profiles.findIndex((profile) => profile.id === userSettings.activeProfileId);
+            if (activeProfileIndex < 0) {
+                return profiles[0];
+            }
+            else {
+                return profiles[activeProfileIndex];
+            }
+        }
+        else {
+            return undefined;
+        }
+    };
+    const [activeProfile, setActiveProfile] = useState(getActiveProfileFromUserSettings());
     // Reference to the logger component. This can be used to log new messages.
     const loggerRef = useRef(null);
-    const handleProfileChanged = (event, data) => {
+    const handleProfileChanged = useCallback((event, data) => {
         const activeProfileIndex = profiles.findIndex((profile) => profile.id === data.value);
         setActiveProfile(profiles[activeProfileIndex]);
-        setActiveProfileId(data.value);
-    };
-    useEffect(() => {
-        const storageProfileId = getActiveProfileId();
-        if (storageProfileId !== (activeProfile === null || activeProfile === void 0 ? void 0 : activeProfile.id)) {
-            const activeProfileIndex = profiles.findIndex((profile) => profile.id === storageProfileId);
-            setActiveProfile(profiles[activeProfileIndex]);
-        }
-    }, [activeProfile === null || activeProfile === void 0 ? void 0 : activeProfile.id, profiles]);
+        setUserSettings(Object.assign(Object.assign({}, userSettings), { activeProfileId: profiles[activeProfileIndex].id }));
+    }, [profiles, userSettings]);
     const ScenarioErrorFallback = (info) => {
         return (React.createElement(Segment, { basic: true },
             React.createElement(Header, { size: "huge" }, "Something went wrong"),