Fix text truncation in data tables

[jeffibm]

1. Datastores
Before

After

---

2. Automation Managers
Before

After

---

3. Service Requests
Before

After

---

4. Containers
Before

After

---

5. Container Images
Before

After

---

6. Instances by Providers
Before

After

Please not that icons and images are slightly smaller than before

[Fryguy]

@jrafanie @jeffibm Does this also fix #8823 ?

[Fryguy]

@jeffibm Is there a reasonable truncation limit at some point? For example, first N lines or first N bytes? - What if someone puts like 1MB of data as text?

[jrafanie]

@jrafanie @jeffibm Does this also fix #8823 ?

Good question. I'm not sure. #8823 was in the pod name column shown for a specific container image, we're only seeing the list view for images and not the view for one image with several pod names. The code looks like it's treated generically so I would think it would fix it.

[Fryguy]

@jeffibm Can you verify on the pages that @jrafanie found in #8823?

[jeffibm]

Yea ok, will need to check how it handles very long text.
And also, how do we handle large text in PDFs,

But for now, the Longer text truncate logic is as follows -

When text.length > 300

• The entire text will be rendered in the source, and displayed in tooltip
• Max height of the cell becomes 200px
• Only 15 lines will be displayed
• An ellipses will be displayed at the end of the text to signify it has been truncated.

and it looks like this in worst case scenario..

Note: I have updated the screenshots in the PR's Description

[miq-bot]

Checked commit jeffbonson@d758a7d with ruby 2.6.10, rubocop 1.28.2, haml-lint 0.35.0, and yamllint
0 files checked, 0 offenses detected
Everything looks fine. 🍰

[jeffibm]

@jeffibm Can you verify on the pages that @jrafanie found in #8823?

I don't have data to see longer text on this particular page.
But, as Joe mentioned, the changes are generic, and they should be fixed.

[jeffibm]

Hey @Fryguy , @jrafanie , will these changes be ok to merge?

[jrafanie]

I don't understand all of the changes here but if we're confident this improves the truncation logic, I'm 👍 on it. My concerns about this change working optimally in various screen resolutions is something we can review after this truncation bug is fixed.

[Fryguy]

Looks good but I do have one more observation that looks strange

When a line does wrapping the vertical alignment of other cells changes to sort-of-top-aligned. However, this looks really strange especially because the vertical alignment of the header doesn't change. This is much more evident when only one line wraps but not other lines.

I hope the screenshots below show it better:

[Fryguy]

That being said, I'd rather merge now because this 99% fixes a huge usability issue - let's do the rest in a follow-up

[jeffibm]

That being said, I'd rather merge now because this 99% fixes a huge usability issue - let's do the rest in a follow-up

Follow up PR - #8832

[Fryguy]

Backported to petrosian in commit 298effe.

commit 298effe5fc84be1a07d862b0f5464ace8f271bce
Author: Jason Frey <fryguy9@gmail.com>
Date:   Thu Jun 15 10:09:12 2023 -0400

    Merge pull request #8825 from jeffibm/fix-datatable-truncation
    
    Fix text truncation in data tables
    
    (cherry picked from commit e24fbf379772cbf0425431c60a495b642451bcd3)