🐛 useExhaustiveDependencies error when useState is on a new line

[aparedes]

Environment information

CLI:
  Version:                      1.0.0
  Color support:                true

Platform:
  CPU Architecture:             x86_64
  OS:                           macos

Environment:
  BIOME_LOG_DIR:                unset
  NO_COLOR:                     unset
  TERM:                         "xterm-256color"
  JS_RUNTIME_VERSION:           "v18.16.0"
  JS_RUNTIME_NAME:              "node"
  NODE_PACKAGE_MANAGER:         "yarn/1.22.19"

Biome Configuration:
  Status:                       Loaded successfully
  Formatter disabled:           false
  Linter disabled:              false
  Organize imports disabled:    true
  VCS disabled:                 true

Workspace:
  Open Documents:               0

Discovering running Biome servers...

Running Biome Server: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

ℹ The client isn't connected to any server but rage discovered this running Biome server.

Server:
  Version:                      1.0.0
  Name:                         rome_lsp
  CPU Architecture:             x86_64
  OS:                           macos

Workspace:
  Open Documents:               0

Other Active Server Workspaces:

Workspace:
  Open Documents:               4
  Client Name:                  Visual Studio Code
  Client Version:               1.81.1

What happened?

useExhaustiveDependencies marks incorrectly a useState function as a missing dependency when the useState statement is on the next line.

https://biomejs.dev/playground/?indentStyle=space&quoteStyle=single&jsxQuoteStyle=single&lintRules=all&code=aQBtAHAAbwByAHQAIAB7ACAAdQBzAGUAUwB0AGEAdABlACwAIAB1AHMAZQBFAGYAZgBlAGMAdAAgAH0AIABmAHIAbwBtACAAJwByAGUAYQBjAHQAJwA7AAoACgB0AHkAcABlACAAUwBvAG0AZQBMAG8AbgBnAFMAdAByAGkAbgBnAFQAeQBwAGUAIAA9ACAAcwB0AHIAaQBuAGcAOwAKAGUAeABwAG8AcgB0ACAAYwBvAG4AcwB0ACAAQwBvAG0AcABvAG4AZQBuAHQAIAA9ACAAKAApACAAPQA%2BACAAewAKACAAIABjAG8AbgBzAHQAIABbAHMAdAByAGkAbgBnAEMAbwBuAHQAZQBuAHQALAAgAHMAZQB0AFMAdAByAGkAbgBnAEMAbwBuAHQAZQBuAHQAXQAgAD0ACgAgACAAIAAgAHUAcwBlAFMAdABhAHQAZQA8AFMAbwBtAGUATABvAG4AZwBTAHQAcgBpAG4AZwBUAHkAcABlAD4AKAAnAFMAbwBtAGUAdABoAGkAbgBnACcAKQA7AAoACgAgACAAdQBzAGUARQBmAGYAZQBjAHQAKAAoACkAIAA9AD4AIAB7AAoAIAAgACAAIABzAGUAdABTAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ACgAKABjAG8AbgB0AGUAbgB0ACkAIAA9AD4AIAB7AAoAIAAgACAAIAAgACAAcgBlAHQAdQByAG4AIABgACQAewBjAG8AbgB0AGUAbgB0AH0AIABvAHQAaABlAHIAYAA7AAoAIAAgACAAIAB9ACkAOwAKACAAIAB9ACwAIABbAF0AKQA7AAoACgAgACAAcgBlAHQAdQByAG4AIABzAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ADsACgB9ADsACgAKAGUAeABwAG8AcgB0ACAAYwBvAG4AcwB0ACAATwB0AGgAZQByAEMAbwBtAHAAbwBuAGUAbgB0ACAAPQAgACgAKQAgAD0APgAgAHsACgAgACAAYwBvAG4AcwB0ACAAWwBzAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ACwAIABzAGUAdABTAHQAcgBpAG4AZwBdACAAPQAgAHUAcwBlAFMAdABhAHQAZQA8AHMAdAByAGkAbgBnAD4AKAAnAFMAbwBtAGUAdABoAGkAbgBnACcAKQA7AAoACgAgACAAdQBzAGUARQBmAGYAZQBjAHQAKAAoACkAIAA9AD4AIAB7AAoAIAAgACAAIABzAGUAdABTAHQAcgBpAG4AZwAoACgAYwBvAG4AdABlAG4AdAApACAAPQA%2BACAAewAKACAAIAAgACAAIAAgAHIAZQB0AHUAcgBuACAAYAAkAHsAYwBvAG4AdABlAG4AdAB9ACAAbwB0AGgAZQByAGAAOwAKACAAIAAgACAAfQApADsACgAgACAAfQAsACAAWwBdACkAOwAKAAoAIAAgAHIAZQB0AHUAcgBuACAAcwB0AHIAaQBuAGcAQwBvAG4AdABlAG4AdAA7AAoAfQA7AAoA

Expected result

No useExhaustiveDependencies error on useState functions

Code of Conduct

• I agree to follow Biome's Code of Conduct

[ematipico]

Thank you for reporting. I opened the playground and I see a diagnostic on useEffect instead of useState. Maybe the link is incorrect?

[aparedes]

Yes the diagnostic error comes on useEffect, useMemo and useCallback but the culprit is that the useState is on a new line. on the second component the useState is in line const [....] = useState("something") so it doesnt mark the dependency as missing.

[aparedes]

@ematipico maybe this example is clearer, it has the same variables the only difference is line 5 and 6 vs line 18

 const [stringContent, setStringContent] =
    useState<SomeLongStringType>('Something');

 const [stringContent, setStringContent] = useState<SomeLongStringType>('Something');

https://biomejs.dev/playground/?indentStyle=space&quoteStyle=single&jsxQuoteStyle=single&lintRules=all&code=aQBtAHAAbwByAHQAIAB7ACAAdQBzAGUAUwB0AGEAdABlACwAIAB1AHMAZQBFAGYAZgBlAGMAdAAgAH0AIABmAHIAbwBtACAAJwByAGUAYQBjAHQAJwA7AAoACgB0AHkAcABlACAAUwBvAG0AZQBMAG8AbgBnAFMAdAByAGkAbgBnAFQAeQBwAGUAIAA9ACAAcwB0AHIAaQBuAGcAOwAKAGUAeABwAG8AcgB0ACAAYwBvAG4AcwB0ACAAQwBvAG0AcABvAG4AZQBuAHQAIAA9ACAAKAApACAAPQA%2BACAAewAKACAAIABjAG8AbgBzAHQAIABbAHMAdAByAGkAbgBnAEMAbwBuAHQAZQBuAHQALAAgAHMAZQB0AFMAdAByAGkAbgBnAEMAbwBuAHQAZQBuAHQAXQAgAD0ACgAgACAAIAAgAHUAcwBlAFMAdABhAHQAZQA8AFMAbwBtAGUATABvAG4AZwBTAHQAcgBpAG4AZwBUAHkAcABlAD4AKAAnAFMAbwBtAGUAdABoAGkAbgBnACcAKQA7AAoACgAgACAAdQBzAGUARQBmAGYAZQBjAHQAKAAoACkAIAA9AD4AIAB7AAoAIAAgACAAIABzAGUAdABTAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ACgAKABjAG8AbgB0AGUAbgB0ACkAIAA9AD4AIAB7AAoAIAAgACAAIAAgACAAcgBlAHQAdQByAG4AIABgACQAewBjAG8AbgB0AGUAbgB0AH0AIABvAHQAaABlAHIAYAA7AAoAIAAgACAAIAB9ACkAOwAKACAAIAB9ACwAIABbAF0AKQA7AAoACgAgACAAcgBlAHQAdQByAG4AIABzAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ADsACgB9ADsACgAKAGUAeABwAG8AcgB0ACAAYwBvAG4AcwB0ACAATwB0AGgAZQByAEMAbwBtAHAAbwBuAGUAbgB0ACAAPQAgACgAKQAgAD0APgAgAHsACgAgAGMAbwBuAHMAdAAgAFsAcwB0AHIAaQBuAGcAQwBvAG4AdABlAG4AdAAsACAAcwBlAHQAUwB0AHIAaQBuAGcAQwBvAG4AdABlAG4AdABdACAAPQAgAHUAcwBlAFMAdABhAHQAZQA8AFMAbwBtAGUATABvAG4AZwBTAHQAcgBpAG4AZwBUAHkAcABlAD4AKAAnAFMAbwBtAGUAdABoAGkAbgBnACcAKQA7AAoACgAgACAAdQBzAGUARQBmAGYAZQBjAHQAKAAoACkAIAA9AD4AIAB7AAoAIAAgACAAIABzAGUAdABTAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ACgAKABjAG8AbgB0AGUAbgB0ACkAIAA9AD4AIAB7AAoAIAAgACAAIAAgACAAcgBlAHQAdQByAG4AIABgACQAewBjAG8AbgB0AGUAbgB0AH0AIABvAHQAaABlAHIAYAA7AAoAIAAgACAAIAB9ACkAOwAKACAAIAB9ACwAIABbAF0AKQA7AAoACgAgACAAcgBlAHQAdQByAG4AIABzAHQAcgBpAG4AZwBDAG8AbgB0AGUAbgB0ADsACgB9ADsACgA%3D