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

19 files changed, 99 insertions, 1 deletions

diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/Sidebar.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/Sidebar.js
index ccaa4144..56fa799f 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/Sidebar.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/Sidebar.js
@@ -42,6 +42,7 @@ function Sidebar({ isRight, collapsible = true, children }) {
 Sidebar.propTypes = {
     isRight: PropTypes.bool.isRequired,
     collapsible: PropTypes.bool,
+    children: PropTypes.node,
 }
 
 export default Sidebar
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js
index 9dd36d5e..ce271819 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js
@@ -37,7 +37,7 @@ function PortfolioListComponent({
                             {portfolio.name}
                         </Col>
                         <Col xs="5" className="text-right">
-                            <Link href={`/projects/${currentProjectId}/portfolios/${portfolio._id}`}>
+                            <Link passHref href={`/projects/${currentProjectId}/portfolios/${portfolio._id}`}>
                                 <Button
                                     color="primary"
                                     outline
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ProjectSidebarComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ProjectSidebarComponent.js
index 7dd13663..10d22e5b 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ProjectSidebarComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ProjectSidebarComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import Sidebar from '../Sidebar'
 import TopologyListContainer from '../../../../containers/app/sidebars/project/TopologyListContainer'
@@ -13,4 +14,8 @@ const ProjectSidebarComponent = ({ collapsible }) => (
     </Sidebar>
 )
 
+ProjectSidebarComponent.propTypes = {
+    collapsible: PropTypes.bool,
+}
+
 export default ProjectSidebarComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js
index 131a00b5..f990dfcb 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js
@@ -30,6 +30,7 @@ function ScenarioListComponent({
                     </Col>
                     <Col xs="5" className="text-right">
                         <Link
+                            passHref
                             href={`/projects/${currentProjectId}/portfolios/${scenario.portfolioId}/scenarios/${scenario._id}`}
                         >
                             <Button
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/NameComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/NameComponent.js
index b4cbc78f..b8c88003 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/NameComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/NameComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faPencilAlt } from '@fortawesome/free-solid-svg-icons'
@@ -11,4 +12,9 @@ const NameComponent = ({ name, onEdit }) => (
     </h2>
 )
 
+NameComponent.propTypes = {
+    name: PropTypes.string,
+    onEdit: PropTypes.func,
+}
+
 export default NameComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/TopologySidebarComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/TopologySidebarComponent.js
index f5eee36b..450df6cd 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/TopologySidebarComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/TopologySidebarComponent.js
@@ -4,6 +4,7 @@ import MachineSidebarContainer from '../../../../containers/app/sidebars/topolog
 import RackSidebarContainer from '../../../../containers/app/sidebars/topology/rack/RackSidebarContainer'
 import RoomSidebarContainer from '../../../../containers/app/sidebars/topology/room/RoomSidebarContainer'
 import Sidebar from '../Sidebar'
+import { InteractionLevel } from '../../../../shapes'
 
 const TopologySidebarComponent = ({ interactionLevel }) => {
     let sidebarContent
@@ -28,4 +29,8 @@ const TopologySidebarComponent = ({ interactionLevel }) => {
     return <Sidebar isRight={true}>{sidebarContent}</Sidebar>
 }
 
+TopologySidebarComponent.propTypes = {
+    interactionLevel: InteractionLevel,
+}
+
 export default TopologySidebarComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js
index b1461743..e8c81735 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/building/NewRoomConstructionComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faPlus, faCheck, faTimes } from '@fortawesome/free-solid-svg-icons'
@@ -26,4 +27,11 @@ const NewRoomConstructionComponent = ({ onStart, onFinish, onCancel, currentRoom
     )
 }
 
+NewRoomConstructionComponent.propTypes = {
+    onStart: PropTypes.func,
+    onFinish: PropTypes.func,
+    onCancel: PropTypes.func,
+    currentRoomInConstruction: PropTypes.string,
+}
+
 export default NewRoomConstructionComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/BackToRackComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/BackToRackComponent.js
index eac99643..829bf265 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/BackToRackComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/BackToRackComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faAngleLeft } from '@fortawesome/free-solid-svg-icons'
@@ -9,4 +10,8 @@ const BackToRackComponent = ({ onClick }) => (
     </div>
 )
 
+BackToRackComponent.propTypes = {
+    onClick: PropTypes.func,
+}
+
 export default BackToRackComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js
index 7c78cf9e..88a99e0f 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import BackToRackContainer from '../../../../../containers/app/sidebars/topology/machine/BackToRackContainer'
 import DeleteMachineContainer from '../../../../../containers/app/sidebars/topology/machine/DeleteMachineContainer'
@@ -15,4 +16,8 @@ const MachineSidebarComponent = ({ machineId }) => {
     )
 }
 
+MachineSidebarComponent.propTypes = {
+    machineId: PropTypes.string,
+}
+
 export default MachineSidebarComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js
index aa473f91..03b92459 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js
@@ -1,7 +1,9 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { UncontrolledPopover, PopoverHeader, PopoverBody, Button } from 'reactstrap'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faTrash, faInfoCircle } from '@fortawesome/free-solid-svg-icons'
+import { ProcessingUnit, StorageUnit } from '../../../../../shapes'
 
 function UnitComponent({ index, unitType, unit, onDelete }) {
     let unitInfo
@@ -55,4 +57,11 @@ function UnitComponent({ index, unitType, unit, onDelete }) {
     )
 }
 
+UnitComponent.propTypes = {
+    index: PropTypes.number,
+    unitType: PropTypes.string,
+    unit: PropTypes.oneOf([ProcessingUnit, StorageUnit]),
+    onDelete: PropTypes.func,
+}
+
 export default UnitComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js
index 2ade0f6a..b7da74a1 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import UnitContainer from '../../../../../containers/app/sidebars/topology/machine/UnitContainer'
 
@@ -17,4 +18,9 @@ const UnitListComponent = ({ unitType, unitIds }) => (
     </ul>
 )
 
+UnitListComponent.propTypes = {
+    unitType: PropTypes.string,
+    unitIds: PropTypes.array,
+}
+
 export default UnitListComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/AddPrefabComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/AddPrefabComponent.js
index d0218f38..a330c302 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/AddPrefabComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/AddPrefabComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faSave } from '@fortawesome/free-solid-svg-icons'
@@ -10,4 +11,8 @@ const AddPrefabComponent = ({ onClick }) => (
     </Button>
 )
 
+AddPrefabComponent.propTypes = {
+    onClick: PropTypes.func,
+}
+
 export default AddPrefabComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/BackToRoomComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/BackToRoomComponent.js
index f6a6f79b..e0eb5979 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/BackToRoomComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/BackToRoomComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faAngleLeft } from '@fortawesome/free-solid-svg-icons'
@@ -10,4 +11,8 @@ const BackToRoomComponent = ({ onClick }) => (
     </Button>
 )
 
+BackToRoomComponent.propTypes = {
+    onClick: PropTypes.func,
+}
+
 export default BackToRoomComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/EmptySlotComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/EmptySlotComponent.js
index d6fa9dc9..63b319e0 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/EmptySlotComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/EmptySlotComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faPlus } from '@fortawesome/free-solid-svg-icons'
@@ -15,4 +16,9 @@ const EmptySlotComponent = ({ position, onAdd }) => (
     </ListGroupItem>
 )
 
+EmptySlotComponent.propTypes = {
+    position: PropTypes.number,
+    onAdd: PropTypes.func,
+}
+
 export default EmptySlotComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js
index 36b15c71..f91202ba 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import Image from 'next/image'
 import { Machine } from '../../../../../shapes'
@@ -15,6 +16,11 @@ const UnitIcon = ({ id, type }) => (
     </div>
 )
 
+UnitIcon.propTypes = {
+    id: PropTypes.string,
+    type: PropTypes.string,
+}
+
 const MachineComponent = ({ position, machine, onClick }) => {
     const hasNoUnits =
         machine.cpuIds.length + machine.gpuIds.length + machine.memoryIds.length + machine.storageIds.length === 0
@@ -42,6 +48,8 @@ const MachineComponent = ({ position, machine, onClick }) => {
 
 MachineComponent.propTypes = {
     machine: Machine,
+    position: PropTypes.number,
+    onClick: PropTypes.func,
 }
 
 export default MachineComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js
index 1c07d237..d0958c28 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import EmptySlotContainer from '../../../../../containers/app/sidebars/topology/rack/EmptySlotContainer'
 import MachineContainer from '../../../../../containers/app/sidebars/topology/rack/MachineContainer'
@@ -17,4 +18,8 @@ const MachineListComponent = ({ machineIds }) => {
     )
 }
 
+MachineListComponent.propTypes = {
+    machineIds: PropTypes.array,
+}
+
 export default MachineListComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/BackToBuildingComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/BackToBuildingComponent.js
index 696b345b..043cc713 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/BackToBuildingComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/BackToBuildingComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faAngleLeft } from '@fortawesome/free-solid-svg-icons'
@@ -9,4 +10,8 @@ const BackToBuildingComponent = ({ onClick }) => (
     </div>
 )
 
+BackToBuildingComponent.propTypes = {
+    onClick: PropTypes.func,
+}
+
 export default BackToBuildingComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/DeleteRoomComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/DeleteRoomComponent.js
index 242f7a2b..d81bad0f 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/DeleteRoomComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/DeleteRoomComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faTrash } from '@fortawesome/free-solid-svg-icons'
@@ -10,4 +11,8 @@ const DeleteRoomComponent = ({ onClick }) => (
     </Button>
 )
 
+DeleteRoomComponent.propTypes = {
+    onClick: PropTypes.func,
+}
+
 export default DeleteRoomComponent
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/RackConstructionComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/RackConstructionComponent.js
index 19d6b309..0a27910c 100644
--- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/RackConstructionComponent.js
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/room/RackConstructionComponent.js
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types'
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faTimes, faPlus } from '@fortawesome/free-solid-svg-icons'
@@ -27,4 +28,11 @@ const RackConstructionComponent = ({ onStart, onStop, inRackConstructionMode, is
     )
 }
 
+RackConstructionComponent.propTypes = {
+    onStart: PropTypes.func,
+    onStop: PropTypes.func,
+    inRackConstructionMode: PropTypes.bool,
+    isEditingRoom: PropTypes.bool,
+}
+
 export default RackConstructionComponent