ui: Upgrade to Next.js 11

This pull request updates the OpenDC frontend to use Next.js 11.

* Upgrade to Next.js 11
* Enable React Strict mode
* Enable ESLint
* Fix ESLint issues

8 files changed, 64 insertions, 3 deletions

diff --git a/opendc-web/opendc-web-ui/src/components/home/ContentSection.js b/opendc-web/opendc-web-ui/src/components/home/ContentSection.js
index 3e9ad50a..abaa565c 100644
--- a/opendc-web/opendc-web-ui/src/components/home/ContentSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/ContentSection.js
@@ -1,7 +1,7 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import classNames from 'classnames'
 import { Container } from 'reactstrap'
-import PropTypes from 'prop-types'
 import { contentSection } from './ContentSection.module.scss'
 
 const ContentSection = ({ name, title, children, className }) => (
@@ -15,6 +15,9 @@ const ContentSection = ({ name, title, children, className }) => (
 
 ContentSection.propTypes = {
     name: PropTypes.string.isRequired,
+    title: PropTypes.string.isRequired,
+    children: PropTypes.node,
+    className: PropTypes.string,
 }
 
 export default ContentSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/IntroSection.js b/opendc-web/opendc-web-ui/src/components/home/IntroSection.js
index 67e8cd8b..f9000d32 100644
--- a/opendc-web/opendc-web-ui/src/components/home/IntroSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/IntroSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import Image from 'next/image'
 import { Container, Row, Col } from 'reactstrap'
@@ -42,4 +43,8 @@ const IntroSection = ({ className }) => (
     </section>
 )
 
+IntroSection.propTypes = {
+    className: PropTypes.string,
+}
+
 export default IntroSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js b/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js
index af36aa45..8959663a 100644
--- a/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import ScreenshotSection from './ScreenshotSection'
 
@@ -20,4 +21,8 @@ const ModelingSection = ({ className }) => (
     </ScreenshotSection>
 )
 
+ModelingSection.propTypes = {
+    className: PropTypes.string,
+}
+
 export default ModelingSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js b/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js
index 9673b7b7..58fe1710 100644
--- a/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import Image from 'next/image'
 import { Row, Col } from 'reactstrap'
@@ -25,4 +26,14 @@ const ScreenshotSection = ({ className, name, title, imageUrl, caption, imageIsR
     </ContentSection>
 )
 
+ScreenshotSection.propTypes = {
+    className: PropTypes.string,
+    name: PropTypes.string,
+    title: PropTypes.string,
+    imageUrl: PropTypes.string,
+    caption: PropTypes.string,
+    imageIsRight: PropTypes.bool,
+    children: PropTypes.node,
+}
+
 export default ScreenshotSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js b/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js
index c154cc26..46ce6a35 100644
--- a/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import Image from 'next/image'
 import { Col, Row } from 'reactstrap'
@@ -32,7 +33,7 @@ const SimulationSection = ({ className }) => {
             </Row>
             <Row className="mt-5">
                 <Col xl="5" lg="5" md="5" sm="2" className="text-left my-auto">
-                    <h3>OpenDC's Simulator:</h3>
+                    <h3>OpenDC&apos;s Simulator:</h3>
                     <ul>
                         <li>Includes a detailed operational model of modern datacenters</li>
                         <li>
@@ -51,11 +52,15 @@ const SimulationSection = ({ className }) => {
                         height={232}
                         alt="OpenDC's Architecture"
                     />
-                    <Row className="text-muted justify-content-center">OpenDC's Architecture</Row>
+                    <Row className="text-muted justify-content-center">OpenDC&apos;s Architecture</Row>
                 </Col>
             </Row>
         </ContentSection>
     )
 }
 
+SimulationSection.propTypes = {
+    className: PropTypes.string,
+}
+
 export default SimulationSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js b/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js
index 9a4892ed..aa689ba4 100644
--- a/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { Row, Col } from 'reactstrap'
 import ContentSection from './ContentSection'
@@ -21,6 +22,12 @@ const Stakeholder = ({ name, title, subtitle }) => (
     </Col>
 )
 
+Stakeholder.propTypes = {
+    name: PropTypes.string,
+    title: PropTypes.string,
+    subtitle: PropTypes.string,
+}
+
 const StakeholderSection = ({ className }) => (
     <ContentSection name="stakeholders" title="Stakeholders" className={className}>
         <Row className="justify-content-center">
@@ -33,4 +40,8 @@ const StakeholderSection = ({ className }) => (
     </ContentSection>
 )
 
+StakeholderSection.propTypes = {
+    className: PropTypes.string,
+}
+
 export default StakeholderSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/TeamSection.js b/opendc-web/opendc-web-ui/src/components/home/TeamSection.js
index bbbe241e..dd057a93 100644
--- a/opendc-web/opendc-web-ui/src/components/home/TeamSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/TeamSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import Image from 'next/image'
 import { Row, Col } from 'reactstrap'
@@ -23,6 +24,12 @@ const TeamLead = ({ photoId, name, description }) => (
     </Col>
 )
 
+TeamLead.propTypes = {
+    photoId: PropTypes.string,
+    name: PropTypes.string,
+    description: PropTypes.string,
+}
+
 const TeamMember = ({ photoId, name }) => (
     <Col xl="2" lg="2" md="3" sm="4" className="justify-content-center">
         <Row>
@@ -42,6 +49,11 @@ const TeamMember = ({ photoId, name }) => (
     </Col>
 )
 
+TeamMember.propTypes = {
+    photoId: PropTypes.string,
+    name: PropTypes.string,
+}
+
 const TeamSection = ({ className }) => (
     <ContentSection name="team" title="OpenDC Team" className={className}>
         <Row className="justify-content-center">
@@ -63,4 +75,8 @@ const TeamSection = ({ className }) => (
     </ContentSection>
 )
 
+TeamSection.propTypes = {
+    className: PropTypes.string,
+}
+
 export default TeamSection
diff --git a/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js b/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js
index efedebb7..e5131c2a 100644
--- a/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js
+++ b/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { ListGroup, ListGroupItem } from 'reactstrap'
 import ContentSection from './ContentSection'
@@ -39,4 +40,8 @@ const TechnologiesSection = ({ className }) => (
     </ContentSection>
 )
 
+TechnologiesSection.propTypes = {
+    className: PropTypes.string,
+}
+
 export default TechnologiesSection