Skip to content

Commit

Permalink
Refactoring and polishing
Browse files Browse the repository at this point in the history
  • Loading branch information
@lahmatiy
lahmatiy committed Oct 18, 2023
1 parent 903ed5a commit 117c853
Show file tree
Hide file tree
Showing 3 changed files with 94 additions and 94 deletions.
2 changes: 2 additions & 0 deletions src/pages/report/editor-query.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -243,6 +243,8 @@
}
.page-report > .report-editor .query-editor > .discovery-editor .query-input-details {
grid-area: details;
max-height: max(30vh, 150px);
overflow: auto;
}
.page-report > .report-editor .query-editor > .discovery-editor .query-input-details > .view-struct {
margin: 0;
Expand Down
177 changes: 83 additions & 94 deletions src/pages/report/editor-query.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -229,68 +229,59 @@ export default function(host, updateParams) {
});
host.view.render(queryGraphButtonsEl, [
{ view: 'button', className: 'subquery', tooltip: hintTooltip('Create a new query for a result of current one'), onClick() {
const nextGraph = JSON.parse(JSON.stringify(lastGraph));
const nextGraphPath = getPathInGraph(nextGraph, nextGraph.current);
const last = nextGraphPath[nextGraphPath.length - 1];

if (!Array.isArray(last.children)) {
last.children = [];
}
mutateGraph(({ nextGraph, last }) => {
if (!Array.isArray(last.children)) {
last.children = [];
}

last.query = currentQuery;
nextGraph.current.push(last.children.push({}) - 1);
last.query = currentQuery;
nextGraph.current.push(last.children.push({}) - 1);

updateParams({
query: '',
graph: nextGraph
return {
query: '',
graph: nextGraph
};
});
} },
{ view: 'button', className: 'stash', tooltip: hintTooltip('Stash current query and create a new empty query for current parent'), onClick() {
const nextGraph = JSON.parse(JSON.stringify(lastGraph));
const nextGraphPath = getPathInGraph(nextGraph, nextGraph.current);
const last = nextGraphPath[nextGraphPath.length - 1];
const preLast = nextGraphPath[nextGraphPath.length - 2];

last.query = currentQuery;
nextGraph.current[nextGraph.current.length - 1] = preLast.children.push({}) - 1;
mutateGraph(({ nextGraph, last, preLast }) => {
last.query = currentQuery;
nextGraph.current[nextGraph.current.length - 1] = preLast.children.push({}) - 1;

updateParams({
query: '',
graph: nextGraph
return {
query: '',
graph: nextGraph
};
});
} },
{ view: 'button', className: 'clone', tooltip: hintTooltip('Clone current query'), onClick() {
const nextGraph = JSON.parse(JSON.stringify(lastGraph));
const nextGraphPath = getPathInGraph(nextGraph, nextGraph.current);
const last = nextGraphPath[nextGraphPath.length - 1];
const preLast = nextGraphPath[nextGraphPath.length - 2];
mutateGraph(({ nextGraph, last, preLast }) => {
last.query = currentQuery;
nextGraph.current[nextGraph.current.length - 1] = preLast.children.push({}) - 1;

last.query = currentQuery;
nextGraph.current[nextGraph.current.length - 1] = preLast.children.push({}) - 1;

updateParams({
graph: nextGraph
return {
graph: nextGraph
};
});
} },
{ view: 'button', className: 'delete', tooltip: hintTooltip('Delete current query and all the descendants'), onClick() {
const nextGraph = JSON.parse(JSON.stringify(lastGraph));
const nextGraphPath = getPathInGraph(nextGraph, nextGraph.current);
const last = nextGraphPath[nextGraphPath.length - 1];
const preLast = nextGraphPath[nextGraphPath.length - 2];
const index = preLast.children.indexOf(last);

preLast.children.splice(index, 1);
if (preLast.children.length === 0) {
preLast.children = undefined;
}
nextGraph.current.pop();
if (nextGraph.current.length === 0) {
nextGraph.current.push(Math.max(0, Math.min(index - 1, (nextGraph.children?.length || 0) - 1)));
}
mutateGraph(({ nextGraph, last, preLast }) => {
const index = preLast.children.indexOf(last);

updateParams({
query: preLast.query,
graph: nextGraph
preLast.children.splice(index, 1);
if (preLast.children.length === 0) {
preLast.children = undefined;
}

nextGraph.current.pop();
if (nextGraph.current.length === 0) {
nextGraph.current.push(Math.max(0, Math.min(index - 1, (nextGraph.children?.length || 0) - 1)));
}

return {
query: preLast.query,
graph: nextGraph
};
});
} }
]);
Expand Down Expand Up @@ -327,55 +318,54 @@ export default function(host, updateParams) {
const idx = [...queryPathEl.children].indexOf(e.target.closest('.query-path > *'));

if (idx !== -1) {
const nextGraph = JSON.parse(JSON.stringify(lastGraph));
const currentPath = getPathInGraph(nextGraph, nextGraph.current);
mutateGraph(({ nextGraph, currentPath, last }) => {
last.query = currentQuery;

currentPath[currentPath.length - 1].query = currentQuery;
nextGraph.current = nextGraph.current.slice(0, idx + 1);
nextGraph.current = nextGraph.current.slice(0, idx + 1);

updateParams({
query: currentPath[idx + 1].query,
graph: nextGraph
updateParams({
query: currentPath[idx + 1].query,
graph: nextGraph
});
});
}
});
queryGraphEl.addEventListener('click', (e) => {
const path = e.target.dataset.path;
if (typeof path === 'string' && path !== lastGraph.current.join(' ')) {
const prevPath = lastGraph.current;
const nextPath = path.split(' ').map(x => parseInt(x, 10));
const nextGraph = JSON.parse(JSON.stringify(lastGraph));

const prevGraphPath = getPathInGraph(nextGraph, prevPath);
const nextGraphPath = getPathInGraph(nextGraph, nextPath);
const prevGraphPathTarget = prevGraphPath[prevGraphPath.length - 1];
const nextGraphPathTarget = nextGraphPath[nextGraphPath.length - 1];
// console.log({
// prevPath,
// nextPath,
// prevGraphPath,
// nextGraphPath,
// prev: prevGraphPathTarget,
// next: nextGraphPathTarget
// });

const nextQuery = nextGraphPathTarget.query || '';
prevGraphPathTarget.query = currentQuery;
nextGraphPathTarget.query = undefined;
nextGraph.current = nextPath;

// console.log(JSON.stringify({
// query: nextQuery,
// graph: nextGraph
// }, null, 4));

updateParams({
query: nextQuery,
graph: nextGraph
mutateGraph(({ nextGraph, last }) => {
const nextPath = path.split(' ').map(Number);
const nextGraphPath = getPathInGraph(nextGraph, nextPath);
const nextTarget = nextGraphPath[nextGraphPath.length - 1];

const nextQuery = nextTarget.query || '';
nextTarget.query = undefined;
last.query = currentQuery;
nextGraph.current = nextPath;

return {
query: nextQuery,
graph: nextGraph
};
});
}
});

function mutateGraph(fn) {
const nextGraph = JSON.parse(JSON.stringify(lastGraph));
const currentPath = getPathInGraph(nextGraph, nextGraph.current);
const last = currentPath[currentPath.length - 1];
const preLast = currentPath[currentPath.length - 2];

const params = fn({ nextGraph, currentPath, last, preLast });

updateParams(params);
setTimeout(() => {
queryEditor.focus();
queryEditor.cm.setCursor(queryEditor.cm.lineCount(), 0);
}, 0);
}

function scheduleCompute(fn) {
const id = setTimeout(fn, 16);
return () => clearTimeout(id);
Expand Down Expand Up @@ -435,8 +425,7 @@ export default function(host, updateParams) {
host.view.render(
queryEditorInputDetailsEl,
[
{ view: 'struct', expanded: 1 },
{ view: 'signature' }
{ view: 'struct', expanded: 1 }
],
expandQueryInputData
);
Expand Down Expand Up @@ -481,22 +470,22 @@ export default function(host, updateParams) {

switch (computation.state) {
case 'canceled': {
queryEditor.setValue(computation.query);
renderOutputExpander(computation, 'Result', 'Not available');
break;
}
case 'awaiting': {
queryEditor.setValue(computation.query);
renderOutputExpander(computation, 'Avaiting...');
break;
}
case 'computing': {
queryEditor.setValue(computation.query, computation.data, computation.context);
renderOutputExpander(computation, 'Computing...');
break;
}
case 'successful': {
// update suggestions
queryEditor.setValue(computation.query, computation.data, computation.context);

// update computed
renderOutputExpander(computation, 'Result', [
valueDescriptor(computation.computed),
` in ${parseInt(computation.duration, 10)}ms`
Expand Down Expand Up @@ -525,7 +514,10 @@ export default function(host, updateParams) {
);
}

renderOutputExpander(computation, 'Error', error.message.replace(/^Parse error.+/s, 'Parse error ...'));
queryEditor.setValue(computation.query, computation.data, computation.context);
renderOutputExpander(computation, 'Error', [
error.message.replace(/^Parse error.+/s, 'Parse error ...')
]);

break;
}
Expand Down Expand Up @@ -739,9 +731,6 @@ export default function(host, updateParams) {

lastGraph = pageGraph;
lastContext = queryContext;

// update editor
queryEditor.setValue(pageQuery);
currentQuery = pageQuery;

// perform queries
Expand Down
9 changes: 9 additions & 0 deletions src/views/editor/editors.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -144,9 +144,18 @@ class QueryEditor extends Editor {
this.el.append(this.inputPanelEl, this.outputPanelEl);
}
setValue(value, data, context) {
const valueChanged = typeof value === 'string' && this.getValue() !== value;
const dataChanged = this.queryData !== data || this.queryContext !== context;

this.queryData = data;
this.queryContext = context;
super.setValue(value);

if (dataChanged && !valueChanged) {
if (this.cm.state.completionEnabled && this.cm.state.focused) {
this.cm.showHint();
}
}
}
}

Expand Down

0 comments on commit 117c853

Please sign in to comment.