feat(editor): mapping expressions from input table (#3864)

* implement tree render

* update styles

* implement slots

* fix recursive tree rendering

* make not recursive

* Revert "make not recursive"

f064fc14f4aa78573a8b978887076f5dfdb80d83

* enable dragging

* fix dragging name

* fix col bug

* update values and styles

* update style

* update colors

* update design

* add hover state

* add dragging behavior

* format file

* update pill text

* add depth field

* typo

* add avg height

* update event name

* update expr at distance

* add right margin always

* add space

* handle long values

* update types

* update messages

* update keys styling

* update spacing size

* fix hover bug

* update switch spacing

* fix wrap issue

* update spacing issues

* remove br

* update hoverable

* reduce event

* replace tree

* update prop name

* update tree story

* update tree

* refactor run data

* add unit tests

* add test for nodeclass

* remove number check

* bring back hook

* address review comments

* update margin

* update tests

* address max's feedback

* update tslint issues

* if empty, remove min width

* update spacing back
This commit is contained in:
Mutasem Aldmour
2022-08-24 14:47:42 +02:00
committed by GitHub
parent 7d74ddab29
commit ce076dca48
19 changed files with 736 additions and 126 deletions

View File

@@ -224,7 +224,7 @@
/>
</div>
<div v-else-if="hasNodeRun && displayMode === 'table' && tableData && tableData.columns && tableData.columns.length === 0 && binaryData.length > 0" :class="$style.center">
<div v-else-if="hasNodeRun && displayMode === 'table' && binaryData.length > 0 && jsonData.length === 1 && Object.keys(jsonData[0] || {}).length === 0" :class="$style.center">
<n8n-text>
{{ $locale.baseText('runData.switchToBinary.info') }}
<a @click="switchToBinary">
@@ -233,8 +233,8 @@
</n8n-text>
</div>
<div v-else-if="hasNodeRun && displayMode === 'table' && tableData" :class="$style.dataDisplay">
<RunDataTable :node="node" :tableData="tableData" :mappingEnabled="mappingEnabled" :distanceFromActive="distanceFromActive" :showMappingHint="showMappingHint" :runIndex="runIndex" :totalRuns="maxRunIndex" />
<div v-else-if="hasNodeRun && displayMode === 'table'" :class="$style.dataDisplay">
<RunDataTable :node="node" :inputData="inputData" :mappingEnabled="mappingEnabled" :distanceFromActive="distanceFromActive" :showMappingHint="showMappingHint" :runIndex="runIndex" :totalRuns="maxRunIndex" @mounted="$emit('tableMounted', $event)" />
</div>
<div v-else-if="hasNodeRun && displayMode === 'json'" :class="$style.jsonDisplay">
@@ -649,9 +649,6 @@ export default mixins(
jsonData (): IDataObject[] {
return this.convertToJson(this.inputData);
},
tableData (): ITableData | undefined {
return this.convertToTable(this.inputData);
},
binaryData (): IBinaryKeyData[] {
if (!this.node) {
return [];
@@ -1037,60 +1034,6 @@ export default mixins(
return returnData;
},
convertToTable (inputData: INodeExecutionData[]): ITableData | undefined {
const tableData: GenericValue[][] = [];
const tableColumns: string[] = [];
let leftEntryColumns: string[], entryRows: GenericValue[];
// Go over all entries
let entry: IDataObject;
inputData.forEach((data) => {
if (!data.hasOwnProperty('json')) {
return;
}
entry = data.json;
// Go over all keys of entry
entryRows = [];
leftEntryColumns = Object.keys(entry);
// Go over all the already existing column-keys
tableColumns.forEach((key) => {
if (entry.hasOwnProperty(key)) {
// Entry does have key so add its value
entryRows.push(entry[key]);
// Remove key so that we know that it got added
leftEntryColumns.splice(leftEntryColumns.indexOf(key), 1);
} else {
// Entry does not have key so add null
entryRows.push(null);
}
});
// Go over all the columns the entry has but did not exist yet
leftEntryColumns.forEach((key) => {
// Add the key for all runs in the future
tableColumns.push(key);
// Add the value
entryRows.push(entry[key]);
});
// Add the data of the entry
tableData.push(entryRows);
});
// Make sure that all entry-rows have the same length
tableData.forEach((entryRows) => {
if (tableColumns.length > entryRows.length) {
// Has to less entries so add the missing ones
entryRows.push.apply(entryRows, new Array(tableColumns.length - entryRows.length));
}
});
return {
columns: tableColumns,
data: tableData,
};
},
clearExecutionData () {
this.$store.commit('setWorkflowExecutionData', null);
this.updateNodesExecutionIssues();