pollination-react-io 1.54.0 → 1.56.0

package/build/Cards/RunCard.types.d.ts

@@ -19,4 +19,5 @@ export interface RunCardProps {
     interval?: number;
     getValue?: (run: Run) => any;
     canWrite?: boolean;
+    localRun?: boolean;
 }

package/build/hooks/index.d.ts

@@ -12,4 +12,5 @@ export * from './useRuns';
 export * from './useSendHbjson';
 export * from './useSendMessage';
 export * from './useWindowDimensions';
+export * from './usePollinationPanel';
 export * from './utilities';

package/build/hooks/usePollinationPanel.d.ts

@@ -1,9 +1,10 @@
 import { PanelMessageOut } from './types';
-import { Run } from '@pollination-solutions/pollination-sdk';
+import { Job, Run } from '@pollination-solutions/pollination-sdk';
 export declare const usePollinationPanel: () => {
     getFileBase64: (key?: any, accept?: any) => PanelMessageOut;
     saveFileBase64: (key: string, file: File | Blob, subFolder: string, fileName: string) => Promise<PanelMessageOut>;
     fromFileToBase64: (filePath: string) => PanelMessageOut;
     getFilesFromDir: (root: any) => PanelMessageOut;
-    fetchLocalRun: (projectOwner?: any, projectName?: any, runPath?: any) => Run;
+    fetchLocalRun: (path?: any) => Run;
+    fetchLocalJob: (path?: any) => Job;
 };

package/build/index.esm.js

@@ -38005,24 +38005,41 @@ var usePollinationPanel = function () {
             return;
         return panel.FromFileToBase64(filePath);
     }, [panel]);
-    var fetchLocalRun = useCallback(function (projectOwner, projectName, runPath) {
+    var fetchLocalRun = useCallback(function (path) {
+        if (path === void 0) { path = ''; }
+        if (!panel)
+            return;
+        var message = panel.FetchLocalRun(path);
+        try {
+            var run = JSON.parse(message.data);
+            return run;
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }, [panel]);
+    var fetchLocalJob = useCallback(function (path) {
         var _a;
-        if (projectOwner === void 0) { projectOwner = 'project-owner'; }
-        if (projectName === void 0) { projectName = 'project-name'; }
-        if (runPath === void 0) { runPath = ''; }
+        if (path === void 0) { path = ''; }
         if (!panel)
             return;
-        var message = panel.FetchLocalRun(projectOwner, projectName, runPath);
-        var runContent = (_a = JSON.parse(message.data)) === null || _a === void 0 ? void 0 : _a.runContent;
-        var run = JSON.parse(runContent);
-        return run;
+        var message = panel.FetchLocalJob(path);
+        try {
+            var localJob = JSON.parse(message.data);
+            var job = (_a = localJob === null || localJob === void 0 ? void 0 : localJob.LocalJob) === null || _a === void 0 ? void 0 : _a.Job;
+            return job;
+        }
+        catch (error) {
+            console.error(error);
+        }
     }, [panel]);
     return {
         getFileBase64: getFileBase64,
         saveFileBase64: saveFileBase64,
         fromFileToBase64: fromFileToBase64,
         getFilesFromDir: getFilesFromDir,
-        fetchLocalRun: fetchLocalRun
+        fetchLocalRun: fetchLocalRun,
+        fetchLocalJob: fetchLocalJob
     };
 };
 
@@ -44717,6 +44734,7 @@ var CreateStudy = function (_a) {
             }, 3000);
         }
     };
+    var toUnixPath = function (path) { return path.replace(/[\\/]+/g, '/').replace(/^([a-zA-Z]+:|\.\/)/, ''); };
     var _onSuccessLocal = function (projectJobInfo) {
         if (!basePath) {
             throw new Error('CreateStudy: client.configuration.basepath not defined.');
@@ -44728,6 +44746,12 @@ var CreateStudy = function (_a) {
         }
         else {
             _t.success("Study is running! Do not close the console.\nYou will find output here ".concat(projectJobInfo.studyId, "."), { duration: 4000, position: 'bottom-left', style: { minWidth: '300px', fontSize: '12px' } });
+            // Formatted name of the job
+            var jobName_1 = toUnixPath(projectJobInfo.studyId).split('/').reverse()[0];
+            // Path is the full path of the local machine where the run input/output are
+            setTimeout(function () {
+                window.location.href = "http://localhost:3000/".concat(projectJobInfo.accountName, "/projects/").concat(projectJobInfo.projectName, "/localStudies/").concat(jobName_1, "/?path=").concat(projectJobInfo.studyId);
+            }, 3000);
         }
     };
     var handleCreateStudy = useCallback(function (name, jobArgs, description, localConfig) {
@@ -46889,7 +46913,7 @@ var JobTabs;
     JobTabs["workspace"] = "workspace";
 })(JobTabs || (JobTabs = {}));
 
-var css_248z$6 = ":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.item1 {\n  grid-area: accountprj;\n  font-size: 1rem;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item2 {\n  grid-area: runworkspacedebug;\n  text-align: right !important;\n  font-size: 1.25rem;\n  white-space: nowrap;\n}\n\n.item3 {\n  grid-area: studyrun;\n  font-size: 1.25rem;\n  font-weight: 500;\n  white-space: wrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item4 {\n  grid-area: date;\n  color: var(--slate10);\n  font-size: 0.9rem;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  text-align: right !important;\n}\n\n.item5 {\n  grid-area: author;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item6 {\n  grid-area: recipe;\n  white-space: wrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item7 {\n  grid-area: description;\n  white-space: wrap;\n  color: var(--slate10);\n  font-size: 0.9rem;\n}\n\n.item8 {\n  grid-area: status;\n  font-size: 0.9rem;\n}\n\n.status-label {\n  font-weight: 500;\n}\n\n.item9 {\n  grid-area: time;\n  text-align: right !important;\n  white-space: wrap;\n}\n\n.item10 {\n  grid-area: cpu;\n  text-align: right !important;\n  white-space: wrap;\n}\n\n.link {\n  text-decoration: none;\n  color: var(--primary3);\n}\n\n.link:hover {\n  color: var(--primary3);\n}\n\n.light-text {\n  color: var(--slate10);\n  font-size: 0.9rem;\n}\n\n.grid-container {\n  display: grid;\n  grid-template-areas: \"accountprj accountprj accountprj accountprj runworkspacedebug runworkspacedebug\" \"studyrun studyrun studyrun studyrun date date\" \"author recipe recipe recipe recipe recipe\" \"status status status status cpu time\" \"description description description description description description\";\n  gap: 0.35rem;\n  border: 0.1rem solid;\n  align-items: center;\n  padding: 0.35rem;\n  transition: box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;\n  grid-template-rows: 52px 38px 46px 46px auto;\n  border-radius: 6px;\n  line-height: 1.5;\n}\n\n.grid-container:hover {\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  cursor: pointer;\n}\n\n.disable-click {\n  box-shadow: none !important;\n  cursor: default !important;\n}\n\n.grid-container > div {\n  text-align: left;\n  padding: 1rem;\n  vertical-align: middle;\n}\n\n.description-expander {\n  all: unset;\n}\n\n.description-expander:focus {\n  outline: 0 !important;\n}\n\n@media (max-width: 600px) {\n  .grid-container {\n    display: grid;\n    grid-template-areas: \"accountprj accountprj accountprj accountprj runworkspacedebug runworkspacedebug\" \"studyrun studyrun studyrun studyrun studyrun studyrun\" \"date date date date date date\" \"author author author recipe recipe recipe\" \"status status status status status status\" \"time time time cpu cpu cpu\" \"description description description description description description\";\n    gap: 0.35rem;\n    border: 0.1rem solid;\n    align-items: center;\n    padding: 0.15rem;\n    transition: box-shadow 0.3s;\n    grid-template-rows: 52px 52px 32px 32px 32px 32px auto;\n  }\n  .item1 {\n    text-align: left !important;\n  }\n  .item2 {\n    text-align: right !important;\n    font-size: 1rem;\n    white-space: nowrap;\n  }\n  .item3, .item4 {\n    text-align: center !important;\n  }\n  .item5 {\n    font-size: 0.8rem;\n  }\n  .item6 {\n    white-space: nowrap;\n    font-size: 0.8rem;\n  }\n  .item7 {\n    font-size: 0.8rem;\n    text-align: center !important;\n  }\n  .item8 {\n    font-size: 1rem;\n    text-align: center !important;\n  }\n  .item9 {\n    text-align: left !important;\n    font-size: 1rem;\n    white-space: nowrap;\n  }\n  .item10 {\n    text-align: right !important;\n  }\n  .grid-container > div {\n    text-align: left;\n    vertical-align: middle;\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}";
+var css_248z$6 = ":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.item1 {\n  grid-area: accountprj;\n  font-size: 1rem;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item2 {\n  grid-area: runworkspacedebug;\n  text-align: right !important;\n  font-size: 1.25rem;\n  white-space: nowrap;\n}\n\n.item3 {\n  grid-area: studyrun;\n  font-size: 1.25rem;\n  font-weight: 500;\n  white-space: wrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item4 {\n  grid-area: date;\n  color: var(--slate10);\n  font-size: 0.9rem;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  text-align: right !important;\n}\n\n.item5 {\n  grid-area: author;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item6 {\n  grid-area: recipe;\n  white-space: wrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.item7 {\n  grid-area: description;\n  white-space: wrap;\n  color: var(--slate10);\n  font-size: 0.9rem;\n}\n\n.item8 {\n  grid-area: status;\n  font-size: 0.9rem;\n}\n\n.status-label {\n  font-weight: 500;\n}\n\n.item9 {\n  grid-area: time;\n  text-align: right !important;\n  white-space: wrap;\n}\n\n.item10 {\n  grid-area: cpu;\n  text-align: right !important;\n  white-space: wrap;\n}\n\n.link {\n  text-decoration: none;\n  color: var(--primary3);\n  cursor: pointer;\n}\n\n.link:hover {\n  color: var(--primary3);\n}\n\n.light-text {\n  color: var(--slate10);\n  font-size: 0.9rem;\n}\n\n.grid-container {\n  display: grid;\n  grid-template-areas: \"accountprj accountprj accountprj accountprj runworkspacedebug runworkspacedebug\" \"studyrun studyrun studyrun studyrun date date\" \"author recipe recipe recipe recipe recipe\" \"status status status status cpu time\" \"description description description description description description\";\n  gap: 0.35rem;\n  border: 0.1rem solid;\n  align-items: center;\n  padding: 0.35rem;\n  transition: box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;\n  grid-template-rows: 52px 38px 46px 46px auto;\n  border-radius: 6px;\n  line-height: 1.5;\n}\n\n.grid-container:hover {\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  cursor: pointer;\n}\n\n.disable-click {\n  box-shadow: none !important;\n  cursor: default !important;\n}\n\n.grid-container > div {\n  text-align: left;\n  padding: 1rem;\n  vertical-align: middle;\n}\n\n.description-expander {\n  all: unset;\n}\n\n.description-expander:focus {\n  outline: 0 !important;\n}\n\n@media (max-width: 600px) {\n  .grid-container {\n    display: grid;\n    grid-template-areas: \"accountprj accountprj accountprj accountprj runworkspacedebug runworkspacedebug\" \"studyrun studyrun studyrun studyrun studyrun studyrun\" \"date date date date date date\" \"author author author recipe recipe recipe\" \"status status status status status status\" \"time time time cpu cpu cpu\" \"description description description description description description\";\n    gap: 0.35rem;\n    border: 0.1rem solid;\n    align-items: center;\n    padding: 0.15rem;\n    transition: box-shadow 0.3s;\n    grid-template-rows: 52px 52px 32px 32px 32px 32px auto;\n  }\n  .item1 {\n    text-align: left !important;\n  }\n  .item2 {\n    text-align: right !important;\n    font-size: 1rem;\n    white-space: nowrap;\n  }\n  .item3, .item4 {\n    text-align: center !important;\n  }\n  .item5 {\n    font-size: 0.8rem;\n  }\n  .item6 {\n    white-space: nowrap;\n    font-size: 0.8rem;\n  }\n  .item7 {\n    font-size: 0.8rem;\n    text-align: center !important;\n  }\n  .item8 {\n    font-size: 1rem;\n    text-align: center !important;\n  }\n  .item9 {\n    text-align: left !important;\n    font-size: 1rem;\n    white-space: nowrap;\n  }\n  .item10 {\n    text-align: right !important;\n  }\n  .grid-container > div {\n    text-align: left;\n    vertical-align: middle;\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}";
 styleInject(css_248z$6);
 
 var IconContext = /*#__PURE__*/createContext({});
@@ -48696,25 +48720,26 @@ var formatDuration = function (duration) {
 };
 var RunCard = function (_a) {
     var _b;
-    var _c, _d, _e, _f;
-    var projectName = _a.projectName, projectOwner = _a.projectOwner, _run = _a.run, style = _a.style, authUser = _a.authUser, client = _a.client, enableClick = _a.enableClick, getTab = _a.getTab, defaultTab = _a.defaultTab, getValue = _a.getValue, _g = _a.interval, interval = _g === void 0 ? 5000 : _g, _h = _a.canWrite, canWrite = _h === void 0 ? false : _h;
+    var _c, _d, _e, _f, _g, _h, _j, _k;
+    var projectName = _a.projectName, projectOwner = _a.projectOwner, _run = _a.run, style = _a.style, authUser = _a.authUser, client = _a.client, enableClick = _a.enableClick, getTab = _a.getTab, defaultTab = _a.defaultTab, getValue = _a.getValue, _l = _a.interval, interval = _l === void 0 ? 5000 : _l, _m = _a.canWrite, canWrite = _m === void 0 ? false : _m, _o = _a.localRun, localRun = _o === void 0 ? false : _o;
+    var _p = usePollinationPanel(), fetchLocalRun = _p.fetchLocalRun, fetchLocalJob = _p.fetchLocalJob;
     /*
      * Fetch run
      */
     var fetchJob = useJobs(client).fetchJob;
-    var _j = useRuns(client), fetchRun = _j.fetchRun, statusMap = _j.statusMap, getDuration = _j.getDuration, cancelRun = _j.cancelRun;
-    var _k = useWindowDimensions(), width = _k.width; _k.height;
-    var _l = useState(false), seeDescription = _l[0], setSeeDescription = _l[1];
-    var _m = useState(false), seeAction = _m[0], setSeeAction = _m[1];
-    var _o = useState(false), stopRefresh = _o[0], setStopRefresh = _o[1];
-    var _p = useState(false), isReady = _p[0], setIsReady = _p[1];
+    var _q = useRuns(client), fetchRun = _q.fetchRun, statusMap = _q.statusMap, getDuration = _q.getDuration, cancelRun = _q.cancelRun;
+    var _r = useWindowDimensions(), width = _r.width; _r.height;
+    var _s = useState(false), seeDescription = _s[0], setSeeDescription = _s[1];
+    var _t = useState(false), seeAction = _t[0], setSeeAction = _t[1];
+    var _u = useState(false), stopRefresh = _u[0], setStopRefresh = _u[1];
+    var _v = useState(false), isReady = _v[0], setIsReady = _v[1];
     /*
      * From run and stop when it is done
      */
-    var _q = useSWR(authUser && _run ? [projectOwner, projectName, _run.id] : undefined, fetchRun, {
+    var _w = useSWR(authUser && _run ? (!localRun ? [projectOwner, projectName, _run.id] : [_run.id]) : undefined, localRun ? fetchLocalRun : fetchRun, {
         revalidateOnFocus: false,
         refreshInterval: stopRefresh ? undefined : interval,
-        fallbackData: _run,
+        fallbackData: localRun ? undefined : _run,
         errorRetryCount: 3,
         onSuccess: function (run, key, config) {
             sendRun(run);
@@ -48722,7 +48747,7 @@ var RunCard = function (_a) {
                 setStopRefresh(true);
             setIsReady(true);
         },
-    }), run = _q.data; _q.error; _q.isValidating;
+    }), run = _w.data, error = _w.error; _w.isValidating;
     var sendRun = useCallback(function (run) { return getValue(run); }, [run]);
     /**
      * Fetch job just one time
@@ -48730,11 +48755,17 @@ var RunCard = function (_a) {
     useEffect(function () {
         if (!_run)
             return;
-        fetchJob(projectOwner, projectName, run.status.job_id)
-            .then(function (d) {
-            setStudy(d);
-        })
-            .catch(function () { setStudy(undefined); });
+        if (localRun) {
+            var jobInfo = fetchLocalJob(_run.id);
+            setLocalStudy(jobInfo);
+        }
+        else {
+            fetchJob(projectOwner, projectName, run.status.job_id)
+                .then(function (d) {
+                setStudy(d);
+            })
+                .catch(function () { setStudy(undefined); });
+        }
     }, [_run]);
     /**
      * Refresh status
@@ -48744,8 +48775,9 @@ var RunCard = function (_a) {
             return undefined;
         return run.status.status;
     }, [run]);
-    var _r = useState(), study = _r[0], setStudy = _r[1];
-    var _s = useState(getDuration(run)), duration = _s[0], setDuration = _s[1];
+    var _x = useState(), study = _x[0], setStudy = _x[1];
+    var _y = useState(), localStudy = _y[0], setLocalStudy = _y[1];
+    var _z = useState(getDuration(run)), duration = _z[0], setDuration = _z[1];
     useEffect(function () {
         if (!run)
             return undefined;
@@ -48776,7 +48808,7 @@ var RunCard = function (_a) {
         info: false,
         settings: false,
     };
-    var _t = useState(__assign(__assign({}, initialValues), (_b = {}, _b[defaultTab] = true, _b))), hover = _t[0], setHover = _t[1];
+    var _0 = useState(__assign(__assign({}, initialValues), (_b = {}, _b[defaultTab] = true, _b))), hover = _0[0], setHover = _0[1];
     var toggleHover = useCallback(function (id, value) {
         if (value === void 0) { value = false; }
         setHover(function (prevHover) {
@@ -48791,21 +48823,39 @@ var RunCard = function (_a) {
         var _a;
         setHover(__assign(__assign({}, initialValues), (_a = {}, _a[defaultTab] = true, _a)));
     }, [defaultTab]);
+    if (error)
+        return React__default.createElement("div", { style: { textAlign: 'center' } }, "ERROR");
     return (React__default.createElement("div", { className: enableClick ? "grid-container ".concat(isReady && !run.status.finished_at && 'blink-effect')
             : "grid-container disable-click ".concat(isReady && !run.status.finished_at && 'blink-effect'), tabIndex: 0, role: 'button', style: __assign({ borderColor: (_d = (_c = statusMap[status]) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : '#d0d7de' }, style), onClick: function () {
-            if (run && enableClick) {
+            if (!enableClick)
+                return;
+            if (!localRun) {
                 window.location.href = "/".concat(projectOwner, "/projects/").concat(projectName, "/studies/").concat(study.id, "/runs/").concat(run.id);
             }
         } },
         React__default.createElement("div", { className: 'item1' },
-            React__default.createElement("a", { className: 'link', style: { marginRight: '0.75rem' }, title: 'Go to account page', onMouseOver: function (e) { return toggleHover('account', true); }, onMouseLeave: function (e) { return toggleHover('account', false); }, href: study && "/".concat(study.owner.name) },
-                React__default.createElement(Avatar, { src: study ? study.owner.picture_url : '', size: 32, color: hover.account ? '#40a9ff' : undefined })),
+            React__default.createElement("button", { className: 'link', style: { all: 'unset', cursor: 'pointer', marginRight: '0.75rem' }, title: 'Go to account page', onMouseOver: function (e) { return toggleHover('account', true); }, onMouseLeave: function (e) { return toggleHover('account', false); }, onClick: function (e) {
+                    e.stopPropagation();
+                    if (!localRun) {
+                        if (!run)
+                            return;
+                        window.location.href = "/".concat(run.owner.name);
+                    }
+                } },
+                React__default.createElement(Avatar, { src: run ? (_e = run.owner) === null || _e === void 0 ? void 0 : _e.picture_url : '', size: 32, color: hover.account ? '#40a9ff' : undefined })),
             React__default.createElement("span", { style: { marginRight: '0.75rem' } }, "/"),
-            React__default.createElement("a", { className: 'link', href: projectName && "/".concat(projectOwner, "/projects/").concat(projectName), title: 'Go to project page', onMouseOver: function (e) { return toggleHover('project', true); }, onMouseLeave: function (e) { return toggleHover('project', false); }, style: hover.project ? { color: '#40a9ff' } : {} }, projectName !== null && projectName !== void 0 ? projectName : '--')),
+            React__default.createElement("button", { className: 'link', title: 'Go to project page', onMouseOver: function (e) { return toggleHover('project', true); }, onMouseLeave: function (e) { return toggleHover('project', false); }, onClick: function (e) {
+                    e.stopPropagation();
+                    if (!localRun) {
+                        if (!projectOwner)
+                            return;
+                        window.location.href = "/".concat(projectOwner, "/projects/").concat(projectName);
+                    }
+                }, style: hover.project ? { all: 'unset', cursor: 'pointer', color: '#40a9ff' } : { all: 'unset', cursor: 'pointer' } }, projectName !== null && projectName !== void 0 ? projectName : '--')),
         React__default.createElement("div", { className: 'item2' },
             React__default.createElement("div", null,
-                (!isReady || !study) && React__default.createElement(LoadingOutlined$1, { style: { margin: '0 10px 0 0' } }),
-                (study && run) &&
+                !localRun && (!isReady || !study) && React__default.createElement(LoadingOutlined$1, { style: { margin: '0 10px 0 0' } }),
+                run &&
                     React__default.createElement(React__default.Fragment, null,
                         React__default.createElement("span", { title: 'Go to run page' },
                             React__default.createElement(InfoCircleOutlined$1, { onClick: function (e) {
@@ -48866,40 +48916,65 @@ var RunCard = function (_a) {
                             } }))))),
         React__default.createElement("div", { className: 'item3' },
             React__default.createElement("div", null,
-                React__default.createElement("a", { className: 'link', href: projectName && study && "/".concat(projectOwner, "/projects/").concat(projectName, "/studies/").concat(study.id), title: 'Go to study page', onMouseOver: function (e) { return toggleHover('study', true); }, onMouseLeave: function (e) { return toggleHover('study', false); }, style: { color: "".concat(hover.study
-                            ? '#40a9ff' : '#000') } }, study ? (_e = study.spec.name) !== null && _e !== void 0 ? _e : "Study: ".concat(study.id) : '--'),
+                React__default.createElement("button", { className: 'link', title: 'Go to study page', onMouseOver: function (e) { return toggleHover('study', true); }, onMouseLeave: function (e) { return toggleHover('study', false); }, onClick: function (e) {
+                        e.stopPropagation();
+                        if (!localRun) {
+                            if (!projectName || !study)
+                                return;
+                            window.location.href = "/".concat(projectOwner, "/projects/").concat(projectName, "/studies/").concat(study.id);
+                        }
+                    }, style: { all: 'unset', cursor: 'pointer', color: "".concat(hover.study
+                            ? '#40a9ff' : '#000') } },
+                    !localRun && study ? (_f = study.spec.name) !== null && _f !== void 0 ? _f : "Study: ".concat(study.id) : '',
+                    localRun && localStudy && localStudy.name),
                 React__default.createElement("button", { style: { all: 'unset', margin: '0 0 0 8px', cursor: 'pointer' }, onMouseOver: function (e) { return toggleHover('info', true); }, onMouseLeave: function (e) { return toggleHover('info', false); }, onClick: function (e) {
                         e.stopPropagation();
                         setSeeDescription(function (prev) { return !prev; });
                         setSeeAction(false);
                     } },
                     React__default.createElement(InfoCircle$1, { size: 14, style: hover.info ? { color: '#40a9ff' } : {} })))),
-        React__default.createElement("div", { className: 'item4', title: study && dayjs_min(study.status.started_at).format('[on] MMM DD YYYY [at] hh:mm') }, study ? dayjs_min(study.status.started_at).format('[on] MMM DD YYYY') : '--'),
+        React__default.createElement("div", { className: 'item4', title: run && dayjs_min(run.status.started_at).format('[on] MMM DD YYYY [at] hh:mm') }, run ? dayjs_min(run.status.started_at).format('[on] MMM DD YYYY') : '--'),
         React__default.createElement("div", { className: 'item5' },
             React__default.createElement("span", { style: { marginRight: '0.75rem' } },
-                React__default.createElement(Avatar, { color: hover.author ? '#40a9ff' : undefined, src: study ? study.author.picture_url : '', size: 24 })),
-            React__default.createElement("a", { className: 'link', href: study ? "/".concat(study.author.name) : '', title: 'Go to author page', target: '_blank', rel: 'noreferrer', onMouseOver: function (e) { return toggleHover('author', true); }, onMouseLeave: function (e) { return toggleHover('author', false); }, style: hover.author ? { color: '#40a9ff' } : {} }, study ? ((_f = study.author.display_name) !== null && _f !== void 0 ? _f : study.author.name) : '--')),
+                React__default.createElement(Avatar, { color: hover.author ? '#40a9ff' : undefined, src: run ? (_g = run.author) === null || _g === void 0 ? void 0 : _g.picture_url : '', size: 24 })),
+            React__default.createElement("a", { className: 'link', onClick: function (e) {
+                    e.stopPropagation();
+                    if (!localRun) {
+                        if (!run)
+                            return;
+                        window.location.href = "/".concat(run.author.name);
+                    }
+                }, title: 'Go to author page', target: '_blank', rel: 'noreferrer', onMouseOver: function (e) { return toggleHover('author', true); }, onMouseLeave: function (e) { return toggleHover('author', false); }, style: hover.author ? { color: '#40a9ff' } : {} }, run ? ((_j = (_h = run.author) === null || _h === void 0 ? void 0 : _h.display_name) !== null && _j !== void 0 ? _j : (_k = run.author) === null || _k === void 0 ? void 0 : _k.name) : '--')),
         React__default.createElement("div", { className: 'item6' },
             React__default.createElement("span", { style: { marginRight: '0.75rem' } },
-                React__default.createElement(Avatar, { color: hover.recipe ? '#40a9ff' : undefined, src: study ? study.recipe.metadata.icon : '', size: 24 })),
-            React__default.createElement("a", { className: 'link', href: study ? recipeLinkFromSource(study.recipe.source) : '', title: 'Go to recipe page', target: '_blank', rel: 'noreferrer', onMouseOver: function (e) { return toggleHover('recipe', true); }, onMouseLeave: function (e) { return toggleHover('recipe', false); }, style: hover.recipe ? { color: '#40a9ff' } : {} }, study ? study.recipe.metadata.name : '--'),
-            study && React__default.createElement("span", { className: 'light-text' },
+                React__default.createElement(Avatar, { color: hover.recipe ? '#40a9ff' : undefined, src: run ? run.recipe.metadata.icon : '', size: 24 })),
+            React__default.createElement("a", { className: 'link', onClick: function (e) {
+                    e.stopPropagation();
+                    if (!localRun) {
+                        if (!run)
+                            return;
+                        window.location.href = recipeLinkFromSource(run.recipe.source);
+                    }
+                }, title: 'Go to recipe page', target: '_blank', rel: 'noreferrer', onMouseOver: function (e) { return toggleHover('recipe', true); }, onMouseLeave: function (e) { return toggleHover('recipe', false); }, style: hover.recipe ? { color: '#40a9ff' } : {} }, run ? run.recipe.metadata.name : '--'),
+            run && React__default.createElement("span", { className: 'light-text' },
                 " ",
-                study.recipe.metadata.tag)),
+                run.recipe.metadata.tag)),
         React__default.createElement("div", { className: 'item8' },
-            React__default.createElement("span", { className: 'status-label', style: { marginRight: '0.75rem' } }, study ? status : '--'),
+            React__default.createElement("span", { className: 'status-label', style: { marginRight: '0.75rem' } }, run ? status : '--'),
             React__default.createElement("span", { className: 'light-text' },
                 !isReady && React__default.createElement(LoadingOutlined$1, null),
                 study && run && width > 600 &&
                     "".concat(run.meta.progress.completed, " / ").concat(run.meta.progress.total, " steps"))),
         React__default.createElement("div", { className: 'item9', title: 'CPU usage' },
             React__default.createElement(Cpu$1, { size: 18, style: { marginRight: '0.15rem' } }),
-            React__default.createElement("span", { className: 'light-text' }, study ? "".concat(formatDuration(dayjs_min.duration(run.meta.resources_duration.cpu, 'seconds'))) : '--')),
+            React__default.createElement("span", { className: 'light-text' }, run ? "".concat(formatDuration(dayjs_min.duration(run.meta.resources_duration.cpu, 'seconds'))) : '--')),
         React__default.createElement("div", { className: 'item10', title: 'Duration of the simulation' },
             React__default.createElement(Clock$1, { size: 18, style: { marginRight: '0.15rem' } }),
-            React__default.createElement("span", { className: 'light-text' }, study ? "".concat(formatDuration(duration)) : '--')),
+            React__default.createElement("span", { className: 'light-text' }, run ? "".concat(formatDuration(duration)) : '--')),
         seeDescription && React__default.createElement(React__default.Fragment, null,
-            React__default.createElement("div", { className: 'item7' }, study ? study.spec.description : '--')),
+            React__default.createElement("div", { className: 'item7' },
+                !localRun && study && study.spec.description,
+                localRun && localStudy && localStudy.description)),
         seeAction && width && React__default.createElement(React__default.Fragment, null,
             React__default.createElement("div", { className: 'item7' },
                 React__default.createElement(Button, { style: (width > 600) ? { display: 'inline' } : { display: 'inline', float: 'left' }, disabled: !run || (run.status.status === dist$1.RunStatusEnum.Failed ||
@@ -48909,9 +48984,11 @@ var RunCard = function (_a) {
                         e.stopPropagation();
                         if (!run)
                             return;
-                        cancelRun(projectOwner, projectName, run.id)
-                            .then(function (d) { return console.log(d); })
-                            .catch(function (e) { return console.log(e); });
+                        if (!localRun) {
+                            cancelRun(projectOwner, projectName, run.id)
+                                .then(function (d) { return console.log(d); })
+                                .catch(function (e) { return console.log(e); });
+                        }
                     } },
                     React__default.createElement(XOctagon$1, { style: { display: 'inline', margin: '0 5px 0 0' } }),
                     " Cancel")))));
@@ -50350,5 +50427,5 @@ var RunTable = function (_a) {
                         React__default.createElement(ChevronRight$1, null)))))));
 };
 
-export { APIClient, AuthUser, Avatar, Button, ComboBox, ComboFileSelector, ConditionalWrapper, ConfigureLocalRun, CreateStudy, Dropdown, FileInput, FilePreview, FormInput, GetGeometry, GetModel, InputDescription, Label, Logo, NumberInput, RadioList, RecipeForm, RunCard, RunDetails, RunRow, RunTable, SelectAccount, SelectCloudArtifacts, SelectLocalArtifacts, SelectProject, SelectRecipe, SelectRun, SelectStudy, SendGeometry, SendModel, SendResults, SettingsButton, StudyCard, TextInput, Tooltip, _defaultConfig, checkDotNet, checkPollinationPanel, checkRuby, formatBytes, getHost, recipeLinkFromSource, sendMessageDotNet, sendMessageRuby, useAPIClient, useArtifacts, useCreateStudy, useGetGeometry, useGetHbjson, useHbjsontoVTK, useJobs, useManageSettings, useRunCommand, useRuns, useSendHbjson, useSendMessage, useWindowDimensions };
+export { APIClient, AuthUser, Avatar, Button, ComboBox, ComboFileSelector, ConditionalWrapper, ConfigureLocalRun, CreateStudy, Dropdown, FileInput, FilePreview, FormInput, GetGeometry, GetModel, InputDescription, Label, Logo, NumberInput, RadioList, RecipeForm, RunCard, RunDetails, RunRow, RunTable, SelectAccount, SelectCloudArtifacts, SelectLocalArtifacts, SelectProject, SelectRecipe, SelectRun, SelectStudy, SendGeometry, SendModel, SendResults, SettingsButton, StudyCard, TextInput, Tooltip, _defaultConfig, checkDotNet, checkPollinationPanel, checkRuby, formatBytes, getHost, recipeLinkFromSource, sendMessageDotNet, sendMessageRuby, useAPIClient, useArtifacts, useCreateStudy, useGetGeometry, useGetHbjson, useHbjsontoVTK, useJobs, useManageSettings, usePollinationPanel, useRunCommand, useRuns, useSendHbjson, useSendMessage, useWindowDimensions };
 //# sourceMappingURL=index.esm.js.map