diff --git a/src/components/common/Status401.jsx b/src/components/common/Status401.jsx new file mode 100644 index 00000000..278af182 --- /dev/null +++ b/src/components/common/Status401.jsx @@ -0,0 +1,11 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import GenericStatusPage from './GenericStatusPage'; + +function Darien401(props) { + return ( + + ); +}; + +export default Darien401; diff --git a/src/components/common/Status404.jsx b/src/components/common/Status404.jsx new file mode 100644 index 00000000..9953ce0b --- /dev/null +++ b/src/components/common/Status404.jsx @@ -0,0 +1,11 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import GenericStatusPage from './GenericStatusPage'; + +function Darien404(props) { + return ( + + ); +}; + +export default Darien404; diff --git a/src/components/darien/DarienClassroomsTable.jsx b/src/components/darien/DarienClassroomsTable.jsx index 9acfacd9..2a7f1cdc 100644 --- a/src/components/darien/DarienClassroomsTable.jsx +++ b/src/components/darien/DarienClassroomsTable.jsx @@ -22,7 +22,7 @@ import { CLASSROOMS_INITIAL_STATE, CLASSROOMS_PROPTYPES } from '../../ducks/classrooms'; -const DarienClassroomsTable = (props) => { +function DarienClassroomsTable(props) { return ( {props.children} diff --git a/src/components/darien/DarienEducators.jsx b/src/components/darien/DarienEducators.jsx new file mode 100644 index 00000000..7cdd7422 --- /dev/null +++ b/src/components/darien/DarienEducators.jsx @@ -0,0 +1,14 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ClassroomsLayout from '../classrooms/ClassroomsLayout'; + +function DarienEducators(props) { + return ( + + ); +}; + +DarienEducators.defaultProps = {}; +DarienEducators.propTypes = {}; + +export default DarienEducators; diff --git a/src/components/darien/DarienHome.jsx b/src/components/darien/DarienHome.jsx index e8f311dc..c4828c1f 100644 --- a/src/components/darien/DarienHome.jsx +++ b/src/components/darien/DarienHome.jsx @@ -1,6 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; +import { Actions } from 'jumpstate'; import Section from 'grommet/components/Section'; import Box from 'grommet/components/Box'; @@ -9,6 +10,7 @@ import Image from 'grommet/components/Image'; import Heading from 'grommet/components/Heading'; import Button from 'grommet/components/Button'; import Paragraph from 'grommet/components/Paragraph'; +import Label from 'grommet/components/Label'; import ProgramHome from '../common/ProgramHome'; import NeedHelp from '../common/NeedHelp'; @@ -17,47 +19,51 @@ import { PROGRAMS_INITIAL_STATE, PROGRAMS_PROPTYPES, PROGRAMS_STATUS } from '../../ducks/programs'; -class DarienHome extends React.Component { - constructor(props) { - super(props); - } +function DarienHome(props) { + const signedIn = (props.user && props.initialised); + const selectedProgramExists = (props.programsStatus === PROGRAMS_STATUS.SUCCESS && props.selectedProgram); + const name = (selectedProgramExists && props.selectedProgram.name) ? props.selectedProgram.name : ''; - render() { - const selectedProgramExists = (this.props.programsStatus === PROGRAMS_STATUS.SUCCESS && this.props.selectedProgram); - const name = (selectedProgramExists && this.props.selectedProgram.name) ? this.props.selectedProgram.name : ''; + return ( + + } + backgroundColorIndex="dark" + size="medium" + > + {name} + +
+ + Investigate ecological questions by exploring trail camera data using an interactive map. Filter and download data to perform analyses and test hypotheses. + + + If you are an educator, you can set up private classrooms and invite your students to join. Curate data sets or let your students explore on their own. Guided activities and supporting educational resources are also available. {(signedIn) ? null : '(Sign In required)'} + {(signedIn) + ?
- - - ); - } + + + + + ); } DarienHome.propTypes = { diff --git a/src/components/darien/DarienExplorer.jsx b/src/components/darien/DarienMap.jsx similarity index 71% rename from src/components/darien/DarienExplorer.jsx rename to src/components/darien/DarienMap.jsx index f4d450d0..c2e31bd1 100644 --- a/src/components/darien/DarienExplorer.jsx +++ b/src/components/darien/DarienMap.jsx @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import MapExplorer from '../../containers/maps/MapExplorer'; import mapConfig from '../../lib/wildcam-darien.mapConfig.js'; -const DarienExplorer = (props) => { +function DarienMap(props) { return ( { ); }; -DarienExplorer.defaultProps = { +DarienMap.defaultProps = { mapConfig }; -DarienExplorer.propTypes = { +DarienMap.propTypes = { mapConfig: PropTypes.object }; -export default DarienExplorer; +export default DarienMap; diff --git a/src/containers/common/ProgramHomeContainer.jsx b/src/containers/common/ProgramHomeContainer.jsx index a75d06c9..042acadf 100644 --- a/src/containers/common/ProgramHomeContainer.jsx +++ b/src/containers/common/ProgramHomeContainer.jsx @@ -5,7 +5,7 @@ import { Actions } from 'jumpstate'; import { Switch, Route, Redirect } from 'react-router-dom'; import AstroHome from '../../components/astro/AstroHome'; -import DarienRoutesContainer from '../darien/DarienRoutesContainer'; +import DarienProgram from '../darien/DarienProgram'; import GenericStatusPage from '../../components/common/GenericStatusPage'; import { @@ -61,7 +61,7 @@ export class ProgramHomeContainer extends React.Component { - + ); } diff --git a/src/containers/darien/DarienProgram.jsx b/src/containers/darien/DarienProgram.jsx new file mode 100644 index 00000000..d416257a --- /dev/null +++ b/src/containers/darien/DarienProgram.jsx @@ -0,0 +1,68 @@ +/* +Darien Program +-------------- +This container is the "main parent" that oversees/organises the rest of the +components used by WildCam Darien Lab. + +Currently, it has two concerns: +- Only allow non-logged-in users access to certain parts of the Lab. +- Route Teachers and Students to their correct components. + + */ + +import React from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; +import { Switch, Route } from 'react-router-dom'; +import DarienHome from '../../components/darien/DarienHome'; +import DarienEducators from '../../components/darien/DarienEducators'; +import DarienMap from '../../components/darien/DarienMap'; +import Status401 from '../../components/common/Status401'; +import Status404 from '../../components/common/Status404'; +import GenericStatusPage from '../../components/common/GenericStatusPage'; + +function DarienProgram(props) { + if (!props.initialised) { //User status unknown: wait. + return (); + } else { + + if (props.user) { //User logged in: give access to all locations. + return ( + + + + + + + ); + } else { //User not logged in: give limited access. + return ( + + + + + + + ); + } + } +} + +DarienProgram.propTypes = { + initialised: PropTypes.bool, + user: PropTypes.shape({ login: PropTypes.string }), +}; + +DarienProgram.defaultProps = { + initialised: false, + user: null, +}; + +function mapStateToProps(state) { + return { + initialised: state.auth.initialised, + user: state.auth.user, + }; +} + +export default connect(mapStateToProps)(DarienProgram); diff --git a/src/containers/darien/DarienRoutesContainer.jsx b/src/containers/darien/DarienRoutesContainer.jsx deleted file mode 100644 index dcbb7993..00000000 --- a/src/containers/darien/DarienRoutesContainer.jsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { Switch, Route } from 'react-router-dom'; -import DarienHome from '../../components/darien/DarienHome'; -import DarienExplorer from '../../components/darien/DarienExplorer'; -import ClassroomsLayout from '../../components/classrooms/ClassroomsLayout'; - -export default class DarienRoutesContainer extends React.Component { - render() { - return ( - - - - - - ); - } -}