pollination-react-io 1.16.2 → 1.16.4

package/build/hooks/useJobs.d.ts

@@ -1,8 +1,8 @@
-import type { CloudJob } from '@pollination-solutions/pollination-sdk';
+import type { CloudJob, CloudJobList, JobStatusEnum } from '@pollination-solutions/pollination-sdk';
 import { APIClient } from './useAPIClient';
 export declare const useJobs: (client: APIClient) => {
-    listJobs: (projectOwner: string, projectName: string) => Promise<any>;
-    fetchJob: (owner: string, name: string, jobId: string) => Promise<CloudJob>;
+    listJobs: (projectOwner: string, projectName: string, jobIds?: string[], page?: number, perPage?: number, status?: JobStatusEnum) => Promise<CloudJobList>;
+    fetchJob: (projectOwner: string, projectName: string, jobId: string) => Promise<CloudJob>;
     deleteJob: (projectOwner: string, projectName: string, jobId: string) => Promise<any>;
     cancelJob: (projectOwner: string, projectName: string, jobId: string) => Promise<any>;
 };

package/build/index.esm.js

@@ -24020,26 +24020,30 @@ var useHbjsontoVTK = function () {
 };
 
 var useJobs = function (client) {
-    var listJobs = useCallback(function (projectOwner, projectName) {
+    var listJobs = useCallback(function (projectOwner, projectName, jobIds, page, perPage, status) {
         if (!client || !client.jobs)
             return;
         return client.jobs
             .listJobs({
             owner: projectOwner,
-            name: projectName
+            name: projectName,
+            ids: jobIds,
+            status: status,
+            page: page !== null && page !== void 0 ? page : 1,
+            perPage: perPage !== null && perPage !== void 0 ? perPage : 10,
         })
             .then(function (_a) {
             var data = _a.data;
             return data;
         });
     }, [client]);
-    var fetchJob = useCallback(function (owner, name, jobId) {
+    var fetchJob = useCallback(function (projectOwner, projectName, jobId) {
         if (!client || !client.jobs)
             return;
         return client.jobs
             .getJob({
-            owner: owner,
-            name: name,
+            owner: projectOwner,
+            name: projectName,
             jobId: jobId
         })
             .then(function (_a) {
@@ -24234,7 +24238,7 @@ var getSummaryColor = function (status) {
 };
 var getDuration = function (run) {
     if (!run)
-        return dayjs_min.duration({ seconds: 1 });
+        return dayjs_min.duration({ seconds: 0 });
     var status = run.status;
     var end = status.finished_at ? dayjs_min(status.finished_at) : dayjs_min().utc();
     return status.finished_at ?
@@ -42031,7 +42035,7 @@ var useSWRHandler = function (_key, fetcher, config) {
 };
 var useSWR = withArgs(useSWRHandler);
 
-var css_248z$2 = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\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.hover-card {\n  transition: box-shadow 250ms ease-in-out, border-color 250ms ease-in-out;\n  border-color: #d0d7de;\n  width: 100%;\n  background-color: white;\n}\n\na > .hover-card:hover {\n  box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 8px 0px;\n  border-color: var(--primary);\n}";
+var css_248z$2 = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\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-card {\n  transition: box-shadow 250ms ease-in-out, border-color 250ms ease-in-out;\n  border-color: #d0d7de;\n  width: 100%;\n  background-color: white;\n}\n\na > .run-card:hover {\n  box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 8px 0px;\n  border-color: var(--primary);\n}";
 styleInject(css_248z$2);
 
 dayjs_min.extend(duration);
@@ -42056,7 +42060,7 @@ var RunCard = function (_a) {
         }, 1000);
         return run.status.finished_at ? undefined : function () { return clearInterval(handle); };
     }, [run]);
-    return (React__default.createElement("div", { "data-testid": "RunCard", className: 'hover-card', style: __assign({ borderRadius: 8, borderWidth: 1, borderStyle: 'solid', display: 'grid', gridTemplateColumns: 'minmax(200px, 18%) 1fr', gridTemplateRows: '1fr auto', columnGap: 8, rowGap: 0 }, style) },
+    return (React__default.createElement("div", { "data-testid": "RunCard", className: 'run-card', style: __assign({ borderRadius: 8, borderWidth: 1, borderStyle: 'solid', display: 'grid', gridTemplateColumns: 'minmax(200px, 18%) 1fr', gridTemplateRows: '1fr auto', columnGap: 8, rowGap: 0 }, style) },
         React__default.createElement("div", { style: {
                 borderRight: '1px solid #d0d7de',
                 display: 'flex',
@@ -42121,31 +42125,36 @@ var RunCard = function (_a) {
                         textOverflow: 'ellipsis',
                         display: 'inline-block'
                     } }, run.id),
-                React__default.createElement(Dropdown, { trigger: React__default.createElement("button", { type: 'button', style: {
-                            width: 32,
-                            height: 32,
-                            display: 'flex',
-                            justifyContent: 'center',
-                            alignItems: 'center',
-                            borderRadius: 9999,
-                            border: '1px solid #d0d7de',
-                            backgroundColor: 'white',
-                            outlineColor: 'var(--primary)'
-                        } }, isValidating ? React__default.createElement(LoadingIcon, null) : React__default.createElement(Gear$1, null)), optionGroups: [
-                        {
-                            options: [{
-                                    type: 'button',
-                                    id: 'cancel-study',
-                                    label: 'Cancel',
-                                    icon: React__default.createElement(XOctagon$1, null),
-                                    disabled: typeof run.status.finished_at === 'string',
-                                    onSelect: function () { return cancelRun(projectOwner, projectName, _run.id); }
-                                }]
-                        }
-                    ], contentProps: {
-                        align: 'end',
-                        sideOffset: 2,
-                    } })),
+                React__default.createElement("div", { style: {
+                        display: 'flex',
+                        alignItems: 'center'
+                    } },
+                    React__default.createElement(Dropdown, { trigger: React__default.createElement("button", { type: 'button', style: {
+                                width: 32,
+                                height: 32,
+                                display: 'flex',
+                                justifyContent: 'center',
+                                alignItems: 'center',
+                                borderRadius: 9999,
+                                border: '1px solid #d0d7de',
+                                backgroundColor: 'white',
+                                outlineColor: 'var(--primary)',
+                                cursor: 'pointer'
+                            } }, isValidating ? React__default.createElement(LoadingIcon, null) : React__default.createElement(Gear$1, null)), optionGroups: [
+                            {
+                                options: [{
+                                        type: 'button',
+                                        id: 'cancel-study',
+                                        label: 'Cancel',
+                                        icon: React__default.createElement(XOctagon$1, null),
+                                        disabled: typeof run.status.finished_at === 'string',
+                                        onSelect: function () { return cancelRun(projectOwner, projectName, _run.id); }
+                                    }]
+                            }
+                        ], contentProps: {
+                            align: 'end',
+                            sideOffset: 2,
+                        } }))),
             React__default.createElement("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',
@@ -42245,31 +42254,35 @@ var RunsList = function (_a) {
         return (React__default.createElement("div", { key: item.id, style: {
                 display: 'flex',
                 justifyContent: 'space-between',
+                alignItems: 'center',
                 borderTop: '1px solid var(--slate5)',
                 padding: '6px 8px',
+                cursor: 'default'
             } },
             React__default.createElement("div", { style: {
                     display: 'flex',
+                    alignItems: 'center',
                     gap: 12
                 } },
-                React__default.createElement("button", { style: {
-                        backgroundColor: 'rgba(0,0,0,0)',
-                        color: 'red',
-                        border: 'none'
-                    }, onClick: function () {
-                        cancelRun(projectOwner, projectName, item.id);
-                    } },
-                    React__default.createElement(XOctagon$1, null)),
+                item.status.status === dist.RunStatusEnum.Running &&
+                    React__default.createElement("button", { style: {
+                            display: 'flex',
+                            backgroundColor: 'rgba(0,0,0,0)',
+                            color: 'red',
+                            border: 'none'
+                        }, onClick: function () {
+                            cancelRun(projectOwner, projectName, item.id);
+                        } },
+                        React__default.createElement(XOctagon$1, null)),
+                React__default.createElement(Link45deg$1, { size: 16, color: statusMap[item.status.status].color }),
                 React__default.createElement("a", { href: "/".concat(projectOwner, "/projects/").concat(projectName, "/studies/").concat(jobId, "/runs/").concat(item.id), style: {
                         color: statusMap[item.status.status].color
-                    } },
-                    React__default.createElement(Link45deg$1, { size: 16, color: statusMap[item.status.status].color }),
-                    item.status.status),
+                    } }, item.status.status),
                 React__default.createElement(Tag, { style: {
                         color: statusMap[item.status.status].color,
                         borderColor: statusMap[item.status.status].color,
                         backgroundColor: 'white'
-                    } }, "".concat(((item.meta.progress.completed / item.meta.progress.total) * 100).toFixed(2), "% Complete"))),
+                    } }, "".concat(item.meta.progress.completed, " of ").concat(item.meta.progress.total, " steps complete."))),
             React__default.createElement("div", { style: {
                     display: 'grid',
                     gridTemplateColumns: '1fr 1fr',
@@ -42308,6 +42321,7 @@ var RunsList = function (_a) {
                     React__default.createElement("span", { style: {
                             display: 'flex',
                             alignItems: 'center',
+                            cursor: 'pointer',
                             gap: 8
                         } }, "".concat(runs.total_count, " Total Runs"),
                         runs.total_count > 0 && (isValidating ? React__default.createElement(LoadingIcon, { size: 16 }) : React__default.createElement(ChevronCompactDown$1, null))))),
@@ -43151,7 +43165,7 @@ var SendResults = function (_a) {
             }], asButtons: true, label: buttonLabel, helpText: "".concat(selOpt ? selOpt.charAt(0).toUpperCase() + selOpt.replace('-', ' ').slice(1) : 'Send', " results.") }));
 };
 
-var css_248z = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\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.hover-card {\n  transition: box-shadow 250ms ease-in-out, border-color 250ms ease-in-out;\n  border-color: #d0d7de;\n  width: 100%;\n  background-color: white;\n}\n\na > .hover-card:hover {\n  box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 8px 0px;\n  border-color: var(--primary);\n}";
+var css_248z = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\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.study-card {\n  transition: box-shadow 250ms ease-in-out, border-color 250ms ease-in-out;\n  border-color: #d0d7de;\n  width: 100%;\n  background-color: white;\n}\n\na > .study-card:hover {\n  box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 8px 0px;\n  border-color: var(--primary);\n}";
 styleInject(css_248z);
 
 dayjs_min.extend(duration);
@@ -43195,7 +43209,7 @@ var StudyCard = function (_a) {
         }, 1000);
         return study.status.finished_at ? undefined : function () { return clearInterval(handle); };
     }, [study]);
-    return (React__default.createElement("div", { "data-testid": "StudyCard", className: 'hover-card', style: __assign({ borderRadius: 8, borderWidth: 1, borderStyle: 'solid', display: 'grid', gridTemplateColumns: 'minmax(200px, 18%) 1fr', gridTemplateRows: '1fr auto', columnGap: 8, rowGap: 0 }, style) },
+    return (React__default.createElement("div", { "data-testid": "StudyCard", className: 'study-card', style: __assign({ borderRadius: 8, borderWidth: 1, borderStyle: 'solid', display: 'grid', gridTemplateColumns: 'minmax(200px, 18%) 1fr', gridTemplateRows: '1fr auto', columnGap: 8, rowGap: 0 }, style) },
         React__default.createElement("div", { style: {
                 borderRight: '1px solid #d0d7de',
                 display: 'flex',
@@ -43264,37 +43278,41 @@ var StudyCard = function (_a) {
                         textOverflow: 'ellipsis',
                         display: 'inline-block'
                     } }, study.spec.name),
-                React__default.createElement(Dropdown, { trigger: React__default.createElement("button", { type: 'button', style: {
-                            width: 32,
-                            height: 32,
-                            display: 'flex',
-                            justifyContent: 'center',
-                            alignItems: 'center',
-                            borderRadius: 9999,
-                            border: '1px solid #d0d7de',
-                            backgroundColor: 'white',
-                            outlineColor: 'var(--primary)'
-                        } }, isValidating ? React__default.createElement(LoadingIcon, null) : React__default.createElement(Gear$1, null)), optionGroups: [
-                        {
-                            options: [{
-                                    type: 'button',
-                                    id: 'cancel-study',
-                                    label: 'Cancel',
-                                    icon: React__default.createElement(XOctagon$1, null),
-                                    disabled: status.pending < 1 && status.running < 1,
-                                    onSelect: function () { return cancelJob(projectOwner, projectName, study.id); }
-                                }, {
-                                    type: 'button',
-                                    id: 'delete-study',
-                                    label: 'Delete',
-                                    icon: React__default.createElement(Trash$1, null),
-                                    onSelect: function () { return deleteJob(projectOwner, projectName, study.id); }
-                                },]
-                        }
-                    ], contentProps: {
-                        align: 'end',
-                        sideOffset: 2,
-                    } })),
+                React__default.createElement("div", { style: {
+                        display: 'flex',
+                        alignItems: 'center'
+                    } },
+                    React__default.createElement(Dropdown, { trigger: React__default.createElement("button", { type: 'button', style: {
+                                width: 32,
+                                height: 32,
+                                display: 'flex',
+                                justifyContent: 'center',
+                                alignItems: 'center',
+                                borderRadius: 9999,
+                                border: '1px solid #d0d7de',
+                                backgroundColor: 'white',
+                                outlineColor: 'var(--primary)'
+                            } }, isValidating ? React__default.createElement(LoadingIcon, null) : React__default.createElement(Gear$1, null)), optionGroups: [
+                            {
+                                options: [{
+                                        type: 'button',
+                                        id: 'cancel-study',
+                                        label: 'Cancel',
+                                        icon: React__default.createElement(XOctagon$1, null),
+                                        disabled: status.pending < 1 && status.running < 1,
+                                        onSelect: function () { return cancelJob(projectOwner, projectName, study.id); }
+                                    }, {
+                                        type: 'button',
+                                        id: 'delete-study',
+                                        label: 'Delete',
+                                        icon: React__default.createElement(Trash$1, null),
+                                        onSelect: function () { return deleteJob(projectOwner, projectName, study.id); }
+                                    },]
+                            }
+                        ], contentProps: {
+                            align: 'end',
+                            sideOffset: 2,
+                        } }))),
             React__default.createElement("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',