Skip to content

Commit

Permalink
Feature #54394. Ml data upload functionality has been implemented.
Browse files Browse the repository at this point in the history
(cherry picked from commit e00e7ab4f9ea6e95d8a339f61b58e7663ad62848)

Change-Id: I8f06b6fff29aebbb6188c28ebf2790918dcdd7fc
  • Loading branch information
WbyNghbr authored and Nikita-Smirnov-Exactpro committed May 14, 2019
1 parent e8bac1c commit 22e1deb
Show file tree
Hide file tree
Showing 24 changed files with 527 additions and 70 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
30 changes: 28 additions & 2 deletions FrontEnd/Sailfish-JS-report/src/actions/actionCreators.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
* limitations under the License.
******************************************************************************/

import TestCase from "../models/TestCase";
import {
SetTestCaseStateAction,
StateActionTypes,
Expand All @@ -34,13 +33,20 @@ import {
RejectedMessageSelectStateAction,
ActionSelectByIdStateAction,
SetAdminMessageEnabledStateAction,
VerificationSelectStateAction
VerificationSelectStateAction,
SetMlTokenStateAction,
SetSubmittedMlDataStateAction,
AddSubmittedMlDataStateAction,
RemoveSubmittedMlDataStateAction
} from "./stateActions";

import TestCase from "../models/TestCase";
import Action from '../models/Action';
import { StatusType } from "../models/Status";
import Report from "../models/Report";
import { Panel } from "../helpers/Panel";
import Message from '../models/Message';
import { SubmittedData } from "../models/MlServiceResponse";

export const setReport = (report: Report): SetReportStateAction => ({
type: StateActionTypes.SET_REPORT,
Expand Down Expand Up @@ -128,4 +134,24 @@ export const setLeftPane = (pane: Panel): SetLeftPaneStateActions => ({
export const setRightPane = (pane: Panel): SetRightPaneStateAction => ({
type: StateActionTypes.SET_RIGHT_PANE,
pane: pane
})

export const setMlToken = (token: string): SetMlTokenStateAction => ({
type: StateActionTypes.SET_ML_TOKEN,
token: token
})

export const setSubmittedMlData = (data: SubmittedData[]): SetSubmittedMlDataStateAction => ({
type: StateActionTypes.SET_SUBMITTED_ML_DATA,
data: data
})

export const addSubmittedMlData = (data: SubmittedData): AddSubmittedMlDataStateAction => ({
type: StateActionTypes.ADD_SUBMITTED_ML_DATA,
data: data
})

export const removeSubmittedMlData = (data: SubmittedData): RemoveSubmittedMlDataStateAction => ({
type: StateActionTypes.REMOVE_SUBMITTED_ML_DATA,
data: data
})
37 changes: 33 additions & 4 deletions FrontEnd/Sailfish-JS-report/src/actions/stateActions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import { StatusType } from "../models/Status";
import Report from '../models/Report';
import { Panel } from "../helpers/Panel";
import Message from "../models/Message";

import { SubmittedData } from "../models/MlServiceResponse";
export enum StateActionTypes {
SET_REPORT = 'SET_REPORT',
NEXT_TEST_CASE = 'NEXT_TEST_CASE',
Expand All @@ -39,7 +39,11 @@ export enum StateActionTypes {
SWITCH_FIELDS_FILTER = 'SWITCH_FIELDS_FILTER',
SWITCH_SPLIT_MODE = 'SWITCH_SPLIT_MODE',
SET_LEFT_PANE = 'SET_LEFT_PANE',
SET_RIGHT_PANE = 'SET_RIGHT_PANE'
SET_RIGHT_PANE = 'SET_RIGHT_PANE',
SET_ML_TOKEN = 'SET_ML_TOKEN',
SET_SUBMITTED_ML_DATA = "SET_SUBMITTED_ML_DATA",
ADD_SUBMITTED_ML_DATA = "ADD_SUBMITTED_ML_DATA",
REMOVE_SUBMITTED_ML_DATA = "REMOVE_SUBMITTED_ML_DATA"
}

export interface SetReportStateAction {
Expand Down Expand Up @@ -130,7 +134,28 @@ export interface SetRightPaneStateAction {
pane: Panel;
}

export type StateActionType = SetReportStateAction |
export interface SetMlTokenStateAction {
type: StateActionTypes.SET_ML_TOKEN;
token: string;
}

export interface SetSubmittedMlDataStateAction {
type: StateActionTypes.SET_SUBMITTED_ML_DATA;
data: SubmittedData[];
}

export interface AddSubmittedMlDataStateAction {
type: StateActionTypes.ADD_SUBMITTED_ML_DATA;
data: SubmittedData;
}

export interface RemoveSubmittedMlDataStateAction {
type: StateActionTypes.REMOVE_SUBMITTED_ML_DATA;
data: SubmittedData;
}

export type StateActionType =
SetReportStateAction |
SetTestCaseStateAction |
ResetTestCaseStateAction |
ActionSelectStateAction |
Expand All @@ -148,4 +173,8 @@ export type StateActionType = SetReportStateAction |
SwitchActionFilterStateAction |
SwitchFieldsFilterStateAction |
SetRightPaneStateAction |
SetLeftPaneStateActions;
SetLeftPaneStateActions |
SetMlTokenStateAction |
SetSubmittedMlDataStateAction |
AddSubmittedMlDataStateAction |
RemoveSubmittedMlDataStateAction
21 changes: 17 additions & 4 deletions FrontEnd/Sailfish-JS-report/src/components/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,25 +22,31 @@ import TestCase from "../models/TestCase";
import ReportLayout from '../components/ReportLayout';
import { connect } from 'preact-redux';
import AppState from "../state/models/AppState";
import { setTestCase, setReport, setTestCasePath, selectActionById, selectVerification } from "../actions/actionCreators";
import { setTestCase, setReport, setTestCasePath, selectActionById, selectVerification, setMlToken, setSubmittedMlData } from "../actions/actionCreators";
import {
getUrlSearchString,
ACTION_PARAM_KEY,
MESSAGE_PARAM_KEY,
TEST_CASE_PARAM_KEY
} from "../middleware/urlHandler";
import { fetchToken } from "../helpers/machineLearning";
import { SubmittedData } from "../models/MlServiceResponse"

const REPORT_FILE_PATH = 'index.html';

interface AppProps {
report: Report;
testCase: TestCase;
testCaseFilePath: string;
mlToken: string;
submittedMlData: SubmittedData[];
updateTestCase: (testCase: TestCase) => any;
updateTestCasePath: (testCasePath: string) => any;
selectAction: (actionId: number) => any;
selectMessage: (messageId: number) => any;
updateReport: (report: Report) => any;
setMlToken: (token: string) => any;
setSubmittedMlData: (data: SubmittedData[]) => any;
}

class AppBase extends Component<AppProps, {}> {
Expand Down Expand Up @@ -73,7 +79,10 @@ class AppBase extends Component<AppProps, {}> {
if (!this.searchParams) {
this.searchParams = new URLSearchParams(getUrlSearchString(top.window.location.href));
this.handleSharedUrl();
return;
}

if (!this.props.mlToken && this.props.report.reportProperties) {
fetchToken(this.props.report.reportProperties.workFolder, this.props.setMlToken, this.props.setSubmittedMlData)
}
}

Expand Down Expand Up @@ -152,13 +161,17 @@ export const App = connect(
(state: AppState) => ({
report: state.report.report,
testCase: state.selected.testCase,
testCaseFilePath: state.report.currentTestCasePath
testCaseFilePath: state.report.currentTestCasePath,
mlToken: state.machineLearning.token,
submittedMlData: state.machineLearning.submittedData
}),
dispatch => ({
updateTestCase: (testCase: TestCase) => dispatch(setTestCase(testCase)),
updateTestCasePath: (testCasePath: string) => dispatch(setTestCasePath(testCasePath)),
selectAction: (actionId: number) => dispatch(selectActionById(actionId)),
selectMessage: (messageId: number) => dispatch(selectVerification(messageId)),
updateReport: (report: Report) => dispatch(setReport(report))
updateReport: (report: Report) => dispatch(setReport(report)),
setMlToken: (token: string) => dispatch(setMlToken(token)),
setSubmittedMlData: (data: SubmittedData[]) => dispatch(setSubmittedMlData(data))
})
)(AppBase)
8 changes: 2 additions & 6 deletions FrontEnd/Sailfish-JS-report/src/components/MessageCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import { MessageRaw } from './MessageRaw';
import { getHashCode } from '../helpers/stringHash';
import { formatTime } from '../helpers/dateFormatter';
import { MessageCardActionChips } from './MessageCardActionChips';
import { MlUploadButton } from './MlUploadButton';
import '../styles/messages.scss';
import { createSelector, createBemElement } from '../helpers/styleCreators';
import { createBemBlock } from '../helpers/styleCreators';
Expand Down Expand Up @@ -124,12 +125,7 @@ export class MessageCard extends Component<MessageCardProps, MessageCardState> {
<div class="mc-header__to">
<p>{to}</p>
</div>
{/* DISABLED */}
<div class="mc-header__prediction"
title="Not implemented">
<div class="mc-header__prediction-icon"
onClick={() => alert("Not implemented...")} />
</div>
<MlUploadButton messageId={message.id}/>
</div>
<div class="message-card__body mc-body">
{
Expand Down
92 changes: 92 additions & 0 deletions FrontEnd/Sailfish-JS-report/src/components/MlUploadButton.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
/******************************************************************************
* Copyright 2009-2019 Exactpro (Exactpro Systems Limited)
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
******************************************************************************/

import { h, Component } from 'preact';
import '../styles/messages.scss';
import { SubmittedData } from '../models/MlServiceResponse'
import AppState from '../state/models/AppState';
import { setSubmittedMlData, addSubmittedMlData, removeSubmittedMlData } from "../actions/actionCreators";
import { connect } from 'preact-redux';
import { submitEntry, deleteEntry } from '../helpers/machineLearning';
import Action from "../models/Action";

interface MlUploadButtonProps {
messageId: number;
token: string;
submittedData: SubmittedData[];
selectedActionIds: number[];
actionMap: Map<number, Action>;
setSubmittedMlData: (data: SubmittedData[]) => any;
addSubmittedMlData: (data: SubmittedData) => any;
removeSubmittedMlData: (data: SubmittedData) => any;
}

export class MlUploadButtonBase extends Component<MlUploadButtonProps, {}> {
render({ submittedData, messageId, token, selectedActionIds, actionMap }: MlUploadButtonProps) {

let selectedActionId = selectedActionIds.length === 1 ? selectedActionIds[0] : null

let isAvailable = token !== null
&& selectedActionId !== null
&& actionMap.get(selectedActionId).status.status === "FAILED";

let isSubmitted = isAvailable && submittedData.some((entry) => {
return entry.messageId === messageId
&& entry.actionId === selectedActionId
});

// default one (message cannot be submitted or ml servie is unavailable)
let mlButton = <div class="mc-header__submit-icon inactive" />;

if (isAvailable) {
mlButton = isSubmitted

? <div class="mc-header__submit-icon submitted"
title="Revoke ML data"
onClick={(e) => {
deleteEntry(token, { messageId: messageId, actionId: selectedActionId }, this.props.removeSubmittedMlData);
e.cancelBubble = true;
}} />

: <div class="mc-header__submit-icon active"
title="Submit ML data"
onClick={(e) => {
submitEntry(token, { messageId: messageId, actionId: selectedActionId }, this.props.addSubmittedMlData);
e.cancelBubble = true;
}} />
}

return (
<div class="mc-header__submit" title="Unable to submit ML data">
{mlButton}
</div>
)
}
}

export const MlUploadButton = connect(
(state: AppState) => ({
token: state.machineLearning.token,
submittedData: state.machineLearning.submittedData,
selectedActionIds: state.selected.actionsId,
actionMap: state.selected.actionsMap
}),
(dispatch) => ({
setSubmittedMlData: (data: SubmittedData[]) => dispatch(setSubmittedMlData(data)),
addSubmittedMlData: (data: SubmittedData) => dispatch(addSubmittedMlData(data)),
removeSubmittedMlData: (data: SubmittedData) => dispatch(removeSubmittedMlData(data))
})
)(MlUploadButtonBase);
4 changes: 2 additions & 2 deletions FrontEnd/Sailfish-JS-report/src/components/ReportLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import { connect } from 'preact-redux';
import AppState from '../state/models/AppState';
import { setTestCasePath } from '../actions/actionCreators';
import { getSecondsPeriod, formatTime } from '../helpers/dateFormatter';
import { ReportMetadata } from '../models/ReportMetadata';
import { TestcaseMetadata } from '../models/TestcaseMetadata';
import "../styles/report.scss";
import { StatusType, statusValues } from '../models/Status';
import TestCaseCard from './TestCaseCard';
Expand Down Expand Up @@ -126,7 +126,7 @@ const ReportLayoutBase = ({ report, onTestCaseSelect }: ReportLayoutProps) => {
)
}

function renderStatusInfo(status: StatusType, metadata: ReportMetadata[]): JSX.Element {
function renderStatusInfo(status: StatusType, metadata: TestcaseMetadata[]): JSX.Element {
const testCasesCount = metadata.filter(metadata => metadata.status.status == status).length,
valueClassName = createSelector(
"report-summary__element-value",
Expand Down
6 changes: 3 additions & 3 deletions FrontEnd/Sailfish-JS-report/src/components/TestCaseCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,15 @@
******************************************************************************/

import { h } from 'preact';
import { ReportMetadata } from '../models/ReportMetadata';
import { TestcaseMetadata } from '../models/TestcaseMetadata';
import { formatTime, getSecondsPeriod } from '../helpers/dateFormatter';
import '../styles/report.scss';
import { createSelector } from '../helpers/styleCreators';

interface TestCaseCardProps {
metadata: ReportMetadata;
metadata: TestcaseMetadata;
index: number;
handleClick: (metadata: ReportMetadata) => any;
handleClick: (metadata: TestcaseMetadata) => any;
}

const TestCaseCard = ({ metadata, handleClick, index }: TestCaseCardProps) => {
Expand Down
4 changes: 2 additions & 2 deletions FrontEnd/Sailfish-JS-report/src/helpers/heatmapCreator.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
import Message from '../models/Message';
import { StatusType } from '../models/Status';
import Action from '../models/Action';
import { ReportMetadata } from '../models/ReportMetadata';
import { TestcaseMetadata } from '../models/TestcaseMetadata';

export function messagesHeatmap(messages: Message[], selectedMessages: number[], selectedStatus: StatusType): Map<number, StatusType> {
const heatmap = new Map<number, StatusType>();
Expand All @@ -42,7 +42,7 @@ export function actionsHeatmap(actions: Action[], selectedActionsId: number[]):
return heatmap;
}

export function testCasesHeatmap(testCases: ReportMetadata[]): Map<number, StatusType> {
export function testCasesHeatmap(testCases: TestcaseMetadata[]): Map<number, StatusType> {
const heatmap = new Map<number, StatusType>();

testCases.forEach((metadata, idx) => {
Expand Down
Loading

0 comments on commit 22e1deb

Please sign in to comment.