Skip to content

Alert for unattached variables#628

Open
Shmerlard wants to merge 2 commits into
Autonomy-Logic:developmentfrom
Shmerlard:alert-for-unattached-variables
Open

Alert for unattached variables#628
Shmerlard wants to merge 2 commits into
Autonomy-Logic:developmentfrom
Shmerlard:alert-for-unattached-variables

Conversation

@Shmerlard
Copy link
Copy Markdown

@Shmerlard Shmerlard commented Feb 26, 2026

Pull request info

References

this PR adds a visual feedback for orphaned variables

resolves #552

Description of the changes proposed

  • Added a TriangleAlert warning icon next to the variable name.
  • Implemented a Tooltip that appears on hover, explicitly stating "Unused variable" to clarify the indicator's meaning to the user.

DOD checklist

  • The code is complete and according to developers’ standards.
  • I have performed a self-review of my code.
  • Meet the acceptance criteria.
  • Unit tests are written and green.
  • Test coverage: __ %.
  • Integration tests are written and green.
  • Changes were communicated and updated in the ticket description.
  • Reviewed and accepted by the Product Owner.
  • End-to-end test are successful.
2026-02-26.11-30-07.mp4

Summary by CodeRabbit

  • New Features
    • The variables table now identifies and highlights unused variables. Variables with no references are displayed in red text with a warning icon indicator. Hovering over the indicator displays an "Unused variable" tooltip to help identify variables that may be safely removed.

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Feb 26, 2026

Walkthrough

Added orphaned variable detection to EditableNameCell component. When a variable has no references in the codebase, its name displays in red with a tooltip alert icon indicating "Unused variable". The detection logic analyzes references based on scope, variable class, and debugger state.

Changes

Cohort / File(s) Summary
Orphaned Variable Detection
src/renderer/components/_molecules/variables-table/editable-cell.tsx
Introduced isOrphaned computation to identify variables with no references; displays red text and TriangleAlert tooltip icon when orphaned. Added imports for TriangleAlert and Tooltip components. Adjusted text container width from 400px to 380px and restructured rendering to wrap HighlightedText with conditional icon display.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 A cottontail's delight in code so neat,
Variables orphaned now meet their defeat!
With crimson text and a triangle's wise call,
No lonely code lingers—we'll flag them all! ✨

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed The title 'Alert for unattached variables' is clear, concise, and directly describes the main change—adding visual feedback for orphaned/unused variables.
Description check ✅ Passed The description includes the issue reference (#552), explains the changes (TriangleAlert icon and Tooltip), and provides a DOD checklist. However, several DOD items remain unchecked, indicating incomplete adherence to the template.
Linked Issues check ✅ Passed The PR adds visual identification of orphaned variables through a TriangleAlert icon and tooltip, directly addressing issue #552's requirement to surface unused declarations for cleanup.
Out of Scope Changes check ✅ Passed All changes are focused on adding visual feedback for orphaned variables in the editable-cell component, aligning with issue #552 requirements. No out-of-scope changes detected.
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 unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Tip

Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs).
Share your feedback on Discord.


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

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

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (3)
src/renderer/components/_molecules/variables-table/editable-cell.tsx (3)

332-332: Remove empty object from cn() call.

The empty object {} passed to cn() is unnecessary.

🧹 Minor cleanup
-            className={cn('h-4 max-w-[380px] overflow-hidden text-ellipsis break-all', {})}
+            className={cn('h-4 max-w-[380px] overflow-hidden text-ellipsis break-all')}
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@src/renderer/components/_molecules/variables-table/editable-cell.tsx` at line
332, The cn() call in the JSX (inside the EditableCell component) includes an
unnecessary empty object as a second argument; remove the empty object so the
className prop uses cn('h-4 max-w-[380px] overflow-hidden text-ellipsis
break-all') instead, leaving the rest of the JSX untouched.

334-347: Add accessibility attributes to the warning icon.

The TriangleAlert icon provides important visual feedback, but screen reader users won't receive this information since there's no accessible label. Consider adding an aria-label or using sr-only text.

♿ Proposed accessibility improvement
             {isOrphaned && (
               <TooltipProvider delayDuration={0}>
                 <Tooltip>
                   <TooltipTrigger asChild>
-                    <div className='flex items-center justify-center'>
-                      <TriangleAlert className='h-4 w-4 text-red-500' />
+                    <div className='flex items-center justify-center' role='img' aria-label='Unused variable'>
+                      <TriangleAlert className='h-4 w-4 text-red-500' aria-hidden='true' />
                     </div>
                   </TooltipTrigger>
                   <TooltipContent>
                     <p>Unused variable</p>
                   </TooltipContent>
                 </Tooltip>
               </TooltipProvider>
             )}
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@src/renderer/components/_molecules/variables-table/editable-cell.tsx` around
lines 334 - 347, The warning icon (TriangleAlert) shown when isOrphaned is true
is not accessible to screen readers; update the Tooltip/TooltipTrigger block to
provide an accessible label for the icon by either adding an aria-label (e.g.,
aria-label="Unused variable") and role="img" to the TriangleAlert element or by
rendering visually-hidden text (sr-only) alongside the icon inside
TooltipTrigger so screen readers announce "Unused variable"; ensure
TooltipContent still provides the same message for sighted users and keep the
existing visual markup (Tooltip, TooltipTrigger, TooltipContent, TriangleAlert)
intact.

263-278: Consider memoization strategy for large variable tables.

The findAllReferencesToVariable call iterates through POUs and flows on every dependency change. With many variables in the table, this could cause performance degradation since each row computes its orphan status independently.

A few observations:

  1. The dependency on pous, ladderFlows, and fbdFlows means any edit to any flow will trigger recalculation for all variable rows.
  2. isExternalVariable in the dependency array is derived from variable?.class, so variable alone would suffice, though this is harmless.

For now this is acceptable, but if performance issues arise, consider lifting the orphan computation to a parent component that batch-processes all variables and passes down the result.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@src/renderer/components/_molecules/variables-table/editable-cell.tsx` around
lines 263 - 278, The per-row useMemo calling findAllReferencesToVariable (used
in isOrphaned) causes repeated expensive scans whenever
pous/ladderFlows/fbdFlows change; move the orphan computation out of
editable-cell.tsx into a parent (e.g., create computeOrphanStatusForAllVariables
or buildVariableOrphanMap) that runs once and returns a map keyed by variable
name/id, then pass the boolean down to each row; also simplify dependencies by
using variable (not isExternalVariable) where appropriate and memoize the parent
computation with useMemo using stable keys (e.g., flows versions/counts, scope,
editor.meta.name) so rows only read the precomputed isOrphaned value instead of
calling findAllReferencesToVariable themselves.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@src/renderer/components/_molecules/variables-table/editable-cell.tsx`:
- Line 332: The cn() call in the JSX (inside the EditableCell component)
includes an unnecessary empty object as a second argument; remove the empty
object so the className prop uses cn('h-4 max-w-[380px] overflow-hidden
text-ellipsis break-all') instead, leaving the rest of the JSX untouched.
- Around line 334-347: The warning icon (TriangleAlert) shown when isOrphaned is
true is not accessible to screen readers; update the Tooltip/TooltipTrigger
block to provide an accessible label for the icon by either adding an aria-label
(e.g., aria-label="Unused variable") and role="img" to the TriangleAlert element
or by rendering visually-hidden text (sr-only) alongside the icon inside
TooltipTrigger so screen readers announce "Unused variable"; ensure
TooltipContent still provides the same message for sighted users and keep the
existing visual markup (Tooltip, TooltipTrigger, TooltipContent, TriangleAlert)
intact.
- Around line 263-278: The per-row useMemo calling findAllReferencesToVariable
(used in isOrphaned) causes repeated expensive scans whenever
pous/ladderFlows/fbdFlows change; move the orphan computation out of
editable-cell.tsx into a parent (e.g., create computeOrphanStatusForAllVariables
or buildVariableOrphanMap) that runs once and returns a map keyed by variable
name/id, then pass the boolean down to each row; also simplify dependencies by
using variable (not isExternalVariable) where appropriate and memoize the parent
computation with useMemo using stable keys (e.g., flows versions/counts, scope,
editor.meta.name) so rows only read the precomputed isOrphaned value instead of
calling findAllReferencesToVariable themselves.

ℹ️ Review info

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • Linear integration is disabled

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 8f775a1 and 8f830e3.

📒 Files selected for processing (1)
  • src/renderer/components/_molecules/variables-table/editable-cell.tsx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Deleting unused variables, functions, or function blocks

1 participant