Add ESLint Rule to techdocs-react plugin

Signed-off-by: Juan Pablo Garcia Ripa <sarabadu@gmail.com>

.changeset/chatty-rules-repair.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs-react': patch
+---
+
+Added ESLint rule `no-top-level-material-ui-4-imports` in the Techdocs-react plugin to migrate the Material UI imports.

plugins/techdocs-react/.eslintrc.js

@@ -1 +1,5 @@
-module.exports = require('@backstage/cli/config/eslint-factory')(__dirname);
+module.exports = require('@backstage/cli/config/eslint-factory')(__dirname, {
+  rules: {
+    '@backstage/no-top-level-material-ui-4-imports': 'error',
+  },
+});

plugins/techdocs-react/src/component.tsx

@@ -22,7 +22,8 @@ import React, {
 } from 'react';
 
 import { create } from 'jss';
-import { StylesProvider, jssPreset } from '@material-ui/styles';
+import StylesProvider from '@material-ui/styles/StylesProvider';
+import jssPreset from '@material-ui/styles/jssPreset';
 
 import { Progress } from '@backstage/core-components';
 

plugins/techdocs-react/src/context.test.tsx

@@ -16,7 +16,7 @@
 import React from 'react';
 import { renderHook, act, waitFor } from '@testing-library/react';
 
-import { ThemeProvider } from '@material-ui/core';
+import { ThemeProvider } from '@material-ui/core/styles';
 
 import { lightTheme } from '@backstage/theme';
 import {