-
Notifications
You must be signed in to change notification settings - Fork 12
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add option to hide in the viewer parts that have not changed #1
Comments
I think it's ok and it'll be useful in my own business project. I'm going to add an optional prop /**
* all fields are optional,
* default is `false` which means it won't hide unchanged lines.
*/
type HideUnchangedLines = false | {
/**
* if there are continuous unchanged lines exceeding the limit, they should be hidden.
* default is `6`
*/
threshold?: number;
/**
* if there are `x` continuous unchanged lines to be hidden, we can keep displaying some lines.
* default is `3`
*/
margin?: number;
/**
* the custom renderer of the "expand" line
* default renderer will produce the following buttons in this line:
* [⬆️ Show 20 lines] [↕️ Show all unchanged lines] [⬇️ Show 20 lines]
*/
expandLineRenderer?: ({
/**
* if this is `true`, you can show a "⬆️ Show xx lines" button
*/
hasLinesBefore: boolean;
/**
* if this is `true`, you can show a "⬇️ Show xx lines" button
*/
hasLinesAfter: boolean;
/**
* call this function to expand `lines` lines before,
* if there are not enough lines before, it will expand all lines before.
*/
onExpandBefore: (lines: number) => void;
/**
* call this function to expand `lines` lines after,
* if there are not enough lines after, it will expand all lines after.
*/
onExpandAfter: (lines: number) => void;
/**
* call this function to expand all lines in this continuous part.
*/
onExpandAll: () => void;
}) => JSX.Element;
} For example, if I call the viewer component like this: <Viewer
{...otherViewerProps}
hideUnchangedLines={{ threshold: 6, margin: 3 }}
/> And the data (the unchanged parts) is like this:
Which will produce the output like this:
|
Hi, you can pass the |
I'm trying to use JSONDiffKit to visualize diff between two, relatively big JSON payloads.
Usually the diff is only about 5 properties out of the whole structure.
The current problem I face is out of 480 lines the viewer show only 7 actually have change but I still see the whole structure.
Of course the solution is not as simple as just hiding any line that haven't been changed because you can have an inner object have a single property change but you still want to see the parent properties to understand the context of the change.
Do you think it is possible to add the ability to somehow decide which lines to hide to make the diff more concise and easy to understand?
The text was updated successfully, but these errors were encountered: