feat(metrics): implement ability to hide internal topics in charts

[hemahg]

feat(metrics): implement ability to hide internal topics in charts

[MikeEdgar]

The topics should have already been filtered by the API right? I'm not sure this is needed, and I think it's different from the topic list page where only the API filters hidden ones.

[hemahg]

Initially I was using the includeHidden query param in the URL so the API would filter topics.
But toggling the switch updated the URL each time, which caused the whole page (server components) to re-render.
That felt unnecessarily heavy just for showing/hiding internal topics.

So instead, I fetch all topics once (including hidden ones), and then handle the internal topic filtering on the client using:

const isInternalTopic = (topic: TopicOption) =>
  topic.name.startsWith('__')

This way, toggling the switch only affects local state and doesn’t trigger a full page re-render.

It keeps the UI more responsive while avoiding extra API calls.

[MikeEdgar]

I see your point and I don't disagree with the concept, but the issue is that topics aren't identified by leading __ alone. There is a separate flag for internal within Kafka. I.e., I can name a topic with __ as the prefix and it would still not be internal. If you fetch all of the topics regardless or visibility, you can look at the attributes.internal value instead of filtering based on name.

[hemahg]

The popover mentions that internal topics are prefixed with __, so I initially used startsWith('__') based on that convention. But I agree it’s better to rely on attributes.internal from the API, so I’ll update it accordingly.

[hemahg]

I have updated to show the topics based on visibility attribute

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud