Skip to content

Commit 6b94344

Browse files
Merge pull request #2 from nirupama-dev/vertex-schedule-listing
API call updation vertex listing and execution
2 parents 044bd45 + 59eb640 commit 6b94344

File tree

6 files changed

+177
-53
lines changed

6 files changed

+177
-53
lines changed

src/scheduler/vertex/ListVertexScheduler.tsx

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
* limitations under the License.
1616
*/
1717

18-
import React, { useState, useEffect, useMemo, useRef } from 'react';
18+
import React, { useState, useEffect, useMemo } from 'react';
1919
import { useTable, usePagination } from 'react-table';
2020
import TableData from '../../utils/TableData';
2121
import { PaginationComponent } from '../../utils/PaginationComponent';
@@ -80,7 +80,9 @@ function ListVertexScheduler({
8080
setGcsPath,
8181
handleDagIdSelection,
8282
setIsApiError,
83-
setApiError
83+
setApiError,
84+
abortControllers,
85+
abortApiCall
8486
}: {
8587
region: string;
8688
setRegion: (value: string) => void;
@@ -121,6 +123,8 @@ function ListVertexScheduler({
121123
handleDagIdSelection: (scheduleId: any, scheduleName: string) => void;
122124
setIsApiError: (value: boolean) => void;
123125
setApiError: (value: string) => void;
126+
abortControllers: any;
127+
abortApiCall: () => void;
124128
}) {
125129
const [isLoading, setIsLoading] = useState<boolean>(true);
126130
const [vertexScheduleList, setScheduleList] = useState<IVertexScheduleList[]>(
@@ -152,7 +156,6 @@ function ListVertexScheduler({
152156
const [nextPageToken, setNextPageToken] = useState<string | null>(null);
153157
const [fetchPreviousPage, setFetchPreviousPage] = useState<boolean>(false);
154158
const [fetchCurrentPage, setFetchCurrentPage] = useState<boolean>(false);
155-
const abortControllers = useRef<any>([]); // Array of API signals to abort
156159

157160
const columns = useMemo(
158161
() => [
@@ -362,14 +365,16 @@ function ListVertexScheduler({
362365
scheduleId,
363366
region,
364367
displayName,
365-
setResumeLoading
368+
setResumeLoading,
369+
abortControllers
366370
);
367371
} else {
368372
await VertexServices.handleUpdateSchedulerResumeAPIService(
369373
scheduleId,
370374
region,
371375
displayName,
372-
setResumeLoading
376+
setResumeLoading,
377+
abortControllers
373378
);
374379
}
375380
handleCurrentPageRefresh();
@@ -390,9 +395,12 @@ function ListVertexScheduler({
390395
region,
391396
scheduleId,
392397
displayName,
393-
setTriggerLoading
398+
setTriggerLoading,
399+
abortControllers
394400
);
395401
}
402+
403+
handleCurrentPageRefresh();
396404
};
397405

398406
/**
@@ -461,6 +469,7 @@ function ListVertexScheduler({
461469
event: React.MouseEvent,
462470
displayName: string
463471
) => {
472+
abortApiCall();
464473
const job_id = event.currentTarget.getAttribute('data-jobid');
465474
if (job_id) {
466475
setJobId(job_id);
@@ -493,7 +502,8 @@ function ListVertexScheduler({
493502
setMaxRuns,
494503
setEditMode,
495504
setJobNameSelected,
496-
setGcsPath
505+
setGcsPath,
506+
abortControllers
497507
);
498508
}
499509
};
@@ -690,7 +700,8 @@ function ListVertexScheduler({
690700
{...cell.getCellProps()}
691701
className="clusters-table-data table-cell-overflow"
692702
>
693-
{cell.row.original.status === 'COMPLETED' ? (
703+
{cell.row.original.status === 'COMPLETED' ||
704+
cell.row.original.status === 'PAUSED' ? (
694705
<iconDash.react tag="div" />
695706
) : (
696707
dayjs(cell.row.original.nextRunTime).format('lll')
@@ -915,11 +926,6 @@ function ListVertexScheduler({
915926
});
916927
}, [projectId]);
917928

918-
const abortApiCall = () => {
919-
abortControllers.current.forEach((controller: any) => controller.abort());
920-
abortControllers.current = [];
921-
};
922-
923929
return (
924930
<div>
925931
<div className="select-text-overlay-scheduler">

src/scheduler/vertex/VertexExecutionHistory.tsx

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,9 @@ const VertexExecutionHistory = ({
3535
scheduleName,
3636
handleBackButton,
3737
setExecutionPageFlag,
38-
setExecutionPageListFlag
38+
setExecutionPageListFlag,
39+
abortControllers,
40+
abortApiCall
3941
}: {
4042
region: string;
4143
setRegion: (value: string) => void;
@@ -44,6 +46,8 @@ const VertexExecutionHistory = ({
4446
handleBackButton: () => void;
4547
setExecutionPageFlag: (value: boolean) => void;
4648
setExecutionPageListFlag: (value: boolean) => void;
49+
abortControllers: any;
50+
abortApiCall: () => void;
4751
}): JSX.Element => {
4852
const today = dayjs();
4953

@@ -83,6 +87,7 @@ const VertexExecutionHistory = ({
8387

8488
return () => {
8589
setExecutionPageListFlag(false);
90+
abortApiCall();
8691
};
8792
}, []);
8893

@@ -304,9 +309,7 @@ const VertexExecutionHistory = ({
304309
<div className="execution-history-main-wrapper">
305310
<div
306311
className={
307-
isLoading
308-
? 'execution-history-left-wrapper execution-wrapper-border-none'
309-
: 'execution-history-left-wrapper text-enable-warning execution-wrapper-border-none'
312+
'execution-history-left-wrapper calender-top execution-wrapper-border-none'
310313
}
311314
>
312315
<LocalizationProvider dateAdapter={AdapterDayjs}>
@@ -351,6 +354,8 @@ const VertexExecutionHistory = ({
351354
isLoading={isLoading}
352355
vertexScheduleRunsList={vertexScheduleRunsList}
353356
setVertexScheduleRunsList={setVertexScheduleRunsList}
357+
abortControllers={abortControllers}
358+
abortApiCall={abortApiCall}
354359
/>
355360
</div>
356361
</div>

src/scheduler/vertex/VertexJobRuns.tsx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,9 @@ const VertexJobRuns = ({
4343
setIsLoading,
4444
isLoading,
4545
vertexScheduleRunsList,
46-
setVertexScheduleRunsList
46+
setVertexScheduleRunsList,
47+
abortControllers,
48+
abortApiCall
4749
}: {
4850
region: string;
4951
schedulerData: ISchedulerData | undefined;
@@ -64,6 +66,8 @@ const VertexJobRuns = ({
6466
isLoading: boolean;
6567
vertexScheduleRunsList: IVertexScheduleRunList[];
6668
setVertexScheduleRunsList: (value: IVertexScheduleRunList[]) => void;
69+
abortControllers: any;
70+
abortApiCall: () => void;
6771
}): JSX.Element => {
6872
const [jobDownloadLoading, setJobDownloadLoading] = useState(false);
6973
const [
@@ -305,13 +309,18 @@ const VertexJobRuns = ({
305309
data.jobRunId,
306310
data.fileName,
307311
setIsLoading,
308-
setFileExists
312+
setFileExists,
313+
abortControllers
309314
);
310315
};
311316
useEffect(() => {
312317
if (data.state === 'failed') {
313318
outPutFileExistsApi();
314319
}
320+
321+
return () => {
322+
abortApiCall();
323+
};
315324
}, []);
316325

317326
return (
@@ -361,7 +370,8 @@ const VertexJobRuns = ({
361370
setOrangeListDates,
362371
setRedListDates,
363372
setGreenListDates,
364-
setDarkGreenListDates
373+
setDarkGreenListDates,
374+
abortControllers
365375
);
366376
};
367377

src/scheduler/vertex/VertexScheduleJobs.tsx

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
* limitations under the License.
1616
*/
1717

18-
import React, { useState } from 'react';
18+
import React, { useRef, useState } from 'react';
1919
import { SchedulerWidget } from '../../controls/SchedulerWidget';
2020
import { JupyterLab } from '@jupyterlab/application';
2121
import { IThemeManager } from '@jupyterlab/apputils';
@@ -108,13 +108,15 @@ const VertexScheduleJobs = ({
108108
useState<boolean>(false);
109109
const [schedulerData, setScheduleData] = useState<ISchedulerData>();
110110
const [scheduleName, setScheduleName] = useState('');
111+
const abortControllers = useRef<any>([]); // Array of API signals to abort
111112

112113
/**
113114
* Handles the back button click event.
114115
*/
115116
const handleBackButton = () => {
116117
setShowExecutionHistory(false);
117118
setExecutionPageFlag(true);
119+
abortApiCall();
118120
};
119121

120122
/**
@@ -128,6 +130,11 @@ const VertexScheduleJobs = ({
128130
setScheduleData(schedulerData);
129131
};
130132

133+
const abortApiCall = () => {
134+
abortControllers.current.forEach((controller: any) => controller.abort());
135+
abortControllers.current = [];
136+
};
137+
131138
return (
132139
<>
133140
{showExecutionHistory ? (
@@ -139,6 +146,8 @@ const VertexScheduleJobs = ({
139146
handleBackButton={handleBackButton}
140147
setExecutionPageFlag={setExecutionPageFlag}
141148
setExecutionPageListFlag={setExecutionPageListFlag}
149+
abortControllers={abortControllers}
150+
abortApiCall={abortApiCall}
142151
/>
143152
) : (
144153
<ListVertexScheduler
@@ -175,6 +184,8 @@ const VertexScheduleJobs = ({
175184
handleDagIdSelection={handleDagIdSelection}
176185
setIsApiError={setIsApiError}
177186
setApiError={setApiError}
187+
abortControllers={abortControllers}
188+
abortApiCall={abortApiCall}
178189
/>
179190
)}
180191
</>

0 commit comments

Comments
 (0)