leodevbro / vscode-blockman

VSCode extension to highlight nested code blocks
https://github.com/leodevbro/vscode-blockman
MIT License
345 stars 16 forks source link

Whole Block Outline #95

Open RCVarley opened 1 year ago

RCVarley commented 1 year ago

Ideally (for me), the function name & parameters, or the object name would be included in the block highlight.

In an object, this would make all of the blocks butt up against one another, which is undesirable, so maybe if the last line of the block (aka the closing bracket/brace/etc.) gets missed out:

------------------------
objectProperty: {      |
  someProp: "hello",   |
------------------------
},

Or only gets highlights the brace character (plus padding) and then connects to the rest of the block:

------------------------
objectProperty: {      |
  someProp: "hello",   |
    --------------------
},  |
----

Is this possible with the current features? If not, is this a feature you'd consider supporting?

leodevbro commented 1 year ago

Hello, I guess this is the duplicate issue of this one: https://github.com/leodevbro/vscode-blockman/issues/45

In short: So, you would like to make the rectangle cover not just the child area, but also the parent area, right? Like this, right? Basically you prefer "Parent style", right? image

At first glance the "Parent style" seems good and natural, but I think it's not natural and I think it's very bad, because:

1] I think the rectangles should be as small as possible, so it will be easier for your eyes to focus.

2] I think covering the parent area is very unnecessary and redundant because child rectangle already helps our eyes to quickly/easily find the parent area, yeah, the parent area is always just above and below the child rectangle, right? Do you think your eyes need even more help to quickly find the parent code?

3] In the image above, the code is simple, but there are many edge cases when it is confusing to determine what area is the parent area, for example here: image

what is the parent area? export class DogAttribute { or with the decorator

@ObjectType()
export class DogAttribute {

?

Some people will say first one is the parent, some people will prefer the second option to be considered as parent, and this will quickly become a philosophical issue, and there will be so many settings/config required to satisfy each person's preference.

Also, here: image

what is the parent area? this code? fetch("example.com") ? I don't think so, maybe I'm wrong, but it does not seem a parent to me. For me it seems like a pre-operation.

So, maybe the parent is: .then(() => ({ ?

I don't think so either, and it looks very unnatural to me:

image

Again, maybe I am wrong, so, feel free to continue this discussion with your opinions.