[core] Migrate outdated pattern to convention

These are trivial changes to match our latest coding conventions.
mui · Oct 30, 2022 · 5a84b55 · 5a84b55
1 parent a10bb4f
commit 5a84b55
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 18 deletions.
diff --git a/docs/pages/about.tsx b/docs/pages/about.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import Head from 'docs/src/modules/components/Head';
-import { ThemeProvider as MuiThemeProvider } from '@mui/material/styles';
+import { ThemeProvider } from '@mui/material/styles';
 import Avatar from '@mui/material/Avatar';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
@@ -674,7 +674,7 @@ function AboutContent() {
           </Grid>
         </Box>
       </Container>
-      <MuiThemeProvider theme={brandingDarkTheme}>
+      <ThemeProvider theme={brandingDarkTheme}>
         <Box sx={{ bgcolor: 'primaryDark.700' }}>
           <Container sx={{ py: { xs: 4, sm: 8 } }}>
             <Typography
@@ -722,7 +722,7 @@ function AboutContent() {
             </Box>
           </Container>
         </Box>
-      </MuiThemeProvider>
+      </ThemeProvider>
       <Container sx={{ py: { xs: 4, md: 8 } }}>
         <Typography variant="h2" sx={{ mt: 1, mb: { xs: 2, sm: 4 } }}>
           How can you support us?

diff --git a/docs/src/modules/components/AppLayoutDocsFooter.js b/docs/src/modules/components/AppLayoutDocsFooter.js
@@ -57,12 +57,6 @@ const FeedbackGrid = styled(Grid)(({ theme }) => {
   };
 });
 
-const FeedbackMessage = styled(Typography)(({ theme }) => {
-  return {
-    margin: theme.spacing(0, 2),
-  };
-});
-
 /**
  * @typedef {import('docs/src/pages').MuiPage} MuiPage
  * @typedef {import('docs/src/pages').OrderedMuiPage} OrderedMuiPage
@@ -340,14 +334,15 @@ export default function AppLayoutDocsFooter() {
                 alignItems="center"
                 aria-labelledby="feedback-message"
               >
-                <FeedbackMessage
+                <Typography
                   align="center"
                   component="div"
                   id="feedback-message"
                   variant="body2"
+                  sx={{ mx: 2 }}
                 >
                   {t('feedbackMessage')}
-                </FeedbackMessage>
+                </Typography>
                 <div>
                   <Tooltip title={t('feedbackYes')}>
                     <IconButton onClick={handleClickThumb(1)} aria-pressed={rating === 1}>

diff --git a/docs/src/modules/components/HighlightedCode.test.js b/docs/src/modules/components/HighlightedCode.test.js
@@ -2,8 +2,8 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { createRenderer } from 'test/utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
-import { getDesignTokens } from '../brandingTheme';
-import HighlightedCode from './HighlightedCode';
+import { getDesignTokens } from 'docs/src/modules/brandingTheme';
+import HighlightedCode from 'docs/src/modules/components/HighlightedCode';
 
 describe('HighlightedCode', () => {
   const { render } = createRenderer();

diff --git a/docs/src/modules/components/MarkdownElement.js b/docs/src/modules/components/MarkdownElement.js
@@ -402,13 +402,13 @@ const Root = styled('div')(({ theme }) => ({
   '& details': {
     marginBottom: theme.spacing(1.5),
     padding: theme.spacing(0.5, 0, 0.5, 1),
-    '& summary': {
-      cursor: 'pointer',
-    },
     '& pre': {
       marginTop: theme.spacing(1),
     },
   },
+  '& summary': {
+    cursor: 'pointer',
+  },
   '& .MuiCode-root': {
     position: 'relative',
     '&:hover': {

diff --git a/docs/src/modules/utils/CodeCopy.tsx b/docs/src/modules/utils/CodeCopy.tsx
@@ -15,7 +15,7 @@ const CodeBlockContext = React.createContext<React.MutableRefObject<HTMLDivEleme
  *  <button className="MuiCode-copy">...</button>
  * </div>
  */
-export const useCodeCopy = () => {
+export function useCodeCopy() {
   const rootNode = React.useContext(CodeBlockContext);
   return {
     onMouseEnter: (event: React.MouseEvent) => {
@@ -36,7 +36,7 @@ export const useCodeCopy = () => {
       }
     },
   };
-};
+}
 
 function InitCodeCopy() {
   const rootNode = React.useContext(CodeBlockContext);