chore: Improving click and select actions in PZ certification BED-7356

[LucasParraF]

Description

While working on Certifications Table, the Data Table was managing the state of the selected rows. Now Data Table will manage the state of the of selectedRow if it is undefined adding more flexibility to the DataTable.

Motivation and Context

Resolves BED-7356

How Has This Been Tested?

Tested locally

Screenshots (optional):

Types of changes

• Chore (a change that does not modify the application functionality)

Checklist:

• I have met the contributing prerequisites
  • Assigned myself to this PR
  • Added the appropriate labels
  • Associated an issue: Issues and Pull Requests README #672
  • Read the Contributing guide: https://github.com/SpecterOps/BloodHound/wiki/Contributing
• I have ensured that related documentation is up-to-date
  • Open API docs
  • Code comments (GoDocs / JSDocs)
• I have followed proper test practices
  • Added/updated tests to cover my changes
  • All new and existing tests passed

Summary by CodeRabbit

• Bug Fixes
  • Fixed DataTable row click selection behavior to properly handle cases where row selection is externally controlled versus internally managed. Clicking a row now correctly responds based on the selection context.

[coderabbitai]

📝 Walkthrough

Walkthrough

Modified row click selection logic in DataTable component to be conditional on selectedRow presence. When selectedRow is undefined, clicking toggles TanStack rowSelection. When provided, the component only invokes onRowClick callback without mutating internal rowSelection. Updated hook dependencies accordingly.

Changes

Cohort / File(s)	Summary
Row Click Selection Logic packages/javascript/doodle-ui/src/components/DataTable/DataTable.tsx	Modified handleRowClick to conditionally toggle rowSelection based on whether selectedRow is defined. When undefined, mutation occurs; when provided, only onRowClick callback is invoked. Updated hook dependencies to include selectedRow.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'chore: Improving click and select actions in PZ certification BED-7356' clearly relates to the main change of improving row click and selection logic in the DataTable component.
Description check	✅ Passed	The description covers the main change and motivation, though testing details are minimal and motivation section lacks depth beyond the ticket reference.
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

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch BED-7356-Improving-click-and-select-actions-in-PZ-certifications

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@packages/javascript/doodle-ui/src/components/DataTable/DataTable.tsx`:
- Around line 204-206: The selection-control predicate is inconsistent: one
branch checks selectedRow === undefined while the state-sync effect uses
truthy/falsy checks, which breaks when IDs are falsy (e.g., 0 or ""). Update the
state-sync effect to use the same explicit undefined check (selectedRow ===
undefined) or change both places to use a single canonical predicate (e.g.,
selectedRow === undefined for uncontrolled) so selection clearing is consistent;
locate the logic around selectedRow, the branch using
table.getState().rowSelection[row.id], and the state-sync effect and make their
checks identical.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository YAML (base), Organization UI (inherited)

Review profile: CHILL

Plan: Pro

Run ID: 41149027-c339-4cf8-90f2-3797a37053f0

📥 Commits

Reviewing files that changed from the base of the PR and between 827822b and 55082e0.

📒 Files selected for processing (1)

• packages/javascript/doodle-ui/src/components/DataTable/DataTable.tsx

[coderabbitai]

⚠️ Potential issue | 🟡 Minor

Use one consistent controlled/uncontrolled predicate.

This branch uses selectedRow === undefined, but the state-sync effect uses truthy/falsy checks. That mismatch can behave differently for falsy-but-defined IDs and lead to unexpected selection clearing.

Proposed alignment

-    useEffect(() => {
-        if (!selectedRow && table.getIsSomeRowsSelected()) {
+    useEffect(() => {
+        if (selectedRow === undefined && table.getIsSomeRowsSelected()) {
             table.setRowSelection({});
         }
 
-        if (selectedRow && !table.getState().rowSelection[selectedRow]) {
+        if (selectedRow !== undefined && !table.getState().rowSelection[selectedRow]) {
             table.setRowSelection({ [selectedRow]: true });
         }
     }, [selectedRow, table]);

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@packages/javascript/doodle-ui/src/components/DataTable/DataTable.tsx` around
lines 204 - 206, The selection-control predicate is inconsistent: one branch
checks selectedRow === undefined while the state-sync effect uses truthy/falsy
checks, which breaks when IDs are falsy (e.g., 0 or ""). Update the state-sync
effect to use the same explicit undefined check (selectedRow === undefined) or
change both places to use a single canonical predicate (e.g., selectedRow ===
undefined for uncontrolled) so selection clearing is consistent; locate the
logic around selectedRow, the branch using
table.getState().rowSelection[row.id], and the state-sync effect and make their
checks identical.