Improve column alignment by using single table layout

[phonicura]

This PR aims to improve the display of columns in sub-items and fixes #110, https://issues.jenkins.io/browse/JENKINS-29273 and https://issues.jenkins.io/browse/JENKINS-24723 by using a single table for all jobs, instead of nested tables.

Before:

After:

Testing done

Manual testing:

• Expanding and collapsing categories
• Sorting by column
• Identation of jobs with very long names

Submitter checklist

• Make sure you are opening from a topic/feature/bugfix branch (right side) and not your main branch!
• Ensure that the pull request title represents the desired changelog entry
• Please describe what you did
• Link to relevant issues in GitHub or Jira
• Link to relevant pull requests, esp. upstream and downstream changes
• Ensure you have provided tests that demonstrate the feature works or the issue is fixed

[phonicura]

Hi @jenkinsci/categorized-view-plugin-developers @mPokornyETM @MarkEWaite, for this PR the code changes were a bit more extensive than usual for this plugin; therefore i would be grateful if someone would have the time for a proper code review ^-^

[SunBlack]

Just from the screenshots:

• Before this redesign within a subcategory where no border in the first column. Maybe a simple rowspan=<number of items in category>would help
• Does this plugin supports more than one nesting? In case yes: Must the margin also increase with each level of depth?

[phonicura]

Hi @SunBlack,

thanks for your feedback!

1. I adjusted the display of the first column so that it gets hidden, which points out the indentation a bit better than before imo. I provided the updated screenshot in the PR description. What do you think?
2. Right now more than one nesting is not supported, and there are currently no ambitions to implement that.

[SunBlack]

Oh nice update, I like it 👍

Since there is now a clearer marking of the children by the color differentiation of the first column (and the group rows have a bold font): Is it still necessary to indent the children? Could you post a screenshot of this as a comment in case one of the reviewers wants to give an opinion? I'm still a bit conflicted between perfect column alignment and better identification of what children are 😅

[phonicura]

Sure, here you go:

I think I actually like this variant without indentation more, but it it would be nice to get some more opinions on that.

[MarkEWaite]

I think I actually like this variant without indentation more, but it it would be nice to get some more opinions on that.

I agree, though I would want to be sure that it also looks reasonable in a dark theme

[phonicura]

I tried out some themes, and I think the contrast is subtle but visible:

Dark:

Solarized Dark:

Solarized Light:

[MarkEWaite]

Thanks for checking! I agree that it looks fine in the dark themes as well.

[SunBlack]

I don't know if you want to do it as part of this PR, but you could consider updating the screenshots in the readme after this change - the look of Jenkins has changed more in the last 2 years (was it really only 2 years ago that Jenkins looked like this?).

You can also add dark and light mode images. See here.

[mPokornyETM]

For change like this, I will try to use the data-table plugin (https://plugins.jenkins.io/data-tables-api/)
It includes all the fatures like nesting, sorting, filtering ... . In that case you can remove a lot of the javascript code. But it will cost "little" bit time.

[SunBlack]

Any chance this will merged?

[MarkEWaite]

Any chance this will merged?

Since @phonicura is one of the maintainers of the plugin, he can merge it. Have you used the incremental build of the plugin and confirmed that it meets your needs?

[SunBlack]

Tested it now. It works, but when you open it up, it jumps a little. At first I thought it was because some invisible cell needed more space, but that doesn't seem to be the case. And I think it would look even better if the first column had a fixed size, so that the margin around the collapse button was the same in all four directions.

[phonicura]

Hi everyone, I had some difficulties in the past few months to hold up my engagement for this plugin, but now I'm available again, and I will look into the issue next week to bring it to an end.

@SunBlack thank you for testing, fixing the width of the first column seems like a suitable solution.