frontend: network: Add support for Admin Network Policy resources #3601

frozenprocess · 2025-07-09T04:03:12Z

This change adds CRUD support for ANP.

Summary

This PR adds/fixes [feature/bug] by [brief description of what the change does].

frontend: Add support for ANP resources which can be found under the Network section.

Related Issue

Fixes #3575

Changes

Added an ANP component to the UI
Added a Kube Object to headlamp lib to represent ANP

[ x ] Having a dedicated sub menu link in the Network section for ANPs
[ x ] Create ANPs using the + button in the ANP link
[ x ] ANP List view
[ x ] ANP Detail view

Steps to Test

Navigate to Network section
Click on Admin Network policies (alpha)
2a. create an ANP
2b. view your ANP
2c. delete your ANP
submit a feedback here :)

Screenshots (if applicable)

Notes for the Reviewer

[e.g., This touches the i18n layer, so please check language consistency.]

k8s-ci-robot · 2025-07-09T04:03:21Z

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: frozenprocess
Once this PR has been reviewed and has the lgtm label, please assign illume for approval. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Needs approval from an approver in each of these files:

OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

k8s-ci-robot · 2025-07-09T04:03:22Z

Welcome @frozenprocess!

It looks like this is your first PR to kubernetes-sigs/headlamp 🎉. Please refer to our pull request process documentation to help your PR have a smooth ride to approval.

You will be prompted by a bot to use commands during the review process. Do not be afraid to follow the prompts! It is okay to experiment. Here is the bot commands documentation.

You can also check if kubernetes-sigs/headlamp has its own contribution guidelines.

You may want to refer to our testing guide if you run into trouble with your tests not passing.

If you are having difficulty getting your pull request seen, please follow the recommended escalation practices. Also, for tips and tricks in the contribution process you may want to read the Kubernetes contributor cheat sheet. We want to make sure your contribution gets all the attention it needs!

Thank you, and welcome to Kubernetes. 😃

frozenprocess · 2025-07-18T05:34:42Z

I could use a bit of help on this. Unlike KNP, ANPs have subject which could be either pods or namespaces. I'm trying to find a good way to represent them

method one: we use icon and labels with a tooltip that explains each icon if you hover over it

2. Method two: we use text

Judges? :)

mazdakn · 2025-07-18T16:04:16Z

@frozenprocess I personally think option 2 is better than 1. But is it possible to use icons before each subject selector for differentiation?

frozenprocess · 2025-07-22T05:32:22Z

@frozenprocess I personally think option 2 is better than 1. But is it possible to use icons before each subject selector for differentiation?

Yep, did some testing and it is possible to put an icon before each subject selector.

ANP - Alpha support - This change adds CRUD support for ANP. - Added an ANP component to the UI - Added a Kube Object to headlamp lib to represent ANP

frozenprocess · 2025-10-05T18:49:52Z

Admin network policy is going through some changes, and it will be renamed. However, this will not change our effort to have it ready for the Beta release in Headlamp.

Copilot

Pull Request Overview

Adds CRUD support for Admin Network Policy (ANP) resources in the frontend, integrating them into the Network section of the UI.

Added AdminNetworkPolicy Kubernetes object class with TypeScript interfaces
Implemented list and detail views for ANP resources
Added routing and sidebar navigation for ANP pages

Reviewed Changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
frontend/src/lib/router/index.tsx	Added routing configuration for ANP list and detail pages
frontend/src/lib/k8s/adminnetworkpolicy.tsx	Created Kubernetes object class and TypeScript interfaces for ANP resources
frontend/src/components/adminnetworkpolicy/List.tsx	Implemented list view component displaying ANP resources in a table
frontend/src/components/adminnetworkpolicy/Details.tsx	Implemented detailed view component for individual ANP resources
frontend/src/components/Sidebar/useSidebarItems.ts	Added ANP entry to Network section sidebar menu

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

Copilot · 2025-10-08T22:23:59Z

frontend/src/lib/k8s/adminnetworkpolicy.tsx

+              },
+            },
+          ],
+          name: 'default-egress',


The ingress rule is incorrectly named 'default-egress' when it should be 'default-ingress'.

Suggested change

name: 'default-egress',

name: 'default-ingress',

Copilot · 2025-10-08T22:24:00Z

frontend/src/lib/k8s/adminnetworkpolicy.tsx

+export interface AdminNetworkPolicyPort {
+  portNumber?: Port;
+  namedPort?: string;
+  portRange?: Port;


The portRange field should be of type PortRange, not Port, to match the interface definition.

Suggested change

portRange?: Port;

portRange?: PortRange;

Copilot · 2025-10-08T22:24:00Z

frontend/src/components/adminnetworkpolicy/List.tsx

+              adminnetworkpolicy?.jsonData?.spec?.egress?.length ??
+              adminnetworkpolicy?.jsonData?.spec?.ingress?.length,


This logic incorrectly returns ingress length when egress is 0, instead of summing both ingress and egress rule counts. Should be (adminnetworkpolicy?.jsonData?.spec?.egress?.length ?? 0) + (adminnetworkpolicy?.jsonData?.spec?.ingress?.length ?? 0).

Suggested change

adminnetworkpolicy?.jsonData?.spec?.egress?.length ??

adminnetworkpolicy?.jsonData?.spec?.ingress?.length,

(adminnetworkpolicy?.jsonData?.spec?.egress?.length ?? 0) +

(adminnetworkpolicy?.jsonData?.spec?.ingress?.length ?? 0),

Copilot · 2025-10-08T22:24:01Z

frontend/src/components/adminnetworkpolicy/Details.tsx

+                AdminNetworkPolicy.jsonData?.spec?.subject?.namespaces?.namespaceSelector
+                  ?.matchLabels


The property path is incorrect. Based on the interface definition, it should be AdminNetworkPolicy.jsonData?.spec?.subject?.namespaces?.matchLabels (namespaces is a LabelSelector, not containing a namespaceSelector property).

Suggested change

AdminNetworkPolicy.jsonData?.spec?.subject?.namespaces?.namespaceSelector

?.matchLabels

AdminNetworkPolicy.jsonData?.spec?.subject?.namespaces?.matchLabels

Copilot · 2025-10-08T22:24:01Z

frontend/src/components/adminnetworkpolicy/Details.tsx

+                </>
+              ) : (
+                <Typography sx={metadataStyles} display="inline">
+                  All Pods


This text should be 'All Namespaces' since we're handling the namespaces subject case, not pods.

Suggested change

All Pods

All Namespaces

illume · 2025-10-08T22:26:49Z

Admin network policy is going through some changes, and it will be renamed. However, this will not change our effort to have it ready for the Beta release in Headlamp.

Great. Looking forward to this. Please let us know if you have any questions in the mean time?

I see there are some errors in the GitHub checks... here's some tips:

You can update the snapshot tests with this: npm run test -- -u
npm run tsc to run the type checker

k8s-ci-robot added do-not-merge/work-in-progress Indicates that a PR should not merge because it is a work in progress. cncf-cla: yes Indicates the PR's author has signed the CNCF CLA. labels Jul 9, 2025

k8s-ci-robot requested review from sniok and vyncent-t July 9, 2025 04:03

k8s-ci-robot added the size/XL Denotes a PR that changes 500-999 lines, ignoring generated files. label Jul 9, 2025

frozenprocess force-pushed the anp branch from 81f5de4 to 29272b1 Compare July 18, 2025 04:21

frozenprocess mentioned this pull request Jul 18, 2025

Support for Admin Network Policy resources #3575

Open

5 tasks

k8s-ci-robot added the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Sep 5, 2025

frontend: network: Add support for Admin Network Policy resources

959fc62

ANP - Alpha support - This change adds CRUD support for ANP. - Added an ANP component to the UI - Added a Kube Object to headlamp lib to represent ANP

frozenprocess force-pushed the anp branch from 6632648 to 959fc62 Compare October 5, 2025 18:47

k8s-ci-robot removed the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Oct 5, 2025

illume requested a review from Copilot October 8, 2025 22:23

Copilot AI reviewed Oct 8, 2025

View reviewed changes

illume added kind/feature Categorizes issue or PR as related to a new feature. frontend Issues related to the frontend k8s Kubernetes compatibility-related issues/features labels Oct 8, 2025

		adminnetworkpolicy?.jsonData?.spec?.egress?.length ??
		adminnetworkpolicy?.jsonData?.spec?.ingress?.length,

		AdminNetworkPolicy.jsonData?.spec?.subject?.namespaces?.namespaceSelector
		?.matchLabels

frontend: network: Add support for Admin Network Policy resources #3601

Are you sure you want to change the base?

frontend: network: Add support for Admin Network Policy resources #3601

Uh oh!

Conversation

frozenprocess commented Jul 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Related Issue

Changes

Steps to Test

Screenshots (if applicable)

Notes for the Reviewer

Uh oh!

k8s-ci-robot commented Jul 9, 2025

Uh oh!

k8s-ci-robot commented Jul 9, 2025

Uh oh!

frozenprocess commented Jul 18, 2025

Uh oh!

mazdakn commented Jul 18, 2025

Uh oh!

frozenprocess commented Jul 22, 2025

Uh oh!

frozenprocess commented Oct 5, 2025

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

illume commented Oct 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

frozenprocess commented Jul 9, 2025 •

edited

Loading

illume commented Oct 8, 2025 •

edited

Loading