Feature Request: Add edit and detail UI for NetworkPolicies

[bashofmann]

Detailed Description
Add a UI to edit and viel NetworkPolicies.

Context
NetworkPolicies are one of the more complex Kubernetes resources. But they are also frequently used in enterprise contexts to restrict incoming and outgoing traffic of pods. A UI would make this much more accessible, especially for Kubernetes beginners.

[Jono-SUSE-Rancher]

Hey @richard-cox - could you do me a favor and maybe provide some clarification on what QA would be checking here since this would be a brand new page? Is there a specific happy-path that they would want to follow to ensure proper coverage?

[richard-cox]

@Jono-SUSE-Rancher There's some more detail in the PRs description (including screenshots). Otherwise @bashofmann Would be able to provide some better info.

[bashofmann]

You should be able to create and edit network policies as a form which results in valid manifests (https://kubernetes.io/docs/concepts/services-networking/network-policies/).

If you need inspiration for some valid NetworkPolicies that should be also create-able through the UI form, this repo has some examples: https://github.com/ahmetb/kubernetes-network-policy-recipes.

Not sure if you want to also then test the underlying NetworkPolicy functionality of Kubernetes.

[cmurphy]

Validating 3b2677f:

🔴 Issues found:

• Error banner shown when creating ingress rule exception:

The CIDR is not invalid, and there's no explanation given for the error. It goes away once you enter the exception:

🟡 Minor issues with selectors (probably not a blocker):

• The UI only has a way to input matchExpressions, which may be confusing for users following a guide that uses matchLabels (example; doc):

• You can't just tab from key to value, tabbing through causes you to tab into the operator selector menu:

• Generated selector has duplicated expressions:

🟢 Looks good:

• can create a deny-all rule by not adding any ingress rules
• can create an allow-all rule by adding an empty ingress rule
• can create rules with multiple selectors
• can create rules with multiple egress ports

@bashofmann can you check at least the first issue (the error banner)?

[jtravee]

Confirmed with @catherineluse and @gaktive to add release note label.

[richard-cox]

#5428 Resolves the critical issue (improved form validation will come in with #4999 , but that's targetted at 2.6.5). Other issues are fine for 2.6.4

[cmurphy]

@richard-cox the error is still happening but with a different message now:

This is on 417d4a4

[richard-cox]

@cmurphy The error message is correct, there's an invalid Exception

[cmurphy]

@richard-cox the message appears as soon as "Add exception" is clicked, before the user has even had a chance to enter anything in the Exceptions field and before the save button is clicked. It also still appears above the CIDR field instead of above the Exceptions field.

[richard-cox]

I've created #5446 to cover the position of the validation message (and fix another bug). However the visibility of the initial state (where the error is shown when the user hasn't entered anything) is out of scope for this issue. It involves either tracking touched state in the ArrayList or applying per ArrayList item validation, both should be tackle as part of the wider Form validation changes brought in by @Sean-McQ

[cmurphy]

Verified on 024e6fa ✔️

The Exception error message is now below the Exception field