This is an automated email from the ASF dual-hosted git repository.
snlee pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/pinot.git
The following commit(s) were added to refs/heads/master by this push:
new 3dac920bfc Show minion task runtime config details in UI (#9652)
3dac920bfc is described below
commit 3dac920bfc97f33ddbbd2c97d3fe771c1549482d
Author: Jayesh Choudhary <[email protected]>
AuthorDate: Tue Oct 25 23:25:20 2022 +0530
Show minion task runtime config details in UI (#9652)
---
.../resources/app/components/SimpleAccordion.tsx | 12 ++++--
.../src/main/resources/app/interfaces/types.d.ts | 7 +++
.../src/main/resources/app/pages/TaskDetail.tsx | 50 +++++++++++++++++-----
.../src/main/resources/app/requests/index.ts | 5 ++-
.../main/resources/app/utils/PinotMethodUtils.ts | 10 ++++-
5 files changed, 68 insertions(+), 16 deletions(-)
diff --git
a/pinot-controller/src/main/resources/app/components/SimpleAccordion.tsx
b/pinot-controller/src/main/resources/app/components/SimpleAccordion.tsx
index 2cdafa8eab..a8e6b3f22f 100644
--- a/pinot-controller/src/main/resources/app/components/SimpleAccordion.tsx
+++ b/pinot-controller/src/main/resources/app/components/SimpleAccordion.tsx
@@ -26,6 +26,7 @@ import Typography from '@material-ui/core/Typography';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import SearchBar from './SearchBar';
import { FormControlLabel, Switch, Tooltip } from '@material-ui/core';
+import clsx from 'clsx';
const useStyles = makeStyles((theme: Theme) =>
createStyles({
@@ -46,7 +47,8 @@ const useStyles = makeStyles((theme: Theme) =>
},
details: {
flexDirection: 'column',
- padding: '0'
+ padding: '0',
+ overflow: "auto"
},
formControl: {
marginRight: 0,
@@ -68,7 +70,8 @@ type Props = {
toggleChangeHandler: (event: React.ChangeEvent<HTMLInputElement>) => void;
toggleName: string;
toggleValue: boolean;
- }
+ },
+ detailsContainerClass?: string
};
export default function SimpleAccordion({
@@ -79,7 +82,8 @@ export default function SimpleAccordion({
handleSearch,
recordCount,
children,
- accordionToggleObject
+ accordionToggleObject,
+ detailsContainerClass
}: Props) {
const classes = useStyles();
@@ -115,7 +119,7 @@ export default function SimpleAccordion({
/>
}
</AccordionSummary>
- <AccordionDetails className={classes.details}>
+ <AccordionDetails className={clsx(classes.details,
detailsContainerClass)}>
{showSearchBox ?
<SearchBar
// searchOnRight={true}
diff --git a/pinot-controller/src/main/resources/app/interfaces/types.d.ts
b/pinot-controller/src/main/resources/app/interfaces/types.d.ts
index 3efc88f04a..06ab023a3a 100644
--- a/pinot-controller/src/main/resources/app/interfaces/types.d.ts
+++ b/pinot-controller/src/main/resources/app/interfaces/types.d.ts
@@ -197,4 +197,11 @@ declare module 'Models' {
tableName: string
}
}
+
+ export interface TaskRuntimeConfig {
+ ConcurrentTasksPerWorker: string,
+ TaskTimeoutMs: string,
+ TaskExpireTimeMs: string,
+ MinionWorkerGroupTag: string
+ }
}
diff --git a/pinot-controller/src/main/resources/app/pages/TaskDetail.tsx
b/pinot-controller/src/main/resources/app/pages/TaskDetail.tsx
index a0eda167b5..f825cfbd05 100644
--- a/pinot-controller/src/main/resources/app/pages/TaskDetail.tsx
+++ b/pinot-controller/src/main/resources/app/pages/TaskDetail.tsx
@@ -22,6 +22,10 @@ import { get, each } from 'lodash';
import { Grid, makeStyles } from '@material-ui/core';
import PinotMethodUtils from '../utils/PinotMethodUtils';
import CustomizedTables from '../components/Table';
+import { TaskRuntimeConfig } from 'Models';
+import AppLoader from '../components/AppLoader';
+import SimpleAccordion from '../components/SimpleAccordion';
+import CustomCodemirror from '../components/CustomCodemirror';
const useStyles = makeStyles(() => ({
gridContainer: {
@@ -56,6 +60,10 @@ const useStyles = makeStyles(() => ({
border: '1px solid #BDCCD9',
'& .CodeMirror': { height: 532 },
},
+ runtimeConfigContainer: {
+ '& .CodeMirror': { fontSize: "1rem", height: "100%" },
+ maxHeight: 300
+ }
}));
const TaskDetail = (props) => {
@@ -65,10 +73,14 @@ const TaskDetail = (props) => {
const [fetching, setFetching] = useState(true);
const [taskDebugData, setTaskDebugData] = useState({});
const [subtaskTableData, setSubtaskTableData] = useState({ columns: ['Task
ID', 'Status', 'Start Time', 'Finish Time', 'Minion Host Name'], records: [] });
+ const [taskRuntimeConfig, setTaskRuntimeConfig] = useState<TaskRuntimeConfig
| null>(null);
const fetchData = async () => {
setFetching(true);
- const debugRes = await PinotMethodUtils.getTaskDebugData(taskID);
+ const [debugRes, runtimeConfig] = await Promise.all([
+ PinotMethodUtils.getTaskDebugData(taskID),
+ PinotMethodUtils.getTaskRuntimeConfigData(taskID)
+ ]);
const subtaskTableRecords = [];
each(get(debugRes, 'data.subtaskInfos', {}), (subTask) => {
subtaskTableRecords.push([
@@ -83,6 +95,8 @@ const TaskDetail = (props) => {
return { ...prevState, records: subtaskTableRecords };
});
setTaskDebugData(debugRes.data);
+ setTaskRuntimeConfig(runtimeConfig)
+
setFetching(false);
};
@@ -90,6 +104,10 @@ const TaskDetail = (props) => {
fetchData();
}, []);
+ if(fetching) {
+ return <AppLoader />
+ }
+
return (
<Grid item xs className={classes.gridContainer}>
<div className={classes.highlightBackground}>
@@ -112,17 +130,29 @@ const TaskDetail = (props) => {
</Grid>
</div>
<Grid container spacing={2}>
+ {/* Runtime config - JSON */}
<Grid item xs={12}>
- {!fetching && (
- <CustomizedTables
- title="Sub Tasks"
- data={subtaskTableData}
- showSearchBox={true}
- inAccordionFormat={true}
- addLinks
-
baseURL={`/task-queue/${taskType}/tables/${queueTableName}/task/${taskID}/sub-task/`}
+ <SimpleAccordion
+ headerTitle="Runtime Config"
+ showSearchBox={false}
+ detailsContainerClass={classes.runtimeConfigContainer}
+ >
+ <CustomCodemirror
+ data={taskRuntimeConfig}
/>
- )}
+ </SimpleAccordion>
+ </Grid>
+
+ {/* Sub task table */}
+ <Grid item xs={12}>
+ <CustomizedTables
+ title="Sub Tasks"
+ data={subtaskTableData}
+ showSearchBox={true}
+ inAccordionFormat={true}
+ addLinks
+
baseURL={`/task-queue/${taskType}/tables/${queueTableName}/task/${taskID}/sub-task/`}
+ />
</Grid>
</Grid>
</Grid>
diff --git a/pinot-controller/src/main/resources/app/requests/index.ts
b/pinot-controller/src/main/resources/app/requests/index.ts
index a235c60996..8258e200ed 100644
--- a/pinot-controller/src/main/resources/app/requests/index.ts
+++ b/pinot-controller/src/main/resources/app/requests/index.ts
@@ -20,7 +20,7 @@
import { AxiosResponse } from 'axios';
import { TableData, Instances, Instance, Tenants, ClusterConfig, TableName,
TableSize,
IdealState, QueryTables, TableSchema, SQLResult, ClusterName, ZKGetList,
ZKConfig, OperationResponse,
- BrokerList, ServerList, UserList, TableList, UserObject,
TaskProgressResponse, TableSegmentJobs
+ BrokerList, ServerList, UserList, TableList, UserObject,
TaskProgressResponse, TableSegmentJobs, TaskRuntimeConfig
} from 'Models';
const headers = {
@@ -126,6 +126,9 @@ export const getMinionMeta = (tableName: string, taskType:
string): Promise<Axio
export const getTasks = (tableName: string, taskType: string):
Promise<AxiosResponse<OperationResponse>> =>
baseApi.get(`/tasks/${taskType}/${tableName}/state`, { headers: {
...headers, Accept: 'application/json' } });
+export const getTaskRuntimeConfig = (taskName: string):
Promise<AxiosResponse<TaskRuntimeConfig>> =>
+ baseApi.get(`/tasks/task/${taskName}/runtime/config`, { headers: {
...headers, Accept: 'application/json' }});
+
export const getTaskDebug = (taskName: string):
Promise<AxiosResponse<OperationResponse>> =>
baseApi.get(`/tasks/task/${taskName}/debug?verbosity=1`, { headers: {
...headers, Accept: 'application/json' } });
diff --git a/pinot-controller/src/main/resources/app/utils/PinotMethodUtils.ts
b/pinot-controller/src/main/resources/app/utils/PinotMethodUtils.ts
index 843cb05326..7cca8e5474 100644
--- a/pinot-controller/src/main/resources/app/utils/PinotMethodUtils.ts
+++ b/pinot-controller/src/main/resources/app/utils/PinotMethodUtils.ts
@@ -92,7 +92,8 @@ import {
requestDeleteUser,
requestUpdateUser,
getTaskProgress,
- getSegmentReloadStatus
+ getSegmentReloadStatus,
+ getTaskRuntimeConfig
} from '../requests';
import { baseApi } from './axios-config';
import Utils from './Utils';
@@ -827,6 +828,12 @@ const getTasksList = async (tableName, taskType) => {
return finalResponse;
};
+const getTaskRuntimeConfigData = async (taskName: string) => {
+ const response = await getTaskRuntimeConfig(taskName);
+
+ return response.data;
+}
+
const getTaskDebugData = async (taskName) => {
const debugRes = await getTaskDebug(taskName);
return debugRes;
@@ -1117,6 +1124,7 @@ export default {
fetchSegmentReloadStatus,
getTaskTypeDebugData,
getTableData,
+ getTaskRuntimeConfigData,
getTaskInfo,
stopAllTasks,
resumeAllTasks,
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
