Clean up imports (orcasound#37)

- Remove unused
- Group `mui/material`

src/components/Footer.jsx

@@ -4,14 +4,8 @@ import LinkedInIcon from '@mui/icons-material/LinkedIn'
 import NotificationsIcon from '@mui/icons-material/Notifications'
 import TwitterIcon from '@mui/icons-material/Twitter'
 import YouTubeIcon from '@mui/icons-material/YouTube'
-import { styled } from '@mui/material'
-import AppBar from '@mui/material/AppBar'
-import Box from '@mui/material/Box'
-import Button from '@mui/material/Button'
-import Toolbar from '@mui/material/Toolbar'
-import Typography from '@mui/material/Typography'
+import { AppBar, Box, Button, styled, Toolbar, Typography } from '@mui/material'
 import Link from 'next/link'
-import * as React from 'react'
 
 import useCheckMobileScreen from '../utils/useCheckMobileScreen'
 

src/components/Nav.jsx

@@ -1,17 +1,19 @@
 import MenuIcon from '@mui/icons-material/Menu'
 import NotificationsIcon from '@mui/icons-material/Notifications'
-import AppBar from '@mui/material/AppBar'
-import Box from '@mui/material/Box'
-import Button from '@mui/material/Button'
-import Container from '@mui/material/Container'
-import IconButton from '@mui/material/IconButton'
-import Menu from '@mui/material/Menu'
-import MenuItem from '@mui/material/MenuItem'
-import Toolbar from '@mui/material/Toolbar'
-import Typography from '@mui/material/Typography'
+import {
+  AppBar,
+  Box,
+  Button,
+  Container,
+  IconButton,
+  Menu,
+  MenuItem,
+  Toolbar,
+  Typography,
+} from '@mui/material'
 import Image from 'next/image'
 import Link from 'next/link'
-import * as React from 'react'
+import { useState } from 'react'
 
 import orcasoundlogo from '../../public/images/orcasoundlogo.png'
 
@@ -39,7 +41,7 @@ const navLinks = [
 ]
 
 const Nav = () => {
-  const [anchorElNav, setAnchorElNav] = React.useState(null)
+  const [anchorElNav, setAnchorElNav] = useState(null)
 
   const handleOpenNavMenu = (event) => {
     setAnchorElNav(event.currentTarget)

src/pages/_app.jsx

@@ -5,7 +5,6 @@ import { CacheProvider } from '@emotion/react'
 import CssBaseline from '@mui/material/CssBaseline'
 import { ThemeProvider } from '@mui/material/styles'
 import Head from 'next/head'
-import React from 'react'
 
 import Layout from '../components/Layout'
 import theme from '../styles/theme'

src/pages/_document.jsx

@@ -1,6 +1,5 @@
 import createEmotionServer from '@emotion/server/create-instance'
 import Document, { Head, Html, Main, NextScript } from 'next/document'
-import * as React from 'react'
 
 import theme from '../styles/theme'
 import createEmotionCache from '../utils/createEmotionCache'

src/pages/learn.jsx

@@ -1,6 +1,5 @@
 import Head from 'next/head'
 import Image from 'next/image'
-import Link from 'next/link'
 import ReactAudioPlayer from 'react-audio-player'
 
 import audio from '../../public/audio/frequency.mp3'