remove some unnecessary react imports

src/components/ImageLinkCard.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Link } from 'react-router-dom'
 import styled from 'styled-components'
 import Card from '@mui/material/Card'

src/components/NavbarItems/SignInBtn.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import styled from 'styled-components'
 import Button from '@mui/material/Button'
 import { LoginRounded } from '@mui/icons-material'

src/components/PhotoGallery.tsx

@@ -4,7 +4,7 @@
  * be used in MDX files as <PhotoGallery driveFolderID={...} />
  */
 
-import React, {useEffect, useState} from 'react'
+import { useEffect, useState } from 'react'
 
 
 type Props = {

src/components/PhotoIndex.tsx

@@ -3,7 +3,7 @@
  * are organized into directories.
  */
 
-import React, {useEffect, useState} from 'react'
+import {useEffect, useState} from 'react'
 import styled from 'styled-components'
 import { Link, useLocation, useHistory } from 'react-router-dom'
 

src/components/home/Calendar.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 
 
 const calID = '65dcf6922cf9f84679f598865716f1fea2b7d974896c300fda9d3e26810aa1e8@group.calendar.google.com'

src/components/home/CodeWindow.tsx

@@ -46,7 +46,7 @@ export default function CodeWindow(props: Props) {
           }
         </div>
         {code &&
-          <Highlight theme={themes.github} language={language} code={code}>
+          <Highlight theme={themes.dracula} language={language} code={code}>
             {({ className, style, tokens, getLineProps, getTokenProps }) => (
               <pre className={className} style={style}>
                 {tokens.map((line, i) => (

src/components/home/Home.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { useState } from 'react'
 import { Link } from 'react-router-dom'
 import styled from 'styled-components'
@@ -137,12 +136,12 @@ export default function Home() {
       <div className="bg-white">
         <Section>
           <div className="flex flex-col md:flex-row gap-10 md:gap-4 xl:gap-10">
-            <Link to="science" className="card">
+            <Link to="/science" className="card">
               <img src={require('@site/static/img/home/learn.jpg').default} />
               <h3 className="flex items-center gap-2">
                 <LearnIcon />Learn
               </h3>
-              <p>Explore some of the <Link to="science">science</Link> made possible with Sage</p>
+              <p>Explore some of the <Link to="/science">science</Link> made possible with Sage</p>
             </Link>
             <a href={`${portal}/apps`} className="card">
               <img src={require('@site/static/img/home/create-app.png').default} />
@@ -312,8 +311,8 @@ export default function Home() {
                 })}
 
               <div className="hidden md:flex justify-between mx-5">
-                <Link to="publications" className="focused-link gap-1">Publications <Arrow /></Link>
-                <Link to="science" className="focused-link gap-1">Science<Arrow /></Link>
+                <Link to="/publications" className="focused-link gap-1">Publications <Arrow /></Link>
+                <Link to="/science" className="focused-link gap-1">Science<Arrow /></Link>
                 <a href={`${portal}/apps`} className="focused-link gap-1">Apps <Arrow /></a>
               </div>
             </div>

src/components/home/JobMetrics.tsx

@@ -1,5 +1,3 @@
-import React from 'react'
-
 import HubIcon from '@mui/icons-material/HubOutlined'
 import ScheduleIcon from '@mui/icons-material/ScheduleRounded'
 import Apps from '@mui/icons-material/AppsRounded'

src/components/home/NewsPreview.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { Link } from 'react-router-dom'
 
 

src/components/home/StatusChart.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 
 import * as topojson from 'topojson'
 import { geoPath, geoAlbersUsa } from 'd3-geo'

src/components/home/TwitterSkeleton.tsx

@@ -1,5 +1,3 @@
-
-import React from 'react'
 import Skeleton from '@mui/material/Skeleton'
 
 export default function TwitterSkeleton() {

src/components/home/TypeWriter.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react'
+import { useState, useEffect } from 'react'
 
 
 export default function TypeWriter(props) {

src/components/home/_DeprecatedActiveApps.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import styled from 'styled-components'
 import { type App } from './StatusChart'