@finsemble/finsemble-ui 1.0.0-beta-1

package/react/components/sdd/AddApp.js

@@ -0,0 +1,170 @@
+/*!
+ * Copyright 2021 by Cosaic
+ * All rights reserved.
+ */
+import React, { useState } from "react";
+import { Button } from "../common/Button";
+import { ButtonIcon } from "../common/ButtonIcon";
+import { FileInput } from "../common/FileInput";
+import { VALID_APP_EXTENSIONS } from "../common/file_helpers";
+import { FinsembleIcon } from "../common/FinsembleIcon";
+import { FinsembleToggleButtonBar } from "../common/FinsembleToggleButtonBar";
+import { Tooltip } from "../common/Tooltip";
+import { getDefaultName } from "./sdd_helpers";
+import "./css/addApp.css";
+const isValid = ({ visible, appUrl, appPath, appCitrix, webAppName, pathAppName, citrixAppName, }) => {
+    if (visible === "web") {
+        if (appUrl === "" || webAppName === "") {
+            return false;
+        }
+    }
+    else if (visible === "native") {
+        if (appPath === "" || pathAppName === "") {
+            return false;
+        }
+    }
+    else if (visible === "citrix" && (appCitrix === "" || citrixAppName === "")) {
+        return false;
+    }
+    return true;
+};
+export const AddApp = ({ checkValidURL, addAppByPath, addAppByUrl, addAppCitrix = () => { }, close, show, includeCitrix = true, idKey = "", }) => {
+    const [visible, setVisible] = useState("web");
+    const [appUrl, setAppUrl] = useState("");
+    const [appPath, setAppPath] = useState("");
+    const [appCitrix, setAppCitrix] = useState("");
+    const [webAppName, setWebAppName] = useState("");
+    const [pathAppName, setPathAppName] = useState("");
+    const [citrixAppName, setCitrixAppName] = useState("");
+    const [apiAccess, setApiAccess] = useState(true);
+    const [urlUserInput, setUrlUserInput] = useState(false);
+    const isAppUrlValid = checkValidURL(appUrl);
+    const clearAll = () => {
+        setAppUrl("");
+        setAppPath("");
+        setAppCitrix("");
+        setWebAppName("");
+        setPathAppName("");
+        setCitrixAppName("");
+        setApiAccess(true);
+    };
+    const closeBox = () => {
+        clearAll();
+        close();
+    };
+    if (!show && (appUrl !== "" || appPath !== "" || appCitrix !== "")) {
+        clearAll();
+    }
+    const isEnabledFlag = isValid({
+        visible,
+        appUrl,
+        appPath,
+        appCitrix,
+        webAppName,
+        pathAppName,
+        citrixAppName,
+    });
+    const changeUrlContent = (newUrl) => {
+        setAppUrl(newUrl);
+        !urlUserInput && setWebAppName(getDefaultName(newUrl));
+    };
+    const toggleButtonOptions = [
+        {
+            label: (React.createElement("span", null,
+                React.createElement(FinsembleIcon, { icon: "linker" }),
+                " URL")),
+            value: "web",
+        },
+        {
+            label: (React.createElement("span", null,
+                React.createElement(FinsembleIcon, { icon: "folder" }),
+                " Path")),
+            value: "native",
+        },
+    ].concat(includeCitrix
+        ? [
+            {
+                label: (React.createElement("span", null,
+                    React.createElement(FinsembleIcon, { icon: "server" }),
+                    " Virtual")),
+                value: "citrix",
+            },
+        ]
+        : []);
+    return (React.createElement("div", { className: `quick-add-app${show ? "" : " collapsed"}`, style: { position: "relative" }, "aria-hidden": !show },
+        React.createElement(ButtonIcon, { icon: "times", onClick: closeBox, text: "Close", className: "quick-add-close" }),
+        React.createElement(FinsembleToggleButtonBar, { selected: visible, onChange: setVisible, options: toggleButtonOptions }),
+        React.createElement("table", { role: "presentation", style: { width: "100%" } },
+            visible === "web" && (React.createElement("tbody", null,
+                React.createElement("tr", { className: "quick-add-url" },
+                    React.createElement("td", { style: { width: "20%" } },
+                        React.createElement("label", { htmlFor: `app-url-${idKey}` }, "App URL")),
+                    React.createElement("td", null,
+                        React.createElement("input", { type: "text", placeholder: "https://...", id: `app-url-${idKey}`, value: appUrl, "aria-invalid": !isAppUrlValid, "aria-errormessage": `app-url-error-message-${idKey}`, onChange: (e) => {
+                                changeUrlContent(e.target.value);
+                            }, onKeyUp: (e) => {
+                                changeUrlContent(e.currentTarget.value);
+                            }, style: { width: "95%" } }),
+                        !isAppUrlValid && (React.createElement("div", { id: `app-url-error-message-${idKey}`, 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("td", null,
+                        React.createElement("label", { htmlFor: `url-app-name-${idKey}` }, "App name")),
+                    React.createElement("td", null,
+                        React.createElement("input", { type: "text", id: `url-app-name-${idKey}`, value: webAppName, onChange: (e) => {
+                                setWebAppName(e.target.value);
+                                setUrlUserInput(true);
+                            }, style: { width: "95%" } }))))),
+            visible === "native" && (React.createElement("tbody", null,
+                React.createElement("tr", { className: "quick-add-url" },
+                    React.createElement("td", { colSpan: 2 },
+                        React.createElement(FileInput, { id: `app-path-${idKey}`, acceptTypes: VALID_APP_EXTENSIONS, shouldUpload: false, value: appPath, onSetValue: (value) => {
+                                setAppPath(value);
+                            }, textEditable: true }))),
+                React.createElement("tr", null,
+                    React.createElement("td", null,
+                        React.createElement("label", { htmlFor: `path-app-name-${idKey}` }, "App name")),
+                    React.createElement("td", null,
+                        React.createElement("input", { type: "text", id: `path-app-name-${idKey}`, value: pathAppName, onChange: (e) => {
+                                setPathAppName(e.target.value);
+                            }, style: { width: "95%" } }))),
+                React.createElement("tr", null,
+                    React.createElement("td", null,
+                        React.createElement("label", { htmlFor: `api-access-${idKey}` }, "API access")),
+                    React.createElement("td", null,
+                        React.createElement("input", { type: "checkbox", id: `api-access-${idKey}`, checked: apiAccess, onChange: (e) => {
+                                setApiAccess(e.target.checked);
+                            } })),
+                    React.createElement("td", null,
+                        React.createElement(Tooltip, { position: "left" }, "Specify if your app needs to access Finsemble API. Your app must be built with the Finsemble native integration library (see Finsemble documentation for details)."))))),
+            visible === "citrix" && (React.createElement("tbody", null,
+                React.createElement("tr", { className: "quick-add-citrix" },
+                    React.createElement("td", { style: { width: "20%" } },
+                        React.createElement("label", { htmlFor: `app-citrix-${idKey}` }, "Virtual app name")),
+                    React.createElement("td", null,
+                        React.createElement("input", { type: "text", placeholder: "", id: `app-citrix-${idKey}`, value: appCitrix, onChange: (e) => {
+                                if (citrixAppName === "" || citrixAppName === appCitrix) {
+                                    setCitrixAppName(e.target.value);
+                                }
+                                setAppCitrix(e.target.value);
+                            }, style: { width: "95%" } }))),
+                React.createElement("tr", null,
+                    React.createElement("td", null,
+                        React.createElement("label", { htmlFor: `citrix-display-name-${idKey}` }, "Display name")),
+                    React.createElement("td", null,
+                        React.createElement("input", { type: "text", id: `citrix-display-name-${idKey}`, value: citrixAppName, onChange: (e) => {
+                                setCitrixAppName(e.target.value);
+                            }, style: { width: "95%" } })))))),
+        React.createElement("div", { className: "save-button-container" },
+            React.createElement(Button, { fashion: "secondary", className: "quick-add-save", onClick: () => {
+                    if (visible === "web") {
+                        addAppByUrl(appUrl, webAppName);
+                    }
+                    else if (visible === "native") {
+                        addAppByPath(appPath, pathAppName, apiAccess);
+                    }
+                    else if (visible === "citrix") {
+                        addAppCitrix(appCitrix, citrixAppName);
+                    }
+                }, text: "Save", disabled: !isEnabledFlag }))));
+};
+//# sourceMappingURL=AddApp.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AddApp.js","sourceRoot":"","sources":["../../../src/components/sdd/AddApp.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2021 by Cosaic\n * All rights reserved.\n */\n\nimport React, { useState } from \"react\";\nimport { Button } from \"../common/Button\";\nimport { ButtonIcon } from \"../common/ButtonIcon\";\nimport { FileInput } from \"../common/FileInput\";\nimport { VALID_APP_EXTENSIONS } from \"../common/file_helpers\";\nimport { FinsembleIcon } from \"../common/FinsembleIcon\";\nimport { FinsembleToggleButtonBar } from \"../common/FinsembleToggleButtonBar\";\nimport { Tooltip } from \"../common/Tooltip\";\nimport { getDefaultName } from \"./sdd_helpers\";\nimport \"./css/addApp.css\";\n\nexport type AddAppProps = {\n\tcheckValidURL: (url: string) => boolean;\n\taddAppByUrl: (url: string, name: string) => void;\n\taddAppByPath: (path: string, name: string, apiAccess: boolean) => void;\n\tclose: () => void;\n\tshow: boolean;\n\taddAppCitrix?: (alias: string, name: string) => void;\n\tincludeCitrix?: boolean;\n\tidKey?: string;\n};\n\ntype pageTypes = \"web\" | \"native\" | \"citrix\";\n\nconst isValid = ({\n\tvisible,\n\tappUrl,\n\tappPath,\n\tappCitrix,\n\twebAppName,\n\tpathAppName,\n\tcitrixAppName,\n}: {\n\tvisible: pageTypes;\n\t[key: string]: string;\n}) => {\n\tif (visible === \"web\") {\n\t\tif (appUrl === \"\" || webAppName === \"\") {\n\t\t\treturn false;\n\t\t}\n\t} else if (visible === \"native\") {\n\t\tif (appPath === \"\" || pathAppName === \"\") {\n\t\t\treturn false;\n\t\t}\n\t} else if (visible === \"citrix\" && (appCitrix === \"\" || citrixAppName === \"\")) {\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nexport const AddApp = ({\n\tcheckValidURL,\n\taddAppByPath,\n\taddAppByUrl,\n\taddAppCitrix = () => {},\n\tclose,\n\tshow,\n\tincludeCitrix = true,\n\tidKey = \"\",\n}: AddAppProps) => {\n\tconst [visible, setVisible] = useState<pageTypes>(\"web\");\n\tconst [appUrl, setAppUrl] = useState(\"\");\n\tconst [appPath, setAppPath] = useState(\"\");\n\tconst [appCitrix, setAppCitrix] = useState(\"\");\n\tconst [webAppName, setWebAppName] = useState(\"\");\n\tconst [pathAppName, setPathAppName] = useState(\"\");\n\tconst [citrixAppName, setCitrixAppName] = useState(\"\");\n\tconst [apiAccess, setApiAccess] = useState(true);\n\tconst [urlUserInput, setUrlUserInput] = useState(false);\n\n\tconst isAppUrlValid = checkValidURL(appUrl);\n\n\tconst clearAll = () => {\n\t\tsetAppUrl(\"\");\n\t\tsetAppPath(\"\");\n\t\tsetAppCitrix(\"\");\n\t\tsetWebAppName(\"\");\n\t\tsetPathAppName(\"\");\n\t\tsetCitrixAppName(\"\");\n\t\tsetApiAccess(true);\n\t};\n\n\tconst closeBox = () => {\n\t\tclearAll();\n\t\tclose();\n\t};\n\n\tif (!show && (appUrl !== \"\" || appPath !== \"\" || appCitrix !== \"\")) {\n\t\tclearAll();\n\t}\n\n\tconst isEnabledFlag = isValid({\n\t\tvisible,\n\t\tappUrl,\n\t\tappPath,\n\t\tappCitrix,\n\t\twebAppName,\n\t\tpathAppName,\n\t\tcitrixAppName,\n\t});\n\n\tconst changeUrlContent = (newUrl: string) => {\n\t\tsetAppUrl(newUrl);\n\t\t!urlUserInput && setWebAppName(getDefaultName(newUrl));\n\t};\n\tconst toggleButtonOptions = [\n\t\t{\n\t\t\tlabel: (\n\t\t\t\t<span>\n\t\t\t\t\t<FinsembleIcon icon=\"linker\" /> URL\n\t\t\t\t</span>\n\t\t\t),\n\t\t\tvalue: \"web\",\n\t\t},\n\t\t{\n\t\t\tlabel: (\n\t\t\t\t<span>\n\t\t\t\t\t<FinsembleIcon icon=\"folder\" /> Path\n\t\t\t\t</span>\n\t\t\t),\n\t\t\tvalue: \"native\",\n\t\t},\n\t].concat(\n\t\tincludeCitrix\n\t\t\t? [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: (\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t<FinsembleIcon icon=\"server\" /> Virtual\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t),\n\t\t\t\t\t\tvalue: \"citrix\",\n\t\t\t\t\t},\n\t\t\t  ]\n\t\t\t: []\n\t);\n\n\treturn (\n\t\t<div className={`quick-add-app${show ? \"\" : \" collapsed\"}`} style={{ position: \"relative\" }} aria-hidden={!show}>\n\t\t\t<ButtonIcon icon=\"times\" onClick={closeBox} text=\"Close\" className=\"quick-add-close\" />\n\t\t\t<FinsembleToggleButtonBar selected={visible} onChange={setVisible} options={toggleButtonOptions} />\n\t\t\t<table role=\"presentation\" style={{ width: \"100%\" }}>\n\t\t\t\t{visible === \"web\" && (\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t<tr className=\"quick-add-url\">\n\t\t\t\t\t\t\t<td style={{ width: \"20%\" }}>\n\t\t\t\t\t\t\t\t<label htmlFor={`app-url-${idKey}`}>App URL</label>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t<td>\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\tplaceholder=\"https://...\"\n\t\t\t\t\t\t\t\t\tid={`app-url-${idKey}`}\n\t\t\t\t\t\t\t\t\tvalue={appUrl}\n\t\t\t\t\t\t\t\t\taria-invalid={!isAppUrlValid}\n\t\t\t\t\t\t\t\t\taria-errormessage={`app-url-error-message-${idKey}`}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tchangeUrlContent(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonKeyUp={(e) => {\n\t\t\t\t\t\t\t\t\t\tchangeUrlContent(e.currentTarget.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tstyle={{ width: \"95%\" }}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{!isAppUrlValid && (\n\t\t\t\t\t\t\t\t\t<div id={`app-url-error-message-${idKey}`} 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<td>\n\t\t\t\t\t\t\t\t<label htmlFor={`url-app-name-${idKey}`}>App name</label>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t<td>\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={`url-app-name-${idKey}`}\n\t\t\t\t\t\t\t\t\tvalue={webAppName}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetWebAppName(e.target.value);\n\t\t\t\t\t\t\t\t\t\tsetUrlUserInput(true);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tstyle={{ width: \"95%\" }}\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)}\n\t\t\t\t{visible === \"native\" && (\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t<tr className=\"quick-add-url\">\n\t\t\t\t\t\t\t<td colSpan={2}>\n\t\t\t\t\t\t\t\t<FileInput\n\t\t\t\t\t\t\t\t\tid={`app-path-${idKey}`}\n\t\t\t\t\t\t\t\t\tacceptTypes={VALID_APP_EXTENSIONS}\n\t\t\t\t\t\t\t\t\tshouldUpload={false}\n\t\t\t\t\t\t\t\t\tvalue={appPath}\n\t\t\t\t\t\t\t\t\tonSetValue={(value: string) => {\n\t\t\t\t\t\t\t\t\t\tsetAppPath(value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\ttextEditable={true}\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<td>\n\t\t\t\t\t\t\t\t<label htmlFor={`path-app-name-${idKey}`}>App name</label>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t<td>\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={`path-app-name-${idKey}`}\n\t\t\t\t\t\t\t\t\tvalue={pathAppName}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetPathAppName(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tstyle={{ width: \"95%\" }}\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<td>\n\t\t\t\t\t\t\t\t<label htmlFor={`api-access-${idKey}`}>API access</label>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t<td>\n\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\tid={`api-access-${idKey}`}\n\t\t\t\t\t\t\t\t\tchecked={apiAccess}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetApiAccess(e.target.checked);\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\t<td>\n\t\t\t\t\t\t\t\t<Tooltip position=\"left\">\n\t\t\t\t\t\t\t\t\tSpecify if your app needs to access Finsemble API. Your app must be built with the Finsemble native\n\t\t\t\t\t\t\t\t\tintegration library (see Finsemble documentation for details).\n\t\t\t\t\t\t\t\t</Tooltip>\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)}\n\t\t\t\t{visible === \"citrix\" && (\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t<tr className=\"quick-add-citrix\">\n\t\t\t\t\t\t\t<td style={{ width: \"20%\" }}>\n\t\t\t\t\t\t\t\t<label htmlFor={`app-citrix-${idKey}`}>Virtual app name</label>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t<td>\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\tplaceholder=\"\"\n\t\t\t\t\t\t\t\t\tid={`app-citrix-${idKey}`}\n\t\t\t\t\t\t\t\t\tvalue={appCitrix}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tif (citrixAppName === \"\" || citrixAppName === appCitrix) {\n\t\t\t\t\t\t\t\t\t\t\tsetCitrixAppName(e.target.value);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tsetAppCitrix(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tstyle={{ width: \"95%\" }}\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<td>\n\t\t\t\t\t\t\t\t<label htmlFor={`citrix-display-name-${idKey}`}>Display name</label>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t<td>\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={`citrix-display-name-${idKey}`}\n\t\t\t\t\t\t\t\t\tvalue={citrixAppName}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tsetCitrixAppName(e.target.value);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tstyle={{ width: \"95%\" }}\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)}\n\t\t\t</table>\n\t\t\t<div className=\"save-button-container\">\n\t\t\t\t<Button\n\t\t\t\t\tfashion=\"secondary\"\n\t\t\t\t\tclassName=\"quick-add-save\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tif (visible === \"web\") {\n\t\t\t\t\t\t\taddAppByUrl(appUrl, webAppName);\n\t\t\t\t\t\t} else if (visible === \"native\") {\n\t\t\t\t\t\t\taddAppByPath(appPath, pathAppName, apiAccess);\n\t\t\t\t\t\t} else if (visible === \"citrix\") {\n\t\t\t\t\t\t\taddAppCitrix(appCitrix, citrixAppName);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t\ttext=\"Save\"\n\t\t\t\t\tdisabled={!isEnabledFlag}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

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

@@ -0,0 +1,16 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+/// <reference types="react" />
+import { ApplicationRule } from "../../types/smartDesktopDesignerTypes";
+import { SmartDesktopClient } from "./smartDesktopClient";
+export declare type AppEditAccessProps = {
+    appName: string;
+    rules: ApplicationRule[];
+    onChange: (data: ApplicationRule[]) => any;
+    addApp: typeof SmartDesktopClient.addApp;
+    isInboundInteropAuthorized: typeof SmartDesktopClient.isInboundInteropAuthorized;
+    isOutboundInteropAuthorized: typeof SmartDesktopClient.isOutboundInteropAuthorized;
+};
+export declare const AppEditAccess: (props: AppEditAccessProps) => JSX.Element;

package/react/components/sdd/AppEditAccess.js

@@ -0,0 +1,130 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import React, { useEffect, useState } from "react";
+import { SmartDesktopDesignerActions } from "../../actions/smartDesktopDesignerActions";
+import { useDispatch, useSelector } from "../../store";
+import { FinsembleSelect } from "../common/FinsembleSelect";
+import { Tooltip } from "../common/Tooltip";
+import RelativePortal from "react-relative-portal";
+export const AppEditAccess = (props) => {
+    const dispatch = useDispatch();
+    const apps = useSelector((state) => state.smartDesktopDesigner.apps);
+    const [rules, setRules] = useState(props.rules);
+    const [scrolling, setScrolling] = useState(false);
+    let timeout = null;
+    useEffect(() => {
+        const handleScroll = () => {
+            setScrolling(true);
+            clearTimeout(timeout);
+            timeout = setTimeout(() => {
+                setScrolling(false);
+            }, 50);
+        };
+        window.addEventListener("scroll", handleScroll, { passive: true, capture: true });
+        return () => window.removeEventListener("scroll", handleScroll);
+    }, []);
+    /**
+     * Get a list of all apps other than this one (in order to pick which ones to authorize)
+     */
+    const filteredApps = apps
+        .filter((app) => { var _a; return !((_a = app.manifest) === null || _a === void 0 ? void 0 : _a.temporary) && app.name !== props.appName; })
+        .sort((a, b) => {
+        if (a.name > b.name) {
+            return 1;
+        }
+        else if (b.name > a.name) {
+            return -1;
+        }
+        return 0;
+    });
+    /**
+     * When adding an app, there will not yet be a name. The app that is flagged as temporary is us.
+     * During editing of an app, the app will not be temporary but it will have a name.
+     * We must check for both circumstances in order to know which app in the list is the current app.
+     */
+    const currentApp = apps.find((app) => { var _a; return ((_a = app.manifest) === null || _a === void 0 ? void 0 : _a.temporary) || app.name === props.appName; });
+    const [inboundAuthorizedApps, setInboundAuthorizedApps] = useState([]);
+    const [outboundAuthorizedApps, setOutboundAuthorizedApps] = useState([]);
+    const [advancedExpanded, setAdvancedExpanded] = useState(false);
+    function doSetRules(newRules) {
+        setRules(newRules);
+        props.onChange(newRules);
+    }
+    function updateBlockingApp(config) {
+        props.addApp(config.appId, config).then(() => {
+            dispatch(SmartDesktopDesignerActions.update_app(config));
+        });
+    }
+    function getOptions() {
+        return filteredApps.map((app) => {
+            const isInboundAuthorized = inboundAuthorizedApps.includes(app.name);
+            return (React.createElement("div", { className: ["app-edit-access-item", !isInboundAuthorized ? "app-edit-access-blocked" : ""].join(" "), key: app.name },
+                React.createElement("span", { className: "app-edit-access-item-name" }, app.name),
+                !isInboundAuthorized && (React.createElement(RelativePortal, { className: ["tooltip-portal", scrolling || !advancedExpanded ? "is-scrolling" : ""].join(" "), component: "div", left: -13, top: 0 },
+                    React.createElement(Tooltip, { type: "lock", onClick: () => {
+                            var _a, _b, _c;
+                            updateBlockingApp(Object.assign(Object.assign({}, app), { manifest: Object.assign(Object.assign({}, app.manifest), { interop: Object.assign(Object.assign({}, (_a = app.manifest) === null || _a === void 0 ? void 0 : _a.interop), { selectConnect: [
+                                            ...(((_c = (_b = app.manifest) === null || _b === void 0 ? void 0 : _b.interop) === null || _c === void 0 ? void 0 : _c.selectConnect) || []),
+                                            {
+                                                authorize: [{ name: props.appName || "" }],
+                                            },
+                                        ] }) }) }));
+                        } }, "This app is blocking access. Click to allow access")))));
+        });
+    }
+    useEffect(() => {
+        if (currentApp) {
+            filteredApps.forEach((targetApp) => {
+                if (targetApp.name === props.appName) {
+                    return;
+                }
+                props
+                    .isInboundInteropAuthorized(Object.assign(Object.assign({}, currentApp), { name: props.appName, manifest: {
+                        interop: {
+                            selectConnect: rules,
+                        },
+                    } }), targetApp)
+                    .then((inboundAuthorized) => {
+                    if (inboundAuthorized && !inboundAuthorizedApps.includes(targetApp.name)) {
+                        setInboundAuthorizedApps([...inboundAuthorizedApps, targetApp.name]);
+                    }
+                });
+                props
+                    .isOutboundInteropAuthorized(Object.assign(Object.assign({}, currentApp), { name: props.appName, manifest: {
+                        interop: {
+                            selectConnect: rules,
+                        },
+                    } }), targetApp)
+                    .then((outboundAuthorized) => {
+                    if (outboundAuthorized && !outboundAuthorizedApps.includes(targetApp.name)) {
+                        setOutboundAuthorizedApps([...outboundAuthorizedApps, targetApp.name]);
+                    }
+                    else if (!outboundAuthorized && outboundAuthorizedApps.includes(targetApp.name)) {
+                        const outboundAuthorizedAppsCopy = outboundAuthorizedApps.slice(0);
+                        outboundAuthorizedAppsCopy.splice(outboundAuthorizedAppsCopy.indexOf(targetApp.name), 1);
+                        setOutboundAuthorizedApps(outboundAuthorizedAppsCopy);
+                    }
+                });
+            });
+        }
+    });
+    return (React.createElement("div", { className: "app-edit-access" },
+        React.createElement(FinsembleSelect, { options: filteredApps.map((app) => app.name), optionComponents: getOptions(), selected: filteredApps.filter((app) => outboundAuthorizedApps.includes(app.name)).map((app) => app.name), updateCallback: (selected) => {
+                let newRules = [...rules];
+                filteredApps.forEach((app) => {
+                    const isSelected = selected.find((name) => name === app.name);
+                    if (!isSelected) {
+                        newRules = newRules.filter((rule) => { var _a; return (_a = rule.authorize) === null || _a === void 0 ? void 0 : _a.some((auth) => auth.name !== app.name); });
+                    }
+                    else {
+                        newRules.push({
+                            authorize: [{ name: app.name }],
+                        });
+                    }
+                });
+                doSetRules(newRules);
+            }, showSearch: true })));
+};
+//# sourceMappingURL=AppEditAccess.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AppEditAccess.js","sourceRoot":"","sources":["../../../src/components/sdd/AppEditAccess.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useEffect, useState } from \"react\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { RootState } from \"../../reducers/rootReducer\";\nimport { useDispatch, useSelector } from \"../../store\";\nimport { ApplicationRule } from \"../../types/smartDesktopDesignerTypes\";\nimport { FinsembleSelect } from \"../common/FinsembleSelect\";\nimport { Tooltip } from \"../common/Tooltip\";\nimport RelativePortal from \"react-relative-portal\";\nimport { services } from \"@finsemble/finsemble-api\";\nimport { SmartDesktopClient } from \"./smartDesktopClient\";\n\ntype AppDefinition = services.Interop.types.AppDefinition;\n\nexport type AppEditAccessProps = {\n\tappName: string;\n\trules: ApplicationRule[];\n\tonChange: (data: ApplicationRule[]) => any;\n\taddApp: typeof SmartDesktopClient.addApp;\n\tisInboundInteropAuthorized: typeof SmartDesktopClient.isInboundInteropAuthorized;\n\tisOutboundInteropAuthorized: typeof SmartDesktopClient.isOutboundInteropAuthorized;\n};\n\nexport const AppEditAccess = (props: AppEditAccessProps) => {\n\tconst dispatch = useDispatch();\n\n\tconst apps = useSelector((state: RootState) => state.smartDesktopDesigner.apps);\n\n\tconst [rules, setRules] = useState(props.rules);\n\n\tconst [scrolling, setScrolling] = useState(false);\n\tlet timeout: any = null;\n\n\tuseEffect(() => {\n\t\tconst handleScroll = () => {\n\t\t\tsetScrolling(true);\n\t\t\tclearTimeout(timeout);\n\n\t\t\ttimeout = setTimeout(() => {\n\t\t\t\tsetScrolling(false);\n\t\t\t}, 50);\n\t\t};\n\n\t\twindow.addEventListener(\"scroll\", handleScroll, { passive: true, capture: true });\n\n\t\treturn () => window.removeEventListener(\"scroll\", handleScroll);\n\t}, []);\n\n\t/**\n\t * Get a list of all apps other than this one (in order to pick which ones to authorize)\n\t */\n\tconst filteredApps = apps\n\t\t.filter((app) => !app.manifest?.temporary && app.name !== props.appName)\n\t\t.sort((a, b) => {\n\t\t\tif (a.name > b.name) {\n\t\t\t\treturn 1;\n\t\t\t} else if (b.name > a.name) {\n\t\t\t\treturn -1;\n\t\t\t}\n\n\t\t\treturn 0;\n\t\t});\n\n\t/**\n\t * When adding an app, there will not yet be a name. The app that is flagged as temporary is us.\n\t * During editing of an app, the app will not be temporary but it will have a name.\n\t * We must check for both circumstances in order to know which app in the list is the current app.\n\t */\n\tconst currentApp = apps.find((app) => app.manifest?.temporary || app.name === props.appName);\n\n\tconst [inboundAuthorizedApps, setInboundAuthorizedApps] = useState<string[]>([]);\n\tconst [outboundAuthorizedApps, setOutboundAuthorizedApps] = useState<string[]>([]);\n\tconst [advancedExpanded, setAdvancedExpanded] = useState(false);\n\n\tfunction doSetRules(newRules: ApplicationRule[]) {\n\t\tsetRules(newRules);\n\n\t\tprops.onChange(newRules);\n\t}\n\n\tfunction updateBlockingApp(config: AppDefinition) {\n\t\tprops.addApp(config.appId, config).then(() => {\n\t\t\tdispatch(SmartDesktopDesignerActions.update_app(config));\n\t\t});\n\t}\n\n\tfunction getOptions() {\n\t\treturn filteredApps.map((app) => {\n\t\t\tconst isInboundAuthorized = inboundAuthorizedApps.includes(app.name);\n\n\t\t\treturn (\n\t\t\t\t<div\n\t\t\t\t\tclassName={[\"app-edit-access-item\", !isInboundAuthorized ? \"app-edit-access-blocked\" : \"\"].join(\" \")}\n\t\t\t\t\tkey={app.name}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"app-edit-access-item-name\">{app.name}</span>\n\t\t\t\t\t{!isInboundAuthorized && (\n\t\t\t\t\t\t<RelativePortal\n\t\t\t\t\t\t\tclassName={[\"tooltip-portal\", scrolling || !advancedExpanded ? \"is-scrolling\" : \"\"].join(\" \")}\n\t\t\t\t\t\t\tcomponent=\"div\"\n\t\t\t\t\t\t\tleft={-13}\n\t\t\t\t\t\t\ttop={0}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\ttype=\"lock\"\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tupdateBlockingApp({\n\t\t\t\t\t\t\t\t\t\t...app,\n\t\t\t\t\t\t\t\t\t\tmanifest: {\n\t\t\t\t\t\t\t\t\t\t\t...app.manifest,\n\t\t\t\t\t\t\t\t\t\t\tinterop: {\n\t\t\t\t\t\t\t\t\t\t\t\t...app.manifest?.interop,\n\t\t\t\t\t\t\t\t\t\t\t\tselectConnect: [\n\t\t\t\t\t\t\t\t\t\t\t\t\t...(app.manifest?.interop?.selectConnect || []),\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tauthorize: [{ name: props.appName || \"\" }],\n\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t},\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}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tThis app is blocking access. Click to allow access\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t</RelativePortal>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t);\n\t\t});\n\t}\n\n\tuseEffect(() => {\n\t\tif (currentApp) {\n\t\t\tfilteredApps.forEach((targetApp) => {\n\t\t\t\tif (targetApp.name === props.appName) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tprops\n\t\t\t\t\t.isInboundInteropAuthorized(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...currentApp,\n\t\t\t\t\t\t\tname: props.appName,\n\t\t\t\t\t\t\tmanifest: {\n\t\t\t\t\t\t\t\tinterop: {\n\t\t\t\t\t\t\t\t\tselectConnect: rules,\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\ttargetApp\n\t\t\t\t\t)\n\t\t\t\t\t.then((inboundAuthorized: boolean) => {\n\t\t\t\t\t\tif (inboundAuthorized && !inboundAuthorizedApps.includes(targetApp.name)) {\n\t\t\t\t\t\t\tsetInboundAuthorizedApps([...inboundAuthorizedApps, targetApp.name]);\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\n\t\t\t\tprops\n\t\t\t\t\t.isOutboundInteropAuthorized(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...currentApp,\n\t\t\t\t\t\t\tname: props.appName,\n\t\t\t\t\t\t\tmanifest: {\n\t\t\t\t\t\t\t\tinterop: {\n\t\t\t\t\t\t\t\t\tselectConnect: rules,\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\ttargetApp\n\t\t\t\t\t)\n\t\t\t\t\t.then((outboundAuthorized: boolean) => {\n\t\t\t\t\t\tif (outboundAuthorized && !outboundAuthorizedApps.includes(targetApp.name)) {\n\t\t\t\t\t\t\tsetOutboundAuthorizedApps([...outboundAuthorizedApps, targetApp.name]);\n\t\t\t\t\t\t} else if (!outboundAuthorized && outboundAuthorizedApps.includes(targetApp.name)) {\n\t\t\t\t\t\t\tconst outboundAuthorizedAppsCopy = outboundAuthorizedApps.slice(0);\n\t\t\t\t\t\t\toutboundAuthorizedAppsCopy.splice(outboundAuthorizedAppsCopy.indexOf(targetApp.name), 1);\n\t\t\t\t\t\t\tsetOutboundAuthorizedApps(outboundAuthorizedAppsCopy);\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t});\n\t\t}\n\t});\n\n\treturn (\n\t\t<div className=\"app-edit-access\">\n\t\t\t<FinsembleSelect\n\t\t\t\toptions={filteredApps.map((app) => app.name)}\n\t\t\t\toptionComponents={getOptions()}\n\t\t\t\tselected={filteredApps.filter((app) => outboundAuthorizedApps.includes(app.name)).map((app) => app.name)}\n\t\t\t\tupdateCallback={(selected) => {\n\t\t\t\t\tlet newRules = [...rules];\n\n\t\t\t\t\tfilteredApps.forEach((app) => {\n\t\t\t\t\t\tconst isSelected = selected.find((name) => name === app.name);\n\n\t\t\t\t\t\tif (!isSelected) {\n\t\t\t\t\t\t\tnewRules = newRules.filter((rule) =>\n\t\t\t\t\t\t\t\trule.authorize?.some((auth: { name: string }) => auth.name !== app.name)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnewRules.push({\n\t\t\t\t\t\t\t\tauthorize: [{ name: app.name }],\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\n\t\t\t\t\tdoSetRules(newRules);\n\t\t\t\t}}\n\t\t\t\tshowSearch={true}\n\t\t\t></FinsembleSelect>\n\t\t</div>\n\t);\n};\n"]}

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

@@ -0,0 +1,26 @@
+/*!
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+/// <reference types="react" />
+import * as Types from "../../types/smartDesktopDesignerTypes";
+import "../common/css/application-edit-page.css";
+import { SmartDesktopClient } from "./smartDesktopClient";
+export declare const defaultAppData: Types.ApplicationSaveData;
+export declare type AppEditPageProps = {
+    startingDisplayName: string;
+    startingAppType: string;
+    startingWindowURL: string;
+    startingNativePath: string;
+    appData?: Types.ApplicationSaveData;
+    validateURL: (s: string) => boolean;
+    removeApplicationFn: () => void;
+    cancelFn: () => void;
+    submitFn: (data: Types.ApplicationSaveData) => void;
+    addApp: typeof SmartDesktopClient.addApp;
+    isInboundInteropAuthorized: typeof SmartDesktopClient.isInboundInteropAuthorized;
+    isOutboundInteropAuthorized: typeof SmartDesktopClient.isOutboundInteropAuthorized;
+    preloadAliasList: string[];
+    appService: boolean;
+};
+export declare const AppEditPage: ({ startingDisplayName, startingAppType, startingWindowURL, startingNativePath, appData, validateURL, removeApplicationFn, cancelFn, submitFn, addApp, isInboundInteropAuthorized, isOutboundInteropAuthorized, preloadAliasList, appService, }: AppEditPageProps) => JSX.Element;