Skip to content

chore(eslint): enable @eslint-react/use-state rule - #1059

Merged
carlosthe19916 merged 5 commits into
guacsec:mainfrom
carlosthe19916:hotfix/enable-use-state
Jul 13, 2026
Merged

chore(eslint): enable @eslint-react/use-state rule#1059
carlosthe19916 merged 5 commits into
guacsec:mainfrom
carlosthe19916:hotfix/enable-use-state

Conversation

@carlosthe19916

@carlosthe19916 carlosthe19916 commented May 27, 2026

Copy link
Copy Markdown
Collaborator

Summary

  • Remove the @eslint-react/use-state override from ESLint config
  • Use lazy initial state (() => ...) for useState calls that involve function calls or object construction to prevent re-computation on every render
  • Suppress rule for one intentional non-standard destructuring in usePersistentState

Test plan

  • npm run lint passes with 0 warnings

🤖 Generated with Claude Code

Summary by Sourcery

Enable the @eslint-react/use-state rule and update state initialization patterns to comply with it.

Enhancements:

  • Switch React useState calls that perform computations or object construction to lazy initialization to avoid re-running logic on every render.
  • Add an inline eslint suppression for an intentionally non-standard useState tuple stored in the persistent state map.

Build:

  • Remove the @eslint-react/use-state override from the ESLint configuration so the rule is enforced.

@sourcery-ai

sourcery-ai Bot commented May 27, 2026

Copy link
Copy Markdown
Contributor
Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Enables the @eslint-react/use-state ESLint rule by removing its override and updating React useState usage patterns to use lazy initializers where computation or object construction occurs, while explicitly suppressing the rule for a deliberate tuple-based useState usage in usePersistentState.

Sequence diagram for lazy useState initialization after enabling eslint-react-use-state

sequenceDiagram
  participant useSelectionState
  participant React
  participant doSelect

  useSelectionState->>React: useState(() => doSelect(isEqual, items, initialSelected)
  alt [initial render]
    React->>doSelect: doSelect(isEqual, items, initialSelected)
    doSelect-->>React: selected
    React-->>useSelectionState: selectedSet, setSelectedSet
  else [subsequent renders]
    React-->>useSelectionState: selectedSet, setSelectedSet
  end
Loading

File-Level Changes

Change Details Files
Adopt lazy initializers for useState calls that perform computation or object construction.
  • Wrap doSelect(...) call in useSelectionState in a lazy initializer function for React.useState so the selection is only computed on initial render.
  • Wrap getValueFromStorage(...) call in useStorage in a lazy initializer function for React.useState so storage is only read on initial render.
  • Change the Set construction used to initialize expandedNodeIds in SbomGroupsProvider to use a lazy initializer arrow function to avoid creating a new Set on every render.
client/src/app/hooks/useSelectionState.ts
client/src/app/hooks/useStorage.ts
client/src/app/pages/sbom-groups/sbom-groups-provider.tsx
Document and suppress the use-state lint rule for an intentional tuple-based useState usage in persistent state handling.
  • Add an inline ESLint disable-next-line comment for @eslint-react/use-state above the tuple-form React.useState usage in the persistence object to preserve its current API while satisfying linting elsewhere.
client/src/app/hooks/usePersistentState.ts
Enable @eslint-react/use-state ESLint rule globally by cleaning up ESLint configuration.
  • Remove the override that turned off @eslint-react/use-state in the ESLint config so the rule now runs project-wide.
eslint.config.mjs

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Hey - I've reviewed your changes and they look great!


Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

@codecov

codecov Bot commented May 27, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 53.36%. Comparing base (fb9c2cf) to head (5103f20).

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #1059      +/-   ##
==========================================
+ Coverage   53.30%   53.36%   +0.06%     
==========================================
  Files         270      270              
  Lines        5878     5877       -1     
  Branches     1845     1844       -1     
==========================================
+ Hits         3133     3136       +3     
+ Misses       2441     2437       -4     
  Partials      304      304              
Flag Coverage Δ
e2e 70.97% <100.00%> (+0.02%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@carlosthe19916
carlosthe19916 marked this pull request as draft May 27, 2026 12:14
Use lazy initial state for useState calls that involve function
calls or object construction to prevent re-computation on every render.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@carlosthe19916
carlosthe19916 force-pushed the hotfix/enable-use-state branch from f2e3c60 to c6e0986 Compare June 1, 2026 11:18
# Conflicts:
#	client/src/app/pages/home/watched-sboms-provider.tsx
@carlosthe19916
carlosthe19916 marked this pull request as ready for review July 1, 2026 11:35

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Hey - I've left some high level feedback:

  • In usePersistentState, consider wrapping the React.useState(defaultValue) tuple in a small helper (e.g. createPersistentState(defaultValue)) or a dedicated type alias so the intentional tuple shape is clearer and the eslint-disable comment is less surprising to future readers.
Prompt for AI Agents
Please address the comments from this code review:

## Overall Comments
- In `usePersistentState`, consider wrapping the `React.useState(defaultValue)` tuple in a small helper (e.g. `createPersistentState(defaultValue)`) or a dedicated type alias so the intentional tuple shape is clearer and the eslint-disable comment is less surprising to future readers.

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

@carlosthe19916
carlosthe19916 enabled auto-merge July 2, 2026 09:33
@carlosthe19916
carlosthe19916 added this pull request to the merge queue Jul 13, 2026
Merged via the queue into guacsec:main with commit 81bde64 Jul 13, 2026
19 checks passed
@github-project-automation github-project-automation Bot moved this to Done in Trustify Jul 13, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

3 participants