feat(matchExpr): match expression visualizer #914

tthvo · 2023-03-20T21:46:14Z

Welcome to Cryostat! 👋

Before contributing, make sure you have:

Read the contributing guidelines
Linked a relevant issue which this PR resolves
Linked any other relevant issues, PR's, or documentation, if any
Resolved all conflicts, if any
Rebased your branch PR on top of the latest upstream main branch
Attached at least one of the following labels to the PR: [chore, ci, docs, feat, fix, test]
Signed the last commit: git commit --amend --signoff

Fixes: #911
Fixes: #912
Fixes: #900

Description of the change:

Match Expression Visualizer with mini topology
- Graph View
- List view (if # of targets are too large).
- Fix height constraints -> need to fill viewport instead of overflowing.
- Update target detail panel to reflect fieldName.

Note: No tests yet tho. Focusing on flushing out features for now.

Motivation for the change:

See #376 (comment)

How to manually test:

Run CRYOSTAT_IMAGE=quay.io... sh smoketest.sh...
Go to Rule and Credential Forms.

Screenshots

Credential Modal

Create Rule Form

Match Expression Hint

tthvo · 2023-03-21T05:27:20Z

Notice how the field path is represented as breadcrumbs. I took this design from OpenShift console. Let me know what you think :D

github-actions · 2023-03-21T05:34:27Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-79dd59579b23171d9228e0e64df803b3862e42e2 sh smoketest.sh

tthvo · 2023-03-21T18:17:34Z

Read for review now :D

Just a small note for testing with observables that includes debounceTime: just need to use waitFor to check if some function (e.g. api requests, etc) is called. Otherwise, the test will move on before the operation completes.

Also, you might notice that the graph view sometimes flicks on first renders. This is because I have an effect that tries to fit all nodes into views. So, there is some animation there but too fast to see.

github-actions · 2023-03-21T18:19:28Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-12e0ad30549eefc5b6e28c17f9abf079da9e829b sh smoketest.sh

andrewazores · 2023-03-21T18:46:34Z

Go to Topology
Select a target with the warning exclamation
Click "Add Credentials"
Select a target with the warning exclamation
Click "Add Credentials" ...

Can that action be removed from the sidebar panel component when it's in this visualization context?

tthvo · 2023-03-21T19:33:04Z

Yeh sure, of course!

I left it in case the user want to add credentials in Create Rule Form. For example. if the target is matched but could not fetch templates, adding credentials there can help refreshing on the go. What do you think?

But yeh it really still needs removing when for example, on a credential modal.

tthvo · 2023-03-21T19:55:59Z

I added options to allow hide action buttons. This is applied for credential modal but still kept for Create Rule Form.

tthvo · 2023-03-21T20:00:58Z

Views appear not responding to target discovery events when adding credentials (i.e. create form rule). Investigating...

github-actions · 2023-03-21T20:01:48Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-5973510780907c18111a2fb0daeebdb0013fdd07 sh smoketest.sh

github-actions · 2023-03-21T20:11:14Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-14687f6b76d677d6678c1b95c08616578880a56f sh smoketest.sh

github-actions · 2023-03-21T20:34:15Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-3ae8348722b08acb9f2b095db42b062277330e5f sh smoketest.sh

andrewazores · 2023-03-21T22:01:21Z

Yea, the Actions menu within the sidecar panel within the modal. Nothing happens when I click it. The "outer" one, in the Topology view, has actions when I click it.

andrewazores · 2023-03-21T22:03:18Z

Also the text at the top of that modal needs updating:

Creates stored credentials for target JVMs according to various properties. If a Target JVM requires JMX authentication, Cryostat will use stored credentials when attempting to open JMX connections to the target.

Should be more generic and just talk about opening connections, not specifically JMX ones.

tthvo · 2023-03-21T22:03:23Z

Ohhh interesting...there is a bug somewhere I think. It should show up. Let me check!

github-actions · 2023-03-21T22:07:58Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-57a204e4de6f9b72aac06faf58cec53e742f20a9 sh smoketest.sh

tthvo · 2023-03-21T22:08:44Z

Never mind, the menu was actually showing but it was mounted in the back of the modal haha. Fixed now :D

github-actions · 2023-03-21T22:17:34Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-56c320e0a136f1ad8a412520cb168be0d3d7a9dc sh smoketest.sh

tthvo · 2023-03-21T23:50:08Z

Updated texts.
Removed actions in empty state: asynchronously update input field will cause the cursor jump to the end -> cant use hook -> actions to reset match expression can't be used. However, the the match expression input field is already visible to edit.

github-actions · 2023-03-21T23:54:05Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-17e0bb547ab6c26ae0a4ad3e4a2573c459e75a41 sh smoketest.sh

github-actions · 2023-03-22T00:50:13Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-3ed4d7caa13a7525b7af394f1000b8540575dd4b sh smoketest.sh

andrewazores · 2023-03-22T17:05:06Z

Looks good testing it out. I'll review the implementation later this afternoon.

maxcao13 · 2023-03-22T19:12:43Z

Should the message be different when the expression is valid?

maxcao13 · 2023-03-22T19:16:38Z

Screencast.from.03-22-2023.03.15.13.PM.webm

If it's not hard to do, keep the positions of the nodes when switching between graph view and list view?

src/app/SecurityPanel/Credentials/CreateCredentialModal.tsx

src/app/Rules/CreateRule.tsx

src/app/SecurityPanel/Credentials/CreateCredentialModal.tsx

tthvo · 2023-03-22T19:47:46Z

If it's not hard to do, keep the positions of the nodes when switching between graph view and list view?

Should be okay to do I think. Just that this might cause another huge chunk of data to be stored if # of targets is large. Especially, topology view also saves positions too.

Should the message be different when the expression is valid?

https://www.patternfly.org/v4/components/form/design-guidelines

No guideline for valid message... I think the green color + check icon should be enough to indicate that.

tthvo · 2023-03-22T20:14:16Z

Updated to to save graph positions and clean up css, console.logs :))

Signed-off-by: Thuan Vo <[email protected]>

github-actions · 2023-03-22T20:21:22Z

Test image available:

CRYOSTAT_IMAGE=ghcr.io/cryostatio/cryostat-web:pr-914-ff12a36baf68e67a26c2abbd7f472aa8837efe07 sh smoketest.sh

maxcao13

Looks great!

tthvo added the feat New feature or request label Mar 20, 2023

mergify bot added the safe-to-test label Mar 20, 2023

tthvo mentioned this pull request Mar 20, 2023

[Task] Remove explicit mention of JMX for Stored Credentials #900

Closed

tthvo changed the title ~~feat(matchExpr): topology-based match expression evaluator~~ feat(matchExpr): match expression visualizer Mar 20, 2023

tthvo force-pushed the match-expr-vis branch 3 times, most recently from 18bfa62 to e4e0b0c Compare March 21, 2023 04:10

tthvo force-pushed the match-expr-vis branch from e4e0b0c to 79dd595 Compare March 21, 2023 05:28

cryostatio deleted a comment from github-actions bot Mar 21, 2023

tthvo force-pushed the match-expr-vis branch 2 times, most recently from 66f60d7 to 12e0ad3 Compare March 21, 2023 18:12

tthvo requested review from andrewazores and maxcao13 March 21, 2023 18:13

tthvo marked this pull request as ready for review March 21, 2023 18:13

tthvo mentioned this pull request Mar 21, 2023

[Story] Consistent unit test framework #848

Open

6 tasks

tthvo force-pushed the match-expr-vis branch from 5973510 to 14687f6 Compare March 21, 2023 20:03

chore(topology): hide action menu if no actions are available

57a204e

tthvo force-pushed the match-expr-vis branch from d2a12d5 to 57a204e Compare March 21, 2023 22:01

fix(actions): fix menu append location

8dd7051

chore(cred): reword modal title

56c320e

fix(matchExpr): remove action to reset match expression

17e0bb5

chore(matchExpr): rename components

3ed4d7c

maxcao13 reviewed Mar 22, 2023

View reviewed changes

src/app/SecurityPanel/Credentials/CreateCredentialModal.tsx Show resolved Hide resolved

maxcao13 reviewed Mar 22, 2023

View reviewed changes

src/app/Rules/CreateRule.tsx Outdated Show resolved Hide resolved

maxcao13 reviewed Mar 22, 2023

View reviewed changes

src/app/SecurityPanel/Credentials/CreateCredentialModal.tsx Outdated Show resolved Hide resolved

chore(matchExpr): clean up and save graph positions

ff12a36

Signed-off-by: Thuan Vo <[email protected]>

tthvo force-pushed the match-expr-vis branch from 3566997 to ff12a36 Compare March 22, 2023 20:14

maxcao13 approved these changes Mar 22, 2023

View reviewed changes

andrewazores merged commit 547a37d into cryostatio:main Mar 22, 2023

tthvo deleted the match-expr-vis branch March 22, 2023 22:44

tthvo mentioned this pull request Mar 23, 2023

feat(cred): credential test table #920

Merged

11 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(matchExpr): match expression visualizer #914

feat(matchExpr): match expression visualizer #914

tthvo commented Mar 20, 2023 •

edited

Loading

tthvo commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

tthvo commented Mar 21, 2023 •

edited

Loading

github-actions bot commented Mar 21, 2023

andrewazores commented Mar 21, 2023

tthvo commented Mar 21, 2023 •

edited

Loading

tthvo commented Mar 21, 2023

tthvo commented Mar 21, 2023 •

edited

Loading

github-actions bot commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

andrewazores commented Mar 21, 2023

andrewazores commented Mar 21, 2023

tthvo commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

tthvo commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

tthvo commented Mar 21, 2023 •

edited

Loading

github-actions bot commented Mar 21, 2023

github-actions bot commented Mar 22, 2023

andrewazores commented Mar 22, 2023

maxcao13 commented Mar 22, 2023

maxcao13 commented Mar 22, 2023

tthvo commented Mar 22, 2023

tthvo commented Mar 22, 2023

github-actions bot commented Mar 22, 2023

maxcao13 left a comment

feat(matchExpr): match expression visualizer #914

feat(matchExpr): match expression visualizer #914

Conversation

tthvo commented Mar 20, 2023 • edited Loading

Welcome to Cryostat! 👋

Before contributing, make sure you have:

Description of the change:

Motivation for the change:

How to manually test:

Screenshots

Credential Modal

Create Rule Form

Match Expression Hint

tthvo commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

tthvo commented Mar 21, 2023 • edited Loading

github-actions bot commented Mar 21, 2023

andrewazores commented Mar 21, 2023

tthvo commented Mar 21, 2023 • edited Loading

tthvo commented Mar 21, 2023

tthvo commented Mar 21, 2023 • edited Loading

github-actions bot commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

andrewazores commented Mar 21, 2023

andrewazores commented Mar 21, 2023

tthvo commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

tthvo commented Mar 21, 2023

github-actions bot commented Mar 21, 2023

tthvo commented Mar 21, 2023 • edited Loading

github-actions bot commented Mar 21, 2023

github-actions bot commented Mar 22, 2023

andrewazores commented Mar 22, 2023

maxcao13 commented Mar 22, 2023

maxcao13 commented Mar 22, 2023

tthvo commented Mar 22, 2023

tthvo commented Mar 22, 2023

github-actions bot commented Mar 22, 2023

maxcao13 left a comment

Choose a reason for hiding this comment

tthvo commented Mar 20, 2023 •

edited

Loading

tthvo commented Mar 21, 2023 •

edited

Loading

tthvo commented Mar 21, 2023 •

edited

Loading

tthvo commented Mar 21, 2023 •

edited

Loading

tthvo commented Mar 21, 2023 •

edited

Loading