Doesn't work if classes are destructured

[mike-dvorscak-enablon]

Background

Our team has just migrated to MUI5 and chosen to use tss-react/mui because the migration was much simpler coming from MUI4. A lot of our MUI 4 based code looked like this:

const { root, label } = useStyles({});

To make the migration simpler and avoid having to re-write many extra lines of code, we simply destructured the classes from tss-react/mui's makeStyles, like so:

const { classes: { root, label } } = useStyles();

Issue

This plugin only seems to work when using classes.classname directly.

Using destructuring: results in a false positive:

But everything works fine if we use classes.root. Is it possible to make this plugin work with destructuring? Our team would love to use it, but currently it's not feasible due to the large number of lines we'd need to re-write.

Thanks for all your hard work, we're really enjoying tss-react/mui!

[vitaliyslion]

I have the same issue when renaming classes.

const { classes: internalClasses } = useStyles();

It's probably related.

[nrutman]

This shows the issue when renaming the variable.

Here's the case that passes:

When I name classes to styles I start getting the warning:

The lint warning is that the class is unused, even though it is not…

[benbynum]

I had the same problem. I’ve put up two PR proposals (one, two) as options that would evaluate renamed classes. Maybe one of them will get accepted, or lead to discussion that winds up with a solution 🤞