This commit accounts for differences in JSONTree's renderer callbacks. #41
Conversation
valueRenderer: passes a scalar value as an argument to the callback you provide.
labelRenderer: passes a array value as an argument to the callback you provide.
This array value is the key ancestry of the json tree.
The Problem:
===
The name formating issue in FilterableState.js was caused by rendering the
**entire** key ancestry array as a string for every key, instead of just the name of the key.
Example:
when trying to render the "child" from this piece of state
```javascript
{
grandParent: {
parent: {
child: { /*...*/ }
}
}
}
```
the `labelRenderer` callback, you provided, will be given the key and its ancestry as a value.
```javascript
function labelRenderer (value) {
// value == ["child", "parent", "grandParent"]
return value;
}
```
`JSONTree` takes the return of `labelRenderer` and renders it as a
string. So the above return value becomes "childparentgrandParent".
This is why you get the visual bug in the preview of state for the LogMonitor.
The Solution:
===
return the first key, instead of the entire key ancestry, to get the
correctly formatted label.
|
Hey @arcin. Thanks a ton for contributing! Any idea if we need to bump the redux dependency range with this change? I'm not sure when it got broken. |
|
No problem @bvaughn! So it looks like we don't need a bump because the issue was introduced by this commit
In version If you scroll to the bottom of the comment thread you'll see that it broke This project predates the feature in |
|
Sorry, I dropped the ball with this PR. I'm a little confused why a change in 0.5.6 of Sorry if I'm being dense here, but can you explain? |
|
Sorry, after looking a little closer I think I see what you're talking about now. |
|
Fix published in version 0.8.1. Sorry again for the delay. I guess I lost track of this because of conference stuff. |
valueRenderer: passes a scalar value as an argument to the callback you provide.
labelRenderer: passes a array value as an argument to the callback you provide.
This array value is the key ancestry of the json tree.
The Problem:
The name formating issue in FilterableState.js was caused by rendering the
entire key ancestry array as a string for every key, instead of just the name of the key.
Example:
when trying to render the "child" from this piece of state
the
labelRenderercallback, you provided, will be given the key and its ancestry as a value.JSONTreetakes the return oflabelRendererand renders it as astring. So the above return value becomes "childparentgrandParent".
This is why you get the visual bug in the preview of state for the LogMonitor.
The Solution:
return the first key, instead of the entire key ancestry, to get the
correctly formatted label.