[webui] eslint fix (#1864)

src/webui/src/components/public-child/IntermediateVal.tsx

@@ -10,7 +10,7 @@ class IntermediateVal extends React.Component<IntermediateValProps, {}> {
         super(props);
     }
 
-    render() {
+    render(): React.ReactNode {
         return (
             <div>{TRIALS.getTrial(this.props.trialId).formatLatestAccuracy()}</div>
         );

src/webui/src/components/public-child/LogPath.tsx

@@ -12,7 +12,7 @@ class LogPath extends React.Component<LogpathProps, {}> {
 
     }
 
-    render() {
+    render(): React.ReactNode {
         const { logStr } = this.props;
         const isTwopath = logStr.indexOf(',') !== -1
             ?

src/webui/src/components/public-child/LogPathChild.tsx

@@ -12,7 +12,7 @@ class LogPathChild extends React.Component<LogpathChildProps, {}> {
 
     }
 
-    render() {
+    render(): React.ReactNode {
         const { eachLogpath, logName } = this.props;
         const isLink = /^http/gi.test(eachLogpath);
 
@@ -22,7 +22,7 @@ class LogPathChild extends React.Component<LogpathChildProps, {}> {
                 {
                     isLink
                         ?
-                        <a className="logContent logHref" href={eachLogpath} target="_blank">{eachLogpath}</a>
+                        <a className="logContent logHref" rel="noopener noreferrer" href={eachLogpath} target="_blank">{eachLogpath}</a>
                         :
                         <span className="logContent">{eachLogpath}</span>
 

src/webui/src/components/public-child/MonacoEditor.tsx

@@ -17,15 +17,15 @@ class MonacoHTML extends React.Component<MonacoEditorProps, {}> {
         super(props);
     }
 
-    componentDidMount() {
+    componentDidMount(): void {
         this._isMonacoMount = true;
     }
 
-    componentWillUnmount() {
+    componentWillUnmount(): void {
         this._isMonacoMount = false;
     }
 
-    render() {
+    render(): React.ReactNode{
         const { content, loading, height } = this.props;
         return (
             <div className="just-for-log">

src/webui/src/components/public-child/OpenRow.tsx

@@ -30,19 +30,19 @@ class OpenRow extends React.Component<OpenRowProps, OpenRowState> {
         };
     }
 
-    showFormatModal = (trial: Trial) => {
+    showFormatModal = (trial: Trial): void => {
         // get copy parameters
         const params = JSON.stringify(trial.info.hyperParameters, null, 4);
         // open modal with format string
         this.setState({ isShowFormatModal: true, formatStr: params });
     }
 
-    hideFormatModal = () => {
+    hideFormatModal = (): void => {
         // close modal, destroy state format string data
         this.setState({ isShowFormatModal: false, formatStr: '' });
     }
 
-    copyParams = () => {
+    copyParams = (): void => {
         // json format
         const { formatStr } = this.state;
         if (copy(formatStr)) {
@@ -55,7 +55,7 @@ class OpenRow extends React.Component<OpenRowProps, OpenRowState> {
         this.hideFormatModal();
     }
 
-    render() {
+    render(): React.ReactNode {
         const { isShowFormatModal, formatStr } = this.state;
         const trialId = this.props.trialId;
         const trial = TRIALS.getTrial(trialId);
@@ -73,10 +73,17 @@ class OpenRow extends React.Component<OpenRowProps, OpenRowState> {
                                     Trails for multiphase experiment will return a set of parameters,
                                     we are listing the latest parameter in webportal.
                                     <br />
-                                    For the entire parameter set, please refer to the following "
-                                    <a href={trialLink} target="_blank">{trialLink}</a>".
+                                    For the entire parameter set, please refer to the following &quot;
+                                    <a
+                                        href={trialLink}
+                                        rel="noopener noreferrer"
+                                        target="_blank"
+                                        style={{marginLeft: 2}}
+                                    >
+                                        {trialLink}
+                                    </a>&quot;
                                     <br />
-                                    Current Phase: {multiProgress}.
+                                    Current Phase:{multiProgress}.
                                 </Row>
                                 :
                                 <div />
@@ -88,8 +95,8 @@ class OpenRow extends React.Component<OpenRowProps, OpenRowState> {
                                     <Row className="bgHyper">
                                         <JSONTree
                                             hideRoot={true}
-                                            shouldExpandNode={() => true}  // default expandNode
-                                            getItemString={() => (<span />)}  // remove the {} items
+                                            shouldExpandNode={(): boolean => true}  // default expandNode
+                                            getItemString={(): any => (<span />)}  // remove the {} items
                                             data={trial.description.parameters}
                                         />
                                     </Row>
@@ -103,8 +110,8 @@ class OpenRow extends React.Component<OpenRowProps, OpenRowState> {
                                 </Row>
                                 :
                                 <Row className="logpath">
-                                    <span className="logName">Error: </span>
-                                    <span className="error">'This trial's parameters are not available.'</span>
+                                    <span className="logName" style={{marginRight: 2}}>Error:</span>
+                                    <span className="error">&apos;This trial&apos;s parameters are not available.&apos;</span>
                                 </Row>
                         }
                     </TabPane>

src/webui/src/components/public-child/PaiTrialChild.tsx

@@ -15,7 +15,7 @@ class PaiTrialChild extends React.Component<PaiTrialChildProps, {}> {
 
     }
 
-    render() {
+    render(): React.ReactNode {
         const { logString, id, logCollect } = this.props;
         return (
             <div>
@@ -30,6 +30,7 @@ class PaiTrialChild extends React.Component<PaiTrialChildProps, {}> {
                                     ?
                                     <a
                                         target="_blank"
+                                        rel="noopener noreferrer"
                                         href={`${DOWNLOAD_IP}/trial_${id}.log`}
                                         style={{ marginRight: 10 }}
                                     >

src/webui/src/components/public-child/PaiTrialLog.tsx

@@ -17,7 +17,7 @@ class PaitrialLog extends React.Component<PaitrialLogProps, {}> {
 
     }
 
-    render() {
+    render(): React.ReactNode {
         const { logStr, id, logCollection } = this.props;
         const isTwopath = logStr.indexOf(',') !== -1
             ?
@@ -37,12 +37,13 @@ class PaitrialLog extends React.Component<PaitrialLogProps, {}> {
                                         <Row>
                                             <a
                                                 target="_blank"
+                                                rel="noopener noreferrer"
                                                 href={`${DOWNLOAD_IP}/trial_${id}.log`}
                                                 style={{ marginRight: 10 }}
                                             >
                                                 Trial stdout
                                             </a>
-                                            <a target="_blank" href={logStr.split(',')[1]}>hdfsLog</a>
+                                            <a target="_blank" rel="noopener noreferrer" href={logStr.split(',')[1]}>hdfsLog</a>
                                         </Row>
                                         :
                                         <Row>

src/webui/src/components/public-child/TrialLog.tsx

@@ -13,7 +13,7 @@ class TrialLog extends React.Component<TrialLogProps, {}> {
 
     }
 
-    render() {
+    render(): React.ReactNode {
         const { logStr } = this.props;
 
         return (

src/webui/src/components/trial-detail/DefaultMetricPoint.tsx

@@ -7,7 +7,20 @@ import { TooltipForAccuracy, EventMap } from '../../static/interface';
 require('echarts/lib/chart/scatter');
 require('echarts/lib/component/tooltip');
 require('echarts/lib/component/title');
-
+const EmptyGraph = {
+    grid: {
+        left: '8%'
+    },
+    xAxis: {
+        name: 'Trial',
+        type: 'category',
+    },
+    yAxis: {
+        name: 'Default metric',
+        type: 'value',
+        scale: true,
+    }
+};
 interface DefaultPointProps {
     trialIds: string[];
     visible: boolean;
@@ -30,15 +43,55 @@ class DefaultPoint extends React.Component<DefaultPointProps, DefaultPointState>
         };
     }
 
-    loadDefault = (checked: boolean) => {
+    loadDefault = (checked: boolean): void => {
         this.setState({ bestCurveEnabled: checked });
     }
 
-    shouldComponentUpdate(nextProps: DefaultPointProps, nextState: DefaultPointState) {
+    shouldComponentUpdate(nextProps: DefaultPointProps): boolean {
         return nextProps.visible;
     }
 
-    render() {
+    generateScatterSeries = (trials: Trial[]): any => {
+        const data = trials.map(trial => [
+            trial.sequenceId,
+            trial.accuracy,
+            trial.description.parameters,
+        ]);
+        return {
+            symbolSize: 6,
+            type: 'scatter',
+            data,
+        };
+    }
+    
+    generateBestCurveSeries = (trials: Trial[]): any => {
+        let best = trials[0];
+        const data = [[best.sequenceId, best.accuracy, best.description.parameters]];
+    
+        for (let i = 1; i < trials.length; i++) {
+            const trial = trials[i];
+            if (trial.accuracy !== undefined) {
+                if (best.accuracy !== undefined) {
+                    const delta = trial.accuracy - best.accuracy;
+                    const better = (EXPERIMENT.optimizeMode === 'minimize') ? (delta < 0) : (delta > 0);
+                    if (better) {
+                        data.push([trial.sequenceId, trial.accuracy, trial.description.parameters]);
+                        best = trial;
+                    } else {
+                        data.push([trial.sequenceId, best.accuracy, trial.description.parameters]);
+                    }
+                }
+            }
+        }
+    
+        return {
+            type: 'line',
+            lineStyle: { color: '#FF6600' },
+            data,
+        };
+    }
+
+    render(): React.ReactNode {
         const graph = this.generateGraph();
         const accNodata = (graph === EmptyGraph ? 'No data' : '');
         const onEvents = { 'dataZoom': this.metricDataZoom };
@@ -67,21 +120,21 @@ class DefaultPoint extends React.Component<DefaultPointProps, DefaultPointState>
         );
     }
 
-    private generateGraph() {
+    private generateGraph(): any {
         const trials = TRIALS.getTrials(this.props.trialIds).filter(trial => trial.sortable);
         if (trials.length === 0) {
             return EmptyGraph;
         }
         const graph = this.generateGraphConfig(trials[trials.length - 1].sequenceId);
         if (this.state.bestCurveEnabled) {
-            (graph as any).series = [generateBestCurveSeries(trials), generateScatterSeries(trials)];
+            (graph as any).series = [this.generateBestCurveSeries(trials), this.generateScatterSeries(trials)];
         } else {
-            (graph as any).series = [generateScatterSeries(trials)];
+            (graph as any).series = [this.generateScatterSeries(trials)];
         }
         return graph;
     }
 
-    private generateGraphConfig(maxSequenceId: number) {
+    private generateGraphConfig(maxSequenceId: number): any {
         const { startY, endY } = this.state;
         return {
             grid: {
@@ -90,10 +143,10 @@ class DefaultPoint extends React.Component<DefaultPointProps, DefaultPointState>
             tooltip: {
                 trigger: 'item',
                 enterable: true,
-                position: (point: Array<number>, data: TooltipForAccuracy) => (
+                position: (point: number[], data: TooltipForAccuracy): number[] => (
                     [(data.data[0] < maxSequenceId ? point[0] : (point[0] - 300)), 80]
                 ),
-                formatter: (data: TooltipForAccuracy) => (
+                formatter: (data: TooltipForAccuracy): any => (
                     '<div class="tooldetailAccuracy">' +
                     '<div>Trial No.: ' + data.data[0] + '</div>' +
                     '<div>Default metric: ' + data.data[1] + '</div>' +
@@ -124,7 +177,7 @@ class DefaultPoint extends React.Component<DefaultPointProps, DefaultPointState>
         };
     }
 
-    private metricDataZoom = (e: EventMap) => {
+    private metricDataZoom = (e: EventMap): void => {
         if (e.batch !== undefined) {
             this.setState(() => ({
                 startY: (e.batch[0].start !== null ? e.batch[0].start : 0),
@@ -134,55 +187,4 @@ class DefaultPoint extends React.Component<DefaultPointProps, DefaultPointState>
     }
 }
 
-const EmptyGraph = {
-    grid: {
-        left: '8%'
-    },
-    xAxis: {
-        name: 'Trial',
-        type: 'category',
-    },
-    yAxis: {
-        name: 'Default metric',
-        type: 'value',
-        scale: true,
-    }
-};
-
-function generateScatterSeries(trials: Trial[]) {
-    const data = trials.map(trial => [
-        trial.sequenceId,
-        trial.accuracy,
-        trial.description.parameters,
-    ]);
-    return {
-        symbolSize: 6,
-        type: 'scatter',
-        data,
-    };
-}
-
-function generateBestCurveSeries(trials: Trial[]) {
-    let best = trials[0];
-    const data = [[best.sequenceId, best.accuracy, best.description.parameters]];
-
-    for (let i = 1; i < trials.length; i++) {
-        const trial = trials[i];
-        const delta = trial.accuracy! - best.accuracy!;
-        const better = (EXPERIMENT.optimizeMode === 'minimize') ? (delta < 0) : (delta > 0);
-        if (better) {
-            data.push([trial.sequenceId, trial.accuracy, trial.description.parameters]);
-            best = trial;
-        } else {
-            data.push([trial.sequenceId, best.accuracy, trial.description.parameters]);
-        }
-    }
-
-    return {
-        type: 'line',
-        lineStyle: { color: '#FF6600' },
-        data,
-    };
-}
-
 export default DefaultPoint;

src/webui/src/components/trial-detail/Duration.tsx

@@ -8,7 +8,7 @@ require('echarts/lib/component/title');
 
 interface Runtrial {
     trialId: Array<string>;
-    trialTime: Array<number>;
+    trialTime: number[];
 }
 
 interface DurationProps {
@@ -32,7 +32,7 @@ class Duration extends React.Component<DurationProps, DurationState> {
         };
     }
 
-    getOption = (dataObj: Runtrial) => {
+    getOption = (dataObj: Runtrial): any => {
         const { startDuration, endDuration } = this.state;
         return {
             tooltip: {
@@ -73,10 +73,10 @@ class Duration extends React.Component<DurationProps, DurationState> {
         };
     }
 
-    drawDurationGraph = (source: Array<TableObj>) => {
+    drawDurationGraph = (source: Array<TableObj>): any => {
         // why this function run two times when props changed?
         const trialId: Array<string> = [];
-        const trialTime: Array<number> = [];
+        const trialTime: number[] = [];
         const trialRun: Array<Runtrial> = [];
         const trialJobs = source.filter(filterDuration);
         Object.keys(trialJobs).map(item => {
@@ -91,7 +91,7 @@ class Duration extends React.Component<DurationProps, DurationState> {
         return this.getOption(trialRun[0]);
     }
 
-    shouldComponentUpdate(nextProps: DurationProps, nextState: DurationState) {
+    shouldComponentUpdate(nextProps: DurationProps): boolean {
 
         const { whichGraph, source } = nextProps;
         if (whichGraph === '3') {
@@ -116,7 +116,7 @@ class Duration extends React.Component<DurationProps, DurationState> {
         return false;
     }
 
-    render() {
+    render(): React.ReactNode {
 
         const { source } = this.props;
         const graph = this.drawDurationGraph(source);
@@ -134,7 +134,7 @@ class Duration extends React.Component<DurationProps, DurationState> {
         );
     }
 
-    private durationDataZoom = (e: EventMap) => {
+    private durationDataZoom = (e: EventMap): void => {
         if (e.batch !== undefined) {
             this.setState(() => ({
                 startDuration: (e.batch[0].start !== null ? e.batch[0].start : 0),

src/webui/src/components/trial-detail/Intermediate.tsx

@@ -46,7 +46,7 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
         };
     }
 
-    drawIntermediate = (source: Array<TableObj>) => {
+    drawIntermediate = (source: Array<TableObj>): void => {
         if (source.length > 0) {
             this.setState({
                 length: source.length,
@@ -68,7 +68,7 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
             const legend: Array<string> = [];
             // max length
             const length = trialIntermediate[0].data.length;
-            const xAxis: Array<number> = [];
+            const xAxis: number[] = [];
             Object.keys(trialIntermediate).map(item => {
                 const temp = trialIntermediate[item];
                 legend.push(temp.name);
@@ -80,14 +80,14 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
                 tooltip: {
                     trigger: 'item',
                     enterable: true,
-                    position: function (point: Array<number>, data: TooltipForIntermediate) {
+                    position: function (point: number[], data: TooltipForIntermediate): number[] {
                         if (data.dataIndex < length / 2) {
                             return [point[0], 80];
                         } else {
                             return [point[0] - 300, 80];
                         }
                     },
-                    formatter: function (data: TooltipForIntermediate) {
+                    formatter: function (data: TooltipForIntermediate): any {
                         const trialId = data.seriesName;
                         let obj = {};
                         const temp = trialIntermediate.find(key => key.name === trialId);
@@ -154,7 +154,7 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
     }
 
     // confirm btn function [filter data]
-    filterLines = () => {
+    filterLines = (): void => {
         const filterSource: Array<TableObj> = [];
         this.setState({ isLoadconfirmBtn: true }, () => {
             const { source } = this.props;
@@ -195,19 +195,19 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
         });
     }
 
-    switchTurn = (checked: boolean) => {
+    switchTurn = (checked: boolean): void => {
         this.setState({ isFilter: checked });
         if (checked === false) {
             this.drawIntermediate(this.props.source);
         }
     }
 
-    componentDidMount() {
+    componentDidMount(): void {
         const { source } = this.props;
         this.drawIntermediate(source);
     }
 
-    componentWillReceiveProps(nextProps: IntermediateProps, nextState: IntermediateState) {
+    componentWillReceiveProps(nextProps: IntermediateProps, nextState: IntermediateState): void {
         const { isFilter, filterSource } = nextState;
         const { whichGraph, source } = nextProps;
 
@@ -226,7 +226,7 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
         }
     }
 
-    shouldComponentUpdate(nextProps: IntermediateProps, nextState: IntermediateState) {
+    shouldComponentUpdate(nextProps: IntermediateProps, nextState: IntermediateState): boolean {
         const { whichGraph, source } = nextProps;
         const beforeGraph = this.props.whichGraph;
         if (whichGraph === '4') {
@@ -271,7 +271,7 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
         return false;
     }
 
-    render() {
+    render(): React.ReactNode {
         const { interSource, isLoadconfirmBtn, isFilter } = this.state;
         const IntermediateEvents = { 'dataZoom': this.intermediateDataZoom };
         return (
@@ -285,18 +285,18 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
                                 <span className="filter-x"># Intermediate result</span>
                                 <input
                                     // placeholder="point"
-                                    ref={input => this.pointInput = input}
+                                    ref={(input): any => this.pointInput = input}
                                     className="strange"
                                 />
                                 <span>Metric range</span>
                                 <input
                                     // placeholder="range"
-                                    ref={input => this.minValInput = input}
+                                    ref={(input): any => this.minValInput = input}
                                 />
                                 <span className="hyphen">-</span>
                                 <input
                                     // placeholder="range"
-                                    ref={input => this.maxValInput = input}
+                                    ref={(input): any => this.maxValInput = input}
                                 />
                                 <Button
                                     type="primary"
@@ -330,7 +330,7 @@ class Intermediate extends React.Component<IntermediateProps, IntermediateState>
         );
     }
 
-    private intermediateDataZoom = (e: EventMap) => {
+    private intermediateDataZoom = (e: EventMap): void => {
         if (e.batch !== undefined) {
             this.setState(() => ({
                 startMediaY: (e.batch[0].start !== null ? e.batch[0].start : 0),

src/webui/src/components/trial-detail/Para.tsx

@@ -76,13 +76,13 @@ class Para extends React.Component<ParaProps, ParaState> {
     getParallelAxis =
         (
             dimName: Array<string>, parallelAxis: Array<Dimobj>,
-            accPara: Array<number>, eachTrialParams: Array<string>,
+            accPara: number[], eachTrialParams: Array<string>,
             lengthofTrials: number
-        ) => {
+        ): void => {
             // get data for every lines. if dim is choice type, number -> toString()
             const paraYdata: number[][] = [];
             Object.keys(eachTrialParams).map(item => {
-                let temp: Array<number> = [];
+                const temp: number[] = [];
                 for (let i = 0; i < dimName.length; i++) {
                     if ('type' in parallelAxis[i]) {
                         temp.push(eachTrialParams[item][dimName[i]].toString());
@@ -122,11 +122,11 @@ class Para extends React.Component<ParaProps, ParaState> {
             this.setState({ paraBack: paraData });
         }
 
-    hyperParaPic = (source: Array<TableObj>, searchSpace: string) => {
+    hyperParaPic = (source: Array<TableObj>, searchSpace: string): void => {
         // filter succeed trials [{}, {}, {}]
         const dataSource = source.filter(filterByStatus);
         const lenOfDataSource: number = dataSource.length;
-        const accPara: Array<number> = [];
+        const accPara: number[] = [];
         // specific value array
         const eachTrialParams: Array<string> = [];
         // experiment interface search space obj
@@ -148,6 +148,7 @@ class Para extends React.Component<ParaProps, ParaState> {
         if (isNested === false) {
             for (i; i < dimName.length; i++) {
                 const searchKey = searchRange[dimName[i]];
+                const data: Array<string> = [];
                 switch (searchKey._type) {
                     case 'uniform':
                     case 'quniform':
@@ -167,7 +168,6 @@ class Para extends React.Component<ParaProps, ParaState> {
                         });
                         break;
                     case 'choice':
-                        const data: Array<string> = [];
                         for (let j = 0; j < searchKey._value.length; j++) {
                             data.push(searchKey._value[j].toString());
                         }
@@ -220,11 +220,10 @@ class Para extends React.Component<ParaProps, ParaState> {
         } else {
             for (i; i < dimName.length; i++) {
                 const searchKey = searchRange[dimName[i]];
+                const data: Array<string> = [];
                 switch (searchKey._type) {
                     case 'choice':
-                        const data: Array<string> = [];
-                        let j = 0;
-                        for (j; j < searchKey._value.length; j++) {
+                        for (let j = 0; j < searchKey._value.length; j++) {
                             const item = searchKey._value[j];
                             Object.keys(item).map(key => {
                                 if (key !== '_name' && key !== '_type') {
@@ -292,7 +291,7 @@ class Para extends React.Component<ParaProps, ParaState> {
                             show: true
                         },
                         axisLabel: {
-                            formatter: function (value?: string) {
+                            formatter: function (value?: string): string | null {
                                 if (value !== undefined) {
                                     const length = value.length;
                                     if (length > 16) {
@@ -340,7 +339,7 @@ class Para extends React.Component<ParaProps, ParaState> {
             if (isNested !== false) {
                 eachTrialParams.forEach(element => {
                     Object.keys(element).forEach(key => {
-                        let item = element[key];
+                        const item = element[key];
                         if (typeof item === 'object') {
                             Object.keys(item).forEach(index => {
                                 if (index !== '_name') {
@@ -363,16 +362,14 @@ class Para extends React.Component<ParaProps, ParaState> {
     }
 
     // get percent value number
-    percentNum = (value: string) => {
+    percentNum = (value: string): void => {
 
-        let vals = parseFloat(value);
-        this.setState({ percent: vals }, () => {
-            this.reInit();
-        });
+        const vals = parseFloat(value);
+        this.setState({ percent: vals }, () => { this.reInit(); });
     }
 
     // deal with response data into pic data
-    getOption = (dataObj: ParaObj, lengthofTrials: number) => {
+    getOption = (dataObj: ParaObj, lengthofTrials: number): void => {
         // dataObj [[y1], [y2]... [default metric]]
         const { max, min } = this.state;
         const parallelAxis = dataObj.parallelAxis;
@@ -407,7 +404,7 @@ class Para extends React.Component<ParaProps, ParaState> {
                         show: true
                     },
                     axisLabel: {
-                        formatter: function (value: string) {
+                        formatter: function (value: string): string {
                             const length = value.length;
                             if (length > 16) {
                                 const temp = value.split('');
@@ -442,16 +439,16 @@ class Para extends React.Component<ParaProps, ParaState> {
     }
 
     // get swap parallel axis
-    getSwapArr = (value: Array<string>) => {
+    getSwapArr = (value: Array<string>): void => {
         this.setState({ swapAxisArr: value });
     }
 
-    reInit = () => {
+    reInit = (): void => {
         const { dataSource, expSearchSpace } = this.props;
         this.hyperParaPic(dataSource, expSearchSpace);
     }
 
-    swapReInit = () => {
+    swapReInit = (): void => {
         const { clickCounts, succeedRenderCount } = this.state;
         const val = clickCounts + 1;
         this.setState({ isLoadConfirm: true, clickCounts: val, });
@@ -509,12 +506,12 @@ class Para extends React.Component<ParaProps, ParaState> {
         });
     }
 
-    sortDimY = (a: Dimobj, b: Dimobj) => {
+    sortDimY = (a: Dimobj, b: Dimobj): number => {
         return a.dim - b.dim;
     }
 
     // deal with after swap data into pic
-    swapGraph = (paraBack: ParaObj, swapAxisArr: string[]) => {
+    swapGraph = (paraBack: ParaObj, swapAxisArr: string[]): void => {
         const paralDim = paraBack.parallelAxis;
         const paraData = paraBack.data;
         let temp: number;
@@ -563,18 +560,18 @@ class Para extends React.Component<ParaProps, ParaState> {
         });
     }
 
-    componentDidMount() {
+    componentDidMount(): void {
         this.reInit();
     }
 
-    componentWillReceiveProps(nextProps: ParaProps) {
+    componentWillReceiveProps(nextProps: ParaProps): void {
         const { dataSource, expSearchSpace, whichGraph } = nextProps;
         if (whichGraph === '2') {
             this.hyperParaPic(dataSource, expSearchSpace);
         }
     }
 
-    shouldComponentUpdate(nextProps: ParaProps, nextState: ParaState) {
+    shouldComponentUpdate(nextProps: ParaProps, nextState: ParaState): boolean {
 
         const { whichGraph } = nextProps;
         const beforeGraph = this.props.whichGraph;
@@ -601,7 +598,7 @@ class Para extends React.Component<ParaProps, ParaState> {
         return false;
     }
 
-    render() {
+    render(): React.ReactNode {
         const { option, paraNodata, dimName, isLoadConfirm } = this.state;
         return (
             <Row className="parameter">

src/webui/src/components/trial-detail/TableList.tsx

@@ -55,6 +55,95 @@ interface ColumnIndex {
     index: number;
 }
 
+const AccuracyColumnConfig: ColumnProps<TableRecord> = {
+    title: 'Default metric',
+    className: 'leftTitle',
+    dataIndex: 'accuracy',
+    sorter: (a, b, sortOrder) => {
+        if (a.latestAccuracy === undefined) {
+            return sortOrder === 'ascend' ? 1 : -1;
+        } else if (b.latestAccuracy === undefined) {
+            return sortOrder === 'ascend' ? -1 : 1;
+        } else {
+            return a.latestAccuracy - b.latestAccuracy;
+        }
+    },
+    render: (text, record): React.ReactNode => <div>{record.formattedLatestAccuracy}</div>
+};
+
+const SequenceIdColumnConfig: ColumnProps<TableRecord> = {
+    title: 'Trial No.',
+    dataIndex: 'sequenceId',
+    className: 'tableHead',
+    sorter: (a, b) => a.sequenceId - b.sequenceId
+};
+
+const IdColumnConfig: ColumnProps<TableRecord> = {
+    title: 'ID',
+    dataIndex: 'id',
+    className: 'tableHead leftTitle',
+    sorter: (a, b) => a.id.localeCompare(b.id),
+    render: (text, record): React.ReactNode => (
+        <div>{record.id}</div>
+    )
+};
+
+const StartTimeColumnConfig: ColumnProps<TableRecord> = {
+    title: 'Start Time',
+    dataIndex: 'startTime',
+    sorter: (a, b) => a.startTime - b.startTime,
+    render: (text, record): React.ReactNode => (
+        <span>{formatTimestamp(record.startTime)}</span>
+    )
+};
+
+const EndTimeColumnConfig: ColumnProps<TableRecord> = {
+    title: 'End Time',
+    dataIndex: 'endTime',
+    sorter: (a, b, sortOrder) => {
+        if (a.endTime === undefined) {
+            return sortOrder === 'ascend' ? 1 : -1;
+        } else if (b.endTime === undefined) {
+            return sortOrder === 'ascend' ? -1 : 1;
+        } else {
+            return a.endTime - b.endTime;
+        }
+    },
+    render: (text, record): React.ReactNode => (
+        <span>{formatTimestamp(record.endTime, '--')}</span>
+    )
+};
+
+const DurationColumnConfig: ColumnProps<TableRecord> = {
+    title: 'Duration',
+    dataIndex: 'duration',
+    sorter: (a, b) => a.duration - b.duration,
+    render: (text, record): React.ReactNode => (
+        <span className="durationsty">{convertDuration(record.duration)}</span>
+    )
+};
+
+const StatusColumnConfig: ColumnProps<TableRecord> = {
+    title: 'Status',
+    dataIndex: 'status',
+    className: 'tableStatus',
+    render: (text, record): React.ReactNode => (
+        <span className={`${record.status} commonStyle`}>{record.status}</span>
+    ),
+    sorter: (a, b) => a.status.localeCompare(b.status),
+    filters: trialJobStatus.map(status => ({ text: status, value: status })),
+    onFilter: (value, record) => (record.status === value)
+};
+
+const IntermediateCountColumnConfig: ColumnProps<TableRecord> = {
+    title: 'Intermediate result',
+    dataIndex: 'intermediateCount',
+    sorter: (a, b) => a.intermediateCount - b.intermediateCount,
+    render: (text, record): React.ReactNode => (
+        <span>{`#${record.intermediateCount}`}</span>
+    )
+};
+
 class TableList extends React.Component<TableListProps, TableListState> {
 
     public intervalTrialLog = 10;
@@ -80,7 +169,7 @@ class TableList extends React.Component<TableListProps, TableListState> {
         };
     }
 
-    showIntermediateModal = async (id: string) => {
+    showIntermediateModal = async (id: string): Promise<void> => {
         const res = await axios.get(`${MANAGER_IP}/metric-data/${id}`);
         if (res.status === 200) {
             const intermediateArr: number[] = [];
@@ -113,7 +202,7 @@ class TableList extends React.Component<TableListProps, TableListState> {
 
     // intermediate button click -> intermediate graph for each trial
     // support intermediate is dict
-    selectOtherKeys = (value: string) => {
+    selectOtherKeys = (value: string): void => {
 
         const isShowDefault: boolean = value === 'default' ? true : false;
         const { intermediateData, intermediateId } = this.state;
@@ -143,20 +232,20 @@ class TableList extends React.Component<TableListProps, TableListState> {
         });
     }
 
-    hideIntermediateModal = () => {
+    hideIntermediateModal = (): void => {
         this.setState({
             modalVisible: false
         });
     }
 
-    hideShowColumnModal = () => {
+    hideShowColumnModal = (): void => {
         this.setState({
             isShowColumn: false
         });
     }
 
     // click add column btn, just show the modal of addcolumn
-    addColumn = () => {
+    addColumn = (): void => {
         // show user select check button
         this.setState({
             isShowColumn: true
@@ -164,7 +253,7 @@ class TableList extends React.Component<TableListProps, TableListState> {
     }
 
     // checkbox for coloumn
-    selectedColumn = (checkedValues: Array<string>) => {
+    selectedColumn = (checkedValues: Array<string>): void => {
         // 9: because have nine common column, 
         // [Intermediate count, Start Time, End Time] is hidden by default
         let count = 9;
@@ -216,17 +305,17 @@ class TableList extends React.Component<TableListProps, TableListState> {
         this.props.changeColumn(wantResult);
     }
 
-    openRow = (record: TableRecord) => {
+    openRow = (record: TableRecord): any => {
         return (
             <OpenRow trialId={record.id} />
         );
     }
 
-    fillSelectedRowsTostate = (selected: number[] | string[], selectedRows: Array<TableRecord>) => {
+    fillSelectedRowsTostate = (selected: number[] | string[], selectedRows: Array<TableRecord>): void => {
         this.setState({ selectRows: selectedRows, selectedRowKeys: selected });
     }
     // open Compare-modal
-    compareBtn = () => {
+    compareBtn = (): void => {
 
         const { selectRows } = this.state;
         if (selectRows.length === 0) {
@@ -236,26 +325,26 @@ class TableList extends React.Component<TableListProps, TableListState> {
         }
     }
     // close Compare-modal
-    hideCompareModal = () => {
+    hideCompareModal = (): void => {
         // close modal. clear select rows data, clear selected track
         this.setState({ isShowCompareModal: false, selectedRowKeys: [], selectRows: [] });
     }
 
     // open customized trial modal
-    setCustomizedTrial = (trialId: string) => {
+    setCustomizedTrial = (trialId: string): void => {
         this.setState({
             isShowCustomizedModal: true,
             copyTrialId: trialId
         });
     }
 
-    closeCustomizedTrial = () => {
+    closeCustomizedTrial = (): void => {
         this.setState({
             isShowCustomizedModal: false,
             copyTrialId: ''
         });
     }
-    render() {
+    render(): React.ReactNode {
         const { pageSize, columnList } = this.props;
         const tableSource: Array<TableRecord> = JSON.parse(JSON.stringify(this.props.tableSource));
         const { intermediateOption, modalVisible, isShowColumn,
@@ -264,7 +353,7 @@ class TableList extends React.Component<TableListProps, TableListState> {
         } = this.state;
         const rowSelection = {
             selectedRowKeys: selectedRowKeys,
-            onChange: (selected: string[] | number[], selectedRows: Array<TableRecord>) => {
+            onChange: (selected: string[] | number[], selectedRows: Array<TableRecord>): void => {
                 this.fillSelectedRowsTostate(selected, selectedRows);
             }
         };
@@ -341,7 +430,7 @@ class TableList extends React.Component<TableListProps, TableListState> {
                         dataIndex: 'operation',
                         key: 'operation',
                         render: (text: string, record: TableRecord) => {
-                            let trialStatus = record.status;
+                            const trialStatus = record.status;
                             const flag: boolean = (trialStatus === 'RUNNING') ? false : true;
                             return (
                                 <Row id="detail-button">
@@ -407,15 +496,15 @@ class TableList extends React.Component<TableListProps, TableListState> {
                     break;
                 case (cc):
                     // remove SEARCH_SPACE title
-                    const realItem = item.replace(' (search space)', '');
+                    // const realItem = item.replace(' (search space)', '');
                     showColumn.push({
-                        title: realItem,
+                        title: item.replace(' (search space)', ''),
                         dataIndex: item,
                         key: item,
                         render: (text: string, record: TableRecord) => {
                             const eachTrial = TRIALS.getTrial(record.id);
                             return (
-                                <span>{eachTrial.description.parameters[realItem]}</span>
+                                <span>{eachTrial.description.parameters[item.replace(' (search space)', '')]}</span>
                             );
                         },
                     });
@@ -430,7 +519,7 @@ class TableList extends React.Component<TableListProps, TableListState> {
             <Row className="tableList">
                 <div id="tableList">
                     <Table
-                        ref={(table: Table<TableRecord> | null) => this.tables = table}
+                        ref={(table: Table<TableRecord> | null): any => this.tables = table}
                         columns={showColumn}
                         rowSelection={rowSelection}
                         expandedRowRender={this.openRow}
@@ -509,95 +598,4 @@ class TableList extends React.Component<TableListProps, TableListState> {
     }
 }
 
-const SequenceIdColumnConfig: ColumnProps<TableRecord> = {
-    title: 'Trial No.',
-    dataIndex: 'sequenceId',
-    className: 'tableHead',
-    sorter: (a, b) => a.sequenceId - b.sequenceId
-};
-
-const IdColumnConfig: ColumnProps<TableRecord> = {
-    title: 'ID',
-    dataIndex: 'id',
-    className: 'tableHead leftTitle',
-    sorter: (a, b) => a.id.localeCompare(b.id),
-    render: (text, record) => (
-        <div>{record.id}</div>
-    )
-};
-
-const StartTimeColumnConfig: ColumnProps<TableRecord> = {
-    title: 'Start Time',
-    dataIndex: 'startTime',
-    sorter: (a, b) => a.startTime - b.startTime,
-    render: (text, record) => (
-        <span>{formatTimestamp(record.startTime)}</span>
-    )
-};
-
-const EndTimeColumnConfig: ColumnProps<TableRecord> = {
-    title: 'End Time',
-    dataIndex: 'endTime',
-    sorter: (a, b, sortOrder) => {
-        if (a.endTime === undefined) {
-            return sortOrder === 'ascend' ? 1 : -1;
-        } else if (b.endTime === undefined) {
-            return sortOrder === 'ascend' ? -1 : 1;
-        } else {
-            return a.endTime - b.endTime;
-        }
-    },
-    render: (text, record) => (
-        <span>{formatTimestamp(record.endTime, '--')}</span>
-    )
-};
-
-const DurationColumnConfig: ColumnProps<TableRecord> = {
-    title: 'Duration',
-    dataIndex: 'duration',
-    sorter: (a, b) => a.duration - b.duration,
-    render: (text, record) => (
-        <span className="durationsty">{convertDuration(record.duration)}</span>
-    )
-};
-
-const StatusColumnConfig: ColumnProps<TableRecord> = {
-    title: 'Status',
-    dataIndex: 'status',
-    className: 'tableStatus',
-    render: (text, record) => (
-        <span className={`${record.status} commonStyle`}>{record.status}</span>
-    ),
-    sorter: (a, b) => a.status.localeCompare(b.status),
-    filters: trialJobStatus.map(status => ({ text: status, value: status })),
-    onFilter: (value, record) => (record.status === value)
-};
-
-const IntermediateCountColumnConfig: ColumnProps<TableRecord> = {
-    title: 'Intermediate result',
-    dataIndex: 'intermediateCount',
-    sorter: (a, b) => a.intermediateCount - b.intermediateCount,
-    render: (text, record) => (
-        <span>{`#${record.intermediateCount}`}</span>
-    )
-};
-
-const AccuracyColumnConfig: ColumnProps<TableRecord> = {
-    title: 'Default metric',
-    className: 'leftTitle',
-    dataIndex: 'accuracy',
-    sorter: (a, b, sortOrder) => {
-        if (a.latestAccuracy === undefined) {
-            return sortOrder === 'ascend' ? 1 : -1;
-        } else if (b.latestAccuracy === undefined) {
-            return sortOrder === 'ascend' ? -1 : 1;
-        } else {
-            return a.latestAccuracy - b.latestAccuracy;
-        }
-    },
-    render: (text, record) => (
-        <div>{record.formattedLatestAccuracy}</div>
-    )
-};
-
 export default TableList;

src/webui/src/registerServiceWorker.ts

@@ -18,14 +18,14 @@ const isLocalhost = Boolean(
   )
 );
 
-function registerValidSW(swUrl: string) {
+function registerValidSW(swUrl: string): void {
   navigator.serviceWorker
     .register(swUrl)
     .then(registration => {
-      registration.onupdatefound = () => {
+      registration.onupdatefound = (): void => {
         const installingWorker = registration.installing;
         if (installingWorker) {
-          installingWorker.onstatechange = () => {
+          installingWorker.onstatechange = (): void => {
             if (installingWorker.state === 'installed') {
               if (navigator.serviceWorker.controller) {
                 // At this point, the old content will have been purged and
@@ -49,14 +49,14 @@ function registerValidSW(swUrl: string) {
     });
 }
 
-function checkValidServiceWorker(swUrl: string) {
+function checkValidServiceWorker(swUrl: string): void {
   // Check if the service worker can be found. If it can't reload the page.
   fetch(swUrl)
     .then(response => {
       // Ensure service worker exists, and that we really are getting a JS file.
       if (
         response.status === 404 ||
-        response.headers.get('content-type')!.indexOf('javascript') === -1
+        response.headers.get('content-type')!.indexOf('javascript') === -1// eslint-disable-line @typescript-eslint/no-non-null-assertion
       ) {
         // No service worker found. Probably a different app. Reload the page.
         navigator.serviceWorker.ready.then(registration => {
@@ -76,11 +76,11 @@ function checkValidServiceWorker(swUrl: string) {
     });
 }
 
-export default function register() {
+export default function register(): void {
   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
     // The URL constructor is available in all browsers that support SW.
     const publicUrl = new URL(
-      process.env.PUBLIC_URL!,
+      process.env.PUBLIC_URL!, // eslint-disable-line @typescript-eslint/no-non-null-assertion
       window.location.toString()
     );
     if (publicUrl.origin !== window.location.origin) {
@@ -104,7 +104,7 @@ export default function register() {
   }
 }
 
-export function unregister() {
+export function unregister(): void {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.ready.then(registration => {
       registration.unregister();

src/webui/src/static/function.ts

@@ -3,7 +3,7 @@ import { message } from 'antd';
 import { MANAGER_IP } from './const';
 import { MetricDataRecord, FinalType, TableObj } from './interface';
 
-const convertTime = (num: number) => {
+const convertTime = (num: number): string => {
     if (num <= 0) {
         return '0';
     }
@@ -17,7 +17,7 @@ const convertTime = (num: number) => {
 };
 
 // trial's duration, accurate to seconds for example 10min 30s
-const convertDuration = (num: number) => {
+const convertDuration = (num: number): string => {
     if (num < 1) {
         return '0s';
     }
@@ -39,7 +39,7 @@ const convertDuration = (num: number) => {
 
 // get final result value
 // draw Accuracy point graph
-const getFinalResult = (final?: MetricDataRecord[]) => {
+const getFinalResult = (final?: MetricDataRecord[]): number => {
     let acc;
     let showDefault = 0;
     if (final) {
@@ -58,7 +58,7 @@ const getFinalResult = (final?: MetricDataRecord[]) => {
 };
 
 // get final result value // acc obj
-const getFinal = (final?: MetricDataRecord[]) => {
+const getFinal = (final?: MetricDataRecord[]): any => {
     let showDefault: FinalType;
     if (final) {
         showDefault = JSON.parse(final[final.length - 1].data);
@@ -72,7 +72,7 @@ const getFinal = (final?: MetricDataRecord[]) => {
 };
 
 // detail page table intermediate button
-const intermediateGraphOption = (intermediateArr: number[], id: string) => {
+const intermediateGraphOption = (intermediateArr: number[], id: string): any => {
     const sequence: number[] = [];
     const lengthInter = intermediateArr.length;
     for (let i = 1; i <= lengthInter; i++) {
@@ -108,7 +108,7 @@ const intermediateGraphOption = (intermediateArr: number[], id: string) => {
 };
 
 // kill job
-const killJob = (key: number, id: string, status: string, updateList?: Function) => {
+const killJob = (key: number, id: string, status: string, updateList?: Function): void => {
     axios(`${MANAGER_IP}/trial-jobs/${id}`, {
         method: 'DELETE',
         headers: {
@@ -138,16 +138,16 @@ const killJob = (key: number, id: string, status: string, updateList?: Function)
         });
 };
 
-const filterByStatus = (item: TableObj) => {
+const filterByStatus = (item: TableObj): any => {
     return item.status === 'SUCCEEDED';
 };
 
 // a waittiong trial may havn't start time 
-const filterDuration = (item: TableObj) => {
+const filterDuration = (item: TableObj): any => {
     return item.status !== 'WAITING';
 };
 
-const downFile = (content: string, fileName: string) => {
+const downFile = (content: string, fileName: string): void => {
     const aTag = document.createElement('a');
     const isEdge = navigator.userAgent.indexOf('Edge') !== -1 ? true : false;
     const file = new Blob([content], { type: 'application/json' });

src/webui/src/static/interface.ts

@@ -42,7 +42,7 @@ interface ErrorParameter {
 interface Parameters {
     parameters: ErrorParameter;
     logPath?: string;
-    intermediate: Array<number>;
+    intermediate: number[];
     multiProgress?: number;
 }
 

src/webui/src/static/model/experiment.ts

@@ -41,6 +41,7 @@ class Experiment {
         if (!this.profileField) {
             throw Error('Experiment profile not initialized');
         }
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.profileField!;
     }
 
@@ -73,6 +74,7 @@ class Experiment {
         if (!this.statusField) {
             throw Error('Experiment status not initialized');
         }
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.statusField!.status;
     }
 
@@ -80,6 +82,7 @@ class Experiment {
         if (!this.statusField) {
             throw Error('Experiment status not initialized');
         }
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.statusField!.errors[0] || '';
     }
 }

src/webui/src/static/model/trial.ts

@@ -19,10 +19,12 @@ class Trial implements TableObj {
         if (!this.sortable || !otherTrial.sortable) {
             return undefined;
         }
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.finalAcc! - otherTrial.finalAcc!;
     }
 
     get info(): TrialJobInfo {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.infoField!;
     }
 
@@ -30,6 +32,7 @@ class Trial implements TableObj {
         const ret: MetricDataRecord[] = [ ];
         for (let i = 0; i < this.intermediates.length; i++) {
             if (this.intermediates[i]) {
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                 ret.push(this.intermediates[i]!);
             } else {
                 break;
@@ -66,12 +69,14 @@ class Trial implements TableObj {
 
     get tableRecord(): TableRecord {
         const endTime = this.info.endTime || new Date().getTime();
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         const duration = (endTime - this.info.startTime!) / 1000;
 
         return {
             key: this.info.id,
             sequenceId: this.info.sequenceId,
             id: this.info.id,
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
             startTime: this.info.startTime!,
             endTime: this.info.endTime,
             duration,
@@ -97,6 +102,7 @@ class Trial implements TableObj {
 
     get duration(): number {
         const endTime = this.info.endTime || new Date().getTime();
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return (endTime - this.info.startTime!) / 1000;
     }
 
@@ -203,6 +209,7 @@ class Trial implements TableObj {
         } else if (this.intermediates.length === 0) {
             return '--';
         } else {
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
             const latest = this.intermediates[this.intermediates.length - 1]!;
             return `${formatAccuracy(metricAccuracy(latest))} (LATEST)`;
         }

src/webui/src/static/model/trialmanager.ts

@@ -7,6 +7,7 @@ function groupMetricsByTrial(metrics: MetricDataRecord[]): Map<string, MetricDat
     const ret = new Map<string, MetricDataRecord[]>();
     for (const metric of metrics) {
         if (ret.has(metric.trialJobId)) {
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
             ret.get(metric.trialJobId)!.push(metric);
         } else {
             ret.set(metric.trialJobId, [ metric ]);
@@ -35,14 +36,17 @@ class TrialManager {
     }
 
     public getTrial(trialId: string): Trial {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.trials.get(trialId)!;
     }
 
     public getTrials(trialIds: string[]): Trial[] {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return trialIds.map(trialId => this.trials.get(trialId)!);
     }
 
     public table(trialIds: string[]): TableRecord[] {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return trialIds.map(trialId => this.trials.get(trialId)!.tableRecord);
     }
 
@@ -61,6 +65,7 @@ class TrialManager {
     }
 
     public sort(): Trial[] {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         return this.filter(trial => trial.sortable).sort((trial1, trial2) => trial1.compareAccuracy(trial2)!);
     }
 
@@ -77,6 +82,7 @@ class TrialManager {
         ]);
         for (const trial of this.trials.values()) {
             if (trial.initialized()) {
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                 cnt.set(trial.info.status, cnt.get(trial.info.status)! + 1);
             }
         }
@@ -89,6 +95,7 @@ class TrialManager {
         if (response.status === 200) {
             for (const info of response.data as TrialJobInfo[]) {
                 if (this.trials.has(info.id)) {
+                    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                     updated = this.trials.get(info.id)!.updateTrialJobInfo(info) || updated;
                 } else {
                     this.trials.set(info.id, new Trial(info, undefined));
@@ -141,6 +148,7 @@ class TrialManager {
         let updated = false;
         for (const [ trialId, metrics ] of groupMetricsByTrial(allMetrics).entries()) {
             if (this.trials.has(trialId)) {
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                 const trial = this.trials.get(trialId)!;
                 updated = (latestOnly ? trial.updateLatestMetrics(metrics) : trial.updateMetrics(metrics)) || updated;
             } else {