Skip to content

Commit 96b044d

Browse files
authored
Merge pull request #26 from Visual-Regression-Tracker/72-branch-merge
approve method added with merge param
2 parents af379b2 + 69b7661 commit 96b044d

File tree

7 files changed

+150
-46
lines changed

7 files changed

+150
-46
lines changed

src/_helpers/route.helpers.ts

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
1-
import { TestRun, TestVariation } from "../types"
2-
import { routes } from "../constants"
1+
import { TestRun, TestVariation } from "../types";
2+
import { routes } from "../constants";
33

4-
export const buildTestRunUrl = (testVariation: TestVariation, testRun: TestRun) =>
5-
`${routes.HOME}${testVariation.projectId}?buildId=${testRun.buildId}&testId=${testRun.id}`
4+
export const buildTestRunUrl = (
5+
testVariation: TestVariation,
6+
testRun: TestRun
7+
) =>
8+
`${routes.HOME}${testVariation.projectId}?buildId=${testRun.buildId}&testId=${testRun.id}`;
69

710
export const buildTestRunLocation = (testRun: TestRun) => ({
8-
search: `buildId=${testRun.buildId}&testId=${testRun.id}`,
9-
})
11+
search: `buildId=${testRun.buildId}&testId=${testRun.id}`,
12+
});
13+
14+
export const buildBuildPageUrl = (projectId: string, buildId: string) =>
15+
`${routes.HOME}${projectId}?buildId=${buildId}`;

src/components/TestDetailsModal.tsx

Lines changed: 45 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ import {
1010
Paper,
1111
Box,
1212
makeStyles,
13+
Chip,
14+
Tooltip,
1315
} from "@material-ui/core";
1416
import { ToggleButton } from "@material-ui/lab";
1517
import { TestRun } from "../types";
@@ -154,26 +156,45 @@ const TestDetailsModal: React.FunctionComponent<{
154156
{(testRun.status === TestStatus.unresolved ||
155157
testRun.status === TestStatus.new) && (
156158
<Grid item>
157-
<Button
158-
color="inherit"
159-
onClick={() =>
160-
testRunService.approve(testRun.id).then((testRun) => {
161-
updateTestRun(testRunDispatch, testRun);
162-
})
163-
}
164-
>
165-
Approve
166-
</Button>
167-
<Button
168-
color="secondary"
169-
onClick={() =>
170-
testRunService.reject(testRun.id).then((testRun) => {
171-
updateTestRun(testRunDispatch, testRun);
172-
})
173-
}
174-
>
175-
Reject
176-
</Button>
159+
<Grid container spacing={2} alignItems="center">
160+
{testRun.merge && (
161+
<Grid item>
162+
<Tooltip title="Will replace target branch baseline if accepted">
163+
<Chip
164+
label={`merge into: ${testRun.baselineBranchName}`}
165+
color="secondary"
166+
size="small"
167+
/>
168+
</Tooltip>
169+
</Grid>
170+
)}
171+
<Grid item>
172+
<Button
173+
color="inherit"
174+
onClick={() =>
175+
testRunService
176+
.approve(testRun.id, testRun.merge)
177+
.then((testRun) => {
178+
updateTestRun(testRunDispatch, testRun);
179+
})
180+
}
181+
>
182+
Approve
183+
</Button>
184+
</Grid>
185+
<Grid item>
186+
<Button
187+
color="secondary"
188+
onClick={() =>
189+
testRunService.reject(testRun.id).then((testRun) => {
190+
updateTestRun(testRunDispatch, testRun);
191+
})
192+
}
193+
>
194+
Reject
195+
</Button>
196+
</Grid>
197+
</Grid>
177198
</Grid>
178199
)}
179200
<Grid item>
@@ -213,8 +234,10 @@ const TestDetailsModal: React.FunctionComponent<{
213234
.setComment(testRun.id, comment)
214235
.then((testRun) => updateTestRun(testRunDispatch, testRun)),
215236
// update in variation
216-
testVariationService
217-
.setComment(testRun.testVariationId, comment),
237+
testVariationService.setComment(
238+
testRun.testVariationId,
239+
comment
240+
),
218241
])
219242
}
220243
/>
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import React from "react";
2+
import { Grid, Select, MenuItem, Button } from "@material-ui/core";
3+
import { testVariationService } from "../services";
4+
import { useHistory } from "react-router-dom";
5+
import { buildBuildPageUrl } from "../_helpers/route.helpers";
6+
7+
interface IProps {
8+
projectId: string;
9+
items: string[];
10+
}
11+
12+
export const TestVariationMergeForm: React.FunctionComponent<IProps> = ({
13+
projectId,
14+
items,
15+
}) => {
16+
const history = useHistory();
17+
const [branch, setBranch] = React.useState("");
18+
19+
const handleSubmit = (event: React.FormEvent) => {
20+
event.preventDefault();
21+
testVariationService.merge(projectId, branch).then((build) => {
22+
history.push(buildBuildPageUrl(projectId, build.id));
23+
});
24+
};
25+
26+
return (
27+
<form onSubmit={handleSubmit}>
28+
<Grid container spacing={2}>
29+
<Grid item>
30+
<Select
31+
displayEmpty
32+
value={branch}
33+
onChange={(event) => setBranch(event.target.value as string)}
34+
>
35+
<MenuItem value="">
36+
<em>Select branch</em>
37+
</MenuItem>
38+
{items.map((i) => (
39+
<MenuItem key={i} value={i}>
40+
{i}
41+
</MenuItem>
42+
))}
43+
</Select>
44+
</Grid>
45+
<Grid item>
46+
<Button type="submit" color="primary" variant="contained">
47+
Merge
48+
</Button>
49+
</Grid>
50+
</Grid>
51+
</form>
52+
);
53+
};

src/pages/TestVariationListPage.tsx

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,10 @@ import { testVariationService } from "../services";
66
import { Container, Box, Grid, Typography } from "@material-ui/core";
77
import ProjectSelect from "../components/ProjectSelect";
88
import Filters from "../components/Filters";
9+
import { TestVariationMergeForm } from "../components/TestVariationMergeForm";
910

1011
const TestVariationListPage: React.FunctionComponent = () => {
11-
const { projectId } = useParams();
12+
const { projectId = "" } = useParams();
1213
const [testVariations, setTestVariations] = React.useState<TestVariation[]>(
1314
[]
1415
);
@@ -54,17 +55,23 @@ const TestVariationListPage: React.FunctionComponent = () => {
5455
<ProjectSelect selectedId={projectId} />
5556
</Grid>
5657
<Grid item>
57-
<Box m={2}>
58-
<Filters
59-
items={testVariations}
60-
queryState={[query, setQuery]}
61-
osState={[os, setOs]}
62-
deviceState={[device, setDevice]}
63-
browserState={[browser, setBrowser]}
64-
viewportState={[viewport, setViewport]}
65-
branchNameState={[branchName, setBranchName]}
66-
/>
67-
</Box>
58+
<TestVariationMergeForm
59+
projectId={projectId}
60+
items={Array.from(
61+
new Set(testVariations.map((t) => t.branchName))
62+
)}
63+
/>
64+
</Grid>
65+
<Grid item>
66+
<Filters
67+
items={testVariations}
68+
queryState={[query, setQuery]}
69+
osState={[os, setOs]}
70+
deviceState={[device, setDevice]}
71+
browserState={[browser, setBrowser]}
72+
viewportState={[viewport, setViewport]}
73+
branchNameState={[branchName, setBranchName]}
74+
/>
6875
</Grid>
6976
<Grid item>
7077
<TestVariationList items={filteredItems} />

src/services/testRun.service.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,15 +50,16 @@ function recalculateDiff(id: string): Promise<TestRun> {
5050
).then(handleResponse);
5151
}
5252

53-
function approve(id: string): Promise<TestRun> {
53+
function approve(id: string, merge: boolean): Promise<TestRun> {
5454
const requestOptions = {
5555
method: "GET",
5656
headers: authHeader(),
5757
};
5858

59-
return fetch(`${API_URL}${ENDPOINT_URL}/approve/${id}`, requestOptions).then(
60-
handleResponse
61-
);
59+
return fetch(
60+
`${API_URL}${ENDPOINT_URL}/approve?id=${id}&merge=${merge}`,
61+
requestOptions
62+
).then(handleResponse);
6263
}
6364

6465
function reject(id: string): Promise<TestRun> {

src/services/testVariation.service.ts

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { TestVariation } from "../types";
1+
import { TestVariation, Build } from "../types";
22
import { handleResponse, authHeader } from "../_helpers/service.helpers";
33
import { API_URL } from "../_config/api.config";
44
import { IgnoreArea } from "../types/ignoreArea";
@@ -10,6 +10,7 @@ export const testVariationService = {
1010
getDetails,
1111
setIgnoreAreas,
1212
setComment,
13+
merge,
1314
};
1415

1516
function getList(projectId: String): Promise<TestVariation[]> {
@@ -30,7 +31,7 @@ function getDetails(id: String): Promise<TestVariation> {
3031
headers: authHeader(),
3132
};
3233

33-
return fetch(`${API_URL}${ENDPOINT_URL}/${id}`, requestOptions).then(
34+
return fetch(`${API_URL}${ENDPOINT_URL}/details/${id}`, requestOptions).then(
3435
handleResponse
3536
);
3637
}
@@ -62,3 +63,15 @@ function setComment(id: string, comment: string): Promise<TestVariation> {
6263
handleResponse
6364
);
6465
}
66+
67+
function merge(projectId: String, branchName: String): Promise<Build> {
68+
const requestOptions = {
69+
method: "GET",
70+
headers: authHeader(),
71+
};
72+
73+
return fetch(
74+
`${API_URL}${ENDPOINT_URL}/merge?projectId=${projectId}&branchName=${branchName}`,
75+
requestOptions
76+
).then(handleResponse);
77+
}

src/types/testRun.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,4 +19,5 @@ export interface TestRun {
1919
comment?: string;
2020
branchName: string;
2121
baselineBranchName: string;
22+
merge: boolean;
2223
}

0 commit comments

Comments
 (0)