CtrlK
BlogDocsLog inGet started
Tessl Logo

uinaf/react-ban-use-effect

Ban direct `useEffect` in React components. Use when writing, refactoring, or reviewing React code so derived state, data fetching, user actions, resets, and mount-only external synchronization use declarative replacement patterns instead of dependency-array choreography.

95

1.02x
Quality

95%

Does it follow best practices?

Impact

98%

1.02x

Average score across 4 eval scenarios

SecuritybySnyk

Passed

No known issues

Overview
Quality
Evals
Security
Files

criteria.jsonevals/scenario-4/

{
  "context": "Tests whether react-ban-use-effect replaces direct effects used for derived state and fetching with render-time derivation plus the repo's existing TanStack Query library pattern.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "No direct useEffect",
      "description": "The refactored component does not import `useEffect`, call `useEffect`, or call `React.useEffect`",
      "max_score": 18
    },
    {
      "name": "Derived during render",
      "description": "Visible projects are derived during render from query data and `showArchived`, not copied into local state by an effect",
      "max_score": 16
    },
    {
      "name": "Existing query pattern used",
      "description": "Server data fetching uses the TanStack Query library and the existing `projectsQuery`/`queryOptions` pattern rather than a fetch-in-effect or new dependency",
      "max_score": 16
    },
    {
      "name": "Abort signal preserved",
      "description": "The data path preserves the query function's AbortSignal-aware fetch behavior",
      "max_score": 8
    },
    {
      "name": "No mirrored state",
      "description": "The solution does not keep redundant `projects` or `visible` state solely to mirror query data or props",
      "max_score": 10
    },
    {
      "name": "Behavior preserved",
      "description": "The rendered list still filters archived projects when `showArchived` is false and includes them when true",
      "max_score": 10
    },
    {
      "name": "Effect categories explained",
      "description": "The notes classify the original effects as data fetching/server state and render-time derivation",
      "max_score": 10
    },
    {
      "name": "Verification named",
      "description": "The notes include lint/type/test guardrails and a component or UI check for the filtering behavior",
      "max_score": 12
    }
  ]
}

SKILL.md

tile.json