diff options
49 files changed, 274 insertions, 48 deletions
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 99b5ca96..ff1ee85f 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -126,3 +126,6 @@ jobs: - run: yarn build env: CI: true + - run: yarn next lint + env: + CI: true diff --git a/opendc-web/opendc-web-ui/src/auth.js b/opendc-web/opendc-web-ui/src/auth.js index 706151bf..96417e67 100644 --- a/opendc-web/opendc-web-ui/src/auth.js +++ b/opendc-web/opendc-web-ui/src/auth.js @@ -20,6 +20,7 @@ * SOFTWARE. */ +import PropTypes from 'prop-types' import { Auth0Provider, useAuth0 } from '@auth0/auth0-react' import { useEffect } from 'react' import { useRouter } from 'next/router' @@ -43,7 +44,7 @@ export function useRequireAuth() { if (!isLoading && !isAuthenticated) { router.replace('/') } - }, [isLoading, isAuthenticated]) + }, [router, isLoading, isAuthenticated]) return auth } @@ -63,3 +64,7 @@ export function AuthProvider({ children }) { </Auth0Provider> ) } + +AuthProvider.propTypes = { + children: PropTypes.node, +} diff --git a/opendc-web/opendc-web-ui/src/components/app/map/MapStageComponent.js b/opendc-web/opendc-web-ui/src/components/app/map/MapStageComponent.js index 7c97f3e4..07b2d8f0 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/MapStageComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/MapStageComponent.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React, { useEffect, useRef, useState } from 'react' import { HotKeys } from 'react-hotkeys' import { Stage } from 'react-konva' @@ -35,10 +36,11 @@ function MapStageComponent({ const mousePos = stage.current.getStage().getPointerPosition() setPos([mousePos.x, mousePos.y]) } - const updateDimensions = () => setMapDimensions(window.innerWidth, window.innerHeight - NAVBAR_HEIGHT) - const updateScale = (e) => zoomInOnPosition(e.deltaY < 0, x, y) useEffect(() => { + const updateDimensions = () => setMapDimensions(window.innerWidth, window.innerHeight - NAVBAR_HEIGHT) + const updateScale = (e) => zoomInOnPosition(e.deltaY < 0, x, y) + updateDimensions() window.addEventListener('resize', updateDimensions) @@ -55,7 +57,7 @@ function MapStageComponent({ window.removeEventListener('resize', updateDimensions) window.removeEventListener('wheel', updateScale) } - }, []) + }, [x, y, setMapDimensions, zoomInOnPosition]) const store = useStore() @@ -77,4 +79,18 @@ function MapStageComponent({ ) } +MapStageComponent.propTypes = { + mapDimensions: PropTypes.shape({ + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + }).isRequired, + mapPosition: PropTypes.shape({ + x: PropTypes.number.isRequired, + y: PropTypes.number.isRequired, + }).isRequired, + setMapDimensions: PropTypes.func, + setMapPositionWithBoundsCheck: PropTypes.func, + zoomInOnPosition: PropTypes.func, +} + export default MapStageComponent diff --git a/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicatorComponent.js b/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicatorComponent.js index 13226602..ef633764 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicatorComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/controls/ScaleIndicatorComponent.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React from 'react' import { TILE_SIZE_IN_METERS, TILE_SIZE_IN_PIXELS } from '../MapConstants' import { scaleIndicator } from './ScaleIndicatorComponent.module.scss' @@ -8,4 +9,8 @@ const ScaleIndicatorComponent = ({ scale }) => ( </div> ) +ScaleIndicatorComponent.propTypes = { + scale: PropTypes.number.isRequired, +} + export default ScaleIndicatorComponent diff --git a/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js b/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js index 6bae792c..6c3c6cb7 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/controls/ZoomControlComponent.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React from 'react' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faPlus, faMinus } from '@fortawesome/free-solid-svg-icons' @@ -23,4 +24,8 @@ const ZoomControlComponent = ({ zoomInOnCenter }) => { ) } +ZoomControlComponent.propTypes = { + zoomInOnCenter: PropTypes.func.isRequired, +} + export default ZoomControlComponent diff --git a/opendc-web/opendc-web-ui/src/components/app/map/elements/GrayLayer.js b/opendc-web/opendc-web-ui/src/components/app/map/elements/GrayLayer.js index c54a34ad..35af4d96 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/elements/GrayLayer.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/elements/GrayLayer.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React from 'react' import { Rect } from 'react-konva' import { GRAYED_OUT_AREA_COLOR } from '../../../../util/colors' @@ -14,4 +15,8 @@ const GrayLayer = ({ onClick }) => ( /> ) +GrayLayer.propTypes = { + onClick: PropTypes.func, +} + export default GrayLayer diff --git a/opendc-web/opendc-web-ui/src/components/app/map/elements/HoverTile.js b/opendc-web/opendc-web-ui/src/components/app/map/elements/HoverTile.js index 912229c4..11bba0e1 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/elements/HoverTile.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/elements/HoverTile.js @@ -21,6 +21,7 @@ HoverTile.propTypes = { pixelX: PropTypes.number.isRequired, pixelY: PropTypes.number.isRequired, isValid: PropTypes.bool.isRequired, + scale: PropTypes.number.isRequired, onClick: PropTypes.func.isRequired, } diff --git a/opendc-web/opendc-web-ui/src/components/app/map/elements/RoomTile.js b/opendc-web/opendc-web-ui/src/components/app/map/elements/RoomTile.js index b2cc1273..ed718601 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/elements/RoomTile.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/elements/RoomTile.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React from 'react' import { Rect } from 'react-konva' import { Tile } from '../../../../shapes' @@ -15,6 +16,7 @@ const RoomTile = ({ tile, color }) => ( RoomTile.propTypes = { tile: Tile, + color: PropTypes.string, } export default RoomTile diff --git a/opendc-web/opendc-web-ui/src/components/app/map/groups/RoomGroup.js b/opendc-web/opendc-web-ui/src/components/app/map/groups/RoomGroup.js index d7c207ca..e67d54fc 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/groups/RoomGroup.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/groups/RoomGroup.js @@ -1,9 +1,10 @@ +import PropTypes from 'prop-types' import React from 'react' import { Group } from 'react-konva' import GrayContainer from '../../../../containers/app/map/GrayContainer' import TileContainer from '../../../../containers/app/map/TileContainer' import WallContainer from '../../../../containers/app/map/WallContainer' -import { Room } from '../../../../shapes' +import { InteractionLevel, Room } from '../../../../shapes' const RoomGroup = ({ room, interactionLevel, currentRoomInConstruction, onClick }) => { if (currentRoomInConstruction === room._id) { @@ -43,6 +44,9 @@ const RoomGroup = ({ room, interactionLevel, currentRoomInConstruction, onClick RoomGroup.propTypes = { room: Room, + interactionLevel: InteractionLevel, + currentRoomInConstruction: PropTypes.string, + onClick: PropTypes.func, } export default RoomGroup diff --git a/opendc-web/opendc-web-ui/src/components/app/map/groups/TileGroup.js b/opendc-web/opendc-web-ui/src/components/app/map/groups/TileGroup.js index ff6ec7ec..2a108b93 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/groups/TileGroup.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/groups/TileGroup.js @@ -6,7 +6,7 @@ import { Tile } from '../../../../shapes' import { ROOM_DEFAULT_COLOR, ROOM_IN_CONSTRUCTION_COLOR } from '../../../../util/colors' import RoomTile from '../elements/RoomTile' -const TileGroup = ({ tile, newTile, roomLoad, onClick }) => { +const TileGroup = ({ tile, newTile, onClick }) => { let tileObject if (tile.rackId) { tileObject = <RackContainer tile={tile} /> @@ -30,6 +30,7 @@ const TileGroup = ({ tile, newTile, roomLoad, onClick }) => { TileGroup.propTypes = { tile: Tile, newTile: PropTypes.bool, + onClick: PropTypes.func, } export default TileGroup diff --git a/opendc-web/opendc-web-ui/src/components/app/map/layers/HoverLayerComponent.js b/opendc-web/opendc-web-ui/src/components/app/map/layers/HoverLayerComponent.js index 08d31dac..a88a8b34 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/layers/HoverLayerComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/layers/HoverLayerComponent.js @@ -21,7 +21,7 @@ function HoverLayerComponent({ mouseX, mouseY, mapPosition, mapScale, isEnabled, setPos([positionX, positionY]) setValid(isValid(positionX, positionY)) } - }, [mouseX, mouseY, mapPosition, mapScale]) + }, [isEnabled, isValid, x, y, mouseX, mouseY, mapPosition, mapScale]) if (!isEnabled()) { return <Layer /> @@ -58,6 +58,7 @@ HoverLayerComponent.propTypes = { isEnabled: PropTypes.func.isRequired, isValid: PropTypes.func.isRequired, onClick: PropTypes.func.isRequired, + children: PropTypes.node, } export default HoverLayerComponent diff --git a/opendc-web/opendc-web-ui/src/components/app/map/layers/MapLayerComponent.js b/opendc-web/opendc-web-ui/src/components/app/map/layers/MapLayerComponent.js index 8ee14c9c..96e6867c 100644 --- a/opendc-web/opendc-web-ui/src/components/app/map/layers/MapLayerComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/map/layers/MapLayerComponent.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React from 'react' import { Group, Layer } from 'react-konva' import TopologyContainer from '../../../../containers/app/map/TopologyContainer' @@ -14,4 +15,12 @@ const MapLayerComponent = ({ mapPosition, mapScale }) => ( </Layer> ) +MapLayerComponent.propTypes = { + mapPosition: PropTypes.shape({ + x: PropTypes.number, + y: PropTypes.number, + }), + mapScale: PropTypes.number, +} + export default MapLayerComponent 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 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'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'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 diff --git a/opendc-web/opendc-web-ui/src/components/modals/Modal.js b/opendc-web/opendc-web-ui/src/components/modals/Modal.js index 21b7f119..8ab3924c 100644 --- a/opendc-web/opendc-web-ui/src/components/modals/Modal.js +++ b/opendc-web/opendc-web-ui/src/components/modals/Modal.js @@ -42,6 +42,7 @@ Modal.propTypes = { onCancel: PropTypes.func.isRequired, submitButtonType: PropTypes.string, submitButtonText: PropTypes.string, + children: PropTypes.node, } Modal.defaultProps = { diff --git a/opendc-web/opendc-web-ui/src/components/navigation/AppNavbarComponent.js b/opendc-web/opendc-web-ui/src/components/navigation/AppNavbarComponent.js index 28207968..8aaaf847 100644 --- a/opendc-web/opendc-web-ui/src/components/navigation/AppNavbarComponent.js +++ b/opendc-web/opendc-web-ui/src/components/navigation/AppNavbarComponent.js @@ -1,15 +1,16 @@ +import PropTypes from 'prop-types' import React from 'react' import Link from 'next/link' -import { NavLink } from 'reactstrap' +import { NavLink, NavItem as RNavItem } from 'reactstrap' import Navbar, { NavItem } from './Navbar' -import {} from './Navbar.module.scss' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faList } from '@fortawesome/free-solid-svg-icons' +import { Project } from '../../shapes' const AppNavbarComponent = ({ project, fullWidth }) => ( <Navbar fullWidth={fullWidth}> <NavItem route="/projects"> - <Link href="/projects"> + <Link href="/projects" passHref> <NavLink title="My Projects"> <FontAwesomeIcon icon={faList} className="mr-2" /> My Projects @@ -17,15 +18,20 @@ const AppNavbarComponent = ({ project, fullWidth }) => ( </Link> </NavItem> {project ? ( - <NavItem> - <Link href={`/projects/${project._id}`}> + <RNavItem> + <Link href={`/projects/${project._id}`} passHref> <NavLink title="Current Project"> <span>{project.name}</span> </NavLink> </Link> - </NavItem> + </RNavItem> ) : undefined} </Navbar> ) +AppNavbarComponent.propTypes = { + project: Project, + fullWidth: PropTypes.bool, +} + export default AppNavbarComponent diff --git a/opendc-web/opendc-web-ui/src/components/navigation/HomeNavbar.js b/opendc-web/opendc-web-ui/src/components/navigation/HomeNavbar.js index 46d01a25..57cb7a53 100644 --- a/opendc-web/opendc-web-ui/src/components/navigation/HomeNavbar.js +++ b/opendc-web/opendc-web-ui/src/components/navigation/HomeNavbar.js @@ -1,22 +1,15 @@ import React from 'react' import { NavItem, NavLink } from 'reactstrap' import Navbar from './Navbar' -import {} from './Navbar.module.scss' - -const ScrollNavItem = ({ id, name }) => ( - <NavItem> - <NavLink href={id}>{name}</NavLink> - </NavItem> -) const HomeNavbar = () => ( <Navbar fullWidth={false}> - <ScrollNavItem id="#stakeholders" name="Stakeholders" /> - <ScrollNavItem id="#modeling" name="Modeling" /> - <ScrollNavItem id="#project" name="Project" /> - <ScrollNavItem id="#technologies" name="Technologies" /> - <ScrollNavItem id="#team" name="Team" /> - <ScrollNavItem id="#contact" name="Contact" /> + <NavLink href="#stakeholders">Stakeholders</NavLink> + <NavLink href="#modeling">Modeling</NavLink> + <NavLink href="#project">Project</NavLink> + <NavLink href="#technologies">Technologies</NavLink> + <NavLink href="#team">Team</NavLink> + <NavLink href="#contact">Contact</NavLink> </Navbar> ) diff --git a/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js b/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js index 690a7bdf..dc74bb8f 100644 --- a/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js +++ b/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types' import React, { useState } from 'react' import Link from 'next/link' import { useRouter } from 'next/router' @@ -45,6 +46,11 @@ export const NavItem = ({ route, children }) => { ) } +NavItem.propTypes = { + route: PropTypes.string.isRequired, + children: PropTypes.node, +} + export const LoggedInSection = () => { const router = useRouter() const { isAuthenticated } = useAuth() @@ -54,18 +60,18 @@ export const LoggedInSection = () => { [ router.asPath === '/' ? ( <NavItem route="/projects" key="projects"> - <Link href="/projects"> + <Link href="/projects" passHref> <NavLink title="My Projects" to="/projects"> My Projects </NavLink> </Link> </NavItem> ) : ( - <NavItem key="profile"> + <RNavItem key="profile"> <NavLink title="My Profile"> <ProfileName /> </NavLink> - </NavItem> + </RNavItem> ), <NavItem route="logout" key="logout"> <Logout /> @@ -106,4 +112,9 @@ const Navbar = ({ fullWidth, children }) => { ) } +Navbar.propTypes = { + fullWidth: PropTypes.bool, + children: PropTypes.node, +} + export default Navbar diff --git a/opendc-web/opendc-web-ui/src/components/projects/ProjectActionButtons.js b/opendc-web/opendc-web-ui/src/components/projects/ProjectActionButtons.js index 0725e42b..4adf3205 100644 --- a/opendc-web/opendc-web-ui/src/components/projects/ProjectActionButtons.js +++ b/opendc-web/opendc-web-ui/src/components/projects/ProjectActionButtons.js @@ -7,7 +7,7 @@ import { faPlay, faUsers, faTrash } from '@fortawesome/free-solid-svg-icons' const ProjectActionButtons = ({ projectId, onViewUsers, onDelete }) => ( <td className="text-right"> - <Link href={`/projects/${projectId}`}> + <Link href={`/projects/${projectId}`} passHref> <Button color="primary" outline size="sm" className="mr-2" title="Open this project"> <FontAwesomeIcon icon={faPlay} /> </Button> diff --git a/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js b/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js index dc3f85ec..46ef4691 100644 --- a/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js +++ b/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js @@ -11,7 +11,7 @@ const ProjectList = ({ projects }) => { {projects.length === 0 ? ( <div className="alert alert-info"> <FontAwesomeIcon icon={faQuestionCircle} className="info-icon mr-2" /> - <strong>No projects here yet...</strong> Add some with the 'New Project' button! + <strong>No projects here yet...</strong> Add some with the ‘New Project’ button! </div> ) : ( <table className="table table-striped"> diff --git a/opendc-web/opendc-web-ui/src/pages/_app.js b/opendc-web/opendc-web-ui/src/pages/_app.js index 4ef4445c..c1adbd6e 100644 --- a/opendc-web/opendc-web-ui/src/pages/_app.js +++ b/opendc-web/opendc-web-ui/src/pages/_app.js @@ -20,6 +20,7 @@ * SOFTWARE. */ +import PropTypes from 'prop-types' import Head from 'next/head' import { Provider } from 'react-redux' import { useStore } from '../redux' @@ -39,6 +40,13 @@ const Inner = ({ Component, pageProps }) => { ) } +Inner.propTypes = { + Component: PropTypes.func, + pageProps: PropTypes.shape({ + initialReduxState: PropTypes.object, + }).isRequired, +} + const dsn = process.env.NEXT_PUBLIC_SENTRY_DSN // Initialize Sentry if the user has configured a DSN if (process.browser && dsn) { @@ -59,7 +67,7 @@ export default function App(props) { <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> <meta name="theme-color" content="#00A6D6" /> </Head> - <Sentry.ErrorBoundary fallback={"An error has occurred"}> + <Sentry.ErrorBoundary fallback={'An error has occurred'}> <AuthProvider> <Inner {...props} /> </AuthProvider> diff --git a/opendc-web/opendc-web-ui/src/pages/projects/index.js b/opendc-web/opendc-web-ui/src/pages/projects/index.js index 8603c228..958ca622 100644 --- a/opendc-web/opendc-web-ui/src/pages/projects/index.js +++ b/opendc-web/opendc-web-ui/src/pages/projects/index.js @@ -15,7 +15,7 @@ function Projects() { const dispatch = useDispatch() const [filter, setFilter] = useState('SHOW_ALL') - useEffect(() => dispatch(fetchProjects()), []) + useEffect(() => dispatch(fetchProjects()), [dispatch]) return ( <> diff --git a/opendc-web/opendc-web-ui/src/redux/index.js b/opendc-web/opendc-web-ui/src/redux/index.js index 5c908957..3c7ad55f 100644 --- a/opendc-web/opendc-web-ui/src/redux/index.js +++ b/opendc-web/opendc-web-ui/src/redux/index.js @@ -1,12 +1,12 @@ import { useMemo } from 'react' -import {applyMiddleware, compose, createStore} from 'redux' +import { applyMiddleware, compose, createStore } from 'redux' import { createLogger } from 'redux-logger' import createSagaMiddleware from 'redux-saga' import thunk from 'redux-thunk' import rootReducer from './reducers' import rootSaga from './sagas' import { viewportAdjustmentMiddleware } from './middleware/viewport-adjustment' -import { createReduxEnhancer } from "@sentry/react"; +import { createReduxEnhancer } from '@sentry/react' let store diff --git a/opendc-web/opendc-web-ui/src/util/timeline.js b/opendc-web/opendc-web-ui/src/util/timeline.js deleted file mode 100644 index 7c8a3ef0..00000000 --- a/opendc-web/opendc-web-ui/src/util/timeline.js +++ /dev/null @@ -1,9 +0,0 @@ -export function convertTickToPercentage(tick, maxTick) { - if (maxTick === 0) { - return '0%' - } else if (tick > maxTick) { - return (maxTick / (maxTick + 1)) * 100 + '%' - } - - return (tick / (maxTick + 1)) * 100 + '%' -} |