summaryrefslogtreecommitdiff
path: root/src/components/simulations
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/simulations')
-rw-r--r--src/components/simulations/FilterButton.js32
-rw-r--r--src/components/simulations/FilterPanel.js12
-rw-r--r--src/components/simulations/NewSimulationButtonComponent.js18
-rw-r--r--src/components/simulations/SimulationActionButtons.js58
-rw-r--r--src/components/simulations/SimulationAuthList.js61
-rw-r--r--src/components/simulations/SimulationAuthRow.js42
6 files changed, 117 insertions, 106 deletions
diff --git a/src/components/simulations/FilterButton.js b/src/components/simulations/FilterButton.js
index b26dd231..aa41f180 100644
--- a/src/components/simulations/FilterButton.js
+++ b/src/components/simulations/FilterButton.js
@@ -1,22 +1,24 @@
-import classNames from 'classnames';
-import PropTypes from 'prop-types';
-import React from 'react';
+import classNames from "classnames";
+import PropTypes from "prop-types";
+import React from "react";
-const FilterButton = ({active, children, onClick}) => (
- <button className={classNames("btn btn-secondary", {"active": active})}
- onClick={() => {
- if (!active) {
- onClick();
- }
- }}>
- {children}
- </button>
+const FilterButton = ({ active, children, onClick }) => (
+ <button
+ className={classNames("btn btn-secondary", { active: active })}
+ onClick={() => {
+ if (!active) {
+ onClick();
+ }
+ }}
+ >
+ {children}
+ </button>
);
FilterButton.propTypes = {
- active: PropTypes.bool.isRequired,
- children: PropTypes.node.isRequired,
- onClick: PropTypes.func.isRequired
+ active: PropTypes.bool.isRequired,
+ children: PropTypes.node.isRequired,
+ onClick: PropTypes.func.isRequired
};
export default FilterButton;
diff --git a/src/components/simulations/FilterPanel.js b/src/components/simulations/FilterPanel.js
index 504e24e4..836c0842 100644
--- a/src/components/simulations/FilterPanel.js
+++ b/src/components/simulations/FilterPanel.js
@@ -1,13 +1,13 @@
-import React from 'react';
+import React from "react";
import FilterLink from "../../containers/simulations/FilterLink";
import "./FilterPanel.css";
const FilterPanel = () => (
- <div className="btn-group filter-panel mb-2">
- <FilterLink filter="SHOW_ALL">All Simulations</FilterLink>
- <FilterLink filter="SHOW_OWN">My Simulations</FilterLink>
- <FilterLink filter="SHOW_SHARED">Shared with me</FilterLink>
- </div>
+ <div className="btn-group filter-panel mb-2">
+ <FilterLink filter="SHOW_ALL">All Simulations</FilterLink>
+ <FilterLink filter="SHOW_OWN">My Simulations</FilterLink>
+ <FilterLink filter="SHOW_SHARED">Shared with me</FilterLink>
+ </div>
);
export default FilterPanel;
diff --git a/src/components/simulations/NewSimulationButtonComponent.js b/src/components/simulations/NewSimulationButtonComponent.js
index 74036c1b..7e12d30f 100644
--- a/src/components/simulations/NewSimulationButtonComponent.js
+++ b/src/components/simulations/NewSimulationButtonComponent.js
@@ -1,17 +1,17 @@
-import PropTypes from 'prop-types';
-import React from 'react';
+import PropTypes from "prop-types";
+import React from "react";
-const NewSimulationButtonComponent = ({onClick}) => (
- <div className="bottom-btn-container">
- <div className="btn btn-primary float-right" onClick={onClick}>
- <span className="fa fa-plus mr-2"/>
- New Simulation
- </div>
+const NewSimulationButtonComponent = ({ onClick }) => (
+ <div className="bottom-btn-container">
+ <div className="btn btn-primary float-right" onClick={onClick}>
+ <span className="fa fa-plus mr-2" />
+ New Simulation
</div>
+ </div>
);
NewSimulationButtonComponent.propTypes = {
- onClick: PropTypes.func.isRequired,
+ onClick: PropTypes.func.isRequired
};
export default NewSimulationButtonComponent;
diff --git a/src/components/simulations/SimulationActionButtons.js b/src/components/simulations/SimulationActionButtons.js
index c8325a71..46f4f159 100644
--- a/src/components/simulations/SimulationActionButtons.js
+++ b/src/components/simulations/SimulationActionButtons.js
@@ -1,37 +1,37 @@
import PropTypes from "prop-types";
-import React from 'react';
-import {Link} from "react-router-dom";
+import React from "react";
+import { Link } from "react-router-dom";
-const SimulationActionButtons = ({simulationId, onViewUsers, onDelete}) => (
- <td className="text-right">
- <Link
- to={"/simulations/" + simulationId}
- className="btn btn-outline-primary btn-sm mr-2"
- title="Open this simulation"
- >
- <span className="fa fa-play"/>
- </Link>
- <div
- className="btn btn-outline-success btn-sm disabled mr-2"
- title="View and edit collaborators (not supported yet)"
- onClick={() => onViewUsers(simulationId)}
- >
- <span className="fa fa-users"/>
- </div>
- <div
- className="btn btn-outline-danger btn-sm"
- title="Delete this simulation"
- onClick={() => onDelete(simulationId)}
- >
- <span className="fa fa-trash"/>
- </div>
- </td>
+const SimulationActionButtons = ({ simulationId, onViewUsers, onDelete }) => (
+ <td className="text-right">
+ <Link
+ to={"/simulations/" + simulationId}
+ className="btn btn-outline-primary btn-sm mr-2"
+ title="Open this simulation"
+ >
+ <span className="fa fa-play" />
+ </Link>
+ <div
+ className="btn btn-outline-success btn-sm disabled mr-2"
+ title="View and edit collaborators (not supported yet)"
+ onClick={() => onViewUsers(simulationId)}
+ >
+ <span className="fa fa-users" />
+ </div>
+ <div
+ className="btn btn-outline-danger btn-sm"
+ title="Delete this simulation"
+ onClick={() => onDelete(simulationId)}
+ >
+ <span className="fa fa-trash" />
+ </div>
+ </td>
);
SimulationActionButtons.propTypes = {
- simulationId: PropTypes.number.isRequired,
- onViewUsers: PropTypes.func,
- onDelete: PropTypes.func,
+ simulationId: PropTypes.number.isRequired,
+ onViewUsers: PropTypes.func,
+ onDelete: PropTypes.func
};
export default SimulationActionButtons;
diff --git a/src/components/simulations/SimulationAuthList.js b/src/components/simulations/SimulationAuthList.js
index 27b141fe..f29dc96d 100644
--- a/src/components/simulations/SimulationAuthList.js
+++ b/src/components/simulations/SimulationAuthList.js
@@ -1,38 +1,43 @@
-import PropTypes from 'prop-types';
-import React from 'react';
+import PropTypes from "prop-types";
+import React from "react";
import Shapes from "../../shapes/index";
import SimulationAuthRow from "./SimulationAuthRow";
-const SimulationAuthList = ({authorizations}) => {
- return (
- <div className="vertically-expanding-container">
- {authorizations.length === 0 ?
- <div className="alert alert-info">
- <span className="info-icon fa fa-question-circle mr-2"/>
- <strong>No simulations here yet...</strong> Add some with the 'New Simulation' button!
- </div> :
- <table className="table table-striped">
- <thead>
- <tr>
- <th>Simulation name</th>
- <th>Last edited</th>
- <th>Access rights</th>
- <th/>
- </tr>
- </thead>
- <tbody>
- {authorizations.map(authorization => (
- <SimulationAuthRow simulationAuth={authorization} key={authorization.simulation.id}/>
- ))}
- </tbody>
- </table>
- }
+const SimulationAuthList = ({ authorizations }) => {
+ return (
+ <div className="vertically-expanding-container">
+ {authorizations.length === 0 ? (
+ <div className="alert alert-info">
+ <span className="info-icon fa fa-question-circle mr-2" />
+ <strong>No simulations here yet...</strong> Add some with the 'New
+ Simulation' button!
</div>
- );
+ ) : (
+ <table className="table table-striped">
+ <thead>
+ <tr>
+ <th>Simulation name</th>
+ <th>Last edited</th>
+ <th>Access rights</th>
+ <th />
+ </tr>
+ </thead>
+ <tbody>
+ {authorizations.map(authorization => (
+ <SimulationAuthRow
+ simulationAuth={authorization}
+ key={authorization.simulation.id}
+ />
+ ))}
+ </tbody>
+ </table>
+ )}
+ </div>
+ );
};
SimulationAuthList.propTypes = {
- authorizations: PropTypes.arrayOf(Shapes.Authorization).isRequired,
+ authorizations: PropTypes.arrayOf(Shapes.Authorization).isRequired
};
export default SimulationAuthList;
diff --git a/src/components/simulations/SimulationAuthRow.js b/src/components/simulations/SimulationAuthRow.js
index 5f452f3e..b638fbce 100644
--- a/src/components/simulations/SimulationAuthRow.js
+++ b/src/components/simulations/SimulationAuthRow.js
@@ -1,28 +1,32 @@
-import classNames from 'classnames';
-import React from 'react';
+import classNames from "classnames";
+import React from "react";
import SimulationActions from "../../containers/simulations/SimulationActions";
import Shapes from "../../shapes/index";
-import {AUTH_DESCRIPTION_MAP, AUTH_ICON_MAP} from "../../util/authorizations";
-import {parseAndFormatDateTime} from "../../util/date-time";
+import { AUTH_DESCRIPTION_MAP, AUTH_ICON_MAP } from "../../util/authorizations";
+import { parseAndFormatDateTime } from "../../util/date-time";
-const SimulationAuthRow = ({simulationAuth}) => (
- <tr>
- <td className="pt-3">
- {simulationAuth.simulation.name}
- </td>
- <td className="pt-3">
- {parseAndFormatDateTime(simulationAuth.simulation.datetimeLastEdited)}
- </td>
- <td className="pt-3">
- <span className={classNames("fa", "fa-" + AUTH_ICON_MAP[simulationAuth.authorizationLevel], "mr-2")}/>
- {AUTH_DESCRIPTION_MAP[simulationAuth.authorizationLevel]}
- </td>
- <SimulationActions simulationId={simulationAuth.simulation.id}/>
- </tr>
+const SimulationAuthRow = ({ simulationAuth }) => (
+ <tr>
+ <td className="pt-3">{simulationAuth.simulation.name}</td>
+ <td className="pt-3">
+ {parseAndFormatDateTime(simulationAuth.simulation.datetimeLastEdited)}
+ </td>
+ <td className="pt-3">
+ <span
+ className={classNames(
+ "fa",
+ "fa-" + AUTH_ICON_MAP[simulationAuth.authorizationLevel],
+ "mr-2"
+ )}
+ />
+ {AUTH_DESCRIPTION_MAP[simulationAuth.authorizationLevel]}
+ </td>
+ <SimulationActions simulationId={simulationAuth.simulation.id} />
+ </tr>
);
SimulationAuthRow.propTypes = {
- simulationAuth: Shapes.Authorization.isRequired,
+ simulationAuth: Shapes.Authorization.isRequired
};
export default SimulationAuthRow;