There should be an eslint rule for "useless-client-component"

[jakeleventhal]

Consider the case of a very simple component like this:

'use client';

const MyComponent = () => {
  const [x] = useState('hello');
  return <div>{x}</div>;
};

The developer then realizes that the state variable was useless and removes it and is left with:

'use client';

const MyComponent = () => {
  return <div>hello</div>;
};

Now the component is a client component, but there is no reason for it to be. There should be a lint rule that checks for a useless client component in this case.

[CunningDJ]

Agreed. I'm working in a large codebase that makes liberal use of 'use client', and disentangling which of these are unnecessary (and auditing future NextJS projects) would be much easier with this rule.