Need better linting for "Snapshots in callbacks are not recommended" when importing another file

[devnomic]

Lets say i have a hook file with a state in it. useAppState.ts

export const state = proxy({
  isLocked: false,
});

export const useAppState = () => {
  const snap = useSnapshot(state);
  return {
    ...snap,
    state,
  };
};

File 2 SomeComponent.tsx

const { state, isLocked } = useAppState();

const handleClick = () => {
   console.log(isLocked); // No warning
};

Hopefully this can be resolved also, as this will probably lead to hard to catch bugs.

[dai-shi]

Hi, thanks for opening this up.

  return {
    ...snap,
    state,
  };

That seems like almost impossible to track.

const { state, isLocked } = useAppState();

const handleClick = () => {
   console.log(isLocked); // No warning
};

It looks actually fine if isLocked isn't an object.

Need better linting for "Snapshots in callbacks are not recommended" when importing another file

Oh, do you mean, it's a false positive?

[devnomic]

Hi @dai-shi

Thanks for replying, no it was not false positive.
It was detected just fine by eslint, if the state is not imported.
don't know why?

e.g.

const state = proxy({
  isLocked: false,
});

function SomeComponent() {
   const { isLocked } = useSnapshot(state);
   const handleClick = () => {
     console.log(isLocked); // Correct, lint warn
  };
}

[devnomic]

I think maybe not detected because of spreading in other object?

[dai-shi]

I see. (I misunderstood something in my previous comment.)

Yeah, maybe. Can you try without spreading?