Skip to content

Commit 7f43b3c

Browse files
author
Brenda Coronel
committed
Displayed exit code in demo
1 parent a59352a commit 7f43b3c

File tree

3 files changed

+64
-77
lines changed

3 files changed

+64
-77
lines changed

‎packages/playground/src/demo/display/task-list/task-list-demo.tsx‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,15 @@ import { inject } from "@azure/bonito-core/lib/environment";
22
import { TaskList } from "@batch/ui-react/lib/task/task-list";
33
import { BatchDependencyName } from "@batch/ui-service/lib/environment/batch-dependencies";
44
import { FakeTaskService } from "@batch/ui-service/lib/task/fake-task-service";
5-
import { Slider } from "@fluentui/react/lib/Slider";
65
import { Stack } from "@fluentui/react/lib/Stack";
76
import React from "react";
87
import { DemoPane } from "../../../layout/demo-pane";
9-
import { TextField } from "@azure/bonito-ui/src/components/form";
10-
import { TextFieldOnChange } from "../../../functions";
11-
//import { PagedAsyncIterableIterator } from "@azure/core-paging";
8+
import { TextField } from "@fluentui/react/lib/TextField";
129

1310
export const TaskListDemo: React.FC = () => {
14-
const [taskNumberField, setTaskNumberField] = React.useState(0);
11+
const [taskNumberField, setTaskNumberField] = React.useState<
12+
string | undefined
13+
>(undefined);
1514
const [items, setItems] = React.useState<any>([]);
1615

1716
const [accountEndpoint] = React.useState<string>(
@@ -29,8 +28,13 @@ export const TaskListDemo: React.FC = () => {
2928
const fetchTaskList = async () => {
3029
if (!isMounted) return;
3130

32-
const tasks = await taskService.listTasks(accountEndpoint, jobId);
33-
31+
const tasks = taskNumberField
32+
? await taskService.listTasks(
33+
accountEndpoint,
34+
jobId,
35+
parseInt(taskNumberField)
36+
)
37+
: await taskService.listTasks(accountEndpoint, jobId);
3438
setItems(tasks);
3539
};
3640

@@ -41,10 +45,10 @@ export const TaskListDemo: React.FC = () => {
4145
return () => {
4246
isMounted = false;
4347
};
44-
}, [accountEndpoint, jobId]);
48+
}, [accountEndpoint, jobId, taskNumberField]);
4549

4650
return (
47-
<DemoPane title="Task List Demo">
51+
<DemoPane title="Task List Demo Test">
4852
<Stack
4953
horizontal={true}
5054
tokens={{ childrenGap: "1em" }}
@@ -56,8 +60,7 @@ export const TaskListDemo: React.FC = () => {
5660
<TextField
5761
value={taskNumberField}
5862
onChange={(_, newValue) => {
59-
const number = parseInt(`${newValue}`);
60-
setTaskNumberField(number);
63+
setTaskNumberField(newValue);
6164
}}
6265
/>
6366
</Stack.Item>

‎packages/react/src/task/task-list.tsx‎

Lines changed: 34 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
import React from "react";
2-
import { CiCircleCheck, CiAvocado } from "react-icons/ci";
2+
import { CiCircleCheck } from "react-icons/ci";
33
import {
44
DataGrid,
55
DataGridColumn,
66
} from "@azure/bonito-ui/lib/components/data-grid";
77
import { BatchTaskOutput } from "@batch/ui-service/lib/batch-models";
88
import { CiCircleChevDown } from "react-icons/ci";
99
import { IconButton } from "@fluentui/react/lib/Button";
10+
import { MdOutlineRunningWithErrors } from "react-icons/md";
11+
import { RiProgress1Line, RiLoader3Fill } from "react-icons/ri";
1012
//import { PagedAsyncIterableIterator } from "@azure/core-paging";
1113

1214
interface TaskListProps {
@@ -35,6 +37,7 @@ export const TaskList = (props: TaskListProps) => {
3537
state: task.state,
3638
creationTime: task.creationTime,
3739
executionInfo: task.executionInfo,
40+
exitConditions: task.exitConditions?.exitCodes[0].code,
3841
});
3942
}
4043
setItems(taskArray);
@@ -68,23 +71,38 @@ const columns: DataGridColumn[] = [
6871
minWidth: 150,
6972
maxWidth: 200,
7073
onRender: (task: any) => {
74+
console.log(task.exitConditions);
7175
return (
7276
<div>
73-
{task.state === "completed" ? (
77+
{task.state.toLowerCase() === "completed" ? (
7478
<CiCircleCheck
7579
style={{
76-
marginRight: 6,
80+
marginRight: 5,
7781
color: "green",
7882
}}
7983
/>
80-
) : (
81-
<CiAvocado
84+
) : task.state.toLowerCase() === "active" ? (
85+
<RiLoader3Fill
8286
style={{
83-
marginRight: 6,
84-
color: "green",
87+
marginRight: 5,
88+
color: "blue",
89+
}}
90+
/>
91+
) : task.state.toLowerCase() === "failed" ? (
92+
<MdOutlineRunningWithErrors
93+
style={{
94+
marginRight: 5,
95+
color: "red",
96+
}}
97+
/>
98+
) : task.state.toLowerCase() === "running" ? (
99+
<RiProgress1Line
100+
style={{
101+
marginRight: 5,
102+
color: "orange",
85103
}}
86104
/>
87-
)}
105+
) : null}
88106
{task.state}
89107
</div>
90108
);
@@ -100,16 +118,12 @@ const columns: DataGridColumn[] = [
100118
},
101119
},
102120
{
103-
label: "Exit Code",
104-
prop: "exitcode",
121+
label: "Exit code",
122+
prop: "exitCode",
105123
minWidth: 150,
124+
maxWidth: 200,
106125
onRender: (task: any) => {
107-
return (
108-
<div>
109-
Retry count: {task.executionInfo.retryCount} {"\n"}
110-
Requeue count: {task.executionInfo.requeueCount}
111-
</div>
112-
);
126+
return <div>{task.exitConditions}</div>;
113127
},
114128
},
115129
{
@@ -132,4 +146,8 @@ const columns: DataGridColumn[] = [
132146
name=""
133147
iconProps={}
134148
/>
149+
150+
151+
Retry count: {task.executionInfo.retryCount} {"\n"}
152+
Requeue count: {task.executionInfo.requeueCount}
135153
*/

‎packages/service/src/test-util/fakes.ts‎

Lines changed: 16 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,7 @@ export interface BatchFakeSet extends FakeSet {
111111
*
112112
* @param accountEndpoint
113113
* @param jobId
114+
* @param numOfTasks The number of tasks to generate
114115
*/
115116
listTasks(
116117
accountEndpoint: string,
@@ -258,46 +259,6 @@ export abstract class AbstractBatchFakeSet
258259
jobId: string,
259260
numOfTasks: number
260261
): BatchTaskOutput[] {
261-
/*
262-
function getRandomDateTime(): string {
263-
const year = Math.floor(Math.random() * 50) + 2020;
264-
const month = Math.floor(Math.random() * 12);
265-
const day = Math.floor(Math.random() * 28) + 1;
266-
const hours = Math.floor(Math.random() * 24);
267-
const minutes = Math.floor(Math.random() * 60);
268-
const seconds = Math.floor(Math.random() * 60); // Random second
269-
270-
const date = new Date(year, month, day, hours, minutes, seconds);
271-
return date.toString();
272-
}
273-
*/
274-
275-
function getRandomDateTime(): string {
276-
const year = Math.floor(Math.random() * 50) + 2020;
277-
const month = Math.floor(Math.random() * 12);
278-
const day = Math.floor(Math.random() * 28); // Assume all months have 28 days for simplicity
279-
const hours = Math.floor(Math.random() * 24);
280-
const minutes = Math.floor(Math.random() * 60);
281-
const seconds = Math.floor(Math.random() * 60);
282-
283-
const date = new Date(year, month, day, hours, minutes, seconds);
284-
285-
// Format the date and time
286-
const formattedDateTime = date.toLocaleString("en-US", {
287-
year: "numeric",
288-
month: "short",
289-
day: "numeric",
290-
hour: "2-digit",
291-
minute: "2-digit",
292-
second: "2-digit",
293-
});
294-
295-
return formattedDateTime;
296-
}
297-
298-
const randomGeneratedDateTime = getRandomDateTime();
299-
console.log(randomGeneratedDateTime); // Example output: "Aug 17, 2022 14:50:40"
300-
301262
if (!jobId) {
302263
throw new Error("Cannot create a task without a valid job ID");
303264
}
@@ -307,33 +268,34 @@ export abstract class AbstractBatchFakeSet
307268
const baseTaskUrl = `https://${accountEndPoint}/jobs/${jobId}/tasks/`;
308269

309270
for (let i = 0; i < numOfTasks; i++) {
310-
/*
311271
const seed = Math.random();
312272
const seedStr = seed.toString().substring(2);
313273

314274
let exitCode, state;
315275

316276
if (parseInt(seedStr[0]) <= 5) {
317-
exitCode = "Success";
277+
exitCode = 1;
318278
} else {
319-
exitCode = "Failure";
279+
exitCode = 0;
320280
}
321281

322-
if (exitCode === "Success") {
282+
if (exitCode == 1) {
323283
state = parseInt(seedStr[1]) <= 5 ? "Active" : "Completed";
324284
} else {
325-
state = parseInt(seedStr[1]) <= 5 ? "Error" : "Running";
285+
state = parseInt(seedStr[1]) <= 5 ? "Failed" : "Running";
326286
}
327-
*/
328287

329288
taskOutput.push({
330289
url: `${baseTaskUrl}task${i + 1}`,
331290
id: `task${i + 1}`,
332-
state: Math.random() > 0.5 ? "active" : "completed",
333-
creationTime: getRandomDateTime(),
291+
state: state,
292+
creationTime: `Aug 15, 2022 14:${i}`,
334293
executionInfo: {
335-
retryCount: Math.random() > 0.5 ? 0 : 1,
336-
requeueCount: Math.random() > 0.5 ? 0 : 1,
294+
retryCount: Math.floor(Math.random() * 10),
295+
requeueCount: Math.floor(Math.random() * 10),
296+
},
297+
exitConditions: {
298+
exitCodes: [{ code: exitCode, exitOptions: {} }],
337299
},
338300
});
339301
}
@@ -974,19 +936,23 @@ export class BasicBatchFakeSet extends AbstractBatchFakeSet {
974936
url: "https://batchsyntheticsprod.eastus2euap.batch.azure.com/jobs/faketestjob1/tasks/taskA",
975937
id: "taska",
976938
state: "active",
939+
creationTime: "Aug 15, 2022 14:50:00",
977940
executionInfo: {
978941
retryCount: 0,
979942
requeueCount: 0,
980943
},
944+
exitConditions: { exitCodes: [{ code: 1, exitOptions: {} }] },
981945
},
982946
"mercury.eastus.batch.azure.com:faketestjob1:task1": {
983947
url: "https://batchsyntheticsprod.eastus2euap.batch.azure.com/jobs/faketestjob1/tasks/task1",
984948
id: "task1",
985949
state: "completed",
950+
creationTime: "Aug 15, 2022 14:50:01",
986951
executionInfo: {
987952
retryCount: 0,
988953
requeueCount: 0,
989954
},
955+
exitConditions: { exitCodes: [{ code: 0, exitOptions: {} }] },
990956
},
991957
};
992958

0 commit comments

Comments
 (0)