CONSOLE-4983: Add Groups to node details

[jeff-phillips-18]

Description

Adds Groups to node details by adding annotations to a Node object.
Uses the node.openshift.io/group annotation to defined a comma separated list of group names for the node.
Adds a column to the Nodes list page for each node showing its groups.
Adds a Group editor modal to allow users to create/update/remove groups.
Adds a details item to the Node details page showing the groups for the node.
Adds a node group editor modal to allow users to edit the groups for the node.

Screenshots

Nodes list page:

Edit Groups Modal

Node Overview

Node group editor modal

/cc @kybaker

Summary by CodeRabbit

Release Notes

• New Features
  • Added node grouping functionality to organize and select resources efficiently
  • New "Groups" column in the nodes list displaying assigned groups per node
  • Interactive modal for creating and managing groups with node assignment capabilities
  • Groups management accessible in node details with inline editing option

[openshift-ci-robot]

@jeff-phillips-18: This pull request references CONSOLE-4983 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the story to target the "4.22.0" version, but no target version was set.

Details

In response to this:

Description

Adds Groups to node details by adding annotations to a Node object.
Uses the node.openshift.io/group annotation to defined a comma separated list of group names for the node.
Adds a column to the Nodes list page for each node showing its groups.
Adds a Group editor modal to allow users to create/update/remove groups.
Adds a details item to the Node details page showing the groups for the node.
Adds a node group editor modal to allow users to edit the groups for the node.

Screenshots

Nodes list page:

Edit Groups Modal

Node Overview

Node group editor modal

/cc @kybaker

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[openshift-ci]

@jeff-phillips-18: GitHub didn't allow me to request PR reviews from the following users: kybaker.

Note that only openshift members and repo collaborators can review this PR, and authors cannot review their own PRs.

Details

In response to this:

Description

Adds Groups to node details by adding annotations to a Node object.
Uses the node.openshift.io/group annotation to defined a comma separated list of group names for the node.
Adds a column to the Nodes list page for each node showing its groups.
Adds a Group editor modal to allow users to create/update/remove groups.
Adds a details item to the Node details page showing the groups for the node.
Adds a node group editor modal to allow users to edit the groups for the node.

Screenshots

Nodes list page:

Edit Groups Modal

Node Overview

Node group editor modal

/cc @kybaker

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

[openshift-ci]

[APPROVALNOTIFIER] This PR is NOT APPROVED

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

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

Details

Needs approval from an approver in each of these files:

• frontend/OWNERS

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

[openshift-ci-robot]

@jeff-phillips-18: This pull request references CONSOLE-4983 which is a valid jira issue.

Details

In response to this:

Description

Adds Groups to node details by adding annotations to a Node object.
Uses the node.openshift.io/group annotation to defined a comma separated list of group names for the node.
Adds a column to the Nodes list page for each node showing its groups.
Adds a Group editor modal to allow users to create/update/remove groups.
Adds a details item to the Node details page showing the groups for the node.
Adds a node group editor modal to allow users to edit the groups for the node.

Screenshots

Nodes list page:

Edit Groups Modal

Node Overview

Node group editor modal

/cc @kybaker

Summary by CodeRabbit

Release Notes

• New Features
• Added node grouping functionality to organize and select resources efficiently
• New "Groups" column in the nodes list displaying assigned groups per node
• Interactive modal for creating and managing groups with node assignment capabilities
• Groups management accessible in node details with inline editing option

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[coderabbitai]

📝 Walkthrough

Walkthrough

This pull request introduces node grouping functionality to the OpenShift Console. It adds localization strings for groups management UI, a utility module (NodeGroupUtils) for parsing and managing node group annotations, modal components (GroupsEditorModal and NodeGroupsEditorModal) for editing groups, and integrates them into the nodes page and node details card. A new SCSS module provides styling for the editor modal. The nodes page table gains a Groups column, and users can edit groups via overlay modals from both the page header and individual node details. Comprehensive test coverage is added for utilities and components.

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'CONSOLE-4983: Add Groups to node details' directly and clearly describes the primary change—adding a Groups feature to node details.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 7

🤖 Fix all issues with AI agents

In
`@frontend/packages/console-app/src/components/nodes/modals/GroupsEditorModal.tsx`:
- Around line 156-198: The onSubmit handler leaves inProgress true when there
are no changes because it only clears inProgress after Promise.all; update the
onSubmit function to handle the no-op case by checking if the computed updates
array is empty and immediately calling setInProgress(false) and closing the
modal (closeOverlay) or otherwise resetting error state, instead of only relying
on the Promise.all path; locate the logic that computes updates in onSubmit and
add this early branch before the Promise.all(updates) call so Save is re-enabled
when no patches are needed.
- Around line 128-141: Normalize and validate the new group name before adding:
in addNewGroup (and in handleNameKeyDown before calling addNewGroup) compute a
normalizedName by trimming whitespace, stripping any commas, and optionally
collapsing internal whitespace; check normalizedName is non-empty and not
already present in groupsByName, then call setGroupsByName(prev => ({ ...prev,
[normalizedName]: [] })), setSelectedGroup(normalizedName), and
setNewGroupName(''); ensure all references to newGroupName use the
normalizedName for uniqueness checks and when setting state so pasted commas or
surrounding whitespace cannot create duplicate/ambiguous group entries.
- Around line 147-154: The onReload handler updates groups but does not clear
the background-change lockout, leaving backgroundChange true and Save disabled;
update the onReload function (referencing onReload) to call
setBackgroundChange(false) (and clear any related refs if present) after
resetting currentGroupsByName and selectedGroup so the background-change lockout
is released on reload.

In
`@frontend/packages/console-app/src/components/nodes/modals/NodeGroupsEditorModal.tsx`:
- Around line 108-124: Normalize and validate the new group name in addNewGroup
and handleNameKeyDown: trim whitespace from newGroupName before checking/adding,
reject/ignore names that contain commas or are empty after trimming, and ensure
any UI state (setNewGroupName) is cleared only when a valid name was added; also
prevent calling addNewGroup from handleNameKeyDown when the trimmed name is
invalid. Use the existing addNewGroup and handleNameKeyDown functions to locate
where to apply these checks.
- Around line 130-137: The Reload handler onReload currently refreshes group
selections but doesn't reset the background-change lockout; update onReload to
also clear the background-change flag (call the state setter for that flag, e.g.
setBackgroundChange(false)) after computing updatedGroupSelections and before
returning so Save becomes enabled; locate onReload, currentGroupSelections, and
setGroupSelections in NodeGroupsEditorModal.tsx and add the single line to reset
backgroundChange state (use the actual setter name used in the file).

In
`@frontend/packages/console-app/src/components/nodes/node-dashboard/DetailsCard.tsx`:
- Around line 84-105: DetailsCard currently renders the "Edit" Button
unconditionally which allows unauthorized users to open NodeGroupsEditorModal;
add an RBAC check using useAccessReview({ group: 'core', resource: 'nodes',
verb: 'patch' }) inside the DetailsCard component and store the boolean (e.g.,
canPatchNode), then only render the Button (and its onClick launching
launchOverlay(NodeGroupsEditorModal, { node: obj })) when canPatchNode is true;
keep all other UI (getNodeGroups(obj).sort().join(', ') || DASH) unchanged.

In `@frontend/packages/console-app/src/components/nodes/NodeGroupUtils.ts`:
- Around line 20-24: The forEach callback in getExistingGroups implicitly
returns the value from uniqueGroups.add(group), violating
useIterableCallbackReturn; update the inner forEach to use a block-bodied
callback that does not return anything (e.g.,
getNodeGroups(node).forEach((group) => { uniqueGroups.add(group); });) or
replace the nested forEach with a for...of loop over getNodeGroups(node) so
getExistingGroups (and the uniqueGroups Set usage) has no callback return value.

[jeff-phillips-18]

/retest

[openshift-ci]

@jeff-phillips-18: all tests passed!

Full PR test history. Your PR dashboard.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here.