Skip to content

Commit e47fd90

Browse files
authored
Add card layout, add job / build titles, adjust color on console screen for dark-theme (#131)
1 parent e37f0c1 commit e47fd90

File tree

37 files changed

+1107
-156
lines changed

37 files changed

+1107
-156
lines changed

.gitignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ target
66
work
77

88
# frontend build output
9-
src/main/webapp/js
9+
src/main/webapp/js/bundles
1010

1111
# IntelliJ IDEA project files
1212
*.iml

package-lock.json

Lines changed: 11 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@
2727
"@material-ui/icons": "4.11.2",
2828
"@material-ui/lab": "4.0.0-alpha.58",
2929
"@react-spring/web": "9.5.4",
30+
"@reacticons/ionicons": "^6.0.3",
3031
"html-react-parser": "1.4.14",
3132
"linkifyjs": "3.0.0-beta.3",
3233
"react": "16.14.0",

pom.xml

Lines changed: 19 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -37,81 +37,49 @@
3737

3838
<dependencies>
3939
<dependency>
40-
<groupId>org.jenkinsci.plugins</groupId>
41-
<artifactId>pipeline-model-definition</artifactId>
42-
</dependency>
43-
<dependency>
44-
<groupId>org.jenkinsci.plugins</groupId>
45-
<artifactId>pipeline-stage-tags-metadata</artifactId>
46-
</dependency>
47-
<dependency>
48-
<groupId>org.jenkinsci.plugins</groupId>
49-
<artifactId>pipeline-model-api</artifactId>
50-
</dependency>
51-
<dependency>
52-
<groupId>org.jenkinsci.plugins</groupId>
53-
<artifactId>pipeline-model-extensions</artifactId>
54-
</dependency>
55-
<dependency>
56-
<groupId>org.jenkins-ci.plugins.workflow</groupId>
57-
<artifactId>workflow-job</artifactId>
40+
<groupId>io.jenkins.plugins</groupId>
41+
<artifactId>ionicons-api</artifactId>
42+
<version>24.va_745a_b_a_97fc3</version>
5843
</dependency>
5944
<dependency>
6045
<groupId>org.jenkins-ci.plugins</groupId>
61-
<artifactId>pipeline-graph-analysis</artifactId>
62-
<version>195.v5812d95a_a_2f9</version>
63-
</dependency>
64-
<dependency>
65-
<groupId>org.jenkins-ci.plugins.workflow</groupId>
66-
<artifactId>workflow-multibranch</artifactId>
67-
</dependency>
68-
<dependency>
69-
<groupId>org.jenkins-ci.plugins.workflow</groupId>
70-
<artifactId>workflow-step-api</artifactId>
71-
</dependency>
72-
<dependency>
73-
<groupId>org.jenkins-ci.plugins.workflow</groupId>
74-
<artifactId>workflow-durable-task-step</artifactId>
46+
<artifactId>metrics</artifactId>
7547
</dependency>
48+
<!-- TODO make optional -->
7649
<dependency>
77-
<groupId>org.jenkins-ci.plugins.workflow</groupId>
78-
<artifactId>workflow-support</artifactId>
50+
<groupId>org.jenkins-ci.plugins</groupId>
51+
<artifactId>github-branch-source</artifactId>
52+
<version>1598.v91207e9f9b_4a_</version>
53+
<optional>true</optional>
7954
</dependency>
8055
<dependency>
81-
<groupId>org.jenkins-ci.plugins.workflow</groupId>
82-
<artifactId>workflow-support</artifactId>
83-
<classifier>tests</classifier>
84-
<scope>test</scope>
56+
<groupId>org.jenkins-ci.plugins</groupId>
57+
<artifactId>git</artifactId>
58+
<optional>true</optional>
8559
</dependency>
8660
<dependency>
8761
<groupId>org.jenkins-ci.plugins.workflow</groupId>
88-
<artifactId>workflow-basic-steps</artifactId>
62+
<artifactId>workflow-job</artifactId>
8963
</dependency>
9064
<dependency>
9165
<groupId>org.jenkins-ci.plugins.workflow</groupId>
92-
<artifactId>workflow-scm-step</artifactId>
93-
</dependency>
94-
<dependency>
95-
<groupId>org.jenkins-ci.plugins</groupId>
96-
<artifactId>pipeline-stage-step</artifactId>
66+
<artifactId>workflow-cps</artifactId>
9767
</dependency>
9868
<dependency>
9969
<groupId>org.jenkins-ci.plugins</groupId>
10070
<artifactId>pipeline-input-step</artifactId>
10171
</dependency>
10272
<dependency>
10373
<groupId>org.jenkins-ci.plugins</groupId>
104-
<artifactId>pipeline-build-step</artifactId>
74+
<artifactId>pipeline-graph-analysis</artifactId>
10575
</dependency>
10676
<dependency>
107-
<groupId>org.jenkins-ci.plugins</groupId>
108-
<artifactId>pipeline-milestone-step</artifactId>
109-
<version>101.vd572fef9d926</version>
77+
<groupId>org.jenkins-ci.plugins.workflow</groupId>
78+
<artifactId>workflow-durable-task-step</artifactId>
11079
</dependency>
11180
<dependency>
112-
<groupId>io.jenkins.plugins</groupId>
113-
<artifactId>ionicons-api</artifactId>
114-
<version>24.va_745a_b_a_97fc3</version>
81+
<groupId>org.jenkinsci.plugins</groupId>
82+
<artifactId>pipeline-model-definition</artifactId>
11583
</dependency>
11684
</dependencies>
11785

src/main/frontend/multi-pipeline-graph-view/multi-pipeline-graph/main/SingleRun.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ interface Props {
1212
export const SingleRun: (data: Props) => JSX.Element = ({ run }) => {
1313
const [stages, setStages] = useState<Array<StageInfo>>([]);
1414
const path = `graph?runId=${run.id}`;
15-
const singleRunPage = `../${run.id}`;
15+
const singleRunPage = `../${run.id}/pipeline-graph/`;
1616

1717
const handleNodeClick = (nodeName: string, id: number) => {
1818
console.log(nodeName, id);

src/main/frontend/pipeline-console-view/app.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React from "react";
2-
//import ReactDOM from "react-dom";
32
import { FunctionComponent } from "react";
43

54
import { PipelineConsole } from "./pipeline-console/main/";

src/main/frontend/pipeline-console-view/pipeline-console/main/DataTreeView.tsx

Lines changed: 36 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
1-
21
import React from "react";
3-
42
import TreeView from "@material-ui/lab/TreeView/";
53

4+
import {
5+
fade,
6+
withStyles,
7+
Theme,
8+
createStyles,
9+
} from "@material-ui/core/styles";
610
import TreeItem, { TreeItemProps } from "@material-ui/lab/TreeItem";
711
import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
812
import ChevronRightIcon from "@material-ui/icons/ChevronRight";
913
import {
1014
StageInfo,
1115
Result,
1216
} from "../../../pipeline-graph-view/pipeline-graph/main/";
17+
import StepStatus from "../../../step-status/StepStatus";
18+
import { decodeResultValue } from "../../../pipeline-graph-view/pipeline-graph/main/PipelineGraphModel";
1319

14-
import {
15-
fade,
16-
withStyles,
17-
Theme,
18-
createStyles,
19-
} from "@material-ui/core/styles";
2020
/**
2121
* StageInfo is the input, in the form of an Array<StageInfo> of the top-level stages of a pipeline
2222
*/
@@ -63,16 +63,18 @@ const getTreeItemsFromStepList = (stepsItems: StepInfo[]) => {
6363
<StepTreeItem
6464
key={stepItemData.id}
6565
nodeId={String(stepItemData.id)}
66-
label={stepItemData.name.replace(/[^ -~]+/g, "")}
66+
label={
67+
<StepStatus
68+
status={decodeResultValue(stepItemData.state)}
69+
text={stepItemData.name.replace(/[^ -~]+/g, "")}
70+
/>
71+
}
6772
/>
6873
);
6974
});
7075
};
7176

72-
const getTreeItemsFromStage = (
73-
stageItems: StageInfo[],
74-
steps: StepInfo[],
75-
) => {
77+
const getTreeItemsFromStage = (stageItems: StageInfo[], steps: StepInfo[]) => {
7678
// Copy steps so we don't affect props.steps.
7779
let stepsCopy = [...steps];
7880
return stageItems.map((stageItemData) => {
@@ -82,7 +84,7 @@ const getTreeItemsFromStage = (
8284
if (stageItemData.children && stageItemData.children.length > 0) {
8385
children = getTreeItemsFromStage(stageItemData.children, stepsCopy);
8486
}
85-
var i = stepsCopy.length
87+
var i = stepsCopy.length;
8688
while (i--) {
8789
let step = stepsCopy[i];
8890
if (step.stageId == String(stageItemData.id)) {
@@ -92,7 +94,7 @@ const getTreeItemsFromStage = (
9294
// This should reduce the total number of loops required.
9395
stepsCopy.splice(i, 1);
9496
}
95-
};
97+
}
9698
if (stageSteps) {
9799
let stepsItems = getTreeItemsFromStepList(stageSteps);
98100
children = [...children, ...stepsItems];
@@ -101,11 +103,16 @@ const getTreeItemsFromStage = (
101103
<StageTreeItem
102104
key={stageItemData.id}
103105
nodeId={String(stageItemData.id)}
104-
label={stageItemData.name}
106+
label={
107+
<StepStatus
108+
status={decodeResultValue(stageItemData.state)}
109+
text={stageItemData.name}
110+
/>
111+
}
105112
children={children}
106113
classes={{
107114
label: stageItemData.synthetic
108-
? "pgw-graph-node--synthetic"
115+
? "pgv-graph-node--synthetic"
109116
: undefined,
110117
}}
111118
/>
@@ -127,6 +134,18 @@ export class DataTreeView extends React.Component {
127134

128135
constructor(props: DataTreeViewProps) {
129136
super(props);
137+
this.state = {
138+
stages: [],
139+
steps: new Map(),
140+
expanded: [],
141+
};
142+
this.handleToggle = this.handleToggle.bind(this);
143+
}
144+
145+
handleToggle(event: React.ChangeEvent<{}>, nodeIds: string[]): void {
146+
this.setState({
147+
expanded: nodeIds,
148+
});
130149
}
131150

132151
render() {

0 commit comments

Comments
 (0)