diff --git a/.github/workflows/build.yaml b/.github/workflows/build.yaml index 152ba5674..85c1e4c16 100644 --- a/.github/workflows/build.yaml +++ b/.github/workflows/build.yaml @@ -37,7 +37,7 @@ jobs: with: check_name: 'Unit Test Report for Java ${{ matrix.java }}' - build-and-test-nflow-explorer-ng: + build-and-test-nflow-explorer: if: always() runs-on: ubuntu-latest steps: @@ -50,7 +50,7 @@ jobs: distribution: 'temurin' cache: 'maven' - name: Run build and unit tests - run: mvn -T1C --no-transfer-progress --color=always -Dmaven.javadoc.skip=true -Dmaven.source.skip=true -am -pl nflow-explorer-ng test + run: mvn -T1C --no-transfer-progress --color=always -Dmaven.javadoc.skip=true -Dmaven.source.skip=true -am -pl nflow-explorer test javadoc-spotbugs-codeql: runs-on: ubuntu-latest diff --git a/CHANGELOG.md b/CHANGELOG.md index 83014120e..2771ddb30 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -31,6 +31,8 @@ - export the nflow.database.type as a metric - `nflow-netty` - POTENTIALLY BREAKING CHANGE: Netty configuration might need `Jackson2ObjectMapperBuilder` to have `findModulesViaServiceLoader` enabled as joda time module is not in wellknown modules anymore +- `nflow-explorer` + - POTENTIALLY BREAKING CHANGE: old `nflow-explorer` was removed and `nflow-explorer-ng` was renamed to `nflow-explorer` **Details** @@ -66,7 +68,8 @@ - `nflow-netty` - POTENTIALLY BREAKING CHANGE: `Jackson2ObjectMapperBuilder` might need configuration for jodatime - Spring Framework 6 doesn't have Joda time module in wellknown anymore, so might need to configure `findModulesViaServiceLoader` to enable it (or some other way) -- `nflow-explorer-ng` +- `nflow-explorer` + - POTENTIALLY BREAKING CHANGE: old `nflow-explorer` was removed and `nflow-explorer-ng` was renamed to `nflow-explorer` - Improved formatting timestamps - Fix retry on endpoint change - Fix querying with parent instance id diff --git a/README.md b/README.md index 001c1a8c1..05c9518ec 100644 --- a/README.md +++ b/README.md @@ -17,7 +17,7 @@ nFlow has been under development since 2014-01-14 and version 1.0.0 was released ## Key Features * Non-declarative — workflows are defined as code -* Visualization — workflows can be visualized in [nFlow Explorer](https://github.com/NitorCreations/nflow/tree/master/nflow-explorer-ng) +* Visualization — workflows can be visualized in [nFlow Explorer](https://github.com/NitorCreations/nflow/tree/master/nflow-explorer) * Embeddable — usually embedded as a library, but a standalone server is also provided * High availability — the same workflows can be processed by multiple deployments * Fault tolerant — automatic recovery if runtime environment crashes diff --git a/nflow-examples/spring-boot/full-stack-kotlin/build.gradle.kts b/nflow-examples/spring-boot/full-stack-kotlin/build.gradle.kts index e51f7a750..4267fbf37 100644 --- a/nflow-examples/spring-boot/full-stack-kotlin/build.gradle.kts +++ b/nflow-examples/spring-boot/full-stack-kotlin/build.gradle.kts @@ -54,7 +54,7 @@ dependencies { nflowExplorer( group = "io.nflow", - name = "nflow-explorer-ng", + name = "nflow-explorer", version = nflowVersion, ext = "tar.gz" ) diff --git a/nflow-examples/spring-boot/full-stack/maven/pom.xml b/nflow-examples/spring-boot/full-stack/maven/pom.xml index 81918fdad..83732b493 100644 --- a/nflow-examples/spring-boot/full-stack/maven/pom.xml +++ b/nflow-examples/spring-boot/full-stack/maven/pom.xml @@ -64,7 +64,7 @@ io.nflow - nflow-explorer-ng + nflow-explorer 9.0.0-SNAPSHOT tar.gz true diff --git a/nflow-explorer-ng/src/cache.ts b/nflow-explorer-ng/src/cache.ts deleted file mode 100644 index a11ef595f..000000000 --- a/nflow-explorer-ng/src/cache.ts +++ /dev/null @@ -1,29 +0,0 @@ - -class Cache { - private cache = new Map(); - private maxAgeMillis: number; - - constructor(maxAgeMillis: number) { - this.maxAgeMillis = maxAgeMillis; - } - - public setAndReturn(key: string, value: T): T { - const now = new Date().getTime(); - this.cache.set(key, {ts: now, value: value}); - return value; - } - - public get(key: string): T | undefined { - const now = new Date().getTime(); - const entry = this.cache.get(key); - if (!entry) { - return undefined; - } - if ((now - entry.ts) < this.maxAgeMillis) { - return entry.value; - } - return undefined; - } -}; - -export { Cache }; diff --git a/nflow-explorer-ng/src/component/Feedback.scss b/nflow-explorer-ng/src/component/Feedback.scss deleted file mode 100644 index f9749844d..000000000 --- a/nflow-explorer-ng/src/component/Feedback.scss +++ /dev/null @@ -1,17 +0,0 @@ -.feedback { - padding: 8px; - border-width: 1px; - color: white; -} - -.feedback.info { - background-color: blue; -} - -.feedback.error { - background-color: #d11; -} - -.feedback.success { - background-color: green; -} \ No newline at end of file diff --git a/nflow-explorer-ng/src/component/StateGraph.scss b/nflow-explorer-ng/src/component/StateGraph.scss deleted file mode 100644 index bb070324d..000000000 --- a/nflow-explorer-ng/src/component/StateGraph.scss +++ /dev/null @@ -1,163 +0,0 @@ -/* This sets the color for "TK" nodes to a light blue green. */ -.graph-background { - fill: white; - pointer-events: all; - } - - /** - Node styles - ----------- - Generated svg looks like this - - - - - - - - - - <!-- tooltip goes here --> - - */ - - .node rect { - stroke: #333; - fill: white; - stroke-width: 1.5px; - } - - /* changing font or font size may require code changes to have right size boxes */ - .node-normal, .node-manual, .node-start, .node-end, .node-error, .node-wait { - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 14px; - fill: black; - opacity: 1; cursor: pointer; - } - - .node-start > rect, .node-manual > rect, .node-normal > rect, .node-end > rect, .node-error > rect, .node-wait > rect { - stroke-width: 1.5px; - stroke: black; - fill: white; - } - - .node-start > rect { - fill: LightBlue; - } - - .node-manual > rect { - fill: yellow; - } - - .node-error > rect { - fill: pink; - } - - .node-end > rect { - fill: LightGreen; - } - - .node-wait > rect { - fill: LightSkyBlue; - } - - .node-normal.selected > rect, .node-manual.selected > rect, .node-error.selected > rect, .node-start.selected > rect, .node-end.selected > rect, .node-wait.selected > rect { - stroke-width: 3px; - } - - .node-passive { - fill: gray; - } - - .node-passive > rect { - stroke: gray; - } - - - /** - Edge styles - ------------ - Basic edge types are - - normal: normal transition - - error: error transition via global error handler state - - failure: error transition via per state error handler state - - unexpected: any transition not part of workflow definition. Unexpected is always active. - - Edges may be one of: - - : with workflow definition - - passive: when transition has not been used by workflow instance - - active: when transition has been used by workflow instance - - Edge may be also be selected. - - So error edge, that has not been used and is selected is indicated like this - - class="edge-error edge-passive selected" - - If you need new colors for arrowheads see graph.js, addArrowheadMarker() - */ - .edge-normal, .edge-error, .edge-failure { - stroke-width: 1px; - stroke: black; - } - - .edge-unexpected { - stroke: red; - } - - .edge-error, .edge-failure { - stroke: black; - stroke-dasharray: 5,5; - } - - .edge-normal.active, .edge-error.active, .edge-failure.active .edge-unexpected { - stroke-width: 2px; - } - - .edge-normal.selected, .edge-error.selected, .edge-failure.selected, .edge-unexpected.selected { - stroke-width: 2px; - } - - .edge-normal.active.selected, .edge-error.active.selected, .edge-failure.active.selected, .edge-unexpected.selected { - stroke-width: 3px; - } - - .arrowhead-normal { - fill: black; - } - - .arrowhead-unexpected { - fill: red; - } - - /* retries */ - .retry-indicator { - fill: orange; - stroke: black; - stroke-width: 1.5px; - } - - - /* */ - g.current-state > g > g > text { - text-decoration: underline; - } - - /* - dagre-d3 hard-codes nodes to have class 'label', which makes style definitions from bootstrap-sass to leak to the graph. - Resetting the leaked styles here. - */ - .label { - font-size: 100%; - font-weight: normal; - } - - /*****************/ - .svg-container { - margin: 10px; - } - - - .svg-content-responsive { - width: 100%; - } \ No newline at end of file diff --git a/nflow-explorer-ng/src/index.scss b/nflow-explorer-ng/src/index.scss deleted file mode 100644 index 02c492552..000000000 --- a/nflow-explorer-ng/src/index.scss +++ /dev/null @@ -1,94 +0,0 @@ -:root { - --color-hover: #c7c7c7; - - /* colors from nflow-explorer v1 */ - --color-blue: #01a4e4; - --color-dark-blue: #0093cc; - --color-black: #000000; - --color-grey: #636466; - --color-mid-grey: #888888; - --color-light-grey: #e7e7e7; - --color-white: #ffffff; - --color-green: #C0F4B3; - --color-dark-green: #bcf4ae; - --color-light-green: #dff0d8; - --color-red: #d11; - - --color-nitor-grey: #ADA9A1; - --color-nitor-white: #ffffff; - --color-nitor-black: #26273A; - --color-nitor-blue: #6056EB; - --color-nitor-light-blue: #6DC4E2; - --color-nitor-pink: #FFD1C1; - - --size-xs: .25rem; - --size-s: .5rem; - --size-m: 1rem; - --size-l: 1.5rem; - --size-xl: 2rem; - --size-2-xl: 2.5rem; -} - -body { - margin: 0; - font-family: "Roboto"; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -code { - font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", - monospace; -} - -.clickable { - cursor: pointer; -} - -/* tables */ -/* table stripes */ -.table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th { - background-color: var(--color-light-gray); -} - -.table-striped > tbody > tr:nth-child(even) > td, .table-striped > tbody > tr:nth-child(even) > th { - background-color: white; -} - -.table-hover > tbody > tr > td:hover, .table-hover > tbody > tr > th:hover, .table-hover > tbody > tr:hover > td, .table-hover > tbody > tr > td, .table-hover > tbody > tr:hover > th { - background-color: var(--color-hover); -} - - -/* table colors */ -.table > thead > tr > td.success, .table > thead > tr > th.success, .table > thead > tr.success > td, .table > thead > tr.success > th, .table > tbody > tr > td.success, .table > tbody > tr > th.success, .table > tbody > tr.success > td, .table > tbody > tr.success > th, .table > tfoot > tr > td.success, .table > tfoot > tr > th.success, .table > tfoot > tr.success > td, .table > tfoot > tr.success > th { - background-color: var(--color-green); -} -.table-hover > tbody > tr > td.success:hover, .table-hover > tbody > tr > th.success:hover, .table-hover > tbody > tr.success:hover > td, .table-hover > tbody > tr:hover > .success, .table-hover > tbody > tr.success:hover > th { - background-color: var(--color-light-green); -} - -.table > thead > tr > td.info, .table > thead > tr > th.info, .table > thead > tr.info > td, .table > thead > tr.info > th, .table > tbody > tr > td.info, .table > tbody > tr > th.info, .table > tbody > tr.info > td, .table > tbody > tr.info > th, .table > tfoot > tr > td.info, .table > tfoot > tr > th.info, .table > tfoot > tr.info > td, .table > tfoot > tr.info > th { - background-color: #c4e3f3; -} -.table-hover > tbody > tr > td.info:hover, .table-hover > tbody > tr > th.info:hover, .table-hover > tbody > tr.info:hover > td, .table-hover > tbody > tr:hover > .info, .table-hover > tbody > tr.info:hover > th { - background-color: #d9edf7; -} - -.table > thead > tr > td.danger, .table > thead > tr > th.danger, .table > thead > tr.danger > td, .table > thead > tr.danger > th, .table > tbody > tr > td.danger, .table > tbody > tr > th.danger, .table > tbody > tr.danger > td, .table > tbody > tr.danger > th, .table > tfoot > tr > td.danger, .table > tfoot > tr > th.danger, .table > tfoot > tr.danger > td, .table > tfoot > tr.danger > th { - background-color: #e4b9b9; -} -.table-hover > tbody > tr > td.danger:hover, .table-hover > tbody > tr > th.danger:hover, .table-hover > tbody > tr.danger:hover > td, .table-hover > tbody > tr:hover > .danger, .table-hover > tbody > tr.danger:hover > th { - background-color: #ebcccc; -} - -.table > thead > tr > td.warning, .table > thead > tr > th.warning, .table > thead > tr.warning > td, .table > thead > tr.warning > th, .table > tbody > tr > td.warning, .table > tbody > tr > th.warning, .table > tbody > tr.warning > td, .table > tbody > tr.warning > th, .table > tfoot > tr > td.warning, .table > tfoot > tr > th.warning, .table > tfoot > tr.warning > td, .table > tfoot > tr.warning > th { - background-color: #faf2cc; -} -.table-hover > tbody > tr > td.warning:hover, .table-hover > tbody > tr > th.warning:hover, .table-hover > tbody > tr.warning:hover > td, .table-hover > tbody > tr:hover > .warning, .table-hover > tbody > tr.warning:hover > th { - background-color: #fcf8e3; -} - -.table-hover > tbody > tr > td:hover, .table-hover > tbody > tr > th:hover, .table-hover > tbody > tr:hover > td, .table-hover > tbody > tr > td, .table-hover > tbody > tr:hover > th { - background-color: #c7c7c7; -} diff --git a/nflow-explorer-ng/src/utils.test.ts b/nflow-explorer-ng/src/utils.test.ts deleted file mode 100644 index af97dee7e..000000000 --- a/nflow-explorer-ng/src/utils.test.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { formatRelativeTime, formatTimestamp } from "./utils"; -import { addDays, subDays } from "date-fns"; - -test("formatRelativeTime", () => { - const now = new Date('2021-05-26T06:25:40.722Z'); - - expect(formatRelativeTime('2021-05-26T06:25:40.722Z', now)).toBe('less than a minute ago'); - expect(formatRelativeTime(now, now)).toBe('less than a minute ago'); - - expect(formatRelativeTime(new Date('2021-05-26T06:25:40.999Z'), now)).toBe('in less than a minute'); - expect(formatRelativeTime(new Date('2021-05-26T06:25:40.000Z'), now)).toBe('less than a minute ago'); - - expect(formatRelativeTime(addDays(now, 150), now)).toBe('in 5 months'); - expect(formatRelativeTime(subDays(now, 100), now)).toBe('3 months ago'); -}); - -test('formatTimestamp', () => { - const now = new Date('2021-05-26T06:25:40.722Z'); - // TODO what timezone? - expect(formatTimestamp(now)).toBe('2021-05-26 09:25:40'); -}); diff --git a/nflow-explorer-ng/src/workflow-instance/ActionHistoryTable.tsx b/nflow-explorer-ng/src/workflow-instance/ActionHistoryTable.tsx deleted file mode 100644 index d0a2bf9ba..000000000 --- a/nflow-explorer-ng/src/workflow-instance/ActionHistoryTable.tsx +++ /dev/null @@ -1,100 +0,0 @@ -import React, { Fragment } from "react"; -import { formatDistance } from "date-fns" - -import { Paper, Table, TableHead, TableBody, TableRow, TableCell, TableContainer } from '@material-ui/core'; -import { WorkflowInstance, WorkflowInstanceAction } from "../types"; -import { formatTimestamp } from "../utils"; -import { InternalLink } from "../component"; - -// TODO clicking state highlight state in state graph -const ActionHistoryTable = (props: {instance: WorkflowInstance, childInstances: WorkflowInstance[]}) => { - const clickAction = (action: WorkflowInstanceAction) => { - // TODO call state graph highlight from here - console.log('Action clicked', action); - } - - // Group child instances to to action that created them - const actionChildInstanceMap:{[key: number]: WorkflowInstance[]} = {}; - props.childInstances.forEach(childInstance => { - const parentActionId = childInstance.parentActionId as number; - if (!actionChildInstanceMap[parentActionId]) { - actionChildInstanceMap[parentActionId] = []; - } - actionChildInstanceMap[parentActionId].push(childInstance); - }); - - const actionRow = (action: WorkflowInstanceAction, index: number, actions: WorkflowInstanceAction[]) => { - // TODO colors - // stateExecution = green - // stateExecutionFailed = xxx - // externalChange = blue - // recovery = xxx - const actionNumber = actions.length - index; - - // TODO formatDistance is too coarse, gives "less than minute" - // TODO service.ts should convert these to Date - const duration = formatDistance(new Date(action.executionStartTime), new Date(action.executionEndTime)); - const durationTooltip = new Date(action.executionEndTime).getTime() - new Date(action.executionStartTime).getTime() + ' ms'; - - const childWorkflows = actionChildInstanceMap[action.id] || []; - const description = ( - -
{action.stateText}
- {childWorkflows.length > 0 && ( -
    - {childWorkflows.map(child => ( -
  • - {child.type} ({child.id}) -
    • - ))} -
- )} -
{action.type}
- - ); - - const className = () => { - switch (action.type) { - case 'stateExecution': return 'success'; - case 'stateExecutionFailed': return 'danger'; - } - return 'info'; - } - return ( - - {actionNumber} - clickAction(action)} className="clickable">{action.state} - {description} - {action.retryNo} - {formatTimestamp(action.executionStartTime)} - {formatTimestamp(action.executionEndTime)} - {duration} - - ) - } - return ( - - - - - - No - State - Description - Retries - Started - Finished - Duration - - - - {props.instance.actions.map((action, index) => actionRow(action, index, props.instance.actions))} - -
- - - ) - -} - -export { ActionHistoryTable }; diff --git a/nflow-explorer-ng/.gitignore b/nflow-explorer/.gitignore similarity index 100% rename from nflow-explorer-ng/.gitignore rename to nflow-explorer/.gitignore diff --git a/nflow-explorer-ng/.markdownlint.json b/nflow-explorer/.markdownlint.json similarity index 100% rename from nflow-explorer-ng/.markdownlint.json rename to nflow-explorer/.markdownlint.json diff --git a/nflow-explorer-ng/.prettierrc.json b/nflow-explorer/.prettierrc.json similarity index 100% rename from nflow-explorer-ng/.prettierrc.json rename to nflow-explorer/.prettierrc.json diff --git a/nflow-explorer-ng/.settings/org.eclipse.core.resources.prefs b/nflow-explorer/.settings/org.eclipse.core.resources.prefs similarity index 100% rename from nflow-explorer-ng/.settings/org.eclipse.core.resources.prefs rename to nflow-explorer/.settings/org.eclipse.core.resources.prefs diff --git a/nflow-explorer-ng/README.md b/nflow-explorer/README.md similarity index 54% rename from nflow-explorer-ng/README.md rename to nflow-explorer/README.md index 85429594c..250116f2a 100644 --- a/nflow-explorer-ng/README.md +++ b/nflow-explorer/README.md @@ -4,16 +4,16 @@ The next generation User Interface for [nFlow](https://github.com/NitorCreations ## Screenshots - - - - - - + + + + + + ## Demo - + ## Development diff --git a/nflow-explorer-ng/assembly.xml b/nflow-explorer/assembly.xml similarity index 100% rename from nflow-explorer-ng/assembly.xml rename to nflow-explorer/assembly.xml diff --git a/nflow-explorer-ng/package-lock.json b/nflow-explorer/package-lock.json similarity index 100% rename from nflow-explorer-ng/package-lock.json rename to nflow-explorer/package-lock.json diff --git a/nflow-explorer-ng/package.json b/nflow-explorer/package.json similarity index 100% rename from nflow-explorer-ng/package.json rename to nflow-explorer/package.json diff --git a/nflow-explorer-ng/pom.xml b/nflow-explorer/pom.xml similarity index 95% rename from nflow-explorer-ng/pom.xml rename to nflow-explorer/pom.xml index bbc2697e2..3e779918b 100644 --- a/nflow-explorer-ng/pom.xml +++ b/nflow-explorer/pom.xml @@ -1,10 +1,10 @@ 4.0.0 - nflow-explorer-ng + nflow-explorer pom - nflow-explorer-ng - nFlow Explorer next generation + nflow-explorer + nFlow Explorer https://nflow.io Nitor Creations diff --git a/nflow-explorer-ng/public/config.js b/nflow-explorer/public/config.js similarity index 100% rename from nflow-explorer-ng/public/config.js rename to nflow-explorer/public/config.js diff --git a/nflow-explorer-ng/public/favicon.ico b/nflow-explorer/public/favicon.ico similarity index 100% rename from nflow-explorer-ng/public/favicon.ico rename to nflow-explorer/public/favicon.ico diff --git a/nflow-explorer-ng/public/index.html b/nflow-explorer/public/index.html similarity index 100% rename from nflow-explorer-ng/public/index.html rename to nflow-explorer/public/index.html diff --git a/nflow-explorer-ng/public/manifest.json b/nflow-explorer/public/manifest.json similarity index 100% rename from nflow-explorer-ng/public/manifest.json rename to nflow-explorer/public/manifest.json diff --git a/nflow-explorer-ng/public/nflow_logo.svg b/nflow-explorer/public/nflow_logo.svg similarity index 100% rename from nflow-explorer-ng/public/nflow_logo.svg rename to nflow-explorer/public/nflow_logo.svg diff --git a/nflow-explorer-ng/public/nflow_logo_borders.svg b/nflow-explorer/public/nflow_logo_borders.svg similarity index 100% rename from nflow-explorer-ng/public/nflow_logo_borders.svg rename to nflow-explorer/public/nflow_logo_borders.svg diff --git a/nflow-explorer-ng/public/nflow_logo_borders_192.png b/nflow-explorer/public/nflow_logo_borders_192.png similarity index 100% rename from nflow-explorer-ng/public/nflow_logo_borders_192.png rename to nflow-explorer/public/nflow_logo_borders_192.png diff --git a/nflow-explorer-ng/public/robots.txt b/nflow-explorer/public/robots.txt similarity index 100% rename from nflow-explorer-ng/public/robots.txt rename to nflow-explorer/public/robots.txt diff --git a/nflow-explorer-ng/public/spinner.gif b/nflow-explorer/public/spinner.gif similarity index 100% rename from nflow-explorer-ng/public/spinner.gif rename to nflow-explorer/public/spinner.gif diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-create-instance.png b/nflow-explorer/screenshots/nflow-explorer-workflow-create-instance.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-create-instance.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-create-instance.png diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-definition-list.png b/nflow-explorer/screenshots/nflow-explorer-workflow-definition-list.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-definition-list.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-definition-list.png diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-definition.png b/nflow-explorer/screenshots/nflow-explorer-workflow-definition.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-definition.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-definition.png diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance-list.png b/nflow-explorer/screenshots/nflow-explorer-workflow-instance-list.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance-list.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-instance-list.png diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance-manage.png b/nflow-explorer/screenshots/nflow-explorer-workflow-instance-manage.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance-manage.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-instance-manage.png diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance-variables.png b/nflow-explorer/screenshots/nflow-explorer-workflow-instance-variables.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance-variables.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-instance-variables.png diff --git a/nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance.png b/nflow-explorer/screenshots/nflow-explorer-workflow-instance.png similarity index 100% rename from nflow-explorer-ng/screenshots/nflow-explorer-workflow-instance.png rename to nflow-explorer/screenshots/nflow-explorer-workflow-instance.png diff --git a/nflow-explorer-ng/src/App.scss b/nflow-explorer/src/App.scss similarity index 100% rename from nflow-explorer-ng/src/App.scss rename to nflow-explorer/src/App.scss diff --git a/nflow-explorer-ng/src/App.test.tsx b/nflow-explorer/src/App.test.tsx similarity index 67% rename from nflow-explorer-ng/src/App.test.tsx rename to nflow-explorer/src/App.test.tsx index a5146ac6f..8e399d933 100644 --- a/nflow-explorer-ng/src/App.test.tsx +++ b/nflow-explorer/src/App.test.tsx @@ -1,8 +1,8 @@ -import React from "react"; -import { render, screen } from "@testing-library/react"; -import App from "./App"; +import React from 'react'; +import {render, screen} from '@testing-library/react'; +import App from './App'; -test("renders navi", () => { +test('renders navi', () => { render(); const logoElement = screen.getByAltText(/nFlow-logo/i); expect(logoElement).toBeInTheDocument(); diff --git a/nflow-explorer-ng/src/App.tsx b/nflow-explorer/src/App.tsx similarity index 100% rename from nflow-explorer-ng/src/App.tsx rename to nflow-explorer/src/App.tsx diff --git a/nflow-explorer-ng/src/about/AboutPage.tsx b/nflow-explorer/src/about/AboutPage.tsx similarity index 100% rename from nflow-explorer-ng/src/about/AboutPage.tsx rename to nflow-explorer/src/about/AboutPage.tsx diff --git a/nflow-explorer/src/cache.ts b/nflow-explorer/src/cache.ts new file mode 100644 index 000000000..8937e7dff --- /dev/null +++ b/nflow-explorer/src/cache.ts @@ -0,0 +1,28 @@ +class Cache { + private cache = new Map(); + private maxAgeMillis: number; + + constructor(maxAgeMillis: number) { + this.maxAgeMillis = maxAgeMillis; + } + + public setAndReturn(key: string, value: T): T { + const now = new Date().getTime(); + this.cache.set(key, {ts: now, value: value}); + return value; + } + + public get(key: string): T | undefined { + const now = new Date().getTime(); + const entry = this.cache.get(key); + if (!entry) { + return undefined; + } + if (now - entry.ts < this.maxAgeMillis) { + return entry.value; + } + return undefined; + } +} + +export {Cache}; diff --git a/nflow-explorer-ng/src/component/DataTable.tsx b/nflow-explorer/src/component/DataTable.tsx similarity index 100% rename from nflow-explorer-ng/src/component/DataTable.tsx rename to nflow-explorer/src/component/DataTable.tsx diff --git a/nflow-explorer/src/component/Feedback.scss b/nflow-explorer/src/component/Feedback.scss new file mode 100644 index 000000000..4102762ef --- /dev/null +++ b/nflow-explorer/src/component/Feedback.scss @@ -0,0 +1,17 @@ +.feedback { + padding: 8px; + border-width: 1px; + color: white; +} + +.feedback.info { + background-color: blue; +} + +.feedback.error { + background-color: #d11; +} + +.feedback.success { + background-color: green; +} diff --git a/nflow-explorer-ng/src/component/Feedback.tsx b/nflow-explorer/src/component/Feedback.tsx similarity index 100% rename from nflow-explorer-ng/src/component/Feedback.tsx rename to nflow-explorer/src/component/Feedback.tsx diff --git a/nflow-explorer-ng/src/component/InternalLink.tsx b/nflow-explorer/src/component/InternalLink.tsx similarity index 100% rename from nflow-explorer-ng/src/component/InternalLink.tsx rename to nflow-explorer/src/component/InternalLink.tsx diff --git a/nflow-explorer-ng/src/component/Navigation.scss b/nflow-explorer/src/component/Navigation.scss similarity index 100% rename from nflow-explorer-ng/src/component/Navigation.scss rename to nflow-explorer/src/component/Navigation.scss diff --git a/nflow-explorer-ng/src/component/Navigation.tsx b/nflow-explorer/src/component/Navigation.tsx similarity index 100% rename from nflow-explorer-ng/src/component/Navigation.tsx rename to nflow-explorer/src/component/Navigation.tsx diff --git a/nflow-explorer-ng/src/component/ObjectTable.tsx b/nflow-explorer/src/component/ObjectTable.tsx similarity index 100% rename from nflow-explorer-ng/src/component/ObjectTable.tsx rename to nflow-explorer/src/component/ObjectTable.tsx diff --git a/nflow-explorer-ng/src/component/ReturnLink.tsx b/nflow-explorer/src/component/ReturnLink.tsx similarity index 100% rename from nflow-explorer-ng/src/component/ReturnLink.tsx rename to nflow-explorer/src/component/ReturnLink.tsx diff --git a/nflow-explorer-ng/src/component/Selection.tsx b/nflow-explorer/src/component/Selection.tsx similarity index 100% rename from nflow-explorer-ng/src/component/Selection.tsx rename to nflow-explorer/src/component/Selection.tsx diff --git a/nflow-explorer-ng/src/component/Spinner.tsx b/nflow-explorer/src/component/Spinner.tsx similarity index 100% rename from nflow-explorer-ng/src/component/Spinner.tsx rename to nflow-explorer/src/component/Spinner.tsx diff --git a/nflow-explorer-ng/src/component/StateGraph.jsx b/nflow-explorer/src/component/StateGraph.jsx similarity index 100% rename from nflow-explorer-ng/src/component/StateGraph.jsx rename to nflow-explorer/src/component/StateGraph.jsx diff --git a/nflow-explorer/src/component/StateGraph.scss b/nflow-explorer/src/component/StateGraph.scss new file mode 100644 index 000000000..7a8fbdc98 --- /dev/null +++ b/nflow-explorer/src/component/StateGraph.scss @@ -0,0 +1,187 @@ +/* This sets the color for "TK" nodes to a light blue green. */ +.graph-background { + fill: white; + pointer-events: all; +} + +/** + Node styles + ----------- + Generated svg looks like this + + + + + + + + + + <!-- tooltip goes here --> + + */ + +.node rect { + stroke: #333; + fill: white; + stroke-width: 1.5px; +} + +/* changing font or font size may require code changes to have right size boxes */ +.node-normal, +.node-manual, +.node-start, +.node-end, +.node-error, +.node-wait { + font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-size: 14px; + fill: black; + opacity: 1; + cursor: pointer; +} + +.node-start > rect, +.node-manual > rect, +.node-normal > rect, +.node-end > rect, +.node-error > rect, +.node-wait > rect { + stroke-width: 1.5px; + stroke: black; + fill: white; +} + +.node-start > rect { + fill: LightBlue; +} + +.node-manual > rect { + fill: yellow; +} + +.node-error > rect { + fill: pink; +} + +.node-end > rect { + fill: LightGreen; +} + +.node-wait > rect { + fill: LightSkyBlue; +} + +.node-normal.selected > rect, +.node-manual.selected > rect, +.node-error.selected > rect, +.node-start.selected > rect, +.node-end.selected > rect, +.node-wait.selected > rect { + stroke-width: 3px; +} + +.node-passive { + fill: gray; +} + +.node-passive > rect { + stroke: gray; +} + +/** + Edge styles + ------------ + Basic edge types are + - normal: normal transition + - error: error transition via global error handler state + - failure: error transition via per state error handler state + - unexpected: any transition not part of workflow definition. Unexpected is always active. + + Edges may be one of: + - : with workflow definition + - passive: when transition has not been used by workflow instance + - active: when transition has been used by workflow instance + + Edge may be also be selected. + + So error edge, that has not been used and is selected is indicated like this + + class="edge-error edge-passive selected" + + If you need new colors for arrowheads see graph.js, addArrowheadMarker() + */ +.edge-normal, +.edge-error, +.edge-failure { + stroke-width: 1px; + stroke: black; +} + +.edge-unexpected { + stroke: red; +} + +.edge-error, +.edge-failure { + stroke: black; + stroke-dasharray: 5, 5; +} + +.edge-normal.active, +.edge-error.active, +.edge-failure.active .edge-unexpected { + stroke-width: 2px; +} + +.edge-normal.selected, +.edge-error.selected, +.edge-failure.selected, +.edge-unexpected.selected { + stroke-width: 2px; +} + +.edge-normal.active.selected, +.edge-error.active.selected, +.edge-failure.active.selected, +.edge-unexpected.selected { + stroke-width: 3px; +} + +.arrowhead-normal { + fill: black; +} + +.arrowhead-unexpected { + fill: red; +} + +/* retries */ +.retry-indicator { + fill: orange; + stroke: black; + stroke-width: 1.5px; +} + +/* */ +g.current-state > g > g > text { + text-decoration: underline; +} + +/* + dagre-d3 hard-codes nodes to have class 'label', which makes style definitions from bootstrap-sass to leak to the graph. + Resetting the leaked styles here. + */ +.label { + font-size: 100%; + font-weight: normal; +} + +/*****************/ +.svg-container { + margin: 10px; +} + +.svg-content-responsive { + width: 100%; +} diff --git a/nflow-explorer-ng/src/component/TabPanel.tsx b/nflow-explorer/src/component/TabPanel.tsx similarity index 100% rename from nflow-explorer-ng/src/component/TabPanel.tsx rename to nflow-explorer/src/component/TabPanel.tsx diff --git a/nflow-explorer-ng/src/component/index.ts b/nflow-explorer/src/component/index.ts similarity index 100% rename from nflow-explorer-ng/src/component/index.ts rename to nflow-explorer/src/component/index.ts diff --git a/nflow-explorer-ng/src/config.ts b/nflow-explorer/src/config.ts similarity index 100% rename from nflow-explorer-ng/src/config.ts rename to nflow-explorer/src/config.ts diff --git a/nflow-explorer-ng/src/error/NotFoundPage.tsx b/nflow-explorer/src/error/NotFoundPage.tsx similarity index 100% rename from nflow-explorer-ng/src/error/NotFoundPage.tsx rename to nflow-explorer/src/error/NotFoundPage.tsx diff --git a/nflow-explorer-ng/src/executor/ExecutorListPage.tsx b/nflow-explorer/src/executor/ExecutorListPage.tsx similarity index 100% rename from nflow-explorer-ng/src/executor/ExecutorListPage.tsx rename to nflow-explorer/src/executor/ExecutorListPage.tsx diff --git a/nflow-explorer/src/index.scss b/nflow-explorer/src/index.scss new file mode 100644 index 000000000..e6c4caf0e --- /dev/null +++ b/nflow-explorer/src/index.scss @@ -0,0 +1,163 @@ +:root { + --color-hover: #c7c7c7; + + /* colors from nflow-explorer v1 */ + --color-blue: #01a4e4; + --color-dark-blue: #0093cc; + --color-black: #000000; + --color-grey: #636466; + --color-mid-grey: #888888; + --color-light-grey: #e7e7e7; + --color-white: #ffffff; + --color-green: #c0f4b3; + --color-dark-green: #bcf4ae; + --color-light-green: #dff0d8; + --color-red: #d11; + + --color-nitor-grey: #ada9a1; + --color-nitor-white: #ffffff; + --color-nitor-black: #26273a; + --color-nitor-blue: #6056eb; + --color-nitor-light-blue: #6dc4e2; + --color-nitor-pink: #ffd1c1; + + --size-xs: 0.25rem; + --size-s: 0.5rem; + --size-m: 1rem; + --size-l: 1.5rem; + --size-xl: 2rem; + --size-2-xl: 2.5rem; +} + +body { + margin: 0; + font-family: 'Roboto'; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +code { + font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', + monospace; +} + +.clickable { + cursor: pointer; +} + +/* tables */ +/* table stripes */ +.table-striped > tbody > tr:nth-child(odd) > td, +.table-striped > tbody > tr:nth-child(odd) > th { + background-color: var(--color-light-gray); +} + +.table-striped > tbody > tr:nth-child(even) > td, +.table-striped > tbody > tr:nth-child(even) > th { + background-color: white; +} + +.table-hover > tbody > tr > td:hover, +.table-hover > tbody > tr > th:hover, +.table-hover > tbody > tr:hover > td, +.table-hover > tbody > tr > td, +.table-hover > tbody > tr:hover > th { + background-color: var(--color-hover); +} + +/* table colors */ +.table > thead > tr > td.success, +.table > thead > tr > th.success, +.table > thead > tr.success > td, +.table > thead > tr.success > th, +.table > tbody > tr > td.success, +.table > tbody > tr > th.success, +.table > tbody > tr.success > td, +.table > tbody > tr.success > th, +.table > tfoot > tr > td.success, +.table > tfoot > tr > th.success, +.table > tfoot > tr.success > td, +.table > tfoot > tr.success > th { + background-color: var(--color-green); +} +.table-hover > tbody > tr > td.success:hover, +.table-hover > tbody > tr > th.success:hover, +.table-hover > tbody > tr.success:hover > td, +.table-hover > tbody > tr:hover > .success, +.table-hover > tbody > tr.success:hover > th { + background-color: var(--color-light-green); +} + +.table > thead > tr > td.info, +.table > thead > tr > th.info, +.table > thead > tr.info > td, +.table > thead > tr.info > th, +.table > tbody > tr > td.info, +.table > tbody > tr > th.info, +.table > tbody > tr.info > td, +.table > tbody > tr.info > th, +.table > tfoot > tr > td.info, +.table > tfoot > tr > th.info, +.table > tfoot > tr.info > td, +.table > tfoot > tr.info > th { + background-color: #c4e3f3; +} +.table-hover > tbody > tr > td.info:hover, +.table-hover > tbody > tr > th.info:hover, +.table-hover > tbody > tr.info:hover > td, +.table-hover > tbody > tr:hover > .info, +.table-hover > tbody > tr.info:hover > th { + background-color: #d9edf7; +} + +.table > thead > tr > td.danger, +.table > thead > tr > th.danger, +.table > thead > tr.danger > td, +.table > thead > tr.danger > th, +.table > tbody > tr > td.danger, +.table > tbody > tr > th.danger, +.table > tbody > tr.danger > td, +.table > tbody > tr.danger > th, +.table > tfoot > tr > td.danger, +.table > tfoot > tr > th.danger, +.table > tfoot > tr.danger > td, +.table > tfoot > tr.danger > th { + background-color: #e4b9b9; +} +.table-hover > tbody > tr > td.danger:hover, +.table-hover > tbody > tr > th.danger:hover, +.table-hover > tbody > tr.danger:hover > td, +.table-hover > tbody > tr:hover > .danger, +.table-hover > tbody > tr.danger:hover > th { + background-color: #ebcccc; +} + +.table > thead > tr > td.warning, +.table > thead > tr > th.warning, +.table > thead > tr.warning > td, +.table > thead > tr.warning > th, +.table > tbody > tr > td.warning, +.table > tbody > tr > th.warning, +.table > tbody > tr.warning > td, +.table > tbody > tr.warning > th, +.table > tfoot > tr > td.warning, +.table > tfoot > tr > th.warning, +.table > tfoot > tr.warning > td, +.table > tfoot > tr.warning > th { + background-color: #faf2cc; +} +.table-hover > tbody > tr > td.warning:hover, +.table-hover > tbody > tr > th.warning:hover, +.table-hover > tbody > tr.warning:hover > td, +.table-hover > tbody > tr:hover > .warning, +.table-hover > tbody > tr.warning:hover > th { + background-color: #fcf8e3; +} + +.table-hover > tbody > tr > td:hover, +.table-hover > tbody > tr > th:hover, +.table-hover > tbody > tr:hover > td, +.table-hover > tbody > tr > td, +.table-hover > tbody > tr:hover > th { + background-color: #c7c7c7; +} diff --git a/nflow-explorer-ng/src/index.tsx b/nflow-explorer/src/index.tsx similarity index 100% rename from nflow-explorer-ng/src/index.tsx rename to nflow-explorer/src/index.tsx diff --git a/nflow-explorer-ng/src/react-app-env.d.ts b/nflow-explorer/src/react-app-env.d.ts similarity index 100% rename from nflow-explorer-ng/src/react-app-env.d.ts rename to nflow-explorer/src/react-app-env.d.ts diff --git a/nflow-explorer-ng/src/reportWebVitals.ts b/nflow-explorer/src/reportWebVitals.ts similarity index 70% rename from nflow-explorer-ng/src/reportWebVitals.ts rename to nflow-explorer/src/reportWebVitals.ts index 5fa3583b7..b7876a477 100644 --- a/nflow-explorer-ng/src/reportWebVitals.ts +++ b/nflow-explorer/src/reportWebVitals.ts @@ -1,8 +1,8 @@ -import { ReportHandler } from "web-vitals"; +import {ReportHandler} from 'web-vitals'; const reportWebVitals = (onPerfEntry?: ReportHandler) => { if (onPerfEntry && onPerfEntry instanceof Function) { - import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { + import('web-vitals').then(({getCLS, getFID, getFCP, getLCP, getTTFB}) => { getCLS(onPerfEntry); getFID(onPerfEntry); getFCP(onPerfEntry); diff --git a/nflow-explorer-ng/src/service.ts b/nflow-explorer/src/service.ts similarity index 100% rename from nflow-explorer-ng/src/service.ts rename to nflow-explorer/src/service.ts diff --git a/nflow-explorer-ng/src/setupTests.ts b/nflow-explorer/src/setupTests.ts similarity index 85% rename from nflow-explorer-ng/src/setupTests.ts rename to nflow-explorer/src/setupTests.ts index 1dd407a63..8f2609b7b 100644 --- a/nflow-explorer-ng/src/setupTests.ts +++ b/nflow-explorer/src/setupTests.ts @@ -2,4 +2,4 @@ // allows you to do things like: // expect(element).toHaveTextContent(/react/i) // learn more: https://github.com/testing-library/jest-dom -import "@testing-library/jest-dom"; +import '@testing-library/jest-dom'; diff --git a/nflow-explorer-ng/src/types.ts b/nflow-explorer/src/types.ts similarity index 100% rename from nflow-explorer-ng/src/types.ts rename to nflow-explorer/src/types.ts diff --git a/nflow-explorer/src/utils.test.ts b/nflow-explorer/src/utils.test.ts new file mode 100644 index 000000000..a200f8bad --- /dev/null +++ b/nflow-explorer/src/utils.test.ts @@ -0,0 +1,27 @@ +import {formatRelativeTime, formatTimestamp} from './utils'; +import {addDays, subDays} from 'date-fns'; + +test('formatRelativeTime', () => { + const now = new Date('2021-05-26T06:25:40.722Z'); + + expect(formatRelativeTime('2021-05-26T06:25:40.722Z', now)).toBe( + 'less than a minute ago' + ); + expect(formatRelativeTime(now, now)).toBe('less than a minute ago'); + + expect(formatRelativeTime(new Date('2021-05-26T06:25:40.999Z'), now)).toBe( + 'in less than a minute' + ); + expect(formatRelativeTime(new Date('2021-05-26T06:25:40.000Z'), now)).toBe( + 'less than a minute ago' + ); + + expect(formatRelativeTime(addDays(now, 150), now)).toBe('in 5 months'); + expect(formatRelativeTime(subDays(now, 100), now)).toBe('3 months ago'); +}); + +test('formatTimestamp', () => { + const now = new Date('2021-05-26T06:25:40.722Z'); + // TODO what timezone? + expect(formatTimestamp(now)).toBe('2021-05-26 09:25:40'); +}); diff --git a/nflow-explorer-ng/src/utils.ts b/nflow-explorer/src/utils.ts similarity index 100% rename from nflow-explorer-ng/src/utils.ts rename to nflow-explorer/src/utils.ts diff --git a/nflow-explorer-ng/src/workflow-definition/SettingsTable.tsx b/nflow-explorer/src/workflow-definition/SettingsTable.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-definition/SettingsTable.tsx rename to nflow-explorer/src/workflow-definition/SettingsTable.tsx diff --git a/nflow-explorer-ng/src/workflow-definition/StatisticsSummaryTable.tsx b/nflow-explorer/src/workflow-definition/StatisticsSummaryTable.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-definition/StatisticsSummaryTable.tsx rename to nflow-explorer/src/workflow-definition/StatisticsSummaryTable.tsx diff --git a/nflow-explorer-ng/src/workflow-definition/WorkflowDefinitionDetailsPage.tsx b/nflow-explorer/src/workflow-definition/WorkflowDefinitionDetailsPage.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-definition/WorkflowDefinitionDetailsPage.tsx rename to nflow-explorer/src/workflow-definition/WorkflowDefinitionDetailsPage.tsx diff --git a/nflow-explorer-ng/src/workflow-definition/WorkflowDefinitionListPage.tsx b/nflow-explorer/src/workflow-definition/WorkflowDefinitionListPage.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-definition/WorkflowDefinitionListPage.tsx rename to nflow-explorer/src/workflow-definition/WorkflowDefinitionListPage.tsx diff --git a/nflow-explorer-ng/src/workflow-definition/workflow-definition.scss b/nflow-explorer/src/workflow-definition/workflow-definition.scss similarity index 100% rename from nflow-explorer-ng/src/workflow-definition/workflow-definition.scss rename to nflow-explorer/src/workflow-definition/workflow-definition.scss diff --git a/nflow-explorer/src/workflow-instance/ActionHistoryTable.tsx b/nflow-explorer/src/workflow-instance/ActionHistoryTable.tsx new file mode 100644 index 000000000..3d1edf616 --- /dev/null +++ b/nflow-explorer/src/workflow-instance/ActionHistoryTable.tsx @@ -0,0 +1,134 @@ +import React, {Fragment} from 'react'; +import {formatDistance} from 'date-fns'; + +import { + Paper, + Table, + TableHead, + TableBody, + TableRow, + TableCell, + TableContainer +} from '@material-ui/core'; +import {WorkflowInstance, WorkflowInstanceAction} from '../types'; +import {formatTimestamp} from '../utils'; +import {InternalLink} from '../component'; + +// TODO clicking state highlight state in state graph +const ActionHistoryTable = (props: { + instance: WorkflowInstance; + childInstances: WorkflowInstance[]; +}) => { + const clickAction = (action: WorkflowInstanceAction) => { + // TODO call state graph highlight from here + console.log('Action clicked', action); + }; + + // Group child instances to to action that created them + const actionChildInstanceMap: {[key: number]: WorkflowInstance[]} = {}; + props.childInstances.forEach(childInstance => { + const parentActionId = childInstance.parentActionId as number; + if (!actionChildInstanceMap[parentActionId]) { + actionChildInstanceMap[parentActionId] = []; + } + actionChildInstanceMap[parentActionId].push(childInstance); + }); + + const actionRow = ( + action: WorkflowInstanceAction, + index: number, + actions: WorkflowInstanceAction[] + ) => { + // TODO colors + // stateExecution = green + // stateExecutionFailed = xxx + // externalChange = blue + // recovery = xxx + const actionNumber = actions.length - index; + + // TODO formatDistance is too coarse, gives "less than minute" + // TODO service.ts should convert these to Date + const duration = formatDistance( + new Date(action.executionStartTime), + new Date(action.executionEndTime) + ); + const durationTooltip = + new Date(action.executionEndTime).getTime() - + new Date(action.executionStartTime).getTime() + + ' ms'; + + const childWorkflows = actionChildInstanceMap[action.id] || []; + const description = ( + +
{action.stateText}
+ {childWorkflows.length > 0 && ( +
    + {childWorkflows.map(child => ( +
  • + + {child.type} ({child.id}) + +
    • + ))} +
+ )} +
+ {action.type} +
+ + ); + + const className = () => { + switch (action.type) { + case 'stateExecution': + return 'success'; + case 'stateExecutionFailed': + return 'danger'; + } + return 'info'; + }; + return ( + + {actionNumber} + clickAction(action)} className="clickable"> + {action.state} + + {description} + {action.retryNo} + {formatTimestamp(action.executionStartTime)} + {formatTimestamp(action.executionEndTime)} + {duration} + + ); + }; + return ( + + + + + + No + State + Description + Retries + Started + Finished + Duration + + + + {props.instance.actions.map((action, index) => + actionRow(action, index, props.instance.actions) + )} + +
+ + + ); +}; + +export {ActionHistoryTable}; diff --git a/nflow-explorer-ng/src/workflow-instance/CreateWorkflowInstanceForm.tsx b/nflow-explorer/src/workflow-instance/CreateWorkflowInstanceForm.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/CreateWorkflowInstanceForm.tsx rename to nflow-explorer/src/workflow-instance/CreateWorkflowInstanceForm.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/CreateWorkflowInstancePage.tsx b/nflow-explorer/src/workflow-instance/CreateWorkflowInstancePage.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/CreateWorkflowInstancePage.tsx rename to nflow-explorer/src/workflow-instance/CreateWorkflowInstancePage.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/StateVariableTable.tsx b/nflow-explorer/src/workflow-instance/StateVariableTable.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/StateVariableTable.tsx rename to nflow-explorer/src/workflow-instance/StateVariableTable.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/WorkflowInstanceDetailsPage.tsx b/nflow-explorer/src/workflow-instance/WorkflowInstanceDetailsPage.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/WorkflowInstanceDetailsPage.tsx rename to nflow-explorer/src/workflow-instance/WorkflowInstanceDetailsPage.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/WorkflowInstanceListPage.tsx b/nflow-explorer/src/workflow-instance/WorkflowInstanceListPage.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/WorkflowInstanceListPage.tsx rename to nflow-explorer/src/workflow-instance/WorkflowInstanceListPage.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/WorkflowInstanceSearchForm.tsx b/nflow-explorer/src/workflow-instance/WorkflowInstanceSearchForm.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/WorkflowInstanceSearchForm.tsx rename to nflow-explorer/src/workflow-instance/WorkflowInstanceSearchForm.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/manage/ManageWorkflowInstancePage.tsx b/nflow-explorer/src/workflow-instance/manage/ManageWorkflowInstancePage.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/manage/ManageWorkflowInstancePage.tsx rename to nflow-explorer/src/workflow-instance/manage/ManageWorkflowInstancePage.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/manage/UpdateWorkflowInstanceSignalForm.tsx b/nflow-explorer/src/workflow-instance/manage/UpdateWorkflowInstanceSignalForm.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/manage/UpdateWorkflowInstanceSignalForm.tsx rename to nflow-explorer/src/workflow-instance/manage/UpdateWorkflowInstanceSignalForm.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/manage/UpdateWorkflowInstanceStateForm.tsx b/nflow-explorer/src/workflow-instance/manage/UpdateWorkflowInstanceStateForm.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/manage/UpdateWorkflowInstanceStateForm.tsx rename to nflow-explorer/src/workflow-instance/manage/UpdateWorkflowInstanceStateForm.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/manage/UpdateWorkflowInstanceStateVariableForm.tsx b/nflow-explorer/src/workflow-instance/manage/UpdateWorkflowInstanceStateVariableForm.tsx similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/manage/UpdateWorkflowInstanceStateVariableForm.tsx rename to nflow-explorer/src/workflow-instance/manage/UpdateWorkflowInstanceStateVariableForm.tsx diff --git a/nflow-explorer-ng/src/workflow-instance/workflow-instance.scss b/nflow-explorer/src/workflow-instance/workflow-instance.scss similarity index 100% rename from nflow-explorer-ng/src/workflow-instance/workflow-instance.scss rename to nflow-explorer/src/workflow-instance/workflow-instance.scss diff --git a/nflow-explorer-ng/tsconfig.json b/nflow-explorer/tsconfig.json similarity index 100% rename from nflow-explorer-ng/tsconfig.json rename to nflow-explorer/tsconfig.json diff --git a/nflow-server-common/pom.xml b/nflow-server-common/pom.xml index 4a530779d..2e4ca0ec5 100644 --- a/nflow-server-common/pom.xml +++ b/nflow-server-common/pom.xml @@ -74,7 +74,7 @@ false - ${project.basedir}/../nflow-explorer-ng/build + ${project.basedir}/../nflow-explorer/build false config.js diff --git a/pom.xml b/pom.xml index 2fe6a7573..d5c3ed901 100644 --- a/pom.xml +++ b/pom.xml @@ -101,7 +101,7 @@ nflow-rest-api-common nflow-rest-api-jax-rs nflow-rest-api-spring-web - nflow-explorer-ng + nflow-explorer nflow-server-common nflow-jetty nflow-netty @@ -455,7 +455,7 @@ nflow-rest-api-common nflow-rest-api-jax-rs nflow-rest-api-spring-web - nflow-explorer-ng + nflow-explorer nflow-server-common nflow-netty nflow-jetty