@finsemble/finsemble-ui 6.3.2 → 6.5.0-beta.2

package/react/components/smartDesktopDesigner/EditPreload.js

@@ -0,0 +1,169 @@
+import React, { useEffect, useState } from "react";
+import "../common/css/preload-edit-page.css";
+import { FinsembleSelect } from "../common/FinsembleSelect";
+import { Button } from "../common/Button";
+export const EditPreload = ({ preload, getConfig, getApps, updateApp, cancelFunction, addPreload, updatePreload, deletePreload, }) => {
+    const [appList, setAppList] = useState([]);
+    const [appNameList, setAppNameList] = useState([]);
+    const [appNameValues, setAppNameValues] = useState([]);
+    const [selectedApps, setSelectedApps] = useState([]);
+    const [usageType, setUsageType] = useState("selection");
+    const [livePreload, setLivePreload] = useState(Object.assign({}, preload));
+    const [disableSubmit, setDisableSubmit] = useState(true);
+    const [key, setKey] = useState(`${Date.now()}.${Math.random()}`);
+    const validatePreload = (edited) => {
+        let urlValid = true;
+        try {
+            new URL(edited.url);
+        }
+        catch (e) {
+            urlValid = false;
+        }
+        return !!edited.alias && urlValid;
+    };
+    const removePreload = async (alias) => {
+        await deletePreload(alias);
+        cancelFunction();
+    };
+    const getUsageType = () => {
+        getConfig("finsemble.servicesConfig.launcher.defaultPreloads").then(({ data }) => {
+            var _a, _b;
+            let type = "selection";
+            const globalConfig = data !== null && data !== void 0 ? data : {};
+            if ((_a = globalConfig.allComponents) === null || _a === void 0 ? void 0 : _a.includes(preload.alias)) {
+                type = "all";
+            }
+            else if ((_b = globalConfig.launchableComponents) === null || _b === void 0 ? void 0 : _b.includes(preload.alias)) {
+                type = "launchable";
+            }
+            setUsageType(type);
+        });
+    };
+    const setAlias = (alias) => {
+        setLivePreload(Object.assign(Object.assign({}, livePreload), { alias }));
+    };
+    const setUrl = (url) => {
+        setLivePreload(Object.assign(Object.assign({}, livePreload), { url }));
+    };
+    useEffect(() => {
+        setDisableSubmit(!validatePreload(livePreload));
+    }, [livePreload]);
+    useEffect(() => {
+        setKey(`${Date.now()}.${Math.random()}`);
+    }, [appList, appNameList, selectedApps]);
+    useEffect(() => {
+        getUsageType();
+        getApps().then(({ apps }) => {
+            const appNames = [];
+            const appValues = [];
+            const selectedNames = [];
+            apps.forEach((app) => {
+                var _a, _b, _c;
+                appNames.push(app.name);
+                appValues.push(app.appId);
+                if ((_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(preload === null || preload === void 0 ? void 0 : preload.alias)) {
+                    selectedNames.push(app.name);
+                }
+            });
+            setAppNameValues(appValues);
+            setAppNameList(appNames);
+            setSelectedApps(selectedNames);
+            setAppList(apps);
+        });
+        validatePreload(livePreload);
+    }, []);
+    const onRadioChange = (e) => {
+        setUsageType(e.target.value);
+    };
+    const selectChange = (selectedValues) => {
+        setSelectedApps(selectedValues);
+    };
+    const updateAppConfigs = async () => {
+        const promises = appList.map((app) => {
+            var _a, _b, _c, _d, _e;
+            let appPreloads = (_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 ? _c : [];
+            appPreloads = Array.isArray(appPreloads) ? appPreloads : [appPreloads];
+            const isRenaming = livePreload.alias != preload.alias;
+            const wasPreviouslySelected = appPreloads.includes(preload.alias);
+            const inNewList = selectedApps.includes(app.appId);
+            app.manifest = (_d = app.manifest) !== null && _d !== void 0 ? _d : {};
+            app.manifest.component = (_e = app.manifest.component) !== null && _e !== void 0 ? _e : {};
+            if ((!isRenaming && wasPreviouslySelected == inNewList) || (!wasPreviouslySelected && !inNewList)) {
+                return Promise.resolve();
+            }
+            if (wasPreviouslySelected) {
+                appPreloads = appPreloads.filter((preloadAlias) => preloadAlias != preload.alias);
+            }
+            if (inNewList) {
+                appPreloads.push(livePreload.alias);
+            }
+            app.manifest.component.preload = appPreloads;
+            return updateApp(app.appId, app);
+        });
+        return Promise.all(promises);
+    };
+    const clickSubmit = async () => {
+        const usage = {
+            all: usageType == "all",
+            launchable: usageType == "launchable",
+            apps: selectedApps,
+        };
+        if (preload.alias === "") {
+            await addPreload(livePreload, usage);
+        }
+        else {
+            await updatePreload(preload.alias, livePreload, usage);
+        }
+        await updateAppConfigs();
+        cancelFunction();
+    };
+    return (React.createElement("div", { className: "preload-edit-container" },
+        React.createElement("h2", null, (livePreload === null || livePreload === void 0 ? void 0 : livePreload.alias) ? livePreload.alias : "Untitled preload"),
+        React.createElement("div", { className: "app-edit-field" },
+            React.createElement("table", { role: "presentation", className: "preload-edit-table" },
+                React.createElement("tbody", null,
+                    React.createElement("tr", null,
+                        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: livePreload === null || livePreload === void 0 ? void 0 : livePreload.alias, placeholder: "UntitledPreload", onChange: (e) => {
+                                    setAlias(e.target.value);
+                                } }))),
+                    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: livePreload === null || livePreload === void 0 ? void 0 : livePreload.url, onChange: (e) => {
+                                    setUrl(e.target.value);
+                                } }))),
+                    React.createElement("tr", null,
+                        React.createElement("th", { className: "table-header__top-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 }),
+                                    " ",
+                                    "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 }),
+                                    " ",
+                                    "All apps")),
+                            React.createElement("div", { className: "load-option" },
+                                React.createElement("label", null,
+                                    React.createElement("input", { type: "radio", name: "preload-usage", value: "selection", checked: usageType == "selection", onChange: onRadioChange }),
+                                    " ",
+                                    "Select apps")),
+                            usageType == "selection" && (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, preload.alias && (React.createElement(Button, { fashion: "danger", text: "Remove preload", onClick: (e) => {
+                    removePreload(preload.alias);
+                    e.preventDefault();
+                } }))),
+            React.createElement("div", { className: "app-actions-right-wrapper" },
+                React.createElement(Button, { fashion: "ghost", text: "Cancel", onClick: () => {
+                        cancelFunction();
+                    } }),
+                React.createElement(Button, { fashion: "secondary", text: "Save", disabled: disableSubmit, onClick: clickSubmit })))));
+};
+//# sourceMappingURL=EditPreload.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EditPreload.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/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 { PreloadType } from \"../../types/smartDesktopDesignerTypes\";\nimport { AppDefinition } from \"./Application\";\n\nexport interface EditPreloadProps {\n\tgetConfig: typeof FSBL.Clients.ConfigClient.getValue;\n\tpreload: PreloadType;\n\t// Perhaps use the root state to get this value\n\tgetApps: typeof FSBL.Clients.SmartDesktopClient.prototype.getApps;\n\tupdateApp: typeof FSBL.Clients.SmartDesktopClient.prototype.updateApp;\n\tcancelFunction: Function;\n\taddPreload: Function;\n\tupdatePreload: Function;\n\tdeletePreload: (alias: string) => Promise<void>;\n}\n\ntype preloadUsageType = \"launchable\" | \"all\" | \"selection\";\n\nexport const EditPreload: React.FunctionComponent<EditPreloadProps> = ({\n\tpreload,\n\tgetConfig,\n\tgetApps,\n\tupdateApp,\n\tcancelFunction,\n\taddPreload,\n\tupdatePreload,\n\tdeletePreload,\n}) => {\n\tconst [appList, setAppList] = useState<AppDefinition[]>([]);\n\tconst [appNameList, setAppNameList] = useState<string[]>([]);\n\tconst [appNameValues, setAppNameValues] = useState<string[]>([]);\n\tconst [selectedApps, setSelectedApps] = useState<string[]>([]);\n\tconst [usageType, setUsageType] = useState<preloadUsageType>(\"selection\");\n\tconst [livePreload, setLivePreload] = useState({ ...preload });\n\tconst [disableSubmit, setDisableSubmit] = useState<boolean>(true);\n\tconst [key, setKey] = useState(`${Date.now()}.${Math.random()}`);\n\n\tconst validatePreload = (edited: PreloadType): boolean => {\n\t\tlet urlValid = true;\n\t\ttry {\n\t\t\tnew URL(edited.url);\n\t\t} catch (e) {\n\t\t\turlValid = false;\n\t\t}\n\n\t\treturn !!edited.alias && urlValid;\n\t};\n\n\tconst removePreload = async (alias: string) => {\n\t\tawait deletePreload(alias);\n\t\tcancelFunction();\n\t};\n\n\tconst getUsageType = () => {\n\t\tgetConfig(\"finsemble.servicesConfig.launcher.defaultPreloads\").then(({ data }) => {\n\t\t\tlet type: preloadUsageType = \"selection\";\n\t\t\tconst globalConfig = data ?? {};\n\t\t\tif (globalConfig.allComponents?.includes(preload.alias)) {\n\t\t\t\ttype = \"all\";\n\t\t\t} else if (globalConfig.launchableComponents?.includes(preload.alias)) {\n\t\t\t\ttype = \"launchable\";\n\t\t\t}\n\t\t\tsetUsageType(type);\n\t\t});\n\t};\n\n\tconst setAlias = (alias: string) => {\n\t\tsetLivePreload({ ...livePreload, alias });\n\t};\n\n\tconst setUrl = (url: string) => {\n\t\tsetLivePreload({ ...livePreload, url });\n\t};\n\n\tuseEffect(() => {\n\t\tsetDisableSubmit(!validatePreload(livePreload));\n\t}, [livePreload]);\n\n\tuseEffect(() => {\n\t\tsetKey(`${Date.now()}.${Math.random()}`);\n\t}, [appList, appNameList, selectedApps]);\n\n\tuseEffect(() => {\n\t\tgetUsageType();\n\t\tgetApps().then(({ apps }) => {\n\t\t\tconst appNames: string[] = [];\n\t\t\tconst appValues: string[] = [];\n\t\t\tconst selectedNames: string[] = [];\n\n\t\t\tapps.forEach((app: AppDefinition) => {\n\t\t\t\tappNames.push(app.name);\n\t\t\t\tappValues.push(app.appId);\n\t\t\t\tif (app.manifest?.component?.preload?.includes(preload?.alias)) {\n\t\t\t\t\tselectedNames.push(app.name);\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tsetAppNameValues(appValues);\n\t\t\tsetAppNameList(appNames);\n\t\t\tsetSelectedApps(selectedNames);\n\t\t\tsetAppList(apps);\n\t\t});\n\t\tvalidatePreload(livePreload);\n\t}, []);\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 updateAppConfigs = async () => {\n\t\tconst promises: Promise<any>[] = appList.map((app) => {\n\t\t\tlet appPreloads = app.manifest?.component?.preload ?? [];\n\t\t\tappPreloads = Array.isArray(appPreloads) ? appPreloads : [appPreloads];\n\t\t\tconst isRenaming = livePreload.alias != preload.alias;\n\t\t\tconst wasPreviouslySelected = appPreloads.includes(preload.alias);\n\t\t\tconst inNewList = selectedApps.includes(app.appId);\n\t\t\tapp.manifest = app.manifest ?? {};\n\t\t\tapp.manifest.component = app.manifest.component ?? {};\n\n\t\t\tif ((!isRenaming && wasPreviouslySelected == inNewList) || (!wasPreviouslySelected && !inNewList)) {\n\t\t\t\t// No change for this app\n\t\t\t\treturn Promise.resolve();\n\t\t\t}\n\n\t\t\tif (wasPreviouslySelected) {\n\t\t\t\t// Remove it from the list\n\t\t\t\tappPreloads = appPreloads.filter((preloadAlias: string) => preloadAlias != preload.alias);\n\t\t\t}\n\n\t\t\tif (inNewList) {\n\t\t\t\tappPreloads.push(livePreload.alias);\n\t\t\t}\n\n\t\t\tapp.manifest.component.preload = appPreloads;\n\t\t\treturn updateApp(app.appId, app);\n\t\t});\n\n\t\treturn Promise.all(promises);\n\t};\n\n\tconst clickSubmit = async () => {\n\t\tconst usage: any = {\n\t\t\tall: usageType == \"all\",\n\t\t\tlaunchable: usageType == \"launchable\",\n\t\t\tapps: selectedApps,\n\t\t};\n\n\t\tif (preload.alias === \"\") {\n\t\t\tawait addPreload(livePreload, usage);\n\t\t} else {\n\t\t\tawait updatePreload(preload.alias, livePreload, usage);\n\t\t}\n\t\tawait updateAppConfigs();\n\t\tcancelFunction();\n\t};\n\n\treturn (\n\t\t<div className=\"preload-edit-container\">\n\t\t\t<h2>{livePreload?.alias ? livePreload.alias : \"Untitled preload\"}</h2>\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={livePreload?.alias}\n\t\t\t\t\t\t\t\t\tplaceholder=\"UntitledPreload\"\n\t\t\t\t\t\t\t\t\t// onKeyDown=\"\"\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={livePreload?.url}\n\t\t\t\t\t\t\t\t\t// onKeyDown={submitOnEnter}\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=\"selection\"\n\t\t\t\t\t\t\t\t\t\t\tchecked={usageType == \"selection\"}\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 == \"selection\" && (\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{preload.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={(e) => {\n\t\t\t\t\t\t\t\tremovePreload(preload.alias);\n\t\t\t\t\t\t\t\te.preventDefault();\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\tcancelFunction();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button fashion=\"secondary\" text=\"Save\" disabled={disableSubmit} onClick={clickSubmit} />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

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

@@ -11,5 +11,6 @@ export declare type ExportProps = {
     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;
 };
 export declare const Export: (props: ExportProps) => JSX.Element;

package/react/components/smartDesktopDesigner/Export.js

@@ -2,7 +2,7 @@
  * Copyright 2017 - 2020 by ChartIQ, Inc.
  * All rights reserved.
  */
-import React from "react";
+import React, { useState } from "react";
 import { View } from "./View";
 import { Header } from "../common/Header";
 import { Content } from "./Content";
@@ -10,24 +10,55 @@ import { ExportCloud } from "./ExportCloud";
 import { ExportZip } from "./ExportZip";
 import { Publish } from "./Publish";
 import { ExportDeployInfo } from "./ExportDeployInfo";
-import { useSelector } from "../../store";
+import { useSelector, useDispatch } from "../../store";
+import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
 import { launchTutorialLink } from "./common/fsbl_functions";
 import "./css/export.css";
 export const Export = (props) => {
+    const dispatch = useDispatch();
     const isPublishing = useSelector((store) => store.smartDesktopDesigner.export.isPublishing);
     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 setProject = (value) => {
+        dispatch(SmartDesktopDesignerActions.set_project_info(value));
+    };
+    const onSaveProjectName = (name) => {
+        props.updateProjectSettings(Object.assign(Object.assign({}, project), { name: name })).then(({ err }) => {
+            if (err) {
+                FSBL.Clients.Logger.system.error(`ERROR updateProjectSettings: ${JSON.stringify(err)}`);
+            }
+            else {
+                setProject(Object.assign(Object.assign({}, project), { name }));
+            }
+        });
+    };
     return (React.createElement(View, null,
         React.createElement(Header, { helpFunction: () => {
-                launchTutorialLink("publishing-a-desktop-project");
-            } }, "Publish"),
-        React.createElement(Content, null, isPublishing ? (React.createElement(Publish, Object.assign({}, props))) : (React.createElement("div", null,
+                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("div", { className: "export-project-name" },
+                React.createElement("label", { htmlFor: "projectName" }, "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) => {
+                        if (e.key === "Enter") {
+                            e.currentTarget.blur();
+                        }
+                    }, onBlur: () => {
+                        if (isProjectNameValid) {
+                            onSaveProjectName(tmpProjectName);
+                        }
+                    } })),
             React.createElement("div", { className: "export-methods" },
-                React.createElement(ExportCloud, Object.assign({}, props)),
-                React.createElement(ExportZip, Object.assign({}, props))),
+                React.createElement(ExportCloud, Object.assign({}, props, { valid: isProjectNameValid })),
+                React.createElement(ExportZip, Object.assign({}, props, { valid: isProjectNameValid }))),
             deployInfo && (React.createElement("div", { className: "deployInfoContainer" },
-                React.createElement("h2", null, "Published Project"),
                 React.createElement("div", null,
-                    React.createElement("p", null, "Share this installer link with your team to give them access to your desktop:"),
+                    React.createElement("p", null, "Project installer link:"),
                     React.createElement(ExportDeployInfo, null)))))))));
 };
 //# sourceMappingURL=Export.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Export.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/Export.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,kBAAkB,CAAC;AAW1B,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE;IAC5C,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IACvG,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IAEnG,OAAO,CACN,oBAAC,IAAI;QACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;gBAClB,kBAAkB,CAAC,8BAA8B,CAAC,CAAC;YACpD,CAAC,cAGO;QAET,oBAAC,OAAO,QACN,YAAY,CAAC,CAAC,CAAC,CACf,oBAAC,OAAO,oBAAK,KAAK,EAAI,CACtB,CAAC,CAAC,CAAC,CACH;YACC,6BAAK,SAAS,EAAC,gBAAgB;gBAC9B,oBAAC,WAAW,oBAAK,KAAK,EAAI;gBAC1B,oBAAC,SAAS,oBAAK,KAAK,EAAI,CACnB;YACL,UAAU,IAAI,CACd,6BAAK,SAAS,EAAC,qBAAqB;gBACnC,oDAA0B;gBAC1B;oBACC,+GAAoF;oBACpF,oBAAC,gBAAgB,OAAG,CACf,CACD,CACN,CACI,CACN,CACQ,CACJ,CACP,CAAC;AACH,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React 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 } from \"../../store\";\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};\n\nexport const Export = (props: ExportProps) => {\n\tconst isPublishing = useSelector((store: RootState) => store.smartDesktopDesigner.export.isPublishing);\n\tconst deployInfo = useSelector((store: RootState) => store.smartDesktopDesigner.export.deployInfo);\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"publishing-a-desktop-project\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tPublish\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>\n\t\t\t\t\t\t<div className=\"export-methods\">\n\t\t\t\t\t\t\t<ExportCloud {...props} />\n\t\t\t\t\t\t\t<ExportZip {...props} />\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<h2>Published Project</h2>\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t<p>Share this installer link with your team to give them access to your desktop:</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/smartDesktopDesigner/Export.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AAGxF,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,kBAAkB,CAAC;AAY1B,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE;IAC5C,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IACvG,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IACnG,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC;IAC1F,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,MAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAC,CAAC;IACvG,MAAM,kBAAkB,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,qBAAqB,CAAC,cAAc,CAAC,CAAC;IACjG,MAAM,UAAU,GAAG,CAAC,KAAsB,EAAE,EAAE;QAC7C,QAAQ,CAAC,2BAA2B,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC;IAC/D,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,IAAY,EAAE,EAAE;QAC1C,KAAK,CAAC,qBAAqB,iCAAM,OAAO,KAAE,IAAI,EAAE,IAAI,IAAG,CAAC,IAAI,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE;YACxE,IAAI,GAAG,EAAE;gBACR,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,gCAAgC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;aACxF;iBAAM;gBACN,UAAU,iCACN,OAAO,KACV,IAAI,IACH,CAAC;aACH;QACF,CAAC,CAAC,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACN,oBAAC,IAAI;QACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;gBAClB,kBAAkB,CAAC,eAAe,CAAC,CAAC;YACrC,CAAC,sBAGO;QAET,oBAAC,OAAO,QACN,YAAY,CAAC,CAAC,CAAC,CACf,oBAAC,OAAO,oBAAK,KAAK,EAAI,CACtB,CAAC,CAAC,CAAC,CACH,6BAAK,SAAS,EAAC,cAAc;YAC5B,kDAAwB;YACxB,6BAAK,SAAS,EAAC,qBAAqB;gBACnC,+BAAO,OAAO,EAAC,aAAa,mBAAqB;gBACjD,+BACC,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,oBAAoB,EAC9B,EAAE,EAAC,cAAc,EACjB,IAAI,EAAC,cAAc,EACnB,WAAW,EAAC,UAAU,kBACR,CAAC,kBAAkB,EACjC,KAAK,EAAE,cAAc,EACrB,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,EACvB,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;wBACnD,iBAAiB,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;oBACnC,CAAC,EACD,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;wBAChB,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;4BACtB,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;yBACvB;oBACF,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;wBACZ,IAAI,kBAAkB,EAAE;4BACvB,iBAAiB,CAAC,cAAc,CAAC,CAAC;yBAClC;oBACF,CAAC,GACA,CACG;YACN,6BAAK,SAAS,EAAC,gBAAgB;gBAC9B,oBAAC,WAAW,oBAAK,KAAK,IAAE,KAAK,EAAE,kBAAkB,IAAI;gBACrD,oBAAC,SAAS,oBAAK,KAAK,IAAE,KAAK,EAAE,kBAAkB,IAAI,CAC9C;YACL,UAAU,IAAI,CACd,6BAAK,SAAS,EAAC,qBAAqB;gBACnC;oBACC,yDAA8B;oBAC9B,oBAAC,gBAAgB,OAAG,CACf,CACD,CACN,CACI,CACN,CACQ,CACJ,CACP,CAAC;AACH,CAAC,CAAC","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"]}

package/react/components/smartDesktopDesigner/ExportCloud.d.ts

@@ -1,4 +1,6 @@
 /// <reference types="react" />
 import { ExportProps } from "./Export";
-export declare type ExportCloudProps = ExportProps;
+export declare type ExportCloudProps = ExportProps & {
+    valid: boolean;
+};
 export declare const ExportCloud: (props: ExportCloudProps) => JSX.Element;

package/react/components/smartDesktopDesigner/ExportCloud.js

@@ -17,15 +17,13 @@ export const ExportCloud = (props) => {
         };
         getProjectConfig();
     }, []);
-    return (React.createElement("div", { className: "export-method" },
+    return (React.createElement("div", { className: "export-method package-project" },
         deployInfo ? (React.createElement("div", null,
-            React.createElement("h2", null, "Update your project"),
-            React.createElement("p", null, "You can continue to update your desktop with new apps. Publish at any time to push updates to your team. They'll just need to restart their app to get the changes."))) : (React.createElement("div", null,
-            React.createElement("h2", null, "Publish your project"),
-            React.createElement("p", null, "Upload your smart desktop to Cosaic's cloud service to make it available to your team. After you publish, you can make changes and push updates to your team."))),
+            React.createElement("p", null, "Publish your project to share it with your users. Click Publish to create a project installer. Please be patient, it can take up to 20 minutes."))) : (React.createElement("div", null,
+            React.createElement("p", null, "You can continue working on your desktop project after you publish it. To update the project, republish it. Users will see the changes when they restart their desktop."))),
         React.createElement(ProjectErrors, { errors: projectErrors }),
         React.createElement("div", { className: "export-method-actions" },
-            React.createElement(Button, { disabled: projectErrors.length > 0, fashion: "secondary", text: "Publish", onClick: () => {
+            React.createElement(Button, { disabled: projectErrors.length > 0 || !props.valid, fashion: "secondary", text: "Publish", onClick: () => {
                     dispatch(SmartDesktopDesignerActions.set_is_publishing(true));
                     props
                         .publishToCosaicCloud()

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

@@ -1 +1 @@
-{"version":3,"file":"ExportCloud.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/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;AAIhD,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,eAAe;QAC5B,UAAU,CAAC,CAAC,CAAC,CACb;YACC,sDAA4B;YAC5B,qMAGI,CACC,CACN,CAAC,CAAC,CAAC,CACH;YACC,uDAA6B;YAC7B,+LAGI,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,EAClC,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\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\">\n\t\t\t{deployInfo ? (\n\t\t\t\t<div>\n\t\t\t\t\t<h2>Update your project</h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tYou can continue to update your desktop with new apps. Publish at any time to push updates to your team.\n\t\t\t\t\t\tThey&apos;ll just need to restart their app to get the changes.\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<h2>Publish your project</h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tUpload your smart desktop to Cosaic&apos;s cloud service to make it available to your team. After you\n\t\t\t\t\t\tpublish, you can make changes and push updates to your team.\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}\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/smartDesktopDesigner/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"]}

package/react/components/smartDesktopDesigner/ExportZip.d.ts

@@ -1,4 +1,6 @@
 /// <reference types="react" />
 import { ExportProps } from "./Export";
-export declare type ExportZipProps = ExportProps;
+export declare type ExportZipProps = ExportProps & {
+    valid: boolean;
+};
 export declare const ExportZip: (props: ExportZipProps) => JSX.Element;

package/react/components/smartDesktopDesigner/ExportZip.js

@@ -2,6 +2,7 @@ import React, { useState } from "react";
 import { useSelector } from "../../store";
 import { FinsembleIcon } from "../common/FinsembleIcon";
 import { Button } from "../common/Button";
+import { Checkbox } from "../common/Checkbox";
 export const ExportZip = (props) => {
     const projectSettings = useSelector((store) => store.smartDesktopDesigner.projectInfo);
     const projectErrors = useSelector((store) => store.smartDesktopDesigner.errors);
@@ -9,12 +10,16 @@ export const ExportZip = (props) => {
     const [lastExportCount, setLastExportCount] = useState(0);
     const [lastExportTime, setLastExportTime] = useState(null);
     const [lastExportError, setLastExportError] = useState(null);
+    const [iUnderstand, setIUnderstand] = useState(false);
     return (React.createElement("div", { className: "export-method" },
         React.createElement("div", null,
-            React.createElement("h2", null, "Share your design"),
-            React.createElement("p", null, "Much more can be done to create powerful desktops. Share your design with your developer or IT team to take it further.")),
+            React.createElement("h2", null, "Package project"),
+            React.createElement("p", null, "Many Finsemble features can't be configured by using SDD. Share your project with developers or IT to take it further."),
+            React.createElement(Checkbox, { label: "I understand that packaging a project is a one-time only operation. A packaged .zip file can\u2019t be imported back into SDD.", checked: iUnderstand, onClick: () => {
+                    setIUnderstand(!iUnderstand);
+                } })),
         React.createElement("div", { className: "export-method-actions" },
-            !isCopying ? (React.createElement(Button, { className: "export-method-button", disabled: projectErrors.length > 0, fashion: "secondary", text: "Export to local seed project", buttonAttributes: { "data-target-upload-path": "" }, onClick: (e) => {
+            !isCopying ? (React.createElement(Button, { className: "export-method-button", disabled: projectErrors.length > 0 || !props.valid || !iUnderstand, fashion: "secondary", text: "Package", buttonAttributes: { "data-target-upload-path": "" }, onClick: (e) => {
                     setIsCopying(true);
                     setLastExportError(null);
                     props

package/react/components/smartDesktopDesigner/ExportZip.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExportZip.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/ExportZip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAI1C,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE;IAClD,MAAM,eAAe,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC;IAClG,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAE3F,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC,CAAC;IAClE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC1E,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAE5E,OAAO,CACN,6BAAK,SAAS,EAAC,eAAe;QAC7B;YACC,oDAA0B;YAE1B,yJAGI,CACC;QAEN,6BAAK,SAAS,EAAC,uBAAuB;YACpC,CAAC,SAAS,CAAC,CAAC,CAAC,CACb,oBAAC,MAAM,IACN,SAAS,EAAC,sBAAsB,EAChC,QAAQ,EAAE,aAAa,CAAC,MAAM,GAAG,CAAC,EAClC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,8BAA8B,EACnC,gBAAgB,EAAE,EAAE,yBAAyB,EAAE,EAAE,EAAE,EACnD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,YAAY,CAAC,IAAI,CAAC,CAAC;oBACnB,kBAAkB,CAAC,IAAI,CAAC,CAAC;oBAEzB,KAAK;yBACH,gBAAgB,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC,gBAAgB,CAAC;yBAChF,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;wBAChB,kBAAkB,CAAC,KAAK,CAAC,CAAC;oBAC3B,CAAC,CAAC;yBACD,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE;wBACf,iBAAiB,CAAC,IAAI,IAAI,EAAE,CAAC,kBAAkB,EAAE,CAAC,CAAC;wBAEnD,IAAI,KAAK,EAAE;4BACV,kBAAkB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;yBACjC;oBACF,CAAC,CAAC;yBACD,OAAO,CAAC,GAAG,EAAE;wBACb,YAAY,CAAC,KAAK,CAAC,CAAC;oBACrB,CAAC,CAAC,CAAC;gBACL,CAAC,GACA,CACF,CAAC,CAAC,CAAC,CACH,gEAAuC,CACvC;YACA,cAAc,KAAK,IAAI,IAAI,eAAe,GAAG,CAAC,IAAI,CAClD,8BAAM,SAAS,EAAC,kBAAkB;gBACjC,oBAAC,aAAa,IAAC,SAAS,EAAC,uBAAuB,EAAC,IAAI,EAAC,OAAO,GAAiB;;gBACpE,eAAe;;gBAAY,cAAc,CAC7C,CACP;YACA,eAAe,KAAK,IAAI,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,eAAe,CAAQ,CAEpF,CACD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useState } from \"react\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { useSelector } from \"../../store\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { ExportProps } from \"./Export\";\nimport { Button } from \"../common/Button\";\n\nexport type ExportZipProps = ExportProps;\n\nexport const ExportZip = (props: ExportZipProps) => {\n\tconst projectSettings = useSelector((store: RootState) => store.smartDesktopDesigner.projectInfo);\n\tconst projectErrors = useSelector((store: RootState) => store.smartDesktopDesigner.errors);\n\n\tconst [isCopying, setIsCopying] = useState(false);\n\tconst [lastExportCount, setLastExportCount] = useState<number>(0);\n\tconst [lastExportTime, setLastExportTime] = useState<null | string>(null);\n\tconst [lastExportError, setLastExportError] = useState<null | string>(null);\n\n\treturn (\n\t\t<div className=\"export-method\">\n\t\t\t<div>\n\t\t\t\t<h2>Share your design</h2>\n\n\t\t\t\t<p>\n\t\t\t\t\tMuch more can be done to create powerful desktops. Share your design with your developer or IT team to take it\n\t\t\t\t\tfurther.\n\t\t\t\t</p>\n\t\t\t</div>\n\n\t\t\t<div className=\"export-method-actions\">\n\t\t\t\t{!isCopying ? (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"export-method-button\"\n\t\t\t\t\t\tdisabled={projectErrors.length > 0}\n\t\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\t\ttext=\"Export to local seed project\"\n\t\t\t\t\t\tbuttonAttributes={{ \"data-target-upload-path\": \"\" }}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tsetIsCopying(true);\n\t\t\t\t\t\t\tsetLastExportError(null);\n\n\t\t\t\t\t\t\tprops\n\t\t\t\t\t\t\t\t.copyProjectFiles(projectSettings.name, e.currentTarget.dataset.targetUploadPath)\n\t\t\t\t\t\t\t\t.catch((error) => {\n\t\t\t\t\t\t\t\t\tsetLastExportError(error);\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t.then((files) => {\n\t\t\t\t\t\t\t\t\tsetLastExportTime(new Date().toLocaleTimeString());\n\n\t\t\t\t\t\t\t\t\tif (files) {\n\t\t\t\t\t\t\t\t\t\tsetLastExportCount(files.length);\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.finally(() => {\n\t\t\t\t\t\t\t\t\tsetIsCopying(false);\n\t\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) : (\n\t\t\t\t\t<div>Exporting to seed project...</div>\n\t\t\t\t)}\n\t\t\t\t{lastExportTime !== null && lastExportCount > 0 && (\n\t\t\t\t\t<span className=\"last-export-time\">\n\t\t\t\t\t\t<FinsembleIcon className=\"last-export-time-icon\" icon=\"check\"></FinsembleIcon>\n\t\t\t\t\t\tExported {lastExportCount} files at {lastExportTime}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t{lastExportError !== null && <span className=\"last-export-error\">{lastExportError}</span>}\n\t\t\t\t{/* <button type=\"submit\">Share to Github</button> */}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}
+{"version":3,"file":"ExportZip.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/ExportZip.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from \"react\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { useSelector } from \"../../store\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { ExportProps } from \"./Export\";\nimport { Button } from \"../common/Button\";\nimport { Checkbox } from \"../common/Checkbox\";\n\nexport type ExportZipProps = ExportProps & {\n\tvalid: boolean;\n};\n\nexport const ExportZip = (props: ExportZipProps) => {\n\tconst projectSettings = useSelector((store: RootState) => store.smartDesktopDesigner.projectInfo);\n\tconst projectErrors = useSelector((store: RootState) => store.smartDesktopDesigner.errors);\n\n\tconst [isCopying, setIsCopying] = useState(false);\n\tconst [lastExportCount, setLastExportCount] = useState<number>(0);\n\tconst [lastExportTime, setLastExportTime] = useState<null | string>(null);\n\tconst [lastExportError, setLastExportError] = useState<null | string>(null);\n\tconst [iUnderstand, setIUnderstand] = useState(false);\n\n\treturn (\n\t\t<div className=\"export-method\">\n\t\t\t<div>\n\t\t\t\t<h2>Package project</h2>\n\n\t\t\t\t<p>\n\t\t\t\t\tMany Finsemble features can&apos;t be configured by using SDD. Share your project with developers or IT to\n\t\t\t\t\ttake it further.\n\t\t\t\t</p>\n\n\t\t\t\t<Checkbox\n\t\t\t\t\tlabel=\"I understand that packaging a project is a one-time only operation. A packaged .zip file can’t be imported back into SDD.\"\n\t\t\t\t\tchecked={iUnderstand}\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tsetIUnderstand(!iUnderstand);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div className=\"export-method-actions\">\n\t\t\t\t{!isCopying ? (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"export-method-button\"\n\t\t\t\t\t\tdisabled={projectErrors.length > 0 || !props.valid || !iUnderstand}\n\t\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\t\ttext=\"Package\"\n\t\t\t\t\t\tbuttonAttributes={{ \"data-target-upload-path\": \"\" }}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tsetIsCopying(true);\n\t\t\t\t\t\t\tsetLastExportError(null);\n\n\t\t\t\t\t\t\tprops\n\t\t\t\t\t\t\t\t.copyProjectFiles(projectSettings.name, e.currentTarget.dataset.targetUploadPath)\n\t\t\t\t\t\t\t\t.catch((error) => {\n\t\t\t\t\t\t\t\t\tsetLastExportError(error);\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t.then((files) => {\n\t\t\t\t\t\t\t\t\tsetLastExportTime(new Date().toLocaleTimeString());\n\n\t\t\t\t\t\t\t\t\tif (files) {\n\t\t\t\t\t\t\t\t\t\tsetLastExportCount(files.length);\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.finally(() => {\n\t\t\t\t\t\t\t\t\tsetIsCopying(false);\n\t\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) : (\n\t\t\t\t\t<div>Exporting to seed project...</div>\n\t\t\t\t)}\n\t\t\t\t{lastExportTime !== null && lastExportCount > 0 && (\n\t\t\t\t\t<span className=\"last-export-time\">\n\t\t\t\t\t\t<FinsembleIcon className=\"last-export-time-icon\" icon=\"check\"></FinsembleIcon>\n\t\t\t\t\t\tExported {lastExportCount} files at {lastExportTime}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t{lastExportError !== null && <span className=\"last-export-error\">{lastExportError}</span>}\n\t\t\t\t{/* <button type=\"submit\">Share to Github</button> */}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/smartDesktopDesigner/GettingStarted.d.ts

@@ -3,5 +3,6 @@
  * All rights reserved.
  */
 /// <reference types="react" />
+import "./css/getting-started.css";
 export declare type GettingStartedProps = {};
 export declare const GettingStarted: () => JSX.Element;

package/react/components/smartDesktopDesigner/GettingStarted.js

@@ -5,35 +5,21 @@
 import React from "react";
 import { useDispatch } from "../../store";
 import { Header } from "../common/Header";
-import { ButtonTile } from "../common/ButtonTile";
 import { View } from "./View";
 import { Content } from "./Content";
 import { launchTutorialLink } from "./common/fsbl_functions";
-import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
+import "./css/getting-started.css";
 export const GettingStarted = () => {
     const dispatch = useDispatch();
-    return (React.createElement(View, null,
-        React.createElement(Header, { helpFunction: () => {
-                launchTutorialLink("building-a-desktop");
-            } }, "Begin"),
-        React.createElement(Content, null,
-            React.createElement("p", null, "Use these tools to quickly create a smart desktop for your end users. Add apps and customize the user experience."),
-            React.createElement("p", null, "After you design your desktop, you can publish it to your desktop and share it with others. You can also export the project for additional development by a technical team."),
-            React.createElement("div", { className: "getting-started-actions" },
-                React.createElement(ButtonTile, { className: "icon-application", icon: "window", text: "Add apps", onClick: () => {
-                        dispatch(SmartDesktopDesignerActions.set_current_app_id(null));
-                        dispatch(SmartDesktopDesignerActions.change_view("applications"));
-                        dispatch(SmartDesktopDesignerActions.new_app(new Date().getTime().toString()));
-                        dispatch(SmartDesktopDesignerActions.set_is_getting_started(true));
-                    } }),
-                React.createElement(ButtonTile, { className: "icon-theme", icon: "paint-roller", text: "Edit theme", onClick: () => {
-                        dispatch(SmartDesktopDesignerActions.change_view("themes"));
-                    } }),
-                React.createElement(ButtonTile, { className: "icon-publish", icon: "upload", text: "Publish desktop", onClick: () => {
-                        dispatch(SmartDesktopDesignerActions.change_view("export"));
-                    } }),
-                React.createElement(ButtonTile, { className: "icon-authentication", icon: "key", text: "Set up authentication", onClick: () => {
-                        dispatch(SmartDesktopDesignerActions.change_view("authentication"));
-                    } })))));
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "getting-started-gray-back" }),
+        React.createElement(View, null,
+            React.createElement(Header, { helpFunction: () => {
+                    launchTutorialLink("SDD-01-Welcome");
+                } }, "Your 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("div", { className: "hero" },
+                    React.createElement("img", { src: "/build/assets/img/finsemble-display.png", width: "436px", height: "354px" }))))));
 };
 //# sourceMappingURL=GettingStarted.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"GettingStarted.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/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;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAC;AAIxF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IAClC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,OAAO,CACN,oBAAC,IAAI;QACJ,oBAAC,MAAM,IACN,YAAY,EAAE,GAAG,EAAE;gBAClB,kBAAkB,CAAC,oBAAoB,CAAC,CAAC;YAC1C,CAAC,YAGO;QAET,oBAAC,OAAO;YACP,mJAGI;YAEJ,6MAGI;YAEJ,6BAAK,SAAS,EAAC,yBAAyB;gBACvC,oBAAC,UAAU,IACV,SAAS,EAAC,kBAAkB,EAC5B,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,GAAG,EAAE;wBACb,QAAQ,CAAC,2BAA2B,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,CAAC;wBAC/D,QAAQ,CAAC,2BAA2B,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC;wBAClE,QAAQ,CAAC,2BAA2B,CAAC,OAAO,CAAC,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;wBAC/E,QAAQ,CAAC,2BAA2B,CAAC,sBAAsB,CAAC,IAAI,CAAC,CAAC,CAAC;oBACpE,CAAC,GACA;gBAEF,oBAAC,UAAU,IACV,SAAS,EAAC,YAAY,EACtB,IAAI,EAAC,cAAc,EACnB,IAAI,EAAC,YAAY,EACjB,OAAO,EAAE,GAAG,EAAE;wBACb,QAAQ,CAAC,2BAA2B,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC;oBAC7D,CAAC,GACA;gBAEF,oBAAC,UAAU,IACV,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,iBAAiB,EACtB,OAAO,EAAE,GAAG,EAAE;wBACb,QAAQ,CAAC,2BAA2B,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC;oBAC7D,CAAC,GACA;gBAEF,oBAAC,UAAU,IACV,SAAS,EAAC,qBAAqB,EAC/B,IAAI,EAAC,KAAK,EACV,IAAI,EAAC,uBAAuB,EAC5B,OAAO,EAAE,GAAG,EAAE;wBACb,QAAQ,CAAC,2BAA2B,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC;oBACrE,CAAC,GACA,CACG,CACG,CACJ,CACP,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\nexport type GettingStartedProps = {};\n\nexport const GettingStarted = () => {\n\tconst dispatch = useDispatch();\n\n\treturn (\n\t\t<View>\n\t\t\t<Header\n\t\t\t\thelpFunction={() => {\n\t\t\t\t\tlaunchTutorialLink(\"building-a-desktop\");\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\tBegin\n\t\t\t</Header>\n\n\t\t\t<Content>\n\t\t\t\t<p>\n\t\t\t\t\tUse these tools to quickly create a smart desktop for your end users. Add apps and customize the user\n\t\t\t\t\texperience.\n\t\t\t\t</p>\n\n\t\t\t\t<p>\n\t\t\t\t\tAfter you design your desktop, you can publish it to your desktop and share it with others. You can also\n\t\t\t\t\texport the project for additional development by a technical team.\n\t\t\t\t</p>\n\n\t\t\t\t<div className=\"getting-started-actions\">\n\t\t\t\t\t<ButtonTile\n\t\t\t\t\t\tclassName=\"icon-application\"\n\t\t\t\t\t\ticon=\"window\"\n\t\t\t\t\t\ttext=\"Add apps\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.set_current_app_id(null));\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(\"applications\"));\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.new_app(new Date().getTime().toString()));\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.set_is_getting_started(true));\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<ButtonTile\n\t\t\t\t\t\tclassName=\"icon-theme\"\n\t\t\t\t\t\ticon=\"paint-roller\"\n\t\t\t\t\t\ttext=\"Edit theme\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(\"themes\"));\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<ButtonTile\n\t\t\t\t\t\tclassName=\"icon-publish\"\n\t\t\t\t\t\ticon=\"upload\"\n\t\t\t\t\t\ttext=\"Publish desktop\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(\"export\"));\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<ButtonTile\n\t\t\t\t\t\tclassName=\"icon-authentication\"\n\t\t\t\t\t\ticon=\"key\"\n\t\t\t\t\t\ttext=\"Set up authentication\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tdispatch(SmartDesktopDesignerActions.change_view(\"authentication\"));\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</Content>\n\t\t</View>\n\t);\n};\n"]}
+{"version":3,"file":"GettingStarted.js","sourceRoot":"","sources":["../../../src/components/smartDesktopDesigner/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"]}

package/react/components/smartDesktopDesigner/ItemList.d.ts

@@ -0,0 +1,17 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import { ReactNode } from "react";
+import "../common/css/application-list.css";
+export declare type ItemListProps = {
+    items: any[];
+    getItemId?: (item: any) => string;
+    getItemDisplayName?: (item: any) => string;
+    clickItem: (s: string) => void;
+    deleteItem: (s: string) => void;
+    editItem?: (s: string) => void;
+    emptyListMessage?: ReactNode;
+    className?: string;
+};
+export declare const ItemList: ({ items, clickItem, deleteItem, editItem, getItemId, getItemDisplayName, emptyListMessage, className, }: ItemListProps) => JSX.Element;

package/react/components/smartDesktopDesigner/ItemList.js

@@ -0,0 +1,58 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import React from "react";
+import { ButtonIcon } from "../common/ButtonIcon";
+import "../common/css/application-list.css";
+export const ItemList = ({ items, clickItem, deleteItem, editItem, getItemId = (item) => item.appId, getItemDisplayName = (item) => { var _a, _b; return ((_b = (_a = item.manifest) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.displayName) || item.name || item.appId; }, emptyListMessage = (React.createElement(React.Fragment, null,
+    "There\u2019s nothing here!",
+    React.createElement("br", null),
+    "Click the Add button to add apps.")), className = "", }) => (React.createElement(React.Fragment, null, items.length < 1 ? (React.createElement("div", { className: `app-list-empty ${className}` }, emptyListMessage)) : (React.createElement("div", { className: `app-list-table ${className}`, role: "list" }, items
+    .sort((a, b) => {
+    if (getItemDisplayName(a) > getItemDisplayName(b)) {
+        return 1;
+    }
+    else if (getItemDisplayName(b) > getItemDisplayName(a)) {
+        return -1;
+    }
+    return 0;
+})
+    .map((item) => {
+    const appID = getItemId(item);
+    const openItemEventHandler = (e) => {
+        clickItem(appID);
+        e.preventDefault();
+    };
+    const editItemEventHandler = (e) => {
+        e.stopPropagation();
+        editItem === null || editItem === void 0 ? void 0 : editItem(appID);
+        e.preventDefault();
+    };
+    const deleteItemEventHandler = (e) => {
+        e.stopPropagation();
+        deleteItem(appID);
+    };
+    const keyDownHandler = (e) => {
+        switch (e.key) {
+            case "Enter":
+            case " ": {
+                openItemEventHandler(e);
+                break;
+            }
+            case "Delete": {
+                deleteItemEventHandler(e);
+                break;
+            }
+            default: {
+            }
+        }
+    };
+    const displayName = getItemDisplayName(item);
+    return (React.createElement("div", { key: appID, id: `app-list-row-${appID}`, className: "app-list-row", role: "listitem", tabIndex: 0, onClick: openItemEventHandler, onKeyDown: keyDownHandler },
+        React.createElement("span", { className: "app-name" }, displayName),
+        React.createElement("div", { className: "icon-bar" },
+            editItem && (React.createElement(ButtonIcon, { className: "icon-edit", icon: "pencil", text: "Edit", onClick: editItemEventHandler })),
+            React.createElement(ButtonIcon, { tabIndex: -1, className: "icon-delete", icon: "trash", text: "Delete", onClick: deleteItemEventHandler }))));
+})))));
+//# sourceMappingURL=ItemList.js.map