cognite-neat 0.92.3__py3-none-any.whl → 0.93.0__py3-none-any.whl

cognite/neat/_app/ui/neat-app/src/components/WorkflowExecutionReport.tsx

@@ -0,0 +1,112 @@
+import Timeline from '@mui/lab/Timeline';
+import TimelineConnector from '@mui/lab/TimelineConnector';
+import TimelineContent from '@mui/lab/TimelineContent';
+import TimelineDot from '@mui/lab/TimelineDot';
+import TimelineItem, { timelineItemClasses } from '@mui/lab/TimelineItem';
+import TimelineSeparator from '@mui/lab/TimelineSeparator';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import CircularProgress from '@mui/material/CircularProgress';
+import Dialog from '@mui/material/Dialog';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import FormControl from '@mui/material/FormControl';
+import TextField from '@mui/material/TextField';
+import { Container } from '@mui/system';
+import React, { useEffect } from 'react';
+import { useState } from 'react';
+import { WorkflowStats } from 'views/WorkflowView';
+import NJsonViewer from './JsonViewer';
+import { getNeatApiRootUrl, getSelectedWorkflowName } from './Utils';
+
+export default function WorkflowExecutionReport(props: any) {
+    const [workflowStats, setWorkflowStats] = useState<any>();
+    const run_id = props.run_id;
+
+    useEffect(() => {
+      if (props.run_id)
+          loadReport();
+      else
+          setWorkflowStats(filterStats(props.report));
+    }, [props.report]);
+
+    const loadReport = () => {
+      const neatApiRootUrl = getNeatApiRootUrl();
+      let url = neatApiRootUrl+"/api/workflow/detailed-execution-report/"+run_id;
+      fetch(url)
+      .then((response) => {
+        return response.json();
+      }).then((jdata) => {
+        setWorkflowStats(filterStats(jdata.report));
+
+      }
+    )}
+    const filterStats = (stats: WorkflowStats) => {
+
+      console.dir(stats)
+      // detelete all log RUNNING entries that have both RUNNING and COMPLETED entries for the same step
+      if (stats?.execution_log == null )
+        return stats;
+
+      const filteredLog = stats.execution_log!.filter((log, index) => {
+        if (log.state == "STARTED") {
+          const nextLog = stats.execution_log[index + 1];
+          if (nextLog && nextLog.state == "COMPLETED" && nextLog.id == log.id)
+            return false;
+        }
+        return true;
+      })
+      stats.execution_log = filteredLog;
+      return stats;
+    }
+
+    function createMarkup(text) {
+      return {__html: text};
+    }
+
+    return (
+        <Timeline sx={{
+            [`& .${timelineItemClasses.root}:before`]: {
+              flex: 0,
+              padding: 0,
+            },
+          }} >
+            {workflowStats?.execution_log?.map((log) => (
+              <TimelineItem key={log.id}>
+                <TimelineSeparator>
+                  {log.state == "STARTED" && (<TimelineDot color="success" variant="outlined" />)}
+                  {log.state == "COMPLETED" && (<TimelineDot color="success" />)}
+                  {log.state == "FAILED" && (<TimelineDot color="error" />)}
+                  {log.state != "STARTED" && log.state != "COMPLETED" && log.state != "FAILED" && (<TimelineDot />)}
+                  <TimelineConnector />
+                </TimelineSeparator>
+                <TimelineContent> {log.timestamp} - {log.state} : {log.label} ({log.id}) in ({log.elapsed_time} sec)
+                  {log.state == "FAILED" && (<div dangerouslySetInnerHTML={ createMarkup(log.error) }></div>)}
+                  {log.state == "COMPLETED" && (<div dangerouslySetInnerHTML={ createMarkup(log.output_text) }></div>)}
+                  {log.data && ( <NJsonViewer data={log.data} />) }
+                </TimelineContent>
+
+              </TimelineItem>
+            ))}
+            {(workflowStats?.state == "COMPLETED" || workflowStats?.state == "FAILED") && (
+              <TimelineItem>
+                <TimelineSeparator>
+                  {workflowStats?.state == "COMPLETED" && (<TimelineDot color="success" />)}
+                  {workflowStats?.state == "FAILED" && (<TimelineDot color="error" />)}
+                </TimelineSeparator>
+                <TimelineContent> Workflows completed with state : {workflowStats?.state} . Elapsed time : {workflowStats?.elapsed_time} seconds.
+                 </TimelineContent>
+              </TimelineItem>
+            )}
+            {(workflowStats?.state != "COMPLETED" && workflowStats?.state != "FAILED" && workflowStats?.state != "CREATED") && (
+              <TimelineItem>
+                <TimelineSeparator>
+                  <TimelineDot variant="outlined" />
+                </TimelineSeparator>
+                <TimelineContent> <CircularProgress /> </TimelineContent>
+              </TimelineItem>
+            )}
+          </Timeline>
+    )
+}

cognite/neat/_app/ui/neat-app/src/components/WorkflowImportExportDialog.tsx

@@ -0,0 +1,67 @@
+import Button from "@mui/material/Button"
+import Dialog from "@mui/material/Dialog"
+import DialogActions from "@mui/material/DialogActions"
+import DialogContent from "@mui/material/DialogContent"
+import DialogTitle from "@mui/material/DialogTitle"
+import React from "react"
+import { useEffect, useState } from "react"
+import { WorkflowDefinition } from "types/WorkflowTypes"
+import LocalUploader from "./LocalUploader"
+import { getNeatApiRootUrl, getSelectedWorkflowName } from "./Utils"
+import { Box } from "@mui/material"
+import FileDownloadIcon from '@mui/icons-material/FileDownload';
+
+
+export default function WorkflowImportExportDialog(props: any)
+{
+    const neatApiRootUrl = getNeatApiRootUrl();
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const [component, setComponent] = useState<WorkflowDefinition>(null);
+    const handleDialogCancel = () => {
+        setDialogOpen(false);
+    };
+
+    const onDownloadSuccess = (fileName: string, hash: string) => {
+
+        props.onDownloaded(fileName, hash);
+        setDialogOpen(false);
+    }
+    const packageWorkflow = () => {
+        const url = neatApiRootUrl + "/api/workflow/package/" + getSelectedWorkflowName();
+        fetch(url, {
+          method: "post", headers: {
+            'Content-Type': 'application/json;charset=utf-8'
+          }
+        }).then((response) => response.json()).then((data) => {
+           const downloadUrl = neatApiRootUrl+"/data/workflows/"+data.package+"?version="+data.hash;
+           const link = document.createElement("a");
+           link.download = "package.zip";
+           link.href = downloadUrl;
+           document.body.appendChild(link);
+           link.click();
+           document.body.removeChild(link);
+
+        }).catch((error) => {
+          console.error('Error:', error);
+        })
+      }
+
+return (
+<React.Fragment >
+<Button variant="outlined" onClick={(event)=>{setDialogOpen(true)}} sx={{ marginTop: 2, marginRight: 1 }} >Import/Export</Button>
+
+<Dialog open={dialogOpen} onClose={handleDialogCancel}>
+<DialogTitle>Workflow Import/Export</DialogTitle>
+<DialogContent>
+    <Box sx={{width: 500}}>
+    <LocalUploader fileType="workflow" action="install" stepId="none" label="Upload to NEAT" workflowName={getSelectedWorkflowName()} onUpload={onDownloadSuccess} />
+    </Box>
+    <Button variant="outlined" onClick={packageWorkflow} sx={{ marginTop: 2, marginRight: 1 , width: 500 }} >Download from NEAT <FileDownloadIcon sx={{marginLeft:1}} /> </Button>
+</DialogContent>
+<DialogActions>
+  <Button variant="outlined" size="small" onClick={handleDialogCancel}>Cancel</Button>
+</DialogActions>
+</Dialog>
+</React.Fragment>
+)
+}

cognite/neat/_app/ui/neat-app/src/components/WorkflowMetadataDialog.tsx

@@ -0,0 +1,79 @@
+import Button from "@mui/material/Button"
+import Dialog from "@mui/material/Dialog"
+import DialogActions from "@mui/material/DialogActions"
+import DialogContent from "@mui/material/DialogContent"
+import DialogTitle from "@mui/material/DialogTitle"
+import FormControl from "@mui/material/FormControl"
+import IconButton from "@mui/material/IconButton/IconButton"
+import TextField from "@mui/material/TextField"
+import React from "react"
+import { useEffect, useState } from "react"
+import { WorkflowDefinition } from "types/WorkflowTypes"
+import AddCircleOutlineOutlinedIcon from '@mui/icons-material/AddCircleOutlineOutlined';
+
+
+export default function WorkflowMetadataDialog(props: any)
+{
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const [component, setComponent] = useState<WorkflowDefinition>(null);
+    const handleDialogSave = () => {
+        setDialogOpen(false);
+        props.onClose(component,"save");
+    };
+    const handleDialogCancel = () => {
+        setDialogOpen(false);
+        props.onClose(component,"cancel");
+    };
+    const handleDelete = () => {
+        setDialogOpen(false);
+        props.onClose(component,"delete");
+    };
+    const handleStepConfigChange = (name: string, value: any) => {
+        let wdef = new WorkflowDefinition();
+        if (component) {
+            wdef.name = component.name;
+            wdef.description = component.description;
+        }
+
+        switch (name) {
+            case "name":
+                wdef.name = value;
+                break;
+            case "description":
+                wdef.description = value;
+                break;
+        }
+        console.dir(wdef);
+        setComponent(wdef);
+    }
+    useEffect(() => {
+        if (props.open){
+            setDialogOpen(true);
+            setComponent(props.component);
+            console.dir(props.component);
+        }
+      }, [props.open]);
+
+
+
+return (
+<React.Fragment >
+<IconButton color="primary" aria-label="add new workflow" onClick={(event)=>{setDialogOpen(true)} }>
+    <AddCircleOutlineOutlinedIcon />
+</IconButton>
+<Dialog open={dialogOpen} onClose={handleDialogCancel}>
+<DialogTitle>Workflow editor</DialogTitle>
+<DialogContent>
+  <FormControl sx={{ width: 300 }} >
+    <TextField sx={{ marginTop: 1 }} id="step-wf-name" fullWidth label="Unique name" size='small' variant="outlined" value={component?.name} onChange={(event) => { handleStepConfigChange("name", event.target.value) }} />
+    <TextField sx={{ marginTop: 1 }} id="step-wf-description" fullWidth label="Description" size='small' variant="outlined" value={component?.description} onChange={(event) => { handleStepConfigChange("description", event.target.value) }} />
+  </FormControl>
+</DialogContent>
+<DialogActions>
+  <Button variant="outlined" size="small" onClick={handleDialogSave}>Save</Button>
+  <Button variant="outlined" size="small" onClick={handleDialogCancel}>Cancel</Button>
+</DialogActions>
+</Dialog>
+</React.Fragment>
+)
+}

cognite/neat/_app/ui/neat-app/src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

cognite/neat/_app/ui/neat-app/src/index.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+import CssBaseline from '@mui/material/CssBaseline';
+
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(
+  <React.Fragment>
+     <CssBaseline />
+    <App />
+  </React.Fragment>
+);