Allow choosing which part (start/end) of a name will get truncated

[dhirschfeld]

In the application details view the names of the resources are truncated, making it impossible to understand the status of the resources at a glance - you have to hover over each resource to see it's name - e.g. what cron jobs are they?

This becomes even more of an issue with larger applications.

Since the important identifying information for my resources is at the end of the name I could improve the situation by monkey-patching the css to add a direction: rtl:

.application-resource-tree__node-content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    direction: rtl;
}

Which results in:

Maybe that's not ideal for all situations so it would be nice to be able to choose (perhaps initially as a global config) which side of the name will get truncated.

[reginapizza]

hi! I'd like to work on this issue and this is a potential solution I came up with- having a right and left align toggle button added to the viewport zoom in/out tool. Since it deals with the display in the viewport, I thought it made sense to go there. It could look something like this:

@keithchong @rbreeze please let me know your thoughts on adding this functionality here or if you think somewhere else would be better!

[keithchong]

Hi @reginapizza , seems reasonable to have a view option like what you suggest. One possible concern is that the two button icons can imply you want to left or right justify the entire tree view, eg. all parent branch nodes will all line up to the left or to the right. Perhaps we just need to choose the right icons.

Just throwing out ideas here, but another option is maybe to directly address the issue with truncation and maybe there is a way to better represent the name. (Although, truncation is generally the right solution). Or, perhaps, there can be a view option to expand the width of each node, so that truncation can be eliminated.

[reginapizza]

I tried out adding a toggle to expand the width of each node to fit the title because I thought that was a good idea, but one problem I ran into with it is that we'd have to also change the code for the lines between boxes, as you can see in my demo video below. So, a little more complicated than just changing the width. I haven't played around with the code for the lines enough to see exactly how complicated it is, but from a quick glance it doesn't look that easy. Does this change your opinion of it at all? @rbreeze do you have any opinions on this?

titleLengthToggle.mp4

Perhaps we could use the right and left align and make it clear that it's just for the resource name in the tooltip?

[dhirschfeld]

make it clear that it's just for the resource name in the tooltip

That would seem to defeat the purpose of what I was after. I can already see what my resources are by hovering over them and looking at the tooltip, the point is that that's hugely inefficient.

What I'm after is a way to reveal for all resources in the view, what their names are at a glance so e.g. if I have 20 cron jobs I can immediately click on the one I'm interested in, rather than having to hover over each in turn to reveal their names.

Simply making the boxes big enough to fit all names would also work, but maybe there's a point where that would be visually undesirable and you're back to the problem of deciding which part to truncate.

[reginapizza]

Sorry, by that comment I meant that the tooltip on the right or left align button would state specifically that it's only related to the alignment of the resource names (ie. something like 'resource name right', 'resource name left', or whatever), to avoid the confusion that Keith was talking about where a user could confuse it with how the tree itself is aligned.

[keithchong]

FYI, this is not related to this issue, but since Regina's screenshot of the app shows the toolbar blocking the leftmost node and the content is not scrollable, the fix for it is found here: #8597.