FlexitimeTracker/FlexitimeUI/flexitimeui/src/components/users/UserGrid.jsx
Chris Watts 005da7ce2b create initial react project for flexitime v2 application.
includes .net webapi backend and ui test stubs
2021-03-22 14:54:42 +00:00

33 lines
939 B
JavaScript

import React from "react";
import PropTypes from "prop-types";
import { Link } from "react-router-dom";
import UserState from "../common/UserStateIndicator";
class UserGrid extends React.Component {
render() {
return (
<div className="row justify-content-start">
{this.props.users.map(user => {
return (
<div key={user.id} style={{height:120+'px'}} className="align-content-center col-2 border rounded m-1 p-2">
<h4 className="h-50 m-1">
{user.firstName} {user.lastName}
</h4>
<div className="h-25 m-2">
<UserState state={user.state} />
</div>
</div>
);
})}
</div>
//maybe justify..-around?{/*className="display-4"text-center */}
);
}
}
UserGrid.propTypes = {
users: PropTypes.array.isRequired
};
export default UserGrid;