Skip to content

Commit

Permalink
Merge pull request #58 from TNO/bugfix-flag-annotations
Browse files Browse the repository at this point in the history 
Bugfix flag annotations
  • Loading branch information
@TuenDeBuis
TuenDeBuis authored Oct 3, 2023
2 parents 5f28719 + c8ce613 commit 65b4e86
Show file tree
Hide file tree
Showing 8 changed files with 95 additions and 50 deletions.
26 changes: 13 additions & 13 deletions src/viewer/App.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,6 @@ export default class App extends React.Component<Props, State> {
currentStructureMatch: [],
lastSelectedRow: undefined,
collapsibleRows: {},
// collapsibleRows: { 1: constructNewSegment(1, 10, 0), 2: constructNewSegment(2, 6, 1), 5: constructNewSegment(5, 15, 0), 7: constructNewSegment(7, 10, 1), 0 : constructNewSegment(0, 20, 2)},
};

this.onMessage = this.onMessage.bind(this);
Expand Down Expand Up @@ -197,29 +196,30 @@ export default class App extends React.Component<Props, State> {
}
}

handleDialogActions(newRules: Rule[], is_close: boolean) {
handleAnnotationDialog(newRules: Rule[], isClose: boolean) {
this.vscode.postMessage({ type: "saveRules", rules: newRules.map((r) => r.toJSON()) });
if (is_close === true)
if (isClose === true)
this.setState({
rules: newRules,
logFile: this.state.logFile.update(newRules),
logFile: this.state.logFile.updateRules(newRules),
showStatesDialog: false,
showFlagsDialog: false,
});
else this.setState({ rules: newRules });
}

handleSelectDialog(selectedCols: boolean[], selectedColsMini: boolean[], is_close: boolean) {
if (is_close === true) {
handleSelectDialog(selectedCols: boolean[], selectedColsMini: boolean[], isClose: boolean) {
if (isClose === true) {
this.setState({
selectedColumns: selectedCols,
selectedColumnsMini: selectedColsMini,
logFile: this.state.logFile.setSelectedColumns(selectedCols, selectedColsMini),
showSelectDialog: false,
});
}
}

handleStructureDialogActions(isClosing: boolean) {
handleStructureDialog(isClosing: boolean) {
if (isClosing === true) {
logHeaderColumnTypes = [];
this.handleStructureUpdate(isClosing);
Expand Down Expand Up @@ -612,7 +612,7 @@ export default class App extends React.Component<Props, State> {
>
<VSCodeButton
appearance="icon"
onClick={() => this.handleStructureDialogActions(false)}
onClick={() => this.handleStructureDialog(false)}
>
<i className="codicon codicon-three-bars" />
</VSCodeButton>
Expand Down Expand Up @@ -662,16 +662,16 @@ export default class App extends React.Component<Props, State> {
<StatesDialog
logFile={this.state.logFile}
initialRules={this.state.rules}
onClose={(newRules) => this.handleDialogActions(newRules, true)}
onReturn={(newRules) => this.handleDialogActions(newRules, false)}
onClose={(newRules) => this.handleAnnotationDialog(newRules, true)}
onReturn={(newRules) => this.handleAnnotationDialog(newRules, false)}
/>
)}
{this.state.showFlagsDialog && (
<FlagsDialog
logFile={this.state.logFile}
initialRules={this.state.rules}
onClose={(newRules) => this.handleDialogActions(newRules, true)}
onReturn={(newRules) => this.handleDialogActions(newRules, false)}
onClose={(newRules) => this.handleAnnotationDialog(newRules, true)}
onReturn={(newRules) => this.handleAnnotationDialog(newRules, false)}
/>
)}
{this.state.showSelectDialog && (
Expand All @@ -694,7 +694,7 @@ export default class App extends React.Component<Props, State> {
logSelectedRows={this.state.selectedLogRows}
currentStructureMatchIndex={this.state.currentStructureMatchIndex}
numberOfMatches={this.state.structureMatches.length}
onClose={() => this.handleStructureDialogActions(true)}
onClose={() => this.handleStructureDialog(true)}
onStructureUpdate={() => this.handleStructureUpdate(false)}
onMatchStructure={(expression) => this.handleStructureMatching(expression)}
onDefineSegment={(entryExpression, exitExpression) =>
Expand Down
44 changes: 39 additions & 5 deletions src/viewer/LogFile.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,11 +39,39 @@ export default class LogFile {
return logFile;
}

update(rules: Rule[]): LogFile {
this.updateHeaders(rules);
this.computeRulesValuesAndColors(rules);
this.setSelectedColumns(this.selectedColumns, this.selectedColumnsMini); //only show the selected columns after updating the rules
return this;
updateRules(rules: Rule[]): LogFile {
// Slower solution
const [updatedSelected, updatedSelectedMini] = this.updateSelectedColumns(rules)
const headers = LogFile.getHeaders(this.contentHeaders, rules);
const logFile = new LogFile(this.contentHeaders, headers, this.rows);
logFile.copyDefaultColumnColors(this.columnsColors);
logFile.computeRulesValuesAndColors(rules);
return logFile.setSelectedColumns(updatedSelected, updatedSelectedMini);

// Old solution
// this.updateSelectedColumns(rules);
// this.updateHeaders(rules);
// this.computeRulesValuesAndColors(rules);
// return this;
}

updateSelectedColumns(rules: Rule[]) {
const existingHeaders = this.headers.map(h => h.name);
const updatedSelected = this.selectedColumns.slice(0, this.contentHeaders.length);
const updatedSelectedMini = this.selectedColumnsMini.slice(0, this.contentHeaders.length);

for (let i = 0; i < rules.length; i++) {
const existingIndex = existingHeaders.indexOf(rules[i].column);
if (existingIndex > -1) {
updatedSelected.push(this.selectedColumns[existingIndex]);
updatedSelectedMini.push(this.selectedColumnsMini[existingIndex]);
}
else {
updatedSelected.push(true);
updatedSelectedMini.push(true);
}
}
return [updatedSelected, updatedSelectedMini]
}

setSelectedColumns(selected: boolean[], selectedMini: boolean[]) {
Expand Down Expand Up @@ -99,6 +127,12 @@ export default class LogFile {
}
}

private copyDefaultColumnColors(colours: string[][]) {
for (let i = 0; i < this.contentHeaders.length; i++) {
this.columnsColors[i] = colours[i];
}
}

private computeRulesValuesAndColors(rules: Rule[]) {
// Compute rules values
const startIndex = this.headers.length - rules.length;
Expand Down
4 changes: 2 additions & 2 deletions src/viewer/log/SelectColDialog.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,9 +94,9 @@ export default class SelectColDialog extends React.Component<Props, State> {
);
}

onDialogClick(is_close: boolean) {
onDialogClick(isClose: boolean) {
this.setState({ showDialog: false }, () => {
if (is_close === true) this.props.onClose(this.state.selectedCol, this.state.selectedColMini);
if (isClose === true) this.props.onClose(this.state.selectedCol, this.state.selectedColMini);
});
}

Expand Down
28 changes: 17 additions & 11 deletions src/viewer/rules/Dialogs/FlagsDialog.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,14 +95,14 @@ export default class FlagsDialog extends React.Component<Props, State> {
this.setState({ rules });
}

onDialogClick(is_close: boolean) {
onDialogClick(isClose: boolean) {
const ruleIndex = this.state.selectedRule;
if (ruleIndex !== -1) {
const rule = this.state.rules[ruleIndex].reset();
this.updateRule(rule, ruleIndex);
}
this.setState({ showEdit: false }, () => {
if (is_close === true) this.props.onClose(this.state.rules);
if (isClose === true) this.props.onClose(this.state.rules);
else this.props.onReturn(this.state.rules);
});
}
Expand All @@ -124,16 +124,16 @@ export default class FlagsDialog extends React.Component<Props, State> {
});
};

const onEditAction = (table_index: number) => {
const onEditAction = (tableIndex: number) => {
const index = this.state.rules.findIndex(
(x) => x === this.state.rules.filter((r) => r.ruleType === "Flag rule")[table_index],
(x) => x === this.state.rules.filter((r) => r.ruleType === "Flag rule")[tableIndex],
);
this.setState({ showEdit: true, selectedRule: index });
};

const onDeleteAction = (table_index: number) => {
const onDeleteAction = (tableIndex: number) => {
const index = this.state.rules.findIndex(
(x) => x === this.state.rules.filter((r) => r.ruleType === "Flag rule")[table_index],
(x) => x === this.state.rules.filter((r) => r.ruleType === "Flag rule")[tableIndex],
);
if (this.state.selectedRule === index) this.setState({ selectedRule: -1 });
this.setState({ rules: this.state.rules.filter((r, i) => i !== index) });
Expand Down Expand Up @@ -175,7 +175,6 @@ export default class FlagsDialog extends React.Component<Props, State> {
const userColumns = this.state.rules
.map((r, i) => r.column)
.filter((name) => name != rule.column);
const defaultRuleColumn = `FlagRule${ruleIndex + 1}`;
const keyWidth = "100px";
const textFieldWidth = "250px";
const rows = [
Expand All @@ -185,8 +184,9 @@ export default class FlagsDialog extends React.Component<Props, State> {
style={{ width: textFieldWidth, marginBottom: "2px" }}
value={rule.column}
key="Name"
placeholder="Required"
onInput={(e) =>
this.updateRule(rule.setColumn(e.target.value || defaultRuleColumn), ruleIndex)
this.updateRule(rule.setColumn(e.target.value), ruleIndex)
}
/>,
],
Expand All @@ -202,7 +202,7 @@ export default class FlagsDialog extends React.Component<Props, State> {
[
"Type",
<VSCodeDropdown
disabled={ruleAsFlag.flags.length > 0 ? true : false}
disabled={ruleAsFlag.flags.length > 0}
style={{ width: textFieldWidth, marginBottom: "2px" }}
value={flagType}
key="Type"
Expand Down Expand Up @@ -262,14 +262,20 @@ export default class FlagsDialog extends React.Component<Props, State> {
{this.state.showEdit && <div className="title-big">Edit Flag Annotation Column</div>}
{this.state.showEdit && (
<VSCodeButton
style={{ marginLeft: "auto" }}
appearance="icon"
style={{ marginLeft: "auto" }}
disabled={this.state.rules[this.state.selectedRule].column === ''}
onClick={() => this.onDialogClick(false)}
>
<i className="codicon codicon-arrow-left" />
</VSCodeButton>

)}
<VSCodeButton appearance="icon" onClick={() => this.onDialogClick(true)}>
<VSCodeButton
appearance="icon"
disabled={(this.state.selectedRule === -1) || ((this.state.selectedRule !== -1) && (this.state.rules[this.state.selectedRule].column !== '')) ? false : true}
onClick={() => this.onDialogClick(true)}
>
<i className="codicon codicon-close" />
</VSCodeButton>
</div>
Expand Down
25 changes: 15 additions & 10 deletions src/viewer/rules/Dialogs/StatesDialog.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,14 +82,14 @@ export default class StatesDialog extends React.Component<Props, State> {
this.setState({ rules });
}

onDialogClick(is_close: boolean) {
onDialogClick(isClose: boolean) {
const ruleIndex = this.state.selectedRule;
if (ruleIndex !== -1) {
const rule = this.state.rules[ruleIndex].reset();
this.updateRule(rule, ruleIndex);
}
this.setState({ showEdit: false }, () => {
if (is_close === true) this.props.onClose(this.state.rules);
if (isClose === true) this.props.onClose(this.state.rules);
else this.props.onReturn(this.state.rules);
});
}
Expand All @@ -111,16 +111,16 @@ export default class StatesDialog extends React.Component<Props, State> {
});
};

const onEditAction = (table_index: number) => {
const onEditAction = (tableIndex: number) => {
const index = this.state.rules.findIndex(
(x) => x === this.state.rules.filter((r) => r.ruleType === "State based rule")[table_index],
(x) => x === this.state.rules.filter((r) => r.ruleType === "State based rule")[tableIndex],
);
this.setState({ showEdit: true, selectedRule: index });
};

const onDeleteAction = (table_index: number) => {
const onDeleteAction = (tableIndex: number) => {
const index = this.state.rules.findIndex(
(x) => x === this.state.rules.filter((r) => r.ruleType === "State based rule")[table_index],
(x) => x === this.state.rules.filter((r) => r.ruleType === "State based rule")[tableIndex],
);
if (this.state.selectedRule === index) this.setState({ selectedRule: -1 });
this.setState({ rules: this.state.rules.filter((r, i) => i !== index) });
Expand Down Expand Up @@ -154,7 +154,6 @@ export default class StatesDialog extends React.Component<Props, State> {
const userColumns = this.state.rules
.map((r, i) => r.column)
.filter((name) => name != rule.column);
const defaultRuleColumn = `StateRule${ruleIndex + 1}`;
const keyWidth = "100px";
const textFieldWidth = "250px";
const rows = [
Expand All @@ -164,8 +163,9 @@ export default class StatesDialog extends React.Component<Props, State> {
style={{ width: textFieldWidth, marginBottom: "2px" }}
value={rule.column}
key="Name"
placeholder="Required"
onInput={(e) =>
this.updateRule(rule.setColumn(e.target.value || defaultRuleColumn), ruleIndex)
this.updateRule(rule.setColumn(e.target.value), ruleIndex)
}
/>,
],
Expand Down Expand Up @@ -219,14 +219,19 @@ export default class StatesDialog extends React.Component<Props, State> {
)}
{this.state.showEdit && (
<VSCodeButton
style={{ marginLeft: "auto" }}
appearance="icon"
style={{ marginLeft: "auto" }}
disabled={this.state.rules[this.state.selectedRule].column === ''}
onClick={() => this.onDialogClick(false)}
>
<i className="codicon codicon-arrow-left" />
</VSCodeButton>
)}
<VSCodeButton appearance="icon" onClick={() => this.onDialogClick(true)}>
<VSCodeButton
appearance="icon"
disabled={(this.state.selectedRule === -1) || ((this.state.selectedRule !== -1) && (this.state.rules[this.state.selectedRule].column !== '')) ? false : true}
onClick={() => this.onDialogClick(true)}
>
<i className="codicon codicon-close" />
</VSCodeButton>
</div>
Expand Down
6 changes: 3 additions & 3 deletions src/viewer/rules/StateBasedRule.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -132,16 +132,16 @@ export default class StateBasedRule extends Rule {
user_columns: string[],
logFile: LogFile,
) {
const editStateName = (state_index: number, value: string) => {
const editStateName = (stateIndex: number, value: string) => {
const states = [...this.ruleStates];
const previousName = states[state_index].name;
const previousName = states[stateIndex].name;
for (let i = 0; i < states.length; i++) {
for (let j = 0; j < states[i].transitions.length; j++) {
if (states[i].transitions[j].destination === previousName)
states[i].transitions[j].destination = value;
}
}
states[state_index] = { ...states[state_index], ["name"]: value };
states[stateIndex] = { ...states[stateIndex], ["name"]: value };
onEdit(this.setStates(states, this.initialStateIndex));
};

Expand Down
6 changes: 3 additions & 3 deletions src/viewer/rules/Tables/FlagTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,10 @@ interface Props {
hideHeader?: boolean;
noRowsText?: string;
highlightRow?: number | null;
onAddSubconditionAction?: (condition_index: number) => void;
onDeleteSubconditionAction?: (condition_index: number, sub_index: number) => void;
onAddSubconditionAction?: (conditionIndex: number) => void;
onDeleteSubconditionAction?: (conditionIndex: number, subconditionIndex: number) => void;
onAddConditionAction?: () => void;
onDeleteConditionAction?: (condition_index: number) => void;
onDeleteConditionAction?: (conditionIndex: number) => void;
}

const ACTIONS_WIDTH = "50px";
Expand Down
6 changes: 3 additions & 3 deletions src/viewer/rules/Tables/TransitionTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,10 @@ interface Props {
hideHeader?: boolean;
noRowsText?: string;
highlightRow?: number | null;
onAddConditionAction?: (transition_index: number) => void;
onDeleteConditionAction?: (transition_index: number, condition_index: number) => void;
onAddConditionAction?: (transitionIndex: number) => void;
onDeleteConditionAction?: (transitionIndex: number, conditionIndex: number) => void;
onAddTransitionAction?: () => void;
onDeleteTransitionAction?: (transition_index: number) => void;
onDeleteTransitionAction?: (transitionIndex: number) => void;
}

const ACTIONS_WIDTH = "50px";
Expand Down

0 comments on commit 65b4e86

Please sign in to comment.