Prefer Use Reducer

Error

small-rules/prefer-use-reducer

Suggest using useReducer for related state updates instead of multiple useState calls.

Diagnostic Messages

excessiveUseState

Component "{{componentName}}" has {{useStateCount}} useState calls — consider useReducer for related state

Configuration

This rule does not accept options.

{
  "jsPlugins": [
    "@pobammer-ts/small-rules"
  ],
  "rules": {
    "small-rules/prefer-use-reducer": "error"
  }
}

Examples

Too many state hooks

import { useState } from "@rbxts/react";

function Component() {
  const [firstValue] = useState(0);
  const [secondValue] = useState(0);
  const [thirdValue] = useState(0);
  const [fourthValue] = useState(0);
  const [fifthValue] = useState(0);
}

Few state hooks

import { useState } from "@rbxts/react";

function Component() {
  const [firstValue] = useState(0);
  const [secondValue] = useState(0);
  const [thirdValue] = useState(0);
  const [fourthValue] = useState(0);
}

Related Rules

No Cascading Set StateRelatedCascading setState in effects is the runtime symptom prefer-use-reducer is meant to prevent.Prefer Constant DispatchDepends On ConceptConstant action objects only matter once related state is modeled with useReducer.No God ComponentsStrengthensGod-component scoring includes state-hook pressure that prefer-use-reducer also addresses.