josdejong / josdejong/svelte-jsoneditor

"Collapse All", "Collapse Contents", "Collapse Layer", "Collapse Recursively", and "Collapse Others" Functionality for Tree and Text Mode

Open
#557 4 comments 0 reactions 0 assignees View on GitHub
enhancement
Dominant language
TypeScript
Stars
1.3k
Forks
148
PR merge metrics
No merged PRs in 30d

Description

Thanks for working on this project! This is hands down the best JSON viewer I've ever used and is perfectly serviceable as it is now. This isn't an "issue" more than it's a feature request. When I collapse an object with multiple layers in Text or Tree mode, it'll preserve the collapsed status of every array/object inside the parent object. While there are times when I find lossless collapsing useful, there are many more when I wish I had more nuanced control over what collapses when. So, I propose these 5 collapse types (which are really just 2 types in a trench coat) for text _and_ tree mode:

**1. Collapse All**
This is already in Tree Mode, but this would be nice to have in text mode as both a button and a keyboard shortcut.

**2. Collapse Layer**
There are times when I want to edit a dictionary entry I know the location of, but trying to find it quickly gets annoying when there's a gargantuan number of nested arrays and dictionaries between me and my destination. Using the Find/Replace menu helps, but I have to take my hands off the mouse to type the name of the entry. It's a first-world problem, but it gets infinitely more annoying the longer you have to do it. Instead, what if you could alt + click the parent object/array's collapse button to collapse every nested dictionary/array inside of it (but not the parent object itself)? This would basically be equivalent to collapsing every topmost entry by hand.

**3. Collapse Contents**
This is a very similar idea to Collapse layer, but Collapse Contents would recursively collapse the parent entry's contents instead of the normal lossless collapse that saves the collapse state of objects. Instead of alt + click, you would activate it with ctrl + click.

**4. Collapse Recursively**
Another similar type of collapse with a very minor difference. If you hold shift while content or layer collapsing a parent object, it'll collapse the parent as well. Think of it as a self-contained "Collapse all."

**5. Collapse Others**
Compared to the middle three suggestions, this one is pretty unique. If you're comparing an entry in a large object and jump to a difference that's in be in the middle of an object, it gets disorienting fast. Thanks to this, I often find myself collapsing neighboring entries so I can get a better idea of where I am. Digging my way through a dictionary like I'm stuck in a hole is one of my least favorite things to do when parsing a dictionary. If you could only "focus" on the dictionary you're inside of and automatically "hide" (collapse) everything else. Not only would this be helpful in comparison mode for reasons stated above, but it would also help maintain a sense of cleanliness if implemented in other modes like text/tree (ctrl + alt + click shortcut perhaps?).

Even implementing just one of these features would make my day. I hope you enjoy your day :)

Contributor guide

No contributing guide indexed for this repository

Research direction

The issue does not identify files or tests. Start by locating the collapse controls and the text and tree mode implementations, then determine how collapse state is handled. Done means the requested collapse-all, layer, contents, recursive, and others behaviors work in both modes with their proposed shortcuts.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.