Skip to content

Commit 9ba9b2b

Browse files
CahllagerfeldCahllagerfeld
authored
feat: bring in Staging (#523)
1 parent ecb4603 commit 9ba9b2b

File tree

45 files changed

+468
-215
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+468
-215
lines changed

‎src/ui/components/dag/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,6 @@ export const DAG: React.FC<{
8282
</Box>
8383
)
8484
)}
85-
{console.log(graph, '123123123')}
8685
{graph && Object.keys(graph).length > 0 ? (
8786
<LayoutFlow
8887
onRefreshDAG={handleRefreshDAG}

‎src/ui/components/lineage/index.module.scss‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -195,11 +195,13 @@
195195

196196
.sidebarMainContainer {
197197
background-color: rgb(255, 255, 255);
198-
height: 100vh;
198+
// height: 695px;
199+
// padding-bottom: 70px;
199200
width: 50vw;
200201
position: absolute;
201202
right: 0%;
202-
top: 48px;
203+
top: 120px;
204+
// overflow-y: auto;
203205
z-index: 10001;
204206
display: flex;
205207
justify-content: flex-start;
@@ -234,7 +236,7 @@
234236
}
235237

236238
.bodyContainer {
237-
height: 100vh;
239+
// height: 100vh;
238240
width: 100%;
239241
background-color: #ffffff;
240242
}

‎src/ui/components/lineage/index.tsx‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,10 @@ export const LayoutFlow: React.FC<any> = (graph: any) => {
169169

170170
<div style={{ overflow: 'hidden' }}>
171171
<div className="controls">
172-
<button onClick={() => setLegend(!legend)}>
172+
<button
173+
style={{ marginRight: '6px' }}
174+
onClick={() => setLegend(!legend)}
175+
>
173176
{legend ? (
174177
<img
175178
className="legend_arrow"
@@ -186,8 +189,11 @@ export const LayoutFlow: React.FC<any> = (graph: any) => {
186189
Artifact Legends
187190
</button>
188191

189-
<div style={{}}>
190-
<div className="legend" style={{ display: legend ? '' : 'none' }}>
192+
<div>
193+
<div
194+
className="legend"
195+
style={{ display: legend ? '' : 'none', marginRight: '6px' }}
196+
>
191197
<span>
192198
<Analysis /> <span>Data Analysis</span>
193199
</span>

‎src/ui/components/lineage/sidebarTabsSwitchers/artifactTabSwitcher.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,7 @@ const ArtifactTabHeader = ({
105105
style={{
106106
fontSize: '16px',
107107
fontFamily: 'Rubik',
108+
paddingRight: '50px',
108109
}}
109110
data={config}
110111
></JSONPretty>

‎src/ui/components/lineage/sidebarTabsSwitchers/stepTabSwitcher.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -140,6 +140,7 @@ const StepnodeTabHeader: React.FC<any> = ({ node, fetching }) => {
140140
style={{
141141
fontSize: '16px',
142142
fontFamily: 'Rubik',
143+
paddingRight: '50px',
143144
}}
144145
data={config}
145146
></JSONPretty>

‎src/ui/hooks/usePollingService.ts‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
import { useEffect, useState } from 'react';
2+
3+
import { workspaceSelectors } from '../../redux/selectors';
4+
import { useDispatch, useSelector } from 'react-redux';
5+
6+
interface ServiceInterface {}
7+
interface filterValue {
8+
label: string;
9+
type: string;
10+
value: string;
11+
}
12+
13+
export const usePollingService = ({
14+
pipelineId,
15+
stackId,
16+
stackComponentId,
17+
filter,
18+
sortBy,
19+
isExpended,
20+
dispatchFun,
21+
paginatedValue,
22+
}: {
23+
pipelineId?: TId;
24+
stackId?: TId;
25+
stackComponentId?: TId;
26+
isExpended?: any;
27+
sortBy: string;
28+
dispatchFun: Function;
29+
30+
paginatedValue: any;
31+
filter: {
32+
column: filterValue;
33+
type: filterValue;
34+
value: string;
35+
}[];
36+
}): ServiceInterface => {
37+
const dispatch = useDispatch();
38+
39+
const selectedWorkspace = useSelector(workspaceSelectors.selectedWorkspace);
40+
41+
const isValidFilter = filter?.map((f) => f.value).join('');
42+
const [pending, setPending] = useState(false);
43+
console.log(stackComponentId, 'dispatchFun');
44+
useEffect(() => {
45+
if (!isValidFilter && !isExpended && !pending) {
46+
const intervalId = setInterval(() => {
47+
setPending(true);
48+
49+
dispatch(
50+
dispatchFun({
51+
pipelineId: pipelineId,
52+
stackId: stackId,
53+
component_id: stackComponentId,
54+
sort_by: sortBy,
55+
logical_operator: 'and',
56+
workspace: selectedWorkspace,
57+
page: paginatedValue.page,
58+
size: paginatedValue.size,
59+
onSuccess: () => {
60+
setPending(false);
61+
},
62+
onFailure: () => {
63+
setPending(false);
64+
},
65+
}),
66+
);
67+
}, 5000);
68+
69+
return () => clearInterval(intervalId);
70+
}
71+
});
72+
73+
return {};
74+
};

‎src/ui/layouts/AllRuns/BasePage.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,12 @@ export const BasePage: React.FC<{
5858
)}
5959
/>
6060

61-
<Box>
61+
<Box
62+
style={{
63+
maxHeight: 'calc(100vh - 200px)',
64+
overflowY: 'auto',
65+
}}
66+
>
6267
{children}
6368
{tabPages.length > 1 ? (
6469
<TabsRuns pages={tabPages} basePath={tabBasePath} />

‎src/ui/layouts/AllRuns/Runs/List/index.tsx‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,15 @@
11
import React, { useState } from 'react';
22
import { RunsTable } from '../../RunsTable';
3-
import { useService } from './useService';
3+
// import { useService } from './useService';
44
import { getTranslateByScope } from '../../../../../services';
5+
import { usePollingService } from '../../../../hooks/usePollingService';
6+
import { useSelector } from 'react-redux';
7+
import {
8+
runPagesSelectors,
9+
runSelectors,
10+
} from '../../../../../redux/selectors';
11+
import { Run } from '../../../../../api/types';
12+
import { runsActions } from '../../../../../redux/actions';
513

614
export const translate = getTranslateByScope('ui.layouts.AllRuns');
715

@@ -16,8 +24,21 @@ export const List: React.FC<Props> = ({ filter, pagination, runId }: Props) => {
1624
function getSorted(activeSorting: any, activeSortingDirection: any) {
1725
setSortBy(activeSortingDirection?.toLowerCase() + ':' + activeSorting);
1826
}
27+
const runs = useSelector(runSelectors.myRuns);
28+
const runIds = runs.map((run: Run) => run.id);
29+
const runsPaginated = useSelector(runSelectors.myRunsPaginated);
30+
const fetching = useSelector(runPagesSelectors.fetching);
1931

20-
const { fetching, runIds, runsPaginated } = useService({ filter, sortBy });
32+
// const dispatchFun = 'runsActions.allRuns';
33+
const paginatedValue = runsPaginated;
34+
usePollingService({
35+
filter,
36+
sortBy,
37+
dispatchFun: runsActions.allRuns,
38+
paginatedValue,
39+
});
40+
41+
// const { fetching, runIds, runsPaginated } = useService({ filter, sortBy });
2142

2243
return (
2344
<>

‎src/ui/layouts/AllRuns/Runs/List/useService.ts‎

Lines changed: 32 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
// import { useEffect } from 'react';
2-
// import { runsActions } from '../../../../../redux/actions';
1+
import { useEffect, useState } from 'react';
2+
import { runsActions } from '../../../../../redux/actions';
33
import {
44
runSelectors,
55
runPagesSelectors,
6-
// workspaceSelectors,
6+
workspaceSelectors,
77
} from '../../../../../redux/selectors';
8-
import { useSelector } from '../../../../hooks';
8+
import { useDispatch, useSelector } from '../../../../hooks';
99
import { Run } from '../../../../../api/types';
1010

1111
interface ServiceInterface {
@@ -33,30 +33,37 @@ export const useService = ({
3333
}[];
3434
}): ServiceInterface => {
3535
const fetching = useSelector(runPagesSelectors.fetching);
36-
// const dispatch = useDispatch();
36+
const dispatch = useDispatch();
3737
const runs = useSelector(runSelectors.myRuns);
38-
// const selectedWorkspace = useSelector(workspaceSelectors.selectedWorkspace);
38+
const selectedWorkspace = useSelector(workspaceSelectors.selectedWorkspace);
3939
const runsPaginated = useSelector(runSelectors.myRunsPaginated);
40-
// const isValidFilter = filter?.map((f) => f.value).join('');
40+
const isValidFilter = filter?.map((f) => f.value).join('');
41+
const [pending, setPending] = useState(false);
42+
useEffect(() => {
43+
if (!isValidFilter && !isExpended && !pending) {
44+
const intervalId = setInterval(() => {
45+
setPending(true);
46+
//assign interval to a variable to clear it.
47+
dispatch(
48+
runsActions.allRuns({
49+
sort_by: sortBy,
50+
logical_operator: 'and',
51+
workspace: selectedWorkspace,
52+
page: runsPaginated.page,
53+
size: runsPaginated.size,
54+
onSuccess: () => {
55+
setPending(false);
56+
},
57+
onFailure: () => {
58+
setPending(false);
59+
},
60+
}),
61+
);
62+
}, 5000);
4163

42-
// useEffect(() => {
43-
// if (!isValidFilter && !isExpended) {
44-
// const intervalId = setInterval(() => {
45-
// //assign interval to a variable to clear it.
46-
// dispatch(
47-
// runsActions.allRuns({
48-
// sort_by: sortBy,
49-
// logical_operator: 'and',
50-
// workspace: selectedWorkspace,
51-
// page: runsPaginated.page,
52-
// size: runsPaginated.size,
53-
// }),
54-
// );
55-
// }, 5000);
56-
57-
// return () => clearInterval(intervalId); //This is important
58-
// }
59-
// });
64+
return () => clearInterval(intervalId); //This is important
65+
}
66+
});
6067
const runIds = runs.map((run: Run) => run.id);
6168

6269
return {

‎src/ui/layouts/NonEditableRunConfig/index.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ export const NonEditableRunConfig: React.FC<{ runConfiguration: any }> = ({
5656
style={{
5757
fontSize: '16px',
5858
fontFamily: 'Rubik',
59+
paddingRight: '50px',
5960
}}
6061
data={elementSchema}
6162
></JSONPretty>

0 commit comments

Comments
 (0)