fix/Multiple-Overlapping-Tooltips-Appear-on-Hover#6445

[abbiekuma]

Description

This PR fixes #6445

Notes for Reviewers

Signed commits

• [✅] Yes, I signed my commits.

[l5io]

🚀 Preview for commit 2944749 at: https://684786ba70e65ad94994bfba--layer5.netlify.app

[LibenHailu]

Hi @abbiekuma I am not seeing service mesh interface compliance table on the deployed link, can you check?

[abbiekuma]

Hi @abbiekuma I am not seeing service mesh interface compliance table on the deployed link, can you check?

---

Hi @LibenHailu !
While working on the feature, I noticed that the Service Mesh Interface compliance table doesn’t appear unless data is successfully fetched from the API due to CORS restrictions. To address this and make the component visible during development, I used src/collections/landscape/smi.js/smi_data as mock data to view the table, and the issue was successfully resolved in my local environment.

layer5_6445.mov

[LibenHailu]

local environment.

@abbiekuma Hmm, it doesn't seem to be working in production. Could you take a look and see what might be causing the issue?

[abbiekuma]

Just to clarify, when you say it’s not working, are you referring to the table still being missing, or the hover overlap issue still persists?

[LibenHailu]

Just to clarify, when you say it’s not working, are you referring to the table still being missing, or the hover overlap issue still persists?

The table is missing, here is the preview, https://684786ba70e65ad94994bfba--layer5.netlify.app/service-mesh-landscape

[abbiekuma]

The reason you're not seeing the SMI table is becuase the data fetch is being blocked by a CORS policy. For now, I’m using mock data locally so I can continue development so that's why it shows up on my end but not yours.

[LibenHailu]

The reason you're not seeing the SMI table is becuase the data fetch is being blocked by a CORS policy. For now, I’m using mock data locally so I can continue development so that's why it shows up on my end but not yours.

Can you load the data locally? if not we have to check the backend and update the CORS policy?

[abbiekuma]

Hello, I I followed the suggestion at Slack to open a new Chrome window with security options disabled. This bypassed the CORS restrictions, and it worked! the data loaded successfully. Here is the updated recording👇

updated_layer5_6445.mov

[LibenHailu]

LGTM

[vishalvivekm]

@abbiekuma Please revert these whitespace, formatting changes

[vishalvivekm]

@abbiekuma
Thank you for your contribution!
Let's discuss this during the website call today at 5:30 PM IST | 7 AM CT

Add it as an agenda item to the meeting minutes, if you would :)

[l5io]

🚀 Preview for commit 23e5755 at: https://684ffe1d08ec02c8f6f58afe--layer5.netlify.app

[l5io]

🚀 Preview for commit e5f02ba at: https://68599115186515835549a12c--layer5.netlify.app

[abbiekuma]

Here is how it looks in mobile view. @vishalvivekm @vr-varad
I also updated the format. The previous formatting was changed by Prettier, but I’ve now adjusted it back to the original style.

Screen.Recording.2025-06-23.at.1.37.12.PM.mov

[l5io]

🚀 Preview for commit 749aa4c at: https://685bcee22a8410e58b79bf5e--layer5.netlify.app