[UI] Check all UI elements that could be hidden due to long content

[Bobgy]

This is a long standing general issue.

Many UI elements may be partially hidden due to long content. Let's examine our UI and give a workaround for all cases that really needs a way to read full content.

Usually, we should just add a tooltip on hover for full text. e.g. like #2894

[Bobgy]

#3677 reported one place: parameter values in input/outputs tab

[Bobgy]

Found another issue, in pipeline version selector, version could be too long.
/reopen

[k8s-ci-robot]

@Bobgy: Reopened this issue.

In response to this:

Found another issue, in pipeline version selector, version could be too long.
/reopen

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[anatolii-zolotar]

Thanks for the fix #3747. We've realized recently that it's necessary for user to be able to copy URL of artifact on Artifacts page or in "Output artifacts" section of "Input/Output" tab on Run Details page (since artifact URL itself is not visible and link that can be copied is to unarchive/download endpoint).
I was about to implement some workaround before I found that PR and I thought that if trimming of artifact URL (or any other parameter value) is really needed for some reason, then we can think about adding some tiny button for copying to clipboard, to the right of the trimmed link.
I guess this solution have an advantage: we also can display URLs properly on Artifacts page and it won't break grid layout with long link text that doesn't fit into cell.

The button is supposed to be like:

So, what do you think about button for copying to clipboard?

[Bobgy]

@anatolyzolotar Thanks for the suggestion! UI now shows all urls in their complete form. Does it work for your use-case? or do you suggest a copy button is easier to use?

Sounds good to me if we add a copy button. I don't currently have bandwidth to implement that because 1.0 release is coming. Can you create an issue capturing the idea? and PRs welcomed

[anatolii-zolotar]

@Bobgy , yes, complete form of urls will allow user to copy artifact's url (not a link to unarchive/download endpoint) and use it somewhere else for access. (Off topic: can you tell me where I can find any roadmap for 2020 or any kind of release schedule? I couldn't find it anywhere. This fix is crucial for us on this week and, if as far as I understand, we have to the clone repo and build our own docker image with this fix added locally).

Regarding proposal: for me it seems like shortened urls (with copy to clipboard) are better option, at least because we also may need to get artifacts url (instead of download link) on Artifacts List page. Urls there are rendered in cells and showing complete form will spoil grid layout. On the other hand I'm not sure if it's doable there since urls are rendered differently (with different components, at the first glance). Will look deeper later.

I will create issue and will try to add PR for it.

[Bobgy]

@anatolyzolotar

(Off topic: can you tell me where I can find any roadmap for 2020 or any kind of release schedule? I couldn't find it anywhere. This fix is crucial for us on this week and, if as far as I understand, we have to the clone repo and build our own docker image with this fix added locally).

We do bi-weekly release, and you can get images built for any commit in master in gcr.io/ml-pipeline-test/frontend:COMMIT_SHA.

[Bobgy]

Regarding proposal: for me it seems like shortened urls (with copy to clipboard) are better option, at least because we also may need to get artifacts url (instead of download link) on Artifacts List page. Urls there are rendered in cells and showing complete form will spoil grid layout. On the other hand I'm not sure if it's doable there since urls are rendered differently (with different components, at the first glance). Will look deeper later.

Thanks for clarifying that. Sounds like a better UX. Of course these are achievable (KFP's UI is implemented with React, so we have all the flexibility here), we'd welcome contributions.