From 7925a58fe60e5e417da1714492f6e40b33274568 Mon Sep 17 00:00:00 2001 From: Kirill Shumilov Date: Wed, 10 Mar 2021 18:54:59 +0300 Subject: [PATCH] feat(xod-client, xod-project, xod-arduino): make the new user-friendly table-log works fine, show correct labels and etc --- packages/xod-arduino/src/transpiler.js | 2 +- packages/xod-client/src/debugger/selectors.js | 11 ++- packages/xod-client/src/debugger/utils.js | 5 +- packages/xod-client/src/editor/actions.js | 10 +- .../src/project/components/Node.jsx | 3 +- .../components/nodeParts/TableLogNodeBody.jsx | 50 ++++++++++ .../xod-client/test/tableLogSources.spec.js | 99 +++++++++++-------- packages/xod-project/src/constants.js | 4 + 8 files changed, 136 insertions(+), 48 deletions(-) create mode 100644 packages/xod-client/src/project/components/nodeParts/TableLogNodeBody.jsx diff --git a/packages/xod-arduino/src/transpiler.js b/packages/xod-arduino/src/transpiler.js index 2743dc70..aff24dc8 100644 --- a/packages/xod-arduino/src/transpiler.js +++ b/packages/xod-arduino/src/transpiler.js @@ -829,7 +829,7 @@ export const getTableLogNodeIds = def( R.compose( R.map(R.prop('originalId')), R.filter( - R.compose(R.propEq('patchPath', XP.TABLELOG_NODETYPE), R.prop('patch')) + R.compose(R.propEq('patchPath', XP.TSV_LOG_NODETYPE), R.prop('patch')) ), R.prop('nodes') ) diff --git a/packages/xod-client/src/debugger/selectors.js b/packages/xod-client/src/debugger/selectors.js index 34ea4a13..87ad54b2 100644 --- a/packages/xod-client/src/debugger/selectors.js +++ b/packages/xod-client/src/debugger/selectors.js @@ -11,7 +11,7 @@ import { DEBUGGER_TAB_ID } from '../editor/constants'; import { SESSION_TYPE } from './constants'; import { createMemoizedSelector } from '../utils/selectorTools'; -import { getTableLogSourceLabels } from './utils'; +import { getTableLogSourceLabels, removeLastNodeIdInChain } from './utils'; export const getDebuggerState = R.prop('debugger'); @@ -186,7 +186,14 @@ export const getInteractiveNodeValuesForCurrentPatch = createSelector( sheets[lastSheetIndex].length }`; }), - filterOutValuesForCurrentPatch(activeIndex, nodeIdPath) + filterOutValuesForCurrentPatch(activeIndex, nodeIdPath), + // `tsv-log`, which is actually stores the data, encapsulated + // inside `table-log`, which label should be replaced with + // this value. So we have to cut the latest nodeId part from + // keys of table log values map + R.fromPairs, + R.map(R.over(R.lensIndex(0), removeLastNodeIdInChain)), + R.toPairs )(tableLogs); return R.merge(watchNodeValues, tableLogValues); diff --git a/packages/xod-client/src/debugger/utils.js b/packages/xod-client/src/debugger/utils.js index f7efab5e..ddca8ebc 100644 --- a/packages/xod-client/src/debugger/utils.js +++ b/packages/xod-client/src/debugger/utils.js @@ -39,6 +39,9 @@ export const getTetheringInetNodeId = R.curry( export const isErrorMessage = R.propEq('type', UPLOAD_MSG_TYPE.ERROR); +// `a~b~c` -> `a~b` +export const removeLastNodeIdInChain = R.replace(/(~[^~]+)$/, ''); + // :: Project -> [NodeId] -> PatchPath -> [{ nodeId: NodeId, label: String }] export const getTableLogSourceLabels = R.curry( (project, sourceNodeIds, rootPatchPath) => @@ -98,7 +101,7 @@ export const getTableLogSourceLabels = R.curry( }, R.applySpec({ nodeId: R.always(nodeId), - chunks: R.identity, + chunks: R.init, // Get rid of last NodeId, which points to internal `tsv-log` }) ), R.map( diff --git a/packages/xod-client/src/editor/actions.js b/packages/xod-client/src/editor/actions.js index 21ab1040..1a57eb03 100644 --- a/packages/xod-client/src/editor/actions.js +++ b/packages/xod-client/src/editor/actions.js @@ -47,6 +47,7 @@ import * as DebuggerSelectors from '../debugger/selectors'; import { parseDebuggerMessage } from '../debugger/debugProtocol'; import { addMessagesToDebuggerLog } from '../debugger/actions'; +import { removeLastNodeIdInChain } from '../debugger/utils'; import runWasmWorker from '../workers/run'; import { getAccessToken } from '../user/selectors'; import { updateBalances } from '../user/actions'; @@ -964,7 +965,14 @@ export const openTableLogTab = nodeId => (dispatch, getState) => { R.ifElse( R.contains(nodeId), () => Maybe.of(nodeId), - R.compose(Maybe, R.find(R.endsWith(nodeId))) + R.compose( + Maybe, + // `tsv-log`, which is actually stores the table log values + // is encapsulated inside `table-log` node, which node id + // is passed in this function so we need to find nodeId + // with a prefix with unknown nodeId: `${nodeId}~someNodeId` + R.find(R.compose(R.endsWith(nodeId), removeLastNodeIdInChain)) + ) ), R.unnest, R.values, diff --git a/packages/xod-client/src/project/components/Node.jsx b/packages/xod-client/src/project/components/Node.jsx index 4b82dd71..7215aa59 100644 --- a/packages/xod-client/src/project/components/Node.jsx +++ b/packages/xod-client/src/project/components/Node.jsx @@ -11,6 +11,7 @@ import { noop } from '../../utils/ramda'; import { isPinSelected } from '../../editor/utils'; import RegularNodeBody from './nodeParts/RegularNodeBody'; +import TableLogNodeBody from './nodeParts/TableLogNodeBody'; import WatchNodeBody from './nodeParts/WatchNodeBody'; import TweakNodeBody from './nodeParts/TweakNodeBody'; import TerminalNodeBody from './nodeParts/TerminalNodeBody'; @@ -115,7 +116,7 @@ class Node extends React.Component { return R.cond([ [XP.isTerminalPatchPath, () => ], [XP.isWatchPatchPath, () => ], - [XP.isTableLogPatchPath, () => ], + [XP.isTableLogPatchPath, () => ], [XP.isConstantNodeType, () => ], [XP.isBindableCustomType, () => ], [XP.isTweakPath, () => ], diff --git a/packages/xod-client/src/project/components/nodeParts/TableLogNodeBody.jsx b/packages/xod-client/src/project/components/nodeParts/TableLogNodeBody.jsx new file mode 100644 index 00000000..319046ec --- /dev/null +++ b/packages/xod-client/src/project/components/nodeParts/TableLogNodeBody.jsx @@ -0,0 +1,50 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import classNames from 'classnames'; +import * as XP from 'xod-project'; + +import { NODE_CORNER_RADIUS } from '../../nodeLayout'; +import NodeLabel from './NodeLabel'; +import VariadicHandle from './VariadicHandle'; + +const NODE_BODY_RECT_PROPS = { + rx: NODE_CORNER_RADIUS, + ry: NODE_CORNER_RADIUS, + // pxSize is set in root svg, let's occupy it all + width: '100%', + height: '100%', +}; + +const TableLogNodeBody = props => ( + + + + + { + event.stopPropagation(); + props.onVariadicHandleDown(event, props.id); + }} + /> + +); + +TableLogNodeBody.propTypes = { + id: PropTypes.string, + type: PropTypes.string, + label: PropTypes.string, + pxSize: PropTypes.shape({ + width: PropTypes.number, + height: PropTypes.number, + }), + nodeValue: PropTypes.string, + isDebugSession: PropTypes.bool, + onVariadicHandleDown: PropTypes.func, +}; + +export default TableLogNodeBody; diff --git a/packages/xod-client/test/tableLogSources.spec.js b/packages/xod-client/test/tableLogSources.spec.js index f8d290b6..f7d7d904 100644 --- a/packages/xod-client/test/tableLogSources.spec.js +++ b/packages/xod-client/test/tableLogSources.spec.js @@ -4,6 +4,17 @@ import { defaultizeProject } from 'xod-project/test/helpers'; import { getTableLogSourceLabels } from '../src/debugger/utils'; +const TABLE_LOG_NODES = { + 'xod/debug/tsv-log': {}, + 'xod/debug/table-log': { + nodes: { + log: { + type: 'xod/debug/tsv-log', + }, + }, + }, +}; + describe('generate labels for table log sources', () => { const assertSameSources = (project, rootPatchPath, expectedLabelsForIds) => { const ids = R.keys(expectedLabelsForIds); @@ -24,12 +35,12 @@ describe('generate labels for table log sources', () => { const project = defaultizeProject({ patches: { '@/main': {}, - 'xod/debug/table-log': {}, + ...TABLE_LOG_NODES, }, }); assertSameSources(project, '@/main', { - 'a~n~t': '@/main > DELETED (a~n~t)', + 'a~n~t~log': '@/main > DELETED (a~n~t~log)', t: '@/main > DELETED (t)', }); }); @@ -63,14 +74,14 @@ describe('generate labels for table log sources', () => { }, }, }, - 'xod/debug/table-log': {}, + ...TABLE_LOG_NODES, }, }); assertSameSources(project, '@/main', { - 'a~n~t': '@/main > nested-1 > nested-2 > table-log', - 'b~t': '@/main > nested-2 > table-log', - t: '@/main > table-log', + 'a~n~t~log': '@/main > nested-1 > nested-2 > table-log', + 'b~t~log': '@/main > nested-2 > table-log', + 't~log': '@/main > table-log', }); }); it('should contain node labels if it is set', () => { @@ -118,15 +129,15 @@ describe('generate labels for table log sources', () => { }, }, }, - 'xod/debug/table-log': {}, + ...TABLE_LOG_NODES, }, }); assertSameSources(project, '@/main', { - 'a~n~t': '@/main > Nested One > nested-2 > table-log', - 'b~t': '@/main > Nested Two > table-log', - 'c~n~t': '@/main > Nested Label > Log > table-log', - t: '@/main > My Table Log', + 'a~n~t~log': '@/main > Nested One > nested-2 > table-log', + 'b~t~log': '@/main > Nested Two > table-log', + 'c~n~t~log': '@/main > Nested Label > Log > table-log', + 't~log': '@/main > My Table Log', }); }); it('should add numbers to the duplicates on a correct nesting level', () => { @@ -219,45 +230,49 @@ describe('generate labels for table log sources', () => { nd2: { type: '@/nested-double' }, }, }, - 'xod/debug/table-log': {}, + ...TABLE_LOG_NODES, }, }); assertSameSources(project, '@/main', { - 'a~n~t': '@/main > Nested > nested-2 > table-log', - 'a2~n~t': '@/main > Nested #2 > nested-2 > table-log', - 'a3~n~t': '@/main > nested-1 > nested-2 > table-log', - 'b~n~t': '@/main > nested-label > Log > table-log', - 'b2~n~t': '@/main > nested-label #2 > Log > table-log', - 'd~t': '@/main > nested-double > table-log', - 'd~t2': '@/main > nested-double > table-log #2', - 'd2~t': '@/main > nested-double #2 > table-log', - 'd2~t2': '@/main > nested-double #2 > table-log #2', - 'd3~t': '@/main > Double Inside > table-log', - 'd3~t2': '@/main > Double Inside > table-log #2', - 'nc~n~n~t': '@/main > nested-complex > nested-1 > nested-2 > table-log', - 'nc~n2~n~t': + 'a~n~t~log': '@/main > Nested > nested-2 > table-log', + 'a2~n~t~log': '@/main > Nested #2 > nested-2 > table-log', + 'a3~n~t~log': '@/main > nested-1 > nested-2 > table-log', + 'b~n~t~log': '@/main > nested-label > Log > table-log', + 'b2~n~t~log': '@/main > nested-label #2 > Log > table-log', + 'd~t~log': '@/main > nested-double > table-log', + 'd~t2~log': '@/main > nested-double > table-log #2', + 'd2~t~log': '@/main > nested-double #2 > table-log', + 'd2~t2~log': '@/main > nested-double #2 > table-log #2', + 'd3~t~log': '@/main > Double Inside > table-log', + 'd3~t2~log': '@/main > Double Inside > table-log #2', + 'nc~n~n~t~log': + '@/main > nested-complex > nested-1 > nested-2 > table-log', + 'nc~n2~n~t~log': '@/main > nested-complex > nested-1 #2 > nested-2 > table-log', - 'nc~nn~t': '@/main > nested-complex > nested-2 > table-log', - 'nc~nn2~t': '@/main > nested-complex > nested-2 #2 > table-log', - 'nc~nd~t': '@/main > nested-complex > nested-double > table-log', - 'nc~nd~t2': '@/main > nested-complex > nested-double > table-log #2', - 'nc~nd2~t': '@/main > nested-complex > nested-double #2 > table-log', - 'nc~nd2~t2': '@/main > nested-complex > nested-double #2 > table-log #2', - 'nc2~n~n~t': + 'nc~nn~t~log': '@/main > nested-complex > nested-2 > table-log', + 'nc~nn2~t~log': '@/main > nested-complex > nested-2 #2 > table-log', + 'nc~nd~t~log': '@/main > nested-complex > nested-double > table-log', + 'nc~nd~t2~log': '@/main > nested-complex > nested-double > table-log #2', + 'nc~nd2~t~log': '@/main > nested-complex > nested-double #2 > table-log', + 'nc~nd2~t2~log': + '@/main > nested-complex > nested-double #2 > table-log #2', + 'nc2~n~n~t~log': '@/main > nested-complex #2 > nested-1 > nested-2 > table-log', - 'nc2~n2~n~t': + 'nc2~n2~n~t~log': '@/main > nested-complex #2 > nested-1 #2 > nested-2 > table-log', - 'nc2~nn~t': '@/main > nested-complex #2 > nested-2 > table-log', - 'nc2~nn2~t': '@/main > nested-complex #2 > nested-2 #2 > table-log', - 'nc2~nd~t': '@/main > nested-complex #2 > nested-double > table-log', - 'nc2~nd~t2': '@/main > nested-complex #2 > nested-double > table-log #2', - 'nc2~nd2~t': '@/main > nested-complex #2 > nested-double #2 > table-log', - 'nc2~nd2~t2': + 'nc2~nn~t~log': '@/main > nested-complex #2 > nested-2 > table-log', + 'nc2~nn2~t~log': '@/main > nested-complex #2 > nested-2 #2 > table-log', + 'nc2~nd~t~log': '@/main > nested-complex #2 > nested-double > table-log', + 'nc2~nd~t2~log': + '@/main > nested-complex #2 > nested-double > table-log #2', + 'nc2~nd2~t~log': + '@/main > nested-complex #2 > nested-double #2 > table-log', + 'nc2~nd2~t2~log': '@/main > nested-complex #2 > nested-double #2 > table-log #2', - t: '@/main > My Table Log', - t2: '@/main > My Table Log #2', - t3: '@/main > My Table Log #3', + 't~log': '@/main > My Table Log', + 't2~log': '@/main > My Table Log #2', + 't3~log': '@/main > My Table Log #3', }); }); }); diff --git a/packages/xod-project/src/constants.js b/packages/xod-project/src/constants.js index f13ca233..c9a4b7cd 100644 --- a/packages/xod-project/src/constants.js +++ b/packages/xod-project/src/constants.js @@ -126,7 +126,11 @@ export const PULSE_CONST_NODETYPES = { }; export const WATCH_NODETYPE = 'xod/debug/watch'; + +// User-friendly table-log node, that uses a tsv-log inside export const TABLELOG_NODETYPE = 'xod/debug/table-log'; +// Utility node that actually sends a tsv data to the XOD IDE +export const TSV_LOG_NODETYPE = 'xod/debug/tsv-log'; // node types that prints values into Serial // to debug xod programm, it should be omitted