pollination-react-io 1.57.2 → 1.58.1

package/build/RunDetails/Cards/FileCard.d.ts

@@ -12,6 +12,7 @@ export interface FileCardProps {
     description: string;
     file?: Blob | File | string | undefined;
     onClicked?: (card: FileCardProps) => any;
+    isCloud?: boolean;
 }
 export declare const FileCard: React.FC<FileCardProps>;
 export default FileCard;

package/build/RunDetails/RunContent.types.d.ts

@@ -13,4 +13,5 @@ export interface RunContentProps {
     style?: CSSProperties;
     getFileCard?: (card: FileCardProps) => any;
     getFolderCard?: (card: FolderCardProps) => any;
+    isCloud?: boolean;
 }

package/build/RunDetails/RunDetails.types.d.ts

@@ -17,9 +17,9 @@ export interface RunDetailsProps {
     projectOwner: string;
     projectName: string;
     run?: Run | LocalRun;
-    runId?: string;
     client?: APIClient;
     style?: CSSProperties;
     getFileCard?: (card: FileCardProps) => any;
     getFolderCard?: (card: FolderCardProps) => any;
+    isCloud?: boolean;
 }

package/build/index.esm.js

@@ -49325,26 +49325,27 @@ var CADtypeEnum;
 })(CADtypeEnum || (CADtypeEnum = {}));
 var FileCard = function (_a) {
     var _b, _c;
-    var projectOwner = _a.projectOwner, projectName = _a.projectName, client = _a.client, studyId = _a.studyId, runId = _a.runId, label = _a.label, path = _a.path, file = _a.file, description = _a.description, onClicked = _a.onClicked;
+    var projectOwner = _a.projectOwner, projectName = _a.projectName, client = _a.client, studyId = _a.studyId, runId = _a.runId, label = _a.label, path = _a.path, file = _a.file, description = _a.description, onClicked = _a.onClicked, _d = _a.isCloud, isCloud = _d === void 0 ? true : _d;
     var host = getHost();
-    var _d = useState(false), open = _d[0], setOpen = _d[1];
-    var _e = useState(false), over = _e[0], setOver = _e[1];
-    var _f = useState(true), isLoading = _f[0], setIsLoading = _f[1];
-    var _g = useState(false), isInactive = _g[0], setIsInactive = _g[1];
+    var fromFileToBase64 = usePollinationPanel().fromFileToBase64;
+    var _e = useState(false), open = _e[0], setOpen = _e[1];
+    var _f = useState(false), over = _f[0], setOver = _f[1];
+    var _g = useState(true), isLoading = _g[0], setIsLoading = _g[1];
+    var _h = useState(false), isInactive = _h[0], setIsInactive = _h[1];
     // Data to use for CAD injections
-    var _h = useState(), CADdata = _h[0], setCADdata = _h[1];
+    var _j = useState(), CADdata = _j[0], setCADdata = _j[1];
     // File to send to parent
-    var _j = useState(), currFile = _j[0], setCurrFile = _j[1];
-    /**
-     * Check if run id is a valid UUID or file path (Local sim)
-     * @param str run id
-     * @returns true or false
-     */
-    var checkIfValidUUID = function (str) {
-        var regexExp = /^[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}$/gi;
-        return regexExp.test(str);
-    };
-    var isCloud = useMemo(function () { return checkIfValidUUID(runId); }, [runId]);
+    var _k = useState(), currFile = _k[0], setCurrFile = _k[1];
+    // /**
+    //  * Check if run id is a valid UUID or file path (Local sim)
+    //  * @param str run id
+    //  * @returns true or false
+    //  */
+    // const checkIfValidUUID = (str: string): boolean => {
+    //   const regexExp = /^[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}$/gi
+    //   return regexExp.test(str)
+    // }
+    // const isCloud = useMemo(() => checkIfValidUUID(runId), [runId])
     var downloadArtifact = useArtifacts(projectOwner, projectName, client).downloadArtifact;
     var setCADintegration = useCallback(function (file) {
         if (!file)
@@ -49395,9 +49396,42 @@ var FileCard = function (_a) {
                 setCADintegration(blob);
             });
         })
-            .catch(function () { })
+            .catch(function (err) {
+            console.error(err);
+        })
             .finally(function () { return setIsLoading(false); });
     };
+    var extension = useMemo(function () {
+        if (!path)
+            return;
+        return path.split('/').reverse()[0];
+    }, [path]);
+    /**
+     * Read local file as Blob - Panel only
+     */
+    var base64AndFetch = function (path) {
+        if (!path)
+            return;
+        var data = fromFileToBase64(path);
+        var base64Data = data === null || data === void 0 ? void 0 : data.data;
+        if (!base64Data)
+            return;
+        // bas64 mapping
+        var t;
+        switch (extension) {
+            case 'zip':
+                t = 'application/zip';
+                break;
+            case 'hbjson':
+            case 'vsf':
+                t = 'text/plain';
+            default:
+                t = 'text/plain';
+                break;
+        }
+        fetchAndSet("data:".concat(t, ";base64,").concat(base64Data));
+    };
+    var isPanel = useMemo(function () { return checkPollinationPanel(); }, []);
     useEffect(function () {
         if (isCloud) {
             // Generate Blob on click
@@ -49406,8 +49440,15 @@ var FileCard = function (_a) {
                 .catch(function () { return onClicked({ label: label, path: path, file: undefined, description: description, runId: runId }); });
         }
         else {
-            // TODO: Local later...
-            onClicked({ label: label, path: path, file: currFile, description: description, runId: runId });
+            if (!isPanel) {
+                setIsInactive(true);
+                setCurrFile(undefined);
+                setCADintegration(undefined);
+                setIsLoading(false);
+            }
+            else {
+                base64AndFetch(path);
+            }
         }
     }, [studyId, runId, label, path]);
     return React__default.createElement("div", { className: isInactive
@@ -49422,7 +49463,7 @@ var FileCard = function (_a) {
             React__default.createElement("div", { style: { float: 'left', margin: '0 8px 0 0' } }, !isLoading ? React__default.createElement("div", { title: !isInactive
                     ? 'Open the viewer'
                     : 'File is missing. Check run workspace' },
-                React__default.createElement("span", { style: { margin: '0 8px 0 0' } }, getFileIcon(18, ((_c = (_b = path.split('/')
+                React__default.createElement("span", { style: { margin: '0 8px 0 0' } }, path && getFileIcon(18, ((_c = (_b = path.split('/')
                     .reverse()[0]) === null || _b === void 0 ? void 0 : _b.split('.')) === null || _c === void 0 ? void 0 : _c.pop()) || '')),
                 label)
                 : React__default.createElement(LoadingIcon, { size: 14 })),
@@ -49489,11 +49530,11 @@ var css_248z$2 = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --
 styleInject(css_248z$2);
 
 var RunContent = function (_a) {
-    var inputData = _a.inputData, projectOwner = _a.projectOwner, projectName = _a.projectName, studyId = _a.studyId, runId = _a.runId, client = _a.client, title = _a.title, style = _a.style, getFileCard = _a.getFileCard, getFolderCard = _a.getFolderCard;
-    var _b = useState([]), currData = _b[0], setCurrData = _b[1];
-    var _c = useState([]), currParams = _c[0], setCurrParams = _c[1];
-    var _d = useState([]), currFiles = _d[0], setCurrFiles = _d[1];
-    var _e = useState([]), currFolders = _e[0], setCurrFolders = _e[1];
+    var inputData = _a.inputData, projectOwner = _a.projectOwner, projectName = _a.projectName, studyId = _a.studyId, runId = _a.runId, client = _a.client, title = _a.title, style = _a.style, getFileCard = _a.getFileCard, getFolderCard = _a.getFolderCard, _b = _a.isCloud, isCloud = _b === void 0 ? true : _b;
+    var _c = useState([]), currData = _c[0], setCurrData = _c[1];
+    var _d = useState([]), currParams = _d[0], setCurrParams = _d[1];
+    var _e = useState([]), currFiles = _e[0], setCurrFiles = _e[1];
+    var _f = useState([]), currFolders = _f[0], setCurrFolders = _f[1];
     useEffect(function () { return setCurrData(inputData); }, [inputData]);
     useEffect(function () {
         if (!currData || currData.length == 0)
@@ -49523,11 +49564,11 @@ var RunContent = function (_a) {
         setCurrFiles(files);
         setCurrFolders(folders);
     }, [currData]);
-    var checkIfValidUUID = function (str) {
-        var regexExp = /^[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}$/gi;
-        return regexExp.test(str);
-    };
-    var isCloud = useMemo(function () { return checkIfValidUUID(runId); }, [runId]);
+    // const checkIfValidUUID = (str: string): boolean => {
+    //   const regexExp = /^[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}$/gi
+    //   return regexExp.test(str)
+    // }
+    // const isCloud = useMemo(() => checkIfValidUUID(runId), [runId])
     /**
      * Click event handler of the file card
      * @param card File card props
@@ -49555,7 +49596,7 @@ var RunContent = function (_a) {
         currFiles.length > 0 && projectOwner && projectName && client && runId && React__default.createElement("div", { style: { padding: '20px' } },
             React__default.createElement("div", { className: 'cards' }, currFiles.map(function (_a, index) {
                 var label = _a.label, path = _a.path, description = _a.description;
-                return React__default.createElement(FileCard, { projectOwner: projectOwner, projectName: projectName, studyId: studyId, runId: runId, client: client, key: "filecard-".concat(index), label: label, path: path, description: description, onClicked: onFileClicked });
+                return React__default.createElement(FileCard, { projectOwner: projectOwner, projectName: projectName, studyId: studyId, runId: runId, client: client, key: "filecard-".concat(index), label: label, path: path, description: description, onClicked: onFileClicked, isCloud: isCloud });
             }))),
         currFolders.length > 0 && React__default.createElement("div", { style: { padding: '20px' } },
             React__default.createElement("div", { className: 'cards' }, currFolders.map(function (_a, index) {
@@ -49571,11 +49612,10 @@ var RunContent = function (_a) {
 
 var RunDetails = function (_a) {
     var projectName = _a.projectName, projectOwner = _a.projectOwner, run = _a.run, // Cloud and Local
-    runId = _a.runId, // TODO: delete it if RUN JSON has the field
-    client = _a.client, style = _a.style, getFileCard = _a.getFileCard, getFolderCard = _a.getFolderCard;
-    var _b = useState([]), extraInputs = _b[0], setExtraInputs = _b[1];
-    var _c = useState([]), recipeInputs = _c[0], setRecipeInputs = _c[1];
-    var _d = useState([]), outputs = _d[0], setOutputs = _d[1];
+    client = _a.client, style = _a.style, getFileCard = _a.getFileCard, getFolderCard = _a.getFolderCard, _b = _a.isCloud, isCloud = _b === void 0 ? true : _b;
+    var _c = useState([]), extraInputs = _c[0], setExtraInputs = _c[1];
+    var _d = useState([]), recipeInputs = _d[0], setRecipeInputs = _d[1];
+    var _e = useState([]), outputs = _e[0], setOutputs = _e[1];
     useEffect(function () {
         if (!run)
             return;
@@ -49604,11 +49644,11 @@ var RunDetails = function (_a) {
     }, [run]);
     return (React__default.createElement("div", null,
         outputs &&
-            React__default.createElement(RunContent, { title: 'Outputs', inputData: outputs, projectName: projectName, projectOwner: projectOwner, studyId: run.status.job_id, runId: run.id || runId, client: client, style: style, getFileCard: getFileCard, getFolderCard: getFolderCard }),
+            React__default.createElement(RunContent, { title: 'Outputs', inputData: outputs, projectName: projectName, projectOwner: projectOwner, studyId: run.status.job_id, runId: run.id, client: client, style: style, getFileCard: getFileCard, getFolderCard: getFolderCard, isCloud: isCloud }),
         recipeInputs &&
-            React__default.createElement(RunContent, { title: 'Inputs', inputData: recipeInputs, projectName: projectName, projectOwner: projectOwner, studyId: run.status.job_id, runId: run.id || runId, client: client, style: style, getFileCard: getFileCard, getFolderCard: getFolderCard }),
+            React__default.createElement(RunContent, { title: 'Inputs', inputData: recipeInputs, projectName: projectName, projectOwner: projectOwner, studyId: run.status.job_id, runId: run.id, client: client, style: style, getFileCard: getFileCard, getFolderCard: getFolderCard, isCloud: isCloud }),
         extraInputs && extraInputs.length > 0 &&
-            React__default.createElement(RunContent, { title: 'Extra Inputs', inputData: extraInputs, projectName: projectName, projectOwner: projectOwner, studyId: run.status.job_id, runId: run.id || runId, client: client, style: style, getFileCard: getFileCard, getFolderCard: getFolderCard })));
+            React__default.createElement(RunContent, { title: 'Extra Inputs', inputData: extraInputs, projectName: projectName, projectOwner: projectOwner, studyId: run.status.job_id, runId: run.id, client: client, style: style, getFileCard: getFileCard, getFolderCard: getFolderCard, isCloud: isCloud })));
 };
 
 var css_248z$1 = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\n  --primary3: #000;\n  --success: #46A758;\n  --warning: #F76809;\n  --danger: #FF4616;\n  /* radix-ui/colors */\n  --slate1: hsl(206, 30.0%, 98.8%);\n  --slate2: hsl(210, 16.7%, 97.6%);\n  --slate3: hsl(209, 13.3%, 95.3%);\n  --slate4: hsl(209, 12.2%, 93.2%);\n  --slate5: hsl(208, 11.7%, 91.1%);\n  --slate6: hsl(208, 11.3%, 88.9%);\n  --slate7: hsl(207, 11.1%, 85.9%);\n  --slate8: hsl(205, 10.7%, 78.0%);\n  --slate9: hsl(206, 6.0%, 56.1%);\n  --slate10: hsl(206, 5.8%, 52.3%);\n  --slate11: hsl(206, 6.0%, 43.5%);\n  --slate12: hsl(206, 24.0%, 9.0%);\n}\n\n@keyframes spin {\n  from {\n    transform: rotate(0);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n.spin {\n  animation: spin 1s linear 0s infinite;\n}\n\n@keyframes Animation {\n  0% {\n    background-position: 200%;\n  }\n  50% {\n    background-position: 100%;\n  }\n  100% {\n    background-position: 0%;\n  }\n}\n.loading {\n  background: linear-gradient(45deg, transparent, var(--primary), 12%, transparent);\n  background-size: 200%;\n  animation: Animation 3s ease infinite;\n}\n\n@keyframes open {\n  from {\n    height: 0;\n  }\n  to {\n    height: var(--radix-collapsible-content-height);\n  }\n}\n@keyframes close {\n  from {\n    height: var(--radix-collapsible-content-height);\n  }\n  to {\n    height: 0;\n  }\n}\n.collapse-content {\n  overflow: hidden;\n  font-size: inherit;\n  color: inherit;\n}\n\n.collapse-content[data-state=open] {\n  animation: open 300ms ease-out;\n}\n\n.collapse-content[data-state=closed] {\n  animation: close 300ms ease-out;\n}\n\n.run-progress {\n  grid-area: runprogress;\n  font-size: 0.9rem;\n  text-align: left !important;\n}\n\n.run-link {\n  grid-area: runlink;\n  text-align: right !important;\n  font-size: 1rem;\n  white-space: nowrap;\n}\n\n.run-details {\n  grid-area: rundetails;\n  font-size: 0.9rem;\n}\n\n.study-run-container {\n  display: grid;\n  grid-template-areas: \"runprogress runprogress runprogress runprogress runprogress runlink\" \"rundetails rundetails rundetails rundetails rundetails rundetails\";\n  gap: 0.35rem;\n  border: 0.1rem solid;\n  align-items: center;\n  padding: 0.75rem;\n  transition: box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;\n  grid-template-rows: max-content auto;\n  border-radius: 6px;\n  line-height: 1.5;\n}\n\n.study-run-container:hover {\n  cursor: pointer;\n  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 2px -2px, rgba(0, 0, 0, 0.12) 0px 3px 6px 0px, rgba(0, 0, 0, 0.09) 0px 5px 12px 4px;\n}\n\n.run-navigator {\n  display: grid;\n  grid-template-columns: min-content auto min-content min-content;\n  grid-auto-rows: auto;\n  align-items: center;\n  grid-gap: 0.9rem;\n}\n\n.run-pg-input {\n  margin: 0 4px 0 4px;\n  padding: 8px 8px;\n  text-align: center;\n  color: rgba(0, 0, 0, 0.8509803922);\n  width: min-content;\n  border-radius: 2px;\n  font-size: 12px;\n  border: 1px solid rgba(0, 0, 0, 0.125);\n}\n\n.container-scroll {\n  display: inline-flex;\n  flex-direction: row;\n  overflow-x: auto;\n  width: 100%;\n}\n\n.blink-effect {\n  animation: blinker 5s linear infinite;\n}\n\n@keyframes blinker {\n  50% {\n    border: 0.1rem solid white;\n  }\n}";