Skip to content

Conversation

jpinsonneau
Copy link
Contributor

@jpinsonneau jpinsonneau commented Aug 26, 2025

Quick article to showcase CLI new UI

@jpinsonneau jpinsonneau force-pushed the cli-ui branch 2 times, most recently from 82afaca to d9bdafe Compare August 27, 2025 12:43
Copy link

github-actions bot commented Aug 27, 2025

🚀 PR Preview for netobserv.io has been successfully deployed!
It's available at https://netobserv-io-blog-27-preview.surge.sh and will be removed when the PR closes.

@jpinsonneau jpinsonneau marked this pull request as ready for review August 27, 2025 12:45
@jpinsonneau jpinsonneau force-pushed the cli-ui branch 4 times, most recently from 8cb93b6 to f6418bd Compare August 28, 2025 10:02
Copy link
Member

@memodi memodi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks @jpinsonneau. New UI is great, ability to click right on terminal to cycle through options is much convenient indeed.


Metrics visualization takes a leap forward with real-time graphs rendered directly in the CLI.
![graphs](graphs.png)<br>
Figure 6: Metrics graphs
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

how do I get graphs on terminal? I tried oc netobserv metrics command but it just pointed me to OCP dashboard?

That's also the general comment I have - to have a command as precursor to the images of the views that's on the blog.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You command is right, however, you need that PR for metrics: netobserv/network-observability-cli#333

The editors team is suggesting to do a video instead of a blog ... Or at least put videos instead of screens so I will probably change everything here 😿

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah, okay!

![live filters](filters.png)<br>
Figure 4: Live filters suggestions

- *Packet Preview*: When capturing packets, simply click a row to inspect the pcap content directly.<br><br>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't see the use of displaying pcap content on terminal, it's in encoded format anyway.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just click on a row and you will see the content. If you try to read http packets you can read clear text 😸


# UI Gallery

A visual tour of the new CLI experience:
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do you think gifs would be nice as opposed to static images?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

![manage columns](columns.png)<br>
Figure 3: Column selection popup

- *Smart Filtering*: Live filters now include auto-suggestions, making it easier to select the right keys and values.<br><br>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's a small detail, but the bullet is aligned left and the text seems to be aligned to the center. I think would be nicer for the text to be right after the bullet.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's related to the blog itself, not this article. I can take a look at the stylings in parallel 😉

Thanks for the feedback !

@jpinsonneau jpinsonneau marked this pull request as draft September 3, 2025 11:56
@jpinsonneau
Copy link
Contributor Author

Holding this PR since I'm revisiting it as a video recording...

@jotak
Copy link
Member

jotak commented Sep 5, 2025

@jpinsonneau for the community blog I think you can share both as blog/images and with the recording (personally I prefer the blog/text format :-) )

LGTM!

@jpinsonneau
Copy link
Contributor Author

@jpinsonneau for the community blog I think you can share both as blog/images and with the recording (personally I prefer the blog/text format :-) )

LGTM!

We can link the video there when it will be ready.
Also we need to wait for 1.10 release so we have some time

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants