I am working in a codebase where over time, we have done many changes to our pages and components thus resulting in a lot of styles that are now not being used. We would like to clean up our codebase and remove any unused makeStyles properties.

Our styles are being imported from a separate file. For example:

container.styles.ts

import { makeStyles } from "@material-ui/core";

export const useStyles = makeStyles({
  container: {
    backgroundColor: "white",
    ...
  },
  oldContainerStyle1: { ... },
  oldContainerStyle2: { ... },
  oldContainerStyle3: { ... },
  oldComponentStyle1: { ... },
  ...
  },
});

container.tsx

import React, { FC } from "react";

import { useStyles } from "./container.styles";


interface IProps {
  ...
}

export const AutoCompleteContainer: FC<IProps> = ({...}) => {
   const classes = useStyles();
   return (
      <div className={classes.container}>
      ...
   )


}

We are using tslint and have looked into seeing if it is possible but we still cannot seem to find an answer on this issue.