@finsemble/finsemble-ui 6.6.1 → 7.0.0-beta-X

package/react/components/sdd/EditPreload.js

@@ -3,11 +3,18 @@ import "../common/css/preload-edit-page.css";
 import { FinsembleSelect } from "../common/FinsembleSelect";
 import { Button } from "../common/Button";
 import { useSelector } from "../../store";
-const isAliasValid = (alias) => {
+const validAliasRegex = new RegExp("^[a-zA-Z0-9-]+$");
+const getAliasInvalidMessage = (alias, preloads, currentAlias) => {
     if (alias === "") {
-        return false;
+        return "";
     }
-    return true;
+    if (alias.match(validAliasRegex) === null) {
+        return "Name can only use letters, numbers, and dashes.";
+    }
+    if (alias !== currentAlias && alias in preloads) {
+        return "Name is already being used.";
+    }
+    return "";
 };
 const isUrlValid = (url) => {
     let valid = true;
@@ -31,14 +38,27 @@ const breakOut = (apps) => {
         appNameValues,
     };
 };
+/**
+ * Preloads can be set in config as a string, array of strings or a boolean.
+ * This function converts any valid format to an array of string.
+ */
+const preloadAsArray = (currentPreload) => {
+    if (typeof currentPreload === "string") {
+        return [currentPreload];
+    }
+    if (typeof currentPreload === "boolean") {
+        return [];
+    }
+    return currentPreload !== null && currentPreload !== void 0 ? currentPreload : [];
+};
 export const EditPreload = (props) => {
     var _a, _b, _c, _d;
     const preloads = useSelector((state) => state.smartDesktopDesigner.preloads);
     const [alias, setAlias] = useState(props.alias);
-    const aliasValid = isAliasValid(alias);
+    const aliasInvalidMessage = getAliasInvalidMessage(alias, preloads, props.alias);
     const [url, setUrl] = useState((_b = (_a = preloads[alias]) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : "");
     const urlValid = isUrlValid(url);
-    const disableSubmit = !(aliasValid && urlValid);
+    const disableSubmit = !(alias !== "" && aliasInvalidMessage === "" && urlValid);
     const [usageType, setUsageType] = useState((_d = (_c = preloads[alias]) === null || _c === void 0 ? void 0 : _c.autoload) !== null && _d !== void 0 ? _d : "none");
     const [appList, setAppList] = useState([]);
     const { appNameList, appNameValues } = breakOut(appList);
@@ -54,36 +74,39 @@ export const EditPreload = (props) => {
         props.getApps().then(({ apps }) => {
             setAppList(apps);
             if (props.alias !== "") {
-                setSelectedApps(apps.filter((app) => { var _a, _b, _c; return (_c = (_b = (_a = app.manifest) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.preload) === null || _c === void 0 ? void 0 : _c.includes(props.alias); }).map((app) => app.appId));
+                setSelectedApps(apps
+                    .filter((app) => { var _a, _b, _c; return (_c = preloadAsArray((_b = (_a = app.manifest) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.preload)) === null || _c === void 0 ? void 0 : _c.includes(props.alias); })
+                    .map((app) => app.appId));
             }
         });
     };
     const updateAppConfigs = async () => {
         const isRenaming = props.alias !== alias;
         const promises = appList.map((app) => {
-            var _a, _b, _c;
+            var _a, _b;
             app.manifest = (_a = app.manifest) !== null && _a !== void 0 ? _a : {};
             app.manifest.component = (_b = app.manifest.component) !== null && _b !== void 0 ? _b : {};
-            app.manifest.component.preload = (_c = app.manifest.component.preload) !== null && _c !== void 0 ? _c : [];
-            if (typeof app.manifest.component.preload === "string") {
-                app.manifest.component.preload = [app.manifest.component.preload];
-            }
+            app.manifest.component.preload = preloadAsArray(app.manifest.component.preload);
             const index = app.manifest.component.preload.indexOf(props.alias);
             const wasPreloadInThisApp = index >= 0;
             const isPreloadInThisApp = selectedApps.includes(app.appId);
+            // This preload was assigned to this app, but is no longer
             if (wasPreloadInThisApp && !isPreloadInThisApp) {
                 app.manifest.component.preload.splice(index, 1);
                 return props.updateApp(app.appId, app);
             }
+            // This preload was not assigned to this app, but now is
             if (!wasPreloadInThisApp && isPreloadInThisApp) {
                 app.manifest.component.preload.push(alias);
                 return props.updateApp(app.appId, app);
             }
+            // This preload continues to be assigned, but has been renamed
             if (wasPreloadInThisApp && isPreloadInThisApp && isRenaming) {
                 app.manifest.component.preload.splice(index, 1);
                 app.manifest.component.preload.push(alias);
                 return props.updateApp(app.appId, app);
             }
+            // No change to this app
             return new Promise((resolve) => {
                 resolve({ err: null });
             });
@@ -93,6 +116,8 @@ export const EditPreload = (props) => {
     useEffect(() => {
         updateAppList();
     }, []);
+    // Using `key` is a sort of hack to help re-generate FinsembleSelect, after updating appList
+    // @todo - Get FinsembleSelect to respect props changes. At that point, this key hack will be unnecessary
     useEffect(() => {
         setKey(`${Date.now()}.${Math.random()}`);
     }, [appList, selectedApps]);
@@ -105,34 +130,36 @@ export const EditPreload = (props) => {
                         React.createElement("th", null,
                             React.createElement("label", { htmlFor: "preload-alias" }, "Name")),
                         React.createElement("td", { className: "edit-field" },
-                            React.createElement("input", { type: "text", id: "preload-alias", value: alias, "aria-invalid": alias !== "" && !aliasValid, placeholder: "Untitled preload", onChange: (e) => {
+                            React.createElement("input", { type: "text", id: "preload-alias", value: alias, "aria-invalid": alias !== "" && aliasInvalidMessage !== "", "aria-errormessage": "preload-alias-error-message", placeholder: "Untitled preload", onChange: (e) => {
                                     setAlias(e.target.value);
-                                } }))),
+                                } }),
+                            aliasInvalidMessage && (React.createElement("div", { id: "preload-alias-error-message", className: "invalid-message" }, aliasInvalidMessage)))),
                     React.createElement("tr", null,
                         React.createElement("th", null,
                             React.createElement("label", { htmlFor: "preload-url" }, "Web URL")),
                         React.createElement("td", { className: "edit-field" },
-                            React.createElement("input", { type: "text", id: "preload-url", value: url, "aria-invalid": url !== "" && !urlValid, onChange: (e) => {
+                            React.createElement("input", { type: "text", id: "preload-url", value: url, "aria-invalid": url !== "" && !urlValid, "aria-errormessage": "preload-url-error-message", onChange: (e) => {
                                     setUrl(e.target.value);
-                                } }))),
+                                } }),
+                            url !== "" && !urlValid && (React.createElement("div", { id: "preload-url-error-message", className: "invalid-message" }, "URL must be valid (e.g., https://cosaic.io/). Only http and https prototcols are supported.")))),
                     React.createElement("tr", null,
-                        React.createElement("th", { className: "table-header__top-label" }, "Load for"),
+                        React.createElement("th", { className: "table-header__top-label", id: "load-label" }, "Load for"),
                         React.createElement("td", null,
                             React.createElement("div", { className: "load-option" },
                                 React.createElement("label", null,
-                                    React.createElement("input", { type: "radio", name: "preload-usage", value: "launchable", checked: usageType === "launchable", onChange: onRadioChange }),
+                                    React.createElement("input", { type: "radio", name: "preload-usage", "aria-labelledby": "load-label load-label-launchable", value: "launchable", "aria-posinset": 1, "aria-setsize": 3, checked: usageType === "launchable", onChange: onRadioChange }),
                                     " ",
-                                    "Apps launched by users")),
+                                    React.createElement("span", { id: "load-label-launchable" }, "Apps launched by users"))),
                             React.createElement("div", { className: "load-option" },
                                 React.createElement("label", null,
-                                    React.createElement("input", { type: "radio", name: "preload-usage", value: "all", checked: usageType === "all", onChange: onRadioChange }),
+                                    React.createElement("input", { type: "radio", name: "preload-usage", "aria-labelledby": "load-label load-label-all", value: "all", "aria-posinset": 2, "aria-setsize": 3, checked: usageType === "all", onChange: onRadioChange }),
                                     " ",
-                                    "All apps")),
+                                    React.createElement("span", { id: "load-label-all" }, "All apps"))),
                             React.createElement("div", { className: "load-option" },
                                 React.createElement("label", null,
-                                    React.createElement("input", { type: "radio", name: "preload-usage", value: "none", checked: usageType === "none", onChange: onRadioChange }),
+                                    React.createElement("input", { type: "radio", name: "preload-usage", "aria-labelledby": "load-label load-label-select", value: "none", "aria-posinset": 3, "aria-setsize": 3, checked: usageType === "none", onChange: onRadioChange }),
                                     " ",
-                                    "Select apps")),
+                                    React.createElement("span", { id: "load-label-select" }, "Select apps"))),
                             usageType === "none" && (React.createElement(FinsembleSelect, { key: key, options: appNameList, values: appNameValues, selected: selectedApps, updateCallback: selectChange, showSearch: true }))))))),
         React.createElement("div", { className: "preload-edit-actions" },
             React.createElement("div", null, props.alias && (React.createElement(Button, { fashion: "danger", text: "Remove preload", onClick: async (e) => {

package/react/components/sdd/EditPreload.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditPreload.js","sourceRoot":"","sources":["../../../src/components/sdd/EditPreload.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ChangeEvent, useEffect, useState } from \"react\";\nimport \"../common/css/preload-edit-page.css\";\nimport { FinsembleSelect } from \"../common/FinsembleSelect\";\nimport { Button } from \"../common/Button\";\nimport { PreloadDetail, PreloadMap, preloadUsageType } from \"../../types/smartDesktopDesignerTypes\";\nimport { AppDefinition } from \"./Application\";\nimport { useDispatch, useSelector } from \"../../store\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\n\nexport interface EditPreloadProps {\n\talias: string;\n\tcancel: () => void;\n\tsubmit: (oldAlias: string | null, newAlias: string, detail: PreloadDetail) => Promise<void>;\n\tgetApps: typeof FSBL.Clients.SmartDesktopClient.prototype.getApps;\n\tupdateApp: typeof FSBL.Clients.SmartDesktopClient.prototype.updateApp;\n\tdeletePreload: typeof FSBL.Clients.SmartDesktopClient.prototype.deletePreload;\n}\n\nconst isAliasValid = (alias: string) => {\n\tif (alias === \"\") {\n\t\treturn false;\n\t}\n\n\treturn true;\n};\n\nconst isUrlValid = (url: string) => {\n\tlet valid = true;\n\ttry {\n\t\tnew URL(url);\n\t} catch (e) {\n\t\tvalid = false;\n\t}\n\treturn valid;\n};\n\nconst breakOut = (apps: AppDefinition[]) => {\n\tconst appNameList: string[] = [];\n\tconst appNameValues: string[] = [];\n\n\tapps.forEach((app: AppDefinition) => {\n\t\tappNameList.push(app.name);\n\t\tappNameValues.push(app.appId);\n\t});\n\n\treturn {\n\t\tappNameList,\n\t\tappNameValues,\n\t};\n};\n\nexport const EditPreload: React.FunctionComponent<EditPreloadProps> = (props) => {\n\tconst preloads = useSelector((state: RootState) => state.smartDesktopDesigner.preloads);\n\n\tconst [alias, setAlias] = useState(props.alias);\n\tconst aliasValid = isAliasValid(alias);\n\n\tconst [url, setUrl] = useState(preloads[alias]?.url ?? \"\");\n\tconst urlValid = isUrlValid(url);\n\n\tconst disableSubmit = !(aliasValid && urlValid);\n\n\tconst [usageType, setUsageType] = useState<preloadUsageType>(preloads[alias]?.autoload ?? \"none\");\n\tconst [appList, setAppList] = useState<AppDefinition[]>([]);\n\tconst { appNameList, appNameValues } = breakOut(appList);\n\tconst [selectedApps, setSelectedApps] = useState<string[]>([]);\n\tconst [key, setKey] = useState(`${Date.now()}.${Math.random()}`);\n\n\tconst onRadioChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tsetUsageType(e.target.value as preloadUsageType);\n\t};\n\n\tconst selectChange = (selectedValues: string[]) => {\n\t\tsetSelectedApps(selectedValues);\n\t};\n\n\tconst updateAppList = () => {\n\t\tprops.getApps().then(({ apps }: { apps: AppDefinition[] }) => {\n\t\t\tsetAppList(apps);\n\t\t\tif (props.alias !== \"\") {\n\t\t\t\tsetSelectedApps(\n\t\t\t\t\tapps.filter((app) => app.manifest?.component?.preload?.includes(props.alias)).map((app) => app.appId)\n\t\t\t\t);\n\t\t\t}\n\t\t});\n\t};\n\n\tconst updateAppConfigs = async () => {\n\t\tconst isRenaming = props.alias !== alias;\n\t\tconst promises: Promise<any>[] = appList.map((app) => {\n\t\t\tapp.manifest = app.manifest ?? {};\n\t\t\tapp.manifest.component = app.manifest.component ?? {};\n\t\t\tapp.manifest.component.preload = app.manifest.component.preload ?? [];\n\t\t\tif (typeof app.manifest.component.preload === \"string\") {\n\t\t\t\tapp.manifest.component.preload = [app.manifest.component.preload];\n\t\t\t}\n\t\t\tconst index = app.manifest.component.preload.indexOf(props.alias);\n\t\t\tconst wasPreloadInThisApp = index >= 0;\n\t\t\tconst isPreloadInThisApp = selectedApps.includes(app.appId);\n\n\t\t\t// This preload was assigned to this app, but is no longer\n\t\t\tif (wasPreloadInThisApp && !isPreloadInThisApp) {\n\t\t\t\tapp.manifest.component.preload.splice(index, 1);\n\t\t\t\treturn props.updateApp(app.appId, app);\n\t\t\t}\n\n\t\t\t// This preload was not assigned to this app, but now is\n\t\t\tif (!wasPreloadInThisApp && isPreloadInThisApp) {\n\t\t\t\tapp.manifest.component.preload.push(alias);\n\t\t\t\treturn props.updateApp(app.appId, app);\n\t\t\t}\n\n\t\t\t// This preload continues to be assigned, but has been renamed\n\t\t\tif (wasPreloadInThisApp && isPreloadInThisApp && isRenaming) {\n\t\t\t\tapp.manifest.component.preload.splice(index, 1);\n\t\t\t\tapp.manifest.component.preload.push(alias);\n\t\t\t\treturn props.updateApp(app.appId, app);\n\t\t\t}\n\n\t\t\t// No change to this app\n\t\t\treturn new Promise((resolve) => {\n\t\t\t\tresolve({ err: null });\n\t\t\t});\n\t\t});\n\n\t\treturn Promise.all(promises);\n\t};\n\n\tuseEffect(() => {\n\t\tupdateAppList();\n\t}, []);\n\n\t// Using `key` is a sort of hack to help re-generate FinsembleSelect, after updating appList\n\t// @todo - Get FinsembleSelect to respect props changes. At that point, this key hack will be unnecessary\n\tuseEffect(() => {\n\t\tsetKey(`${Date.now()}.${Math.random()}`);\n\t}, [appList, selectedApps]);\n\n\treturn (\n\t\t<div className=\"preload-edit-container\">\n\t\t\t<h2>{alias || \"Untitled preload\"}</h2>\n\n\t\t\t<div className=\"app-edit-field\">\n\t\t\t\t<table role=\"presentation\" className=\"preload-edit-table\">\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t\t<label htmlFor=\"preload-alias\">Name</label>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t<td className=\"edit-field\">\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\tid=\"preload-alias\"\n\t\t\t\t\t\t\t\t\tvalue={alias}\n\t\t\t\t\t\t\t\t\taria-invalid={alias !== \"\" && !aliasValid}\n\t\t\t\t\t\t\t\t\tplaceholder=\"Untitled preload\"\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetAlias(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t\t<label htmlFor=\"preload-url\">Web URL</label>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t<td className=\"edit-field\">\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\tid=\"preload-url\"\n\t\t\t\t\t\t\t\t\tvalue={url}\n\t\t\t\t\t\t\t\t\taria-invalid={url !== \"\" && !urlValid}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetUrl(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<th className=\"table-header__top-label\">Load for</th>\n\t\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t\t<div className=\"load-option\">\n\t\t\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tname=\"preload-usage\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"launchable\"\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType === \"launchable\"}\n\t\t\t\t\t\t\t\t\t\t\tonChange={onRadioChange}\n\t\t\t\t\t\t\t\t\t\t/>{\" \"}\n\t\t\t\t\t\t\t\t\t\tApps launched by users\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div className=\"load-option\">\n\t\t\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tname=\"preload-usage\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"all\"\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType === \"all\"}\n\t\t\t\t\t\t\t\t\t\t\tonChange={onRadioChange}\n\t\t\t\t\t\t\t\t\t\t/>{\" \"}\n\t\t\t\t\t\t\t\t\t\tAll apps\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div className=\"load-option\">\n\t\t\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tname=\"preload-usage\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"none\"\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType === \"none\"}\n\t\t\t\t\t\t\t\t\t\t\tonChange={onRadioChange}\n\t\t\t\t\t\t\t\t\t\t/>{\" \"}\n\t\t\t\t\t\t\t\t\t\tSelect apps\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{usageType === \"none\" && (\n\t\t\t\t\t\t\t\t\t<FinsembleSelect\n\t\t\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t\t\toptions={appNameList}\n\t\t\t\t\t\t\t\t\t\tvalues={appNameValues}\n\t\t\t\t\t\t\t\t\t\tselected={selectedApps}\n\t\t\t\t\t\t\t\t\t\tupdateCallback={selectChange}\n\t\t\t\t\t\t\t\t\t\tshowSearch={true}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t\t<div className=\"preload-edit-actions\">\n\t\t\t\t<div>\n\t\t\t\t\t{props.alias && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tfashion=\"danger\"\n\t\t\t\t\t\t\ttext=\"Remove preload\"\n\t\t\t\t\t\t\tonClick={async (e) => {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tawait props.deletePreload(props.alias);\n\t\t\t\t\t\t\t\tprops.cancel();\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"app-actions-right-wrapper\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tfashion=\"ghost\"\n\t\t\t\t\t\ttext=\"Cancel\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tprops.cancel();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\t\ttext=\"Save\"\n\t\t\t\t\t\tdisabled={disableSubmit}\n\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\tawait props.submit(props.alias, alias, {\n\t\t\t\t\t\t\t\turl,\n\t\t\t\t\t\t\t\tautoload: usageType,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tawait updateAppConfigs();\n\t\t\t\t\t\t\tprops.cancel();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}
+{"version":3,"file":"EditPreload.js","sourceRoot":"","sources":["../../../src/components/sdd/EditPreload.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ChangeEvent, useEffect, useState } from \"react\";\nimport \"../common/css/preload-edit-page.css\";\nimport { FinsembleSelect } from \"../common/FinsembleSelect\";\nimport { Button } from \"../common/Button\";\nimport { PreloadDetail, PreloadMap, preloadUsageType } from \"../../types/smartDesktopDesignerTypes\";\nimport { useSelector } from \"../../store\";\nimport { AppDefinition } from \"./Application\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { SmartDesktopClient } from \"./smartDesktopClient\";\n\nexport interface EditPreloadProps {\n\talias: string;\n\tcancel: () => void;\n\tsubmit: (oldAlias: string | null, newAlias: string, detail: PreloadDetail) => Promise<void>;\n\tgetApps: typeof SmartDesktopClient.getApps;\n\tupdateApp: typeof SmartDesktopClient.updateApp;\n\tdeletePreload: typeof SmartDesktopClient.deletePreload;\n}\n\nconst validAliasRegex = new RegExp(\"^[a-zA-Z0-9-]+$\");\n\nconst getAliasInvalidMessage = (alias: string, preloads: PreloadMap, currentAlias: string): string => {\n\tif (alias === \"\") {\n\t\treturn \"\";\n\t}\n\n\tif (alias.match(validAliasRegex) === null) {\n\t\treturn \"Name can only use letters, numbers, and dashes.\";\n\t}\n\n\tif (alias !== currentAlias && alias in preloads) {\n\t\treturn \"Name is already being used.\";\n\t}\n\n\treturn \"\";\n};\n\nconst isUrlValid = (url: string) => {\n\tlet valid = true;\n\ttry {\n\t\tnew URL(url);\n\t} catch (e) {\n\t\tvalid = false;\n\t}\n\treturn valid;\n};\n\nconst breakOut = (apps: AppDefinition[]) => {\n\tconst appNameList: string[] = [];\n\tconst appNameValues: string[] = [];\n\n\tapps.forEach((app: AppDefinition) => {\n\t\tappNameList.push(app.name);\n\t\tappNameValues.push(app.appId);\n\t});\n\n\treturn {\n\t\tappNameList,\n\t\tappNameValues,\n\t};\n};\n\n/**\n * Preloads can be set in config as a string, array of strings or a boolean.\n * This function converts any valid format to an array of string.\n */\nconst preloadAsArray = (currentPreload: boolean | string | string[]): string[] => {\n\tif (typeof currentPreload === \"string\") {\n\t\treturn [currentPreload];\n\t}\n\tif (typeof currentPreload === \"boolean\") {\n\t\treturn [];\n\t}\n\treturn currentPreload ?? [];\n};\n\nexport const EditPreload: React.FunctionComponent<EditPreloadProps> = (props) => {\n\tconst preloads = useSelector((state: RootState) => state.smartDesktopDesigner.preloads);\n\n\tconst [alias, setAlias] = useState(props.alias);\n\tconst aliasInvalidMessage = getAliasInvalidMessage(alias, preloads, props.alias);\n\tconst [url, setUrl] = useState(preloads[alias]?.url ?? \"\");\n\tconst urlValid = isUrlValid(url);\n\n\tconst disableSubmit = !(alias !== \"\" && aliasInvalidMessage === \"\" && urlValid);\n\n\tconst [usageType, setUsageType] = useState<preloadUsageType>(preloads[alias]?.autoload ?? \"none\");\n\tconst [appList, setAppList] = useState<AppDefinition[]>([]);\n\tconst { appNameList, appNameValues } = breakOut(appList);\n\tconst [selectedApps, setSelectedApps] = useState<string[]>([]);\n\tconst [key, setKey] = useState(`${Date.now()}.${Math.random()}`);\n\n\tconst onRadioChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tsetUsageType(e.target.value as preloadUsageType);\n\t};\n\n\tconst selectChange = (selectedValues: string[]) => {\n\t\tsetSelectedApps(selectedValues);\n\t};\n\n\tconst updateAppList = () => {\n\t\tprops.getApps().then(({ apps }: { apps: AppDefinition[] }) => {\n\t\t\tsetAppList(apps);\n\t\t\tif (props.alias !== \"\") {\n\t\t\t\tsetSelectedApps(\n\t\t\t\t\tapps\n\t\t\t\t\t\t.filter((app) => preloadAsArray(app.manifest?.component?.preload)?.includes(props.alias))\n\t\t\t\t\t\t.map((app) => app.appId)\n\t\t\t\t);\n\t\t\t}\n\t\t});\n\t};\n\n\tconst updateAppConfigs = async () => {\n\t\tconst isRenaming = props.alias !== alias;\n\t\tconst promises: Promise<any>[] = appList.map((app) => {\n\t\t\tapp.manifest = app.manifest ?? {};\n\t\t\tapp.manifest.component = app.manifest.component ?? {};\n\t\t\tapp.manifest.component.preload = preloadAsArray(app.manifest.component.preload);\n\t\t\tconst index = app.manifest.component.preload.indexOf(props.alias);\n\t\t\tconst wasPreloadInThisApp = index >= 0;\n\t\t\tconst isPreloadInThisApp = selectedApps.includes(app.appId);\n\n\t\t\t// This preload was assigned to this app, but is no longer\n\t\t\tif (wasPreloadInThisApp && !isPreloadInThisApp) {\n\t\t\t\tapp.manifest.component.preload.splice(index, 1);\n\t\t\t\treturn props.updateApp(app.appId, app);\n\t\t\t}\n\n\t\t\t// This preload was not assigned to this app, but now is\n\t\t\tif (!wasPreloadInThisApp && isPreloadInThisApp) {\n\t\t\t\tapp.manifest.component.preload.push(alias);\n\t\t\t\treturn props.updateApp(app.appId, app);\n\t\t\t}\n\n\t\t\t// This preload continues to be assigned, but has been renamed\n\t\t\tif (wasPreloadInThisApp && isPreloadInThisApp && isRenaming) {\n\t\t\t\tapp.manifest.component.preload.splice(index, 1);\n\t\t\t\tapp.manifest.component.preload.push(alias);\n\t\t\t\treturn props.updateApp(app.appId, app);\n\t\t\t}\n\n\t\t\t// No change to this app\n\t\t\treturn new Promise((resolve) => {\n\t\t\t\tresolve({ err: null });\n\t\t\t});\n\t\t});\n\n\t\treturn Promise.all(promises);\n\t};\n\n\tuseEffect(() => {\n\t\tupdateAppList();\n\t}, []);\n\n\t// Using `key` is a sort of hack to help re-generate FinsembleSelect, after updating appList\n\t// @todo - Get FinsembleSelect to respect props changes. At that point, this key hack will be unnecessary\n\tuseEffect(() => {\n\t\tsetKey(`${Date.now()}.${Math.random()}`);\n\t}, [appList, selectedApps]);\n\n\treturn (\n\t\t<div className=\"preload-edit-container\">\n\t\t\t<h2>{alias || \"Untitled preload\"}</h2>\n\n\t\t\t<div className=\"app-edit-field\">\n\t\t\t\t<table role=\"presentation\" className=\"preload-edit-table\">\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t\t<label htmlFor=\"preload-alias\">Name</label>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t<td className=\"edit-field\">\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\tid=\"preload-alias\"\n\t\t\t\t\t\t\t\t\tvalue={alias}\n\t\t\t\t\t\t\t\t\taria-invalid={alias !== \"\" && aliasInvalidMessage !== \"\"}\n\t\t\t\t\t\t\t\t\taria-errormessage=\"preload-alias-error-message\"\n\t\t\t\t\t\t\t\t\tplaceholder=\"Untitled preload\"\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetAlias(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{aliasInvalidMessage && (\n\t\t\t\t\t\t\t\t\t<div id=\"preload-alias-error-message\" className=\"invalid-message\">\n\t\t\t\t\t\t\t\t\t\t{aliasInvalidMessage}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t\t<label htmlFor=\"preload-url\">Web URL</label>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t<td className=\"edit-field\">\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\tid=\"preload-url\"\n\t\t\t\t\t\t\t\t\tvalue={url}\n\t\t\t\t\t\t\t\t\taria-invalid={url !== \"\" && !urlValid}\n\t\t\t\t\t\t\t\t\taria-errormessage=\"preload-url-error-message\"\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetUrl(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{url !== \"\" && !urlValid && (\n\t\t\t\t\t\t\t\t\t<div id=\"preload-url-error-message\" className=\"invalid-message\">\n\t\t\t\t\t\t\t\t\t\tURL must be valid (e.g., https://cosaic.io/). Only http and https prototcols are supported.\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<th className=\"table-header__top-label\" id=\"load-label\">\n\t\t\t\t\t\t\t\tLoad for\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t\t<div className=\"load-option\">\n\t\t\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tname=\"preload-usage\"\n\t\t\t\t\t\t\t\t\t\t\taria-labelledby=\"load-label load-label-launchable\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"launchable\"\n\t\t\t\t\t\t\t\t\t\t\taria-posinset={1}\n\t\t\t\t\t\t\t\t\t\t\taria-setsize={3}\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType === \"launchable\"}\n\t\t\t\t\t\t\t\t\t\t\tonChange={onRadioChange}\n\t\t\t\t\t\t\t\t\t\t/>{\" \"}\n\t\t\t\t\t\t\t\t\t\t<span id=\"load-label-launchable\">Apps launched by users</span>\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div className=\"load-option\">\n\t\t\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tname=\"preload-usage\"\n\t\t\t\t\t\t\t\t\t\t\taria-labelledby=\"load-label load-label-all\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"all\"\n\t\t\t\t\t\t\t\t\t\t\taria-posinset={2}\n\t\t\t\t\t\t\t\t\t\t\taria-setsize={3}\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType === \"all\"}\n\t\t\t\t\t\t\t\t\t\t\tonChange={onRadioChange}\n\t\t\t\t\t\t\t\t\t\t/>{\" \"}\n\t\t\t\t\t\t\t\t\t\t<span id=\"load-label-all\">All apps</span>\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div className=\"load-option\">\n\t\t\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tname=\"preload-usage\"\n\t\t\t\t\t\t\t\t\t\t\taria-labelledby=\"load-label load-label-select\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"none\"\n\t\t\t\t\t\t\t\t\t\t\taria-posinset={3}\n\t\t\t\t\t\t\t\t\t\t\taria-setsize={3}\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType === \"none\"}\n\t\t\t\t\t\t\t\t\t\t\tonChange={onRadioChange}\n\t\t\t\t\t\t\t\t\t\t/>{\" \"}\n\t\t\t\t\t\t\t\t\t\t<span id=\"load-label-select\">Select apps</span>\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{usageType === \"none\" && (\n\t\t\t\t\t\t\t\t\t<FinsembleSelect\n\t\t\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t\t\toptions={appNameList}\n\t\t\t\t\t\t\t\t\t\tvalues={appNameValues}\n\t\t\t\t\t\t\t\t\t\tselected={selectedApps}\n\t\t\t\t\t\t\t\t\t\tupdateCallback={selectChange}\n\t\t\t\t\t\t\t\t\t\tshowSearch={true}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t\t<div className=\"preload-edit-actions\">\n\t\t\t\t<div>\n\t\t\t\t\t{props.alias && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tfashion=\"danger\"\n\t\t\t\t\t\t\ttext=\"Remove preload\"\n\t\t\t\t\t\t\tonClick={async (e) => {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tawait props.deletePreload(props.alias);\n\t\t\t\t\t\t\t\tprops.cancel();\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"app-actions-right-wrapper\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tfashion=\"ghost\"\n\t\t\t\t\t\ttext=\"Cancel\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tprops.cancel();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\t\ttext=\"Save\"\n\t\t\t\t\t\tdisabled={disableSubmit}\n\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\tawait props.submit(props.alias, alias, {\n\t\t\t\t\t\t\t\turl,\n\t\t\t\t\t\t\t\tautoload: usageType,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tawait updateAppConfigs();\n\t\t\t\t\t\t\tprops.cancel();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/Export.d.ts

@@ -3,14 +3,15 @@
  * All rights reserved.
  */
 /// <reference types="react" />
+import { SmartDesktopClient } from "./smartDesktopClient";
 import "./css/export.css";
 export declare type ExportProps = {
     progressCheckInterval: number;
-    getProjectConfig: typeof FSBL.Clients.SmartDesktopClient.prototype.projectConfig;
-    createProjectZip: typeof FSBL.Clients.SmartDesktopClient.prototype.createProjectZip;
-    publishToCosaicCloud: typeof FSBL.Clients.SmartDesktopClient.prototype.publishToCosaicCloud;
-    getPublishProgress: typeof FSBL.Clients.SmartDesktopClient.prototype.getPublishProgress;
-    copyProjectFiles: typeof FSBL.Clients.SmartDesktopClient.prototype.copyProjectFiles;
-    updateProjectSettings: typeof FSBL.Clients.SmartDesktopClient.prototype.updateProjectSettings;
+    getProjectConfig: typeof SmartDesktopClient.projectConfig;
+    createProjectZip: typeof SmartDesktopClient.createProjectZip;
+    publishToCosaicCloud: typeof SmartDesktopClient.publishToCosaicCloud;
+    getPublishProgress: typeof SmartDesktopClient.getPublishProgress;
+    copyProjectFiles: typeof SmartDesktopClient.copyProjectFiles;
+    updateProjectSettings: typeof SmartDesktopClient.updateProjectSettings;
 };
 export declare const Export: (props: ExportProps) => JSX.Element;

package/react/components/sdd/Export.js

@@ -13,6 +13,7 @@ import { ExportDeployInfo } from "./ExportDeployInfo";
 import { useSelector, useDispatch } from "../../store";
 import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
 import { launchTutorialLink } from "./common/fsbl_functions";
+import { SmartDesktopClient } from "./smartDesktopClient";
 import "./css/export.css";
 export const Export = (props) => {
     const dispatch = useDispatch();
@@ -20,7 +21,7 @@ export const Export = (props) => {
     const deployInfo = useSelector((store) => store.smartDesktopDesigner.export.deployInfo);
     const project = useSelector((state) => state.smartDesktopDesigner.projectInfo);
     const [tmpProjectName, setTmpProjectName] = useState((project === null || project === void 0 ? void 0 : project.name) === "default" ? "" : project === null || project === void 0 ? void 0 : project.name);
-    const isProjectNameValid = FSBL.Clients.SmartDesktopClient.checkValidProjectName(tmpProjectName);
+    const isProjectNameValid = SmartDesktopClient.checkValidProjectName(tmpProjectName);
     const setProject = (value) => {
         dispatch(SmartDesktopDesignerActions.set_project_info(value));
     };
@@ -39,9 +40,9 @@ export const Export = (props) => {
                 launchTutorialLink("SDD-10-Finish");
             } }, "Publish project"),
         React.createElement(Content, null, isPublishing ? (React.createElement(Publish, Object.assign({}, props))) : (React.createElement("div", { className: "export-block" },
-            React.createElement("h2", null, "Desktop Project"),
+            React.createElement("h2", null, "Desktop project"),
             React.createElement("div", { className: "export-project-name" },
-                React.createElement("label", { htmlFor: "projectName" }, "Project name"),
+                React.createElement("label", { htmlFor: "project-name" }, "Project name"),
                 React.createElement("input", { type: "text", className: "project-name-field", id: "project-name", name: "project-name", placeholder: "Untitled", "aria-invalid": !isProjectNameValid, value: tmpProjectName, style: { fontSize: 14 }, onInput: (e) => {
                         setTmpProjectName(e.target.value);
                     }, onKeyDown: (e) => {

package/react/components/sdd/Export.js.map

@@ -1 +1 @@
-{"version":3,"file":"Export.js","sourceRoot":"","sources":["../../../src/components/sdd/Export.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useState } from \"react\";\nimport { View } from \"./View\";\nimport { Header } from \"../common/Header\";\nimport { Content } from \"./Content\";\nimport { ExportCloud } from \"./ExportCloud\";\nimport { ExportZip } from \"./ExportZip\";\nimport { Publish } from \"./Publish\";\nimport { ExportDeployInfo } from \"./ExportDeployInfo\";\nimport { useSelector, useDispatch } from \"../../store\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { ProjectSaveData } from \"../../types/smartDesktopDesignerTypes\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\n\nimport \"./css/export.css\";\n\nexport type ExportProps = {\n\tprogressCheckInterval: number;\n\tgetProjectConfig: typeof FSBL.Clients.SmartDesktopClient.prototype.projectConfig;\n\tcreateProjectZip: typeof FSBL.Clients.SmartDesktopClient.prototype.createProjectZip;\n\tpublishToCosaicCloud: typeof FSBL.Clients.SmartDesktopClient.prototype.publishToCosaicCloud;\n\tgetPublishProgress: typeof FSBL.Clients.SmartDesktopClient.prototype.getPublishProgress;\n\tcopyProjectFiles: typeof FSBL.Clients.SmartDesktopClient.prototype.copyProjectFiles;\n\tupdateProjectSettings: typeof FSBL.Clients.SmartDesktopClient.prototype.updateProjectSettings;\n};\n\nexport const Export = (props: ExportProps) => {\n\tconst dispatch = useDispatch();\n\n\tconst isPublishing = useSelector((store: RootState) => store.smartDesktopDesigner.export.isPublishing);\n\tconst deployInfo = useSelector((store: RootState) => store.smartDesktopDesigner.export.deployInfo);\n\tconst project = useSelector((state: RootState) => state.smartDesktopDesigner.projectInfo);\n\tconst [tmpProjectName, setTmpProjectName] = useState(project?.name === \"default\" ? \"\" : project?.name);\n\tconst isProjectNameValid = FSBL.Clients.SmartDesktopClient.checkValidProjectName(tmpProjectName);\n\tconst setProject = (value: ProjectSaveData) => {\n\t\tdispatch(SmartDesktopDesignerActions.set_project_info(value));\n\t};\n\n\tconst onSaveProjectName = (name: string) => {\n\t\tprops.updateProjectSettings({ ...project, name: name }).then(({ err }) => {\n\t\t\tif (err) {\n\t\t\t\tFSBL.Clients.Logger.system.error(`ERROR updateProjectSettings: ${JSON.stringify(err)}`);\n\t\t\t} else {\n\t\t\t\tsetProject({\n\t\t\t\t\t...project,\n\t\t\t\t\tname,\n\t\t\t\t});\n\t\t\t}\n\t\t});\n\t};\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"SDD-10-Finish\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tPublish project\n\t\t\t</Header>\n\n\t\t\t<Content>\n\t\t\t\t{isPublishing ? (\n\t\t\t\t\t<Publish {...props} />\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"export-block\">\n\t\t\t\t\t\t<h2>Desktop Project</h2>\n\t\t\t\t\t\t<div className=\"export-project-name\">\n\t\t\t\t\t\t\t<label htmlFor=\"projectName\">Project name</label>\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tclassName=\"project-name-field\"\n\t\t\t\t\t\t\t\tid=\"project-name\"\n\t\t\t\t\t\t\t\tname=\"project-name\"\n\t\t\t\t\t\t\t\tplaceholder=\"Untitled\"\n\t\t\t\t\t\t\t\taria-invalid={!isProjectNameValid}\n\t\t\t\t\t\t\t\tvalue={tmpProjectName}\n\t\t\t\t\t\t\t\tstyle={{ fontSize: 14 }}\n\t\t\t\t\t\t\t\tonInput={(e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\t\t\t\t\t\t\tsetTmpProjectName(e.target.value);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\") {\n\t\t\t\t\t\t\t\t\t\te.currentTarget.blur();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonBlur={() => {\n\t\t\t\t\t\t\t\t\tif (isProjectNameValid) {\n\t\t\t\t\t\t\t\t\t\tonSaveProjectName(tmpProjectName);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"export-methods\">\n\t\t\t\t\t\t\t<ExportCloud {...props} valid={isProjectNameValid} />\n\t\t\t\t\t\t\t<ExportZip {...props} valid={isProjectNameValid} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{deployInfo && (\n\t\t\t\t\t\t\t<div className=\"deployInfoContainer\">\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t<p>Project installer link:</p>\n\t\t\t\t\t\t\t\t\t<ExportDeployInfo />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Content>\n\t\t</View>\n\t);\n};\n"]}
+{"version":3,"file":"Export.js","sourceRoot":"","sources":["../../../src/components/sdd/Export.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useState } from \"react\";\nimport { View } from \"./View\";\nimport { Header } from \"../common/Header\";\nimport { Content } from \"./Content\";\nimport { ExportCloud } from \"./ExportCloud\";\nimport { ExportZip } from \"./ExportZip\";\nimport { Publish } from \"./Publish\";\nimport { ExportDeployInfo } from \"./ExportDeployInfo\";\nimport { useSelector, useDispatch } from \"../../store\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { ProjectSaveData } from \"../../types/smartDesktopDesignerTypes\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\nimport { SmartDesktopClient } from \"./smartDesktopClient\";\n\nimport \"./css/export.css\";\n\nexport type ExportProps = {\n\tprogressCheckInterval: number;\n\tgetProjectConfig: typeof SmartDesktopClient.projectConfig;\n\tcreateProjectZip: typeof SmartDesktopClient.createProjectZip;\n\tpublishToCosaicCloud: typeof SmartDesktopClient.publishToCosaicCloud;\n\tgetPublishProgress: typeof SmartDesktopClient.getPublishProgress;\n\tcopyProjectFiles: typeof SmartDesktopClient.copyProjectFiles;\n\tupdateProjectSettings: typeof SmartDesktopClient.updateProjectSettings;\n};\n\nexport const Export = (props: ExportProps) => {\n\tconst dispatch = useDispatch();\n\n\tconst isPublishing = useSelector((store: RootState) => store.smartDesktopDesigner.export.isPublishing);\n\tconst deployInfo = useSelector((store: RootState) => store.smartDesktopDesigner.export.deployInfo);\n\tconst project = useSelector((state: RootState) => state.smartDesktopDesigner.projectInfo);\n\tconst [tmpProjectName, setTmpProjectName] = useState(project?.name === \"default\" ? \"\" : project?.name);\n\tconst isProjectNameValid = SmartDesktopClient.checkValidProjectName(tmpProjectName);\n\tconst setProject = (value: ProjectSaveData) => {\n\t\tdispatch(SmartDesktopDesignerActions.set_project_info(value));\n\t};\n\n\tconst onSaveProjectName = (name: string) => {\n\t\tprops.updateProjectSettings({ ...project, name: name }).then(({ err }) => {\n\t\t\tif (err) {\n\t\t\t\tFSBL.Clients.Logger.system.error(`ERROR updateProjectSettings: ${JSON.stringify(err)}`);\n\t\t\t} else {\n\t\t\t\tsetProject({\n\t\t\t\t\t...project,\n\t\t\t\t\tname,\n\t\t\t\t});\n\t\t\t}\n\t\t});\n\t};\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"SDD-10-Finish\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tPublish project\n\t\t\t</Header>\n\n\t\t\t<Content>\n\t\t\t\t{isPublishing ? (\n\t\t\t\t\t<Publish {...props} />\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"export-block\">\n\t\t\t\t\t\t<h2>Desktop project</h2>\n\t\t\t\t\t\t<div className=\"export-project-name\">\n\t\t\t\t\t\t\t<label htmlFor=\"project-name\">Project name</label>\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tclassName=\"project-name-field\"\n\t\t\t\t\t\t\t\tid=\"project-name\"\n\t\t\t\t\t\t\t\tname=\"project-name\"\n\t\t\t\t\t\t\t\tplaceholder=\"Untitled\"\n\t\t\t\t\t\t\t\taria-invalid={!isProjectNameValid}\n\t\t\t\t\t\t\t\tvalue={tmpProjectName}\n\t\t\t\t\t\t\t\tstyle={{ fontSize: 14 }}\n\t\t\t\t\t\t\t\tonInput={(e: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\t\t\t\t\t\t\tsetTmpProjectName(e.target.value);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\") {\n\t\t\t\t\t\t\t\t\t\te.currentTarget.blur();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonBlur={() => {\n\t\t\t\t\t\t\t\t\tif (isProjectNameValid) {\n\t\t\t\t\t\t\t\t\t\tonSaveProjectName(tmpProjectName);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"export-methods\">\n\t\t\t\t\t\t\t<ExportCloud {...props} valid={isProjectNameValid} />\n\t\t\t\t\t\t\t<ExportZip {...props} valid={isProjectNameValid} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{deployInfo && (\n\t\t\t\t\t\t\t<div className=\"deployInfoContainer\">\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t<p>Project installer link:</p>\n\t\t\t\t\t\t\t\t\t<ExportDeployInfo />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Content>\n\t\t</View>\n\t);\n};\n"]}

package/react/components/sdd/ExportCloud.js

@@ -7,6 +7,10 @@ export const ExportCloud = (props) => {
     const dispatch = useDispatch();
     const deployInfo = useSelector((store) => store.smartDesktopDesigner.export.deployInfo);
     const projectErrors = useSelector((store) => store.smartDesktopDesigner.errors);
+    /**
+     * This will run once. We'll check to see if there's a current deployInfo for our
+     * project, in other words has it already been published.
+     */
     useEffect(() => {
         const getProjectConfig = async () => {
             const projectConfig = await props.getProjectConfig();

package/react/components/sdd/ExportCloud.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExportCloud.js","sourceRoot":"","sources":["../../../src/components/sdd/ExportCloud.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAEvD,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AAExF,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAMhD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAuB,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IACnG,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAM3F,SAAS,CAAC,GAAG,EAAE;QACd,MAAM,gBAAgB,GAAG,KAAK,IAAI,EAAE;YACnC,MAAM,aAAa,GAAG,MAAM,KAAK,CAAC,gBAAgB,EAAE,CAAC;YACrD,MAAM,iBAAiB,GAAG,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,UAAU,CAAC;YAEpD,IAAI,iBAAiB,EAAE;gBACtB,QAAQ,CAAC,2BAA2B,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC,CAAC;aACzE;QACF,CAAC,CAAC;QACF,gBAAgB,EAAE,CAAC;IACpB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACN,6BAAK,SAAS,EAAC,+BAA+B;QAC5C,UAAU,CAAC,CAAC,CAAC,CACb;YACC,iLAGI,CACC,CACN,CAAC,CAAC,CAAC,CACH;YACC,yMAGI,CACC,CACN;QAED,oBAAC,aAAa,IAAC,MAAM,EAAE,aAAa,GAAkB;QAEtD,6BAAK,SAAS,EAAC,uBAAuB;YACrC,oBAAC,MAAM,IACN,QAAQ,EAAE,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAClD,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,2BAA2B,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC;oBAC9D,KAAK;yBACH,oBAAoB,EAAE;yBACtB,IAAI,CAAC,CAAC,iBAAiB,EAAE,EAAE,CAAC,QAAQ,CAAC,2BAA2B,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC,CAAC;yBACrG,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,2BAA2B,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBACpF,CAAC,GACA,CACG,CACD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useEffect } from \"react\";\nimport { Button } from \"../common/Button\";\nimport { useDispatch, useSelector } from \"../../store\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { ExportProps } from \"./Export\";\nimport { ProjectErrors } from \"./ProjectErrors\";\n\nexport type ExportCloudProps = ExportProps & {\n\tvalid: boolean;\n};\n\nexport const ExportCloud = (props: ExportCloudProps) => {\n\tconst dispatch = useDispatch();\n\tconst deployInfo = useSelector((store: RootState) => store.smartDesktopDesigner.export.deployInfo);\n\tconst projectErrors = useSelector((store: RootState) => store.smartDesktopDesigner.errors);\n\n\t/**\n\t * This will run once. We'll check to see if there's a current deployInfo for our\n\t * project, in other words has it already been published.\n\t */\n\tuseEffect(() => {\n\t\tconst getProjectConfig = async () => {\n\t\t\tconst projectConfig = await props.getProjectConfig();\n\t\t\tconst currentDeployInfo = projectConfig?.deployInfo;\n\n\t\t\tif (currentDeployInfo) {\n\t\t\t\tdispatch(SmartDesktopDesignerActions.set_deploy_info(currentDeployInfo));\n\t\t\t}\n\t\t};\n\t\tgetProjectConfig();\n\t}, []);\n\n\treturn (\n\t\t<div className=\"export-method package-project\">\n\t\t\t{deployInfo ? (\n\t\t\t\t<div>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tPublish your project to share it with your users. Click Publish to create a project installer. Please be\n\t\t\t\t\t\tpatient, it can take up to 20 minutes.\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t<div>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tYou can continue working on your desktop project after you publish it. To update the project, republish it.\n\t\t\t\t\t\tUsers will see the changes when they restart their desktop.\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<ProjectErrors errors={projectErrors}></ProjectErrors>\n\n\t\t\t<div className=\"export-method-actions\">\n\t\t\t\t<Button\n\t\t\t\t\tdisabled={projectErrors.length > 0 || !props.valid}\n\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\ttext=\"Publish\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.set_is_publishing(true));\n\t\t\t\t\t\tprops\n\t\t\t\t\t\t\t.publishToCosaicCloud()\n\t\t\t\t\t\t\t.then((currentDeployInfo) => dispatch(SmartDesktopDesignerActions.set_deploy_info(currentDeployInfo)))\n\t\t\t\t\t\t\t.catch((error) => dispatch(SmartDesktopDesignerActions.set_publish_error(error)));\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}
+{"version":3,"file":"ExportCloud.js","sourceRoot":"","sources":["../../../src/components/sdd/ExportCloud.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAEvD,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AAExF,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAMhD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAuB,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IACnG,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAE3F;;;OAGG;IACH,SAAS,CAAC,GAAG,EAAE;QACd,MAAM,gBAAgB,GAAG,KAAK,IAAI,EAAE;YACnC,MAAM,aAAa,GAAG,MAAM,KAAK,CAAC,gBAAgB,EAAE,CAAC;YACrD,MAAM,iBAAiB,GAAG,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,UAAU,CAAC;YAEpD,IAAI,iBAAiB,EAAE;gBACtB,QAAQ,CAAC,2BAA2B,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC,CAAC;aACzE;QACF,CAAC,CAAC;QACF,gBAAgB,EAAE,CAAC;IACpB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACN,6BAAK,SAAS,EAAC,+BAA+B;QAC5C,UAAU,CAAC,CAAC,CAAC,CACb;YACC,iLAGI,CACC,CACN,CAAC,CAAC,CAAC,CACH;YACC,yMAGI,CACC,CACN;QAED,oBAAC,aAAa,IAAC,MAAM,EAAE,aAAa,GAAkB;QAEtD,6BAAK,SAAS,EAAC,uBAAuB;YACrC,oBAAC,MAAM,IACN,QAAQ,EAAE,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAClD,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,GAAG,EAAE;oBACb,QAAQ,CAAC,2BAA2B,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC;oBAC9D,KAAK;yBACH,oBAAoB,EAAE;yBACtB,IAAI,CAAC,CAAC,iBAAiB,EAAE,EAAE,CAAC,QAAQ,CAAC,2BAA2B,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC,CAAC;yBACrG,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,2BAA2B,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBACpF,CAAC,GACA,CACG,CACD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useEffect } from \"react\";\nimport { Button } from \"../common/Button\";\nimport { useDispatch, useSelector } from \"../../store\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { ExportProps } from \"./Export\";\nimport { ProjectErrors } from \"./ProjectErrors\";\n\nexport type ExportCloudProps = ExportProps & {\n\tvalid: boolean;\n};\n\nexport const ExportCloud = (props: ExportCloudProps) => {\n\tconst dispatch = useDispatch();\n\tconst deployInfo = useSelector((store: RootState) => store.smartDesktopDesigner.export.deployInfo);\n\tconst projectErrors = useSelector((store: RootState) => store.smartDesktopDesigner.errors);\n\n\t/**\n\t * This will run once. We'll check to see if there's a current deployInfo for our\n\t * project, in other words has it already been published.\n\t */\n\tuseEffect(() => {\n\t\tconst getProjectConfig = async () => {\n\t\t\tconst projectConfig = await props.getProjectConfig();\n\t\t\tconst currentDeployInfo = projectConfig?.deployInfo;\n\n\t\t\tif (currentDeployInfo) {\n\t\t\t\tdispatch(SmartDesktopDesignerActions.set_deploy_info(currentDeployInfo));\n\t\t\t}\n\t\t};\n\t\tgetProjectConfig();\n\t}, []);\n\n\treturn (\n\t\t<div className=\"export-method package-project\">\n\t\t\t{deployInfo ? (\n\t\t\t\t<div>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tPublish your project to share it with your users. Click Publish to create a project installer. Please be\n\t\t\t\t\t\tpatient, it can take up to 20 minutes.\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t<div>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tYou can continue working on your desktop project after you publish it. To update the project, republish it.\n\t\t\t\t\t\tUsers will see the changes when they restart their desktop.\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<ProjectErrors errors={projectErrors}></ProjectErrors>\n\n\t\t\t<div className=\"export-method-actions\">\n\t\t\t\t<Button\n\t\t\t\t\tdisabled={projectErrors.length > 0 || !props.valid}\n\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\ttext=\"Publish\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.set_is_publishing(true));\n\t\t\t\t\t\tprops\n\t\t\t\t\t\t\t.publishToCosaicCloud()\n\t\t\t\t\t\t\t.then((currentDeployInfo) => dispatch(SmartDesktopDesignerActions.set_deploy_info(currentDeployInfo)))\n\t\t\t\t\t\t\t.catch((error) => dispatch(SmartDesktopDesignerActions.set_publish_error(error)));\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/GettingStarted.js

@@ -16,10 +16,10 @@ export const GettingStarted = () => {
         React.createElement(View, null,
             React.createElement(Header, { helpFunction: () => {
                     launchTutorialLink("SDD-01-Welcome");
-                } }, "Your Smart Desktop Designer"),
+                } }, "Smart Desktop Designer"),
             React.createElement(Content, null,
-                React.createElement("p", null, "Design a desktop for your users. Add, manage, and remove apps, configure the desktop look to follow your branding, and arrange workspaces. When you\u2019re done, you can publish your desktop to share with others or package it for further development."),
+                React.createElement("p", null, "Design a smart desktop. Add, remove, and manage apps; arrange your workspaces. Customize the look to follow your branding. When you're done, publish your desktop to share with others or package it for further development."),
                 React.createElement("div", { className: "hero" },
-                    React.createElement("img", { src: "/build/assets/img/finsemble-display.png", width: "436px", height: "354px" }))))));
+                    React.createElement("img", { src: "/build/assets/img/finsemble-display.png", width: "436px", height: "354px", alt: "" }))))));
 };
 //# sourceMappingURL=GettingStarted.js.map

package/react/components/sdd/GettingStarted.js.map

@@ -1 +1 @@
-{"version":3,"file":"GettingStarted.js","sourceRoot":"","sources":["../../../src/components/sdd/GettingStarted.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAI7D,OAAO,2BAA2B,CAAC;AAInC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IAClC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,OAAO,CACN;QACC,6BAAK,SAAS,EAAC,2BAA2B,GAAG;QAC7C,oBAAC,IAAI;YACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;oBAClB,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;gBACtC,CAAC,kCAGO;YAET,oBAAC,OAAO;gBACP,4RAII;gBAEJ,6BAAK,SAAS,EAAC,MAAM;oBACpB,6BAAK,GAAG,EAAC,yCAAyC,EAAC,KAAK,EAAC,OAAO,EAAC,MAAM,EAAC,OAAO,GAAG,CAC7E,CACG,CACJ,CACL,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React from \"react\";\nimport { useDispatch } from \"../../store\";\nimport { Header } from \"../common/Header\";\nimport { ButtonTile } from \"../common/ButtonTile\";\nimport { View } from \"./View\";\nimport { Content } from \"./Content\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\n\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\n\nimport \"./css/getting-started.css\";\n\nexport type GettingStartedProps = {};\n\nexport const GettingStarted = () => {\n\tconst dispatch = useDispatch();\n\n\treturn (\n\t\t<>\n\t\t\t<div className=\"getting-started-gray-back\" />\n\t\t\t<View>\n\t\t\t\t<Header\n\t\t\t\t\thelpFunction={() => {\n\t\t\t\t\t\tlaunchTutorialLink(\"SDD-01-Welcome\");\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\tYour Smart Desktop Designer\n\t\t\t\t</Header>\n\n\t\t\t\t<Content>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tDesign a desktop for your users. Add, manage, and remove apps, configure the desktop look to follow your\n\t\t\t\t\t\tbranding, and arrange workspaces. When you’re done, you can publish your desktop to share with others or\n\t\t\t\t\t\tpackage it for further development.\n\t\t\t\t\t</p>\n\n\t\t\t\t\t<div className=\"hero\">\n\t\t\t\t\t\t<img src=\"/build/assets/img/finsemble-display.png\" width=\"436px\" height=\"354px\" />\n\t\t\t\t\t</div>\n\t\t\t\t</Content>\n\t\t\t</View>\n\t\t</>\n\t);\n};\n"]}
+{"version":3,"file":"GettingStarted.js","sourceRoot":"","sources":["../../../src/components/sdd/GettingStarted.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAI7D,OAAO,2BAA2B,CAAC;AAInC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IAClC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,OAAO,CACN;QACC,6BAAK,SAAS,EAAC,2BAA2B,GAAG;QAC7C,oBAAC,IAAI;YACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;oBAClB,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;gBACtC,CAAC,6BAGO;YAET,oBAAC,OAAO;gBACP,+PAII;gBAEJ,6BAAK,SAAS,EAAC,MAAM;oBACpB,6BAAK,GAAG,EAAC,yCAAyC,EAAC,KAAK,EAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAC,GAAG,EAAC,EAAE,GAAG,CACpF,CACG,CACJ,CACL,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React from \"react\";\nimport { useDispatch } from \"../../store\";\nimport { Header } from \"../common/Header\";\nimport { ButtonTile } from \"../common/ButtonTile\";\nimport { View } from \"./View\";\nimport { Content } from \"./Content\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\n\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\n\nimport \"./css/getting-started.css\";\n\nexport type GettingStartedProps = {};\n\nexport const GettingStarted = () => {\n\tconst dispatch = useDispatch();\n\n\treturn (\n\t\t<>\n\t\t\t<div className=\"getting-started-gray-back\" />\n\t\t\t<View>\n\t\t\t\t<Header\n\t\t\t\t\thelpFunction={() => {\n\t\t\t\t\t\tlaunchTutorialLink(\"SDD-01-Welcome\");\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\tSmart Desktop Designer\n\t\t\t\t</Header>\n\n\t\t\t\t<Content>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tDesign a smart desktop. Add, remove, and manage apps; arrange your workspaces. Customize the look to follow\n\t\t\t\t\t\tyour branding. When you&apos;re done, publish your desktop to share with others or package it for further\n\t\t\t\t\t\tdevelopment.\n\t\t\t\t\t</p>\n\n\t\t\t\t\t<div className=\"hero\">\n\t\t\t\t\t\t<img src=\"/build/assets/img/finsemble-display.png\" width=\"436px\" height=\"354px\" alt=\"\" />\n\t\t\t\t\t</div>\n\t\t\t\t</Content>\n\t\t\t</View>\n\t\t</>\n\t);\n};\n"]}

package/react/components/sdd/Navigation.js

@@ -2,7 +2,7 @@
  * Copyright 2017 - 2020 by ChartIQ, Inc.
  * All rights reserved.
  */
-import React from "react";
+import React, { useRef } from "react";
 import { useSelector, useDispatch } from "../../store";
 import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
 import "./css/nav.css";
@@ -10,6 +10,7 @@ import { FinsembleIcon } from "../common/FinsembleIcon";
 import { Tooltip } from "../common/Tooltip";
 export const Navigation = (props) => {
     const dispatch = useDispatch();
+    const tabList = useRef(null);
     const { views } = props;
     const currentViewId = useSelector((state) => state.smartDesktopDesigner.currentViewId);
     const errors = useSelector((state) => state.smartDesktopDesigner.errors);
@@ -17,10 +18,33 @@ export const Navigation = (props) => {
     if (currentViewId === null) {
         dispatch(SmartDesktopDesignerActions.change_view(views[0].views[0].id));
     }
-    return (React.createElement(React.Fragment, null, views.map((section, i) => (React.createElement("div", { key: `nav-section-${i}`, className: "nav-section" },
+    const changeTab = (viewId, direction) => {
+        var _a, _b;
+        const tabReferences = (_a = tabList.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll("[role='tab']");
+        if (tabReferences === undefined) {
+            return;
+        }
+        const currentIndex = Array.from(tabReferences).findIndex((elem) => elem.id.includes(viewId));
+        if (currentIndex === tabReferences.length) {
+            return;
+        }
+        (_b = tabReferences[currentIndex + direction]) === null || _b === void 0 ? void 0 : _b.focus();
+    };
+    return (React.createElement("div", { role: "tablist", ref: tabList }, views.map((section, i) => (React.createElement("div", { key: `nav-section-${i}`, className: "nav-section" },
         section.showLabel && React.createElement("div", { className: "nav-label" }, section.label),
-        React.createElement("ul", { className: "nav" }, section.views.map((view) => (React.createElement("li", { key: view.name, className: ["nav-item", view.id === currentViewId ? "active" : ""].join(" ") },
-            React.createElement("a", { id: `${view.id}-nav-link`, href: "#", onClick: (e) => {
+        React.createElement("ul", { className: "nav" }, section.views.map((view) => (React.createElement("div", { key: view.name, "aria-selected": view.id === currentViewId, className: "nav-item" },
+            React.createElement("div", { key: view.name, id: `${view.id}-nav-link`, tabIndex: view.id === currentViewId ? 0 : -1, role: "tab", onKeyDown: (e) => {
+                    if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
+                        changeTab(view.id, -1);
+                    }
+                    else if (e.key === "ArrowRight" || e.key === "ArrowDown") {
+                        changeTab(view.id, 1);
+                    }
+                    else if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        dispatch(SmartDesktopDesignerActions.change_view(view.id));
+                    }
+                }, onClick: (e) => {
                     e.preventDefault();
                     dispatch(SmartDesktopDesignerActions.change_view(view.id));
                 } },

package/react/components/sdd/Navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sourceRoot":"","sources":["../../../src/components/sdd/Navigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React from \"react\";\nimport { useSelector, useDispatch } from \"../../store\";\n\nimport { ViewSectionInfo } from \"../../types/smartDesktopDesignerTypes\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport \"./css/nav.css\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { Tooltip } from \"../common/Tooltip\";\n\nexport type NavigationProps = {\n\tviews: ViewSectionInfo[];\n};\n\nexport const Navigation = (props: NavigationProps) => {\n\tconst dispatch = useDispatch();\n\n\tconst { views } = props;\n\n\tconst currentViewId = useSelector((state: RootState) => state.smartDesktopDesigner.currentViewId);\n\tconst errors = useSelector((state: RootState) => state.smartDesktopDesigner.errors);\n\tconst isReviewingErrors = useSelector((state: RootState) => state.smartDesktopDesigner.isReviewingErrors);\n\n\tif (currentViewId === null) {\n\t\tdispatch(SmartDesktopDesignerActions.change_view(views[0].views[0].id));\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{views.map((section, i) => (\n\t\t\t\t<div key={`nav-section-${i}`} className=\"nav-section\">\n\t\t\t\t\t{section.showLabel && <div className=\"nav-label\">{section.label}</div>}\n\t\t\t\t\t<ul className=\"nav\">\n\t\t\t\t\t\t{section.views.map((view) => (\n\t\t\t\t\t\t\t<li key={view.name} className={[\"nav-item\", view.id === currentViewId ? \"active\" : \"\"].join(\" \")}>\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\tid={`${view.id}-nav-link`}\n\t\t\t\t\t\t\t\t\thref=\"#\"\n\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(view.id));\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{isReviewingErrors &&\n\t\t\t\t\t\t\t\t\t\tview.id !== \"export\" &&\n\t\t\t\t\t\t\t\t\t\terrors\n\t\t\t\t\t\t\t\t\t\t\t.filter((error) => error.viewId === view.id)\n\t\t\t\t\t\t\t\t\t\t\t.map((error, index) => (\n\t\t\t\t\t\t\t\t\t\t\t\t<div key={index} className=\"nav-error-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip type=\"warn\">{error.message}</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t<FinsembleIcon className=\"nav-icon\" icon={view.icon}></FinsembleIcon>\n\t\t\t\t\t\t\t\t\t<div className={[\"nav-icon\", view.icon].join(\" \")}></div>\n\t\t\t\t\t\t\t\t\t{view.name}\n\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</>\n\t);\n};\n"]}
+{"version":3,"file":"Navigation.js","sourceRoot":"","sources":["../../../src/components/sdd/Navigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useRef } from \"react\";\nimport { useSelector, useDispatch } from \"../../store\";\n\nimport { ViewSectionInfo } from \"../../types/smartDesktopDesignerTypes\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport \"./css/nav.css\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { Tooltip } from \"../common/Tooltip\";\n\nexport type NavigationProps = {\n\tviews: ViewSectionInfo[];\n};\n\nexport const Navigation = (props: NavigationProps) => {\n\tconst dispatch = useDispatch();\n\tconst tabList = useRef<HTMLDivElement>(null);\n\n\tconst { views } = props;\n\n\tconst currentViewId = useSelector((state: RootState) => state.smartDesktopDesigner.currentViewId);\n\tconst errors = useSelector((state: RootState) => state.smartDesktopDesigner.errors);\n\tconst isReviewingErrors = useSelector((state: RootState) => state.smartDesktopDesigner.isReviewingErrors);\n\n\tif (currentViewId === null) {\n\t\tdispatch(SmartDesktopDesignerActions.change_view(views[0].views[0].id));\n\t}\n\n\tconst changeTab = (viewId: string, direction: 1 | -1) => {\n\t\tconst tabReferences = tabList.current?.querySelectorAll(\"[role='tab']\") as NodeListOf<HTMLElement> | undefined;\n\t\tif (tabReferences === undefined) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentIndex = Array.from(tabReferences).findIndex((elem) => elem.id.includes(viewId));\n\n\t\tif (currentIndex === tabReferences.length) {\n\t\t\treturn;\n\t\t}\n\n\t\ttabReferences[currentIndex + direction]?.focus();\n\t};\n\n\treturn (\n\t\t<div role=\"tablist\" ref={tabList}>\n\t\t\t{views.map((section, i) => (\n\t\t\t\t<div key={`nav-section-${i}`} className=\"nav-section\">\n\t\t\t\t\t{section.showLabel && <div className=\"nav-label\">{section.label}</div>}\n\t\t\t\t\t<ul className=\"nav\">\n\t\t\t\t\t\t{section.views.map((view) => (\n\t\t\t\t\t\t\t<div key={view.name} aria-selected={view.id === currentViewId} className=\"nav-item\">\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={view.name}\n\t\t\t\t\t\t\t\t\tid={`${view.id}-nav-link`}\n\t\t\t\t\t\t\t\t\ttabIndex={view.id === currentViewId ? 0 : -1}\n\t\t\t\t\t\t\t\t\trole=\"tab\"\n\t\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\t\tif (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n\t\t\t\t\t\t\t\t\t\t\tchangeTab(view.id, -1);\n\t\t\t\t\t\t\t\t\t\t} else if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n\t\t\t\t\t\t\t\t\t\t\tchangeTab(view.id, 1);\n\t\t\t\t\t\t\t\t\t\t} else if (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(view.id));\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(view.id));\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{isReviewingErrors &&\n\t\t\t\t\t\t\t\t\t\tview.id !== \"export\" &&\n\t\t\t\t\t\t\t\t\t\terrors\n\t\t\t\t\t\t\t\t\t\t\t.filter((error) => error.viewId === view.id)\n\t\t\t\t\t\t\t\t\t\t\t.map((error, index) => (\n\t\t\t\t\t\t\t\t\t\t\t\t<div key={index} className=\"nav-error-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip type=\"warn\">{error.message}</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t<FinsembleIcon className=\"nav-icon\" icon={view.icon}></FinsembleIcon>\n\t\t\t\t\t\t\t\t\t<div className={[\"nav-icon\", view.icon].join(\" \")}></div>\n\t\t\t\t\t\t\t\t\t{view.name}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t);\n};\n"]}

package/react/components/sdd/OptionalSettingsView.d.ts

@@ -1,9 +1,10 @@
 import React from "react";
+import { SmartDesktopClient } from "./smartDesktopClient";
 export declare type OptionalSettingsViewProps = {
-    getApps: typeof FSBL.Clients.SmartDesktopClient.prototype.getApps;
-    updateApp: typeof FSBL.Clients.SmartDesktopClient.prototype.updateApp;
-    getPreloads: typeof FSBL.Clients.SmartDesktopClient.prototype.getPreloads;
-    savePreload: typeof FSBL.Clients.SmartDesktopClient.prototype.savePreload;
-    deletePreload: typeof FSBL.Clients.SmartDesktopClient.prototype.deletePreload;
+    getApps: typeof SmartDesktopClient.getApps;
+    updateApp: typeof SmartDesktopClient.updateApp;
+    getPreloads: typeof SmartDesktopClient.getPreloads;
+    savePreload: typeof SmartDesktopClient.savePreload;
+    deletePreload: typeof SmartDesktopClient.deletePreload;
 };
 export declare const OptionalSettingsView: React.FunctionComponent<OptionalSettingsViewProps>;

package/react/components/sdd/OptionalSettingsView.js

@@ -8,12 +8,7 @@ import { Preloads } from "./Preloads";
 import { EditPreload } from "./EditPreload";
 import { useDispatch } from "../../store";
 import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
-const openLink = (url) => {
-    FSBL.Clients.LauncherClient.spawn("", {
-        url,
-        addToWorkspace: false,
-    }, () => { });
-};
+import { FinsembleLink } from "../common/FinsembleLink";
 export const OptionalSettingsView = (props) => {
     const dispatch = useDispatch();
     const [currentPreloadAlias, setCurrentPreloadAlias] = useState(null);
@@ -34,10 +29,7 @@ export const OptionalSettingsView = (props) => {
                     React.createElement("div", { className: "frontmatter" },
                         "A preload is a script that is loaded into a window before the actual content of that window is loaded. Preloads provide added flexibility because they allows you to run additional code in the window without changing code for the app that the window belongs to. ",
                         React.createElement("br", null),
-                        React.createElement("a", { href: "", onClick: (e) => {
-                                e.preventDefault();
-                                openLink("https://documentation.finsemble.com/tutorial-Preloads.html");
-                            } }, "Learn more about preloads"),
+                        React.createElement(FinsembleLink, { url: "https://documentation.finsemble.com/tutorial-Preloads.html", text: "Learn more about preloads" }),
                         "."),
                     currentPreloadAlias === null ? (React.createElement(Preloads, { setCurrentPreloadAlias: setCurrentPreloadAlias, deletePreload: async (alias) => {
                             await props.deletePreload(alias);

package/react/components/sdd/OptionalSettingsView.js.map

@@ -1 +1 @@
-{"version":3,"file":"OptionalSettingsView.js","sourceRoot":"","sources":["../../../src/components/sdd/OptionalSettingsView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { Header } from \"../common/Header\";\nimport { View } from \"./View\";\nimport { Content } from \"./Content\";\nimport { Tab } from \"../common/Tab\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\nimport { Preloads } from \"./Preloads\";\nimport { EditPreload } from \"./EditPreload\";\nimport { useDispatch } from \"../../store\";\nimport { PreloadDetail } from \"../../types/smartDesktopDesignerTypes\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\n\nexport type OptionalSettingsViewProps = {\n\tgetApps: typeof FSBL.Clients.SmartDesktopClient.prototype.getApps;\n\tupdateApp: typeof FSBL.Clients.SmartDesktopClient.prototype.updateApp;\n\tgetPreloads: typeof FSBL.Clients.SmartDesktopClient.prototype.getPreloads;\n\tsavePreload: typeof FSBL.Clients.SmartDesktopClient.prototype.savePreload;\n\tdeletePreload: typeof FSBL.Clients.SmartDesktopClient.prototype.deletePreload;\n};\n\nconst openLink = (url: string) => {\n\tFSBL.Clients.LauncherClient.spawn(\n\t\t\"\",\n\t\t{\n\t\t\turl,\n\t\t\taddToWorkspace: false,\n\t\t},\n\t\t() => {}\n\t);\n};\n\nexport const OptionalSettingsView: React.FunctionComponent<OptionalSettingsViewProps> = (props) => {\n\tconst dispatch = useDispatch();\n\tconst [currentPreloadAlias, setCurrentPreloadAlias] = useState<string | null>(null);\n\n\tconst refreshPreloadList = async () => {\n\t\tconst { data } = await props.getPreloads();\n\t\tdispatch(SmartDesktopDesignerActions.update_preloads(data));\n\t};\n\n\tuseEffect(() => {\n\t\trefreshPreloadList();\n\t}, []);\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"SDD-06-Preloads\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tExtensions\n\t\t\t</Header>\n\n\t\t\t<Content>\n\t\t\t\t<Tab>\n\t\t\t\t\t<div data-label=\"Preloads\">\n\t\t\t\t\t\t<div className=\"frontmatter\">\n\t\t\t\t\t\t\tA preload is a script that is loaded into a window before the actual content of that window is loaded.\n\t\t\t\t\t\t\tPreloads provide added flexibility because they allows you to run additional code in the window without\n\t\t\t\t\t\t\tchanging code for the app that the window belongs to. <br />\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\thref=\"\"\n\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\topenLink(\"https://documentation.finsemble.com/tutorial-Preloads.html\");\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tLearn more about preloads\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t.\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{currentPreloadAlias === null ? (\n\t\t\t\t\t\t\t<Preloads\n\t\t\t\t\t\t\t\tsetCurrentPreloadAlias={setCurrentPreloadAlias}\n\t\t\t\t\t\t\t\tdeletePreload={async (alias: string) => {\n\t\t\t\t\t\t\t\t\tawait props.deletePreload(alias);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EditPreload\n\t\t\t\t\t\t\t\talias={currentPreloadAlias}\n\t\t\t\t\t\t\t\tgetApps={props.getApps}\n\t\t\t\t\t\t\t\tupdateApp={props.updateApp}\n\t\t\t\t\t\t\t\tcancel={() => {\n\t\t\t\t\t\t\t\t\tsetCurrentPreloadAlias(null);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsubmit={async (oldAlias: string | null, newAlias: string, detail: PreloadDetail) => {\n\t\t\t\t\t\t\t\t\tawait props.savePreload(oldAlias, newAlias, detail);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tdeletePreload={async (alias: string) => {\n\t\t\t\t\t\t\t\t\tconst result = await props.deletePreload(alias);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t\treturn result;\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</Tab>\n\t\t\t</Content>\n\t\t</View>\n\t);\n};\n"]}
+{"version":3,"file":"OptionalSettingsView.js","sourceRoot":"","sources":["../../../src/components/sdd/OptionalSettingsView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AACxF,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAWxD,MAAM,CAAC,MAAM,oBAAoB,GAAuD,CAAC,KAAK,EAAE,EAAE;IACjG,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAEpF,MAAM,kBAAkB,GAAG,KAAK,IAAI,EAAE;QACrC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,KAAK,CAAC,WAAW,EAAE,CAAC;QAC3C,QAAQ,CAAC,2BAA2B,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACd,kBAAkB,EAAE,CAAC;IACtB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACN,oBAAC,IAAI;QACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;gBAClB,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;YACvC,CAAC,iBAGO;QAET,oBAAC,OAAO;YACP,oBAAC,GAAG;gBACH,2CAAgB,UAAU;oBACzB,6BAAK,SAAS,EAAC,aAAa;;wBAG2B,+BAAM;wBAC5D,oBAAC,aAAa,IACb,GAAG,EAAC,4DAA4D,EAChE,IAAI,EAAC,2BAA2B,GAC/B;4BAEG;oBACL,mBAAmB,KAAK,IAAI,CAAC,CAAC,CAAC,CAC/B,oBAAC,QAAQ,IACR,sBAAsB,EAAE,sBAAsB,EAC9C,aAAa,EAAE,KAAK,EAAE,KAAa,EAAE,EAAE;4BACtC,MAAM,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;4BACjC,kBAAkB,EAAE,CAAC;wBACtB,CAAC,GACA,CACF,CAAC,CAAC,CAAC,CACH,oBAAC,WAAW,IACX,KAAK,EAAE,mBAAmB,EAC1B,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,MAAM,EAAE,GAAG,EAAE;4BACZ,sBAAsB,CAAC,IAAI,CAAC,CAAC;wBAC9B,CAAC,EACD,MAAM,EAAE,KAAK,EAAE,QAAuB,EAAE,QAAgB,EAAE,MAAqB,EAAE,EAAE;4BAClF,MAAM,KAAK,CAAC,WAAW,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;4BACpD,kBAAkB,EAAE,CAAC;wBACtB,CAAC,EACD,aAAa,EAAE,KAAK,EAAE,KAAa,EAAE,EAAE;4BACtC,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;4BAChD,kBAAkB,EAAE,CAAC;4BACrB,OAAO,MAAM,CAAC;wBACf,CAAC,GACA,CACF,CACI,CACD,CACG,CACJ,CACP,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { Header } from \"../common/Header\";\nimport { View } from \"./View\";\nimport { Content } from \"./Content\";\nimport { Tab } from \"../common/Tab\";\nimport { launchTutorialLink } from \"./common/fsbl_functions\";\nimport { Preloads } from \"./Preloads\";\nimport { EditPreload } from \"./EditPreload\";\nimport { useDispatch } from \"../../store\";\nimport { PreloadDetail } from \"../../types/smartDesktopDesignerTypes\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { FinsembleLink } from \"../common/FinsembleLink\";\nimport { SmartDesktopClient } from \"./smartDesktopClient\";\n\nexport type OptionalSettingsViewProps = {\n\tgetApps: typeof SmartDesktopClient.getApps;\n\tupdateApp: typeof SmartDesktopClient.updateApp;\n\tgetPreloads: typeof SmartDesktopClient.getPreloads;\n\tsavePreload: typeof SmartDesktopClient.savePreload;\n\tdeletePreload: typeof SmartDesktopClient.deletePreload;\n};\n\nexport const OptionalSettingsView: React.FunctionComponent<OptionalSettingsViewProps> = (props) => {\n\tconst dispatch = useDispatch();\n\tconst [currentPreloadAlias, setCurrentPreloadAlias] = useState<string | null>(null);\n\n\tconst refreshPreloadList = async () => {\n\t\tconst { data } = await props.getPreloads();\n\t\tdispatch(SmartDesktopDesignerActions.update_preloads(data));\n\t};\n\n\tuseEffect(() => {\n\t\trefreshPreloadList();\n\t}, []);\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"SDD-06-Preloads\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tExtensions\n\t\t\t</Header>\n\n\t\t\t<Content>\n\t\t\t\t<Tab>\n\t\t\t\t\t<div data-label=\"Preloads\">\n\t\t\t\t\t\t<div className=\"frontmatter\">\n\t\t\t\t\t\t\tA preload is a script that is loaded into a window before the actual content of that window is loaded.\n\t\t\t\t\t\t\tPreloads provide added flexibility because they allows you to run additional code in the window without\n\t\t\t\t\t\t\tchanging code for the app that the window belongs to. <br />\n\t\t\t\t\t\t\t<FinsembleLink\n\t\t\t\t\t\t\t\turl=\"https://documentation.finsemble.com/tutorial-Preloads.html\"\n\t\t\t\t\t\t\t\ttext=\"Learn more about preloads\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t.\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{currentPreloadAlias === null ? (\n\t\t\t\t\t\t\t<Preloads\n\t\t\t\t\t\t\t\tsetCurrentPreloadAlias={setCurrentPreloadAlias}\n\t\t\t\t\t\t\t\tdeletePreload={async (alias: string) => {\n\t\t\t\t\t\t\t\t\tawait props.deletePreload(alias);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EditPreload\n\t\t\t\t\t\t\t\talias={currentPreloadAlias}\n\t\t\t\t\t\t\t\tgetApps={props.getApps}\n\t\t\t\t\t\t\t\tupdateApp={props.updateApp}\n\t\t\t\t\t\t\t\tcancel={() => {\n\t\t\t\t\t\t\t\t\tsetCurrentPreloadAlias(null);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsubmit={async (oldAlias: string | null, newAlias: string, detail: PreloadDetail) => {\n\t\t\t\t\t\t\t\t\tawait props.savePreload(oldAlias, newAlias, detail);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tdeletePreload={async (alias: string) => {\n\t\t\t\t\t\t\t\t\tconst result = await props.deletePreload(alias);\n\t\t\t\t\t\t\t\t\trefreshPreloadList();\n\t\t\t\t\t\t\t\t\treturn result;\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</Tab>\n\t\t\t</Content>\n\t\t</View>\n\t);\n};\n"]}

package/react/components/sdd/ProjectErrors.js

@@ -19,7 +19,7 @@ export const ProjectErrors = (props) => {
     return (React.createElement("div", { className: "project-errors-container" }, errors.map((error, index) => (React.createElement("div", { key: index, className: "project-error", onClick: () => {
             dispatch(SmartDesktopDesignerActions.change_view(error.viewId));
         } },
-        React.createElement(FinsembleIcon, { className: "project-error-icon", icon: "exclamation-circle" }),
+        React.createElement(FinsembleIcon, { className: "project-error-icon", icon: "exclamation-circle", label: "Error" }),
         error.message)))));
 };
 //# sourceMappingURL=ProjectErrors.js.map