Display the activation state of the accounts

This commit is contained in:
Grégoire Delattre 2017-08-13 10:44:28 +02:00
parent 667768fa10
commit dec9547152
9 changed files with 311 additions and 13 deletions

View File

@ -17,6 +17,7 @@
"react": "^15.3.2",
"react-bootstrap": "^0.30.6",
"react-bootstrap-sweetalert": "^3.0.0",
"react-bootstrap-toggle": "^2.0.8",
"react-dom": "^15.3.2",
"react-infinite-scroller": "^1.0.4",
"react-loading": "^0.0.9",

View File

@ -1,8 +1,11 @@
package admin
import (
"encoding/json"
"fmt"
"net/http"
"gitlab.quimbo.fr/odwrtw/canape-sql/src/internal/config"
"gitlab.quimbo.fr/odwrtw/canape-sql/src/internal/users"
"gitlab.quimbo.fr/odwrtw/canape-sql/src/internal/web"
@ -24,3 +27,51 @@ func GetUsersHandler(env *web.Env, w http.ResponseWriter, r *http.Request) error
return env.RenderJSON(w, users)
}
// UpdateUserHandler updates the user data
func UpdateUserHandler(env *web.Env, w http.ResponseWriter, r *http.Request) error {
log := env.Log.WithFields(logrus.Fields{
"function": "admin.PostActivateUserHandler",
})
var data struct {
ID string `json:"userId"`
Admin bool `json:"admin"`
Activated bool `json:"activated"`
PolochonURL string `json:"polochonUrl"`
PolochonToken string `json:"polochonToken"`
}
if err := json.NewDecoder(r.Body).Decode(&data); err != nil {
return err
}
if data.ID == "" {
return env.RenderError(w, fmt.Errorf("Empty user id"))
}
user, err := users.GetByID(env.Database, data.ID)
if err != nil {
return err
}
// Update the polochon config
polochonConfig := &config.UserPolochon{
URL: data.PolochonURL,
Token: data.PolochonToken,
}
if err := user.SetConfig("polochon", polochonConfig); err != nil {
return err
}
user.Admin = data.Admin
user.Activated = data.Activated
log.Debugf("updating user")
// Save the user with the new configurations
if err := user.Update(env.Database); err != nil {
return err
}
return env.RenderOK(w, "user updated")
}

View File

@ -1,6 +1,7 @@
package users
import (
"database/sql"
"encoding/json"
"errors"
"fmt"
@ -15,17 +16,18 @@ import (
)
const (
addUserQuery = `INSERT INTO users (name, hash, admin, rawconfig) VALUES ($1, $2, $3, $4) RETURNING id;`
getUserQuery = `SELECT * FROM users WHERE name=$1;`
updateUserQuery = `UPDATE users SET name=:name, hash=:hash, admin=:admin, rawconfig=:rawconfig WHERE id=:id RETURNING *;`
deleteUseQuery = `DELETE FROM users WHERE id=:id;`
addUserQuery = `INSERT INTO users (name, hash, admin, rawconfig) VALUES ($1, $2, $3, $4) RETURNING id;`
getUserQuery = `SELECT * FROM users WHERE name=$1;`
getUserByIDQuery = `SELECT * FROM users WHERE id=$1;`
updateUserQuery = `UPDATE users SET name=:name, hash=:hash, admin=:admin, activated=:activated, rawconfig=:rawconfig WHERE id=:id RETURNING *;`
deleteUseQuery = `DELETE FROM users WHERE id=:id;`
addTokenQuery = `INSERT INTO tokens (value, user_id) VALUES ($1, $2) RETURNING id;`
getTokensQuery = `SELECT id, value FROM tokens WHERE user_id=$1;`
checkTokenQuery = `SELECT count(*) FROM tokens WHERE user_id=$1 AND value=$2;`
deleteTokenQuery = `DELETE FROM tokens WHERE user_id=$1 AND value=$2;`
getAllUsersQuery = `SELECT * FROM users;`
getAllUsersQuery = `SELECT * FROM users order by created_at;`
)
const (
@ -128,7 +130,20 @@ func Get(q sqlx.Queryer, name string) (*User, error) {
u := &User{}
err := q.QueryRowx(getUserQuery, name).StructScan(u)
if err != nil {
if err.Error() == "sql: no rows in result set" {
if err == sql.ErrNoRows {
return nil, ErrUnknownUser
}
return nil, err
}
return u, nil
}
// GetByID returns user using its id
func GetByID(q sqlx.Queryer, id string) (*User, error) {
u := &User{}
err := q.QueryRowx(getUserByIDQuery, id).StructScan(u)
if err != nil {
if err == sql.ErrNoRows {
return nil, ErrUnknownUser
}
return nil, err

View File

@ -6,3 +6,13 @@ export function getUsers() {
configureAxios().get("/admins/users")
)
}
export function updateUser(data) {
return request(
"ADMIN_UPDATE_USER",
configureAxios().post("/admins/users", data),
[
() => getUsers(),
]
)
}

View File

@ -1,7 +1,7 @@
import React from "react"
import { connect } from "react-redux"
import { bindActionCreators } from "redux"
import { getUsers } from "../../actions/admins"
import { updateUser } from "../../actions/admins"
import UserList from "./users"
@ -11,11 +11,14 @@ function mapStateToProps(state) {
};
}
const mapDispatchToProps = (dipatch) =>
bindActionCreators({ getUsers }, dipatch)
bindActionCreators({ updateUser }, dipatch)
function AdminPanel(props) {
return (
<UserList users={props.users} />
<UserList
users={props.users}
updateUser={props.updateUser}
/>
);
}

View File

@ -1,5 +1,8 @@
import React from "react"
import { Button, Modal } from "react-bootstrap"
import Toggle from "react-bootstrap-toggle";
export default function UserList(props) {
return (
<div>
@ -10,15 +13,21 @@ export default function UserList(props) {
<tr className="active">
<th>#</th>
<th>Name</th>
<th>Activated</th>
<th>Admin</th>
<th>Polochon URL</th>
<th>Polochon token</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{props.users.map(function(el, index) {
return (
<User key={index} data={el} />
<User
key={index}
data={el}
updateUser={props.updateUser}
/>
);
})}
</tbody>
@ -31,15 +40,149 @@ function User(props) {
const polochonConfig = props.data.get("RawConfig").get("polochon");
const polochonURL = polochonConfig ? polochonConfig.get("url") : "-";
const polochonToken = polochonConfig ? polochonConfig.get("token") : "-";
const admin = props.data.get("Admin") ? "yes" : "no";
return (
<tr>
<td>{props.data.get("id")}</td>
<td>{props.data.get("Name")}</td>
<td>{admin}</td>
<td><UserActivationStatus data={props.data}/></td>
<td><UserAdminStatus data={props.data}/></td>
<td>{polochonURL}</td>
<td>{polochonToken}</td>
<td></td>
<td>
<UserEdit
data={props.data}
updateUser={props.updateUser}
/>
</td>
</tr>
);
}
function UserAdminStatus(props) {
const admin = props.data.get("Admin");
const className = admin ? "fa fa-check" : "fa fa-times";
return (<span className={className}></span>);
}
function UserActivationStatus(props) {
const activated = props.data.get("Activated");
const className = activated ? "fa fa-check" : "fa fa-times text-danger";
return (<span className={className}></span>);
}
class UserEdit extends React.PureComponent {
constructor(props) {
super(props);
// User props
const polochonConfig = props.data.get("RawConfig").get("polochon");
const polochonUrl = polochonConfig ? polochonConfig.get("url") : "";
const polochonToken = polochonConfig ? polochonConfig.get("token") : "";
// Functions
this.showModal = this.showModal.bind(this);
this.hideModal = this.hideModal.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.handleUrlInput = this.handleUrlInput.bind(this);
this.handleTokenInput = this.handleTokenInput.bind(this);
this.handleActivatedToggle = this.handleActivatedToggle.bind(this);
this.handleAdminToggle = this.handleAdminToggle.bind(this);
this.state = {
showModal: false,
polochonUrl: polochonUrl,
polochonToken: polochonToken,
activated: props.data.get("Activated"),
admin: props.data.get("Admin"),
};
}
showModal() {
this.setState({ showModal: true });
}
hideModal() {
this.setState({ showModal: false });
}
handleSubmit(e) {
if (e) { e.preventDefault(); }
this.props.updateUser({
userId: this.props.data.get("id"),
admin: this.state.admin,
activated: this.state.activated,
polochonUrl: this.state.polochonUrl,
polochonToken: this.state.polochonToken,
});
this.setState({ showModal: false });
}
handleTokenInput() {
this.setState({ polochonToken: this.refs.polochonToken.value });
}
handleUrlInput() {
this.setState({ polochonUrl: this.refs.polochonUrl.value });
}
handleActivatedToggle() {
this.setState({ activated: !this.state.activated });
}
handleAdminToggle() {
this.setState({ admin: !this.state.admin });
}
render() {
return (
<span className="fa fa-pencil clickable" onClick={this.showModal}>
<Modal show={this.state.showModal} onHide={this.hideModal}>
<Modal.Header closeButton>
<Modal.Title>
<i className="fa fa-pencil"></i>
&nbsp; Edit user - {this.props.data.get("Name")}
</Modal.Title>
</Modal.Header>
<Modal.Body bsClass="modal-body admin-edit-user-modal">
<form className="form-horizontal" onSubmit={(ev) => this.handleSubmit(ev)}>
<div className="form-group">
<label>Account status</label>
<Toggle
className="pull-right"
on="Activated"
off="Deactivated"
active={this.state.activated}
onClick={this.handleActivatedToggle}
/>
</div>
<div className="form-group">
<label>Admin status</label>
<Toggle
className="pull-right"
on="Admin"
off="User"
active={this.state.admin}
onClick={this.handleAdminToggle}
/>
</div>
<div className="form-group">
<label className="control-label">Polochon URL</label>
<input
className="form-control"
value={this.state.polochonUrl}
onChange={this.handleUrlInput}
ref="polochonUrl"
/>
</div>
<div className="form-group">
<label className="control-label">Polochon token</label>
<input
className="form-control"
value={this.state.polochonToken}
onChange={this.handleTokenInput}
ref="polochonToken"
/>
</div>
</form>
</Modal.Body>
<Modal.Footer>
<Button bsStyle="success" onClick={this.handleSubmit}>Apply</Button>
<Button onClick={this.hideModal}>Close</Button>
</Modal.Footer>
</Modal>
</span>
);
}
}

View File

@ -2,6 +2,7 @@
@import "~bootswatch/superhero/variables.less";
@import "~bootswatch/superhero/bootswatch.less";
@import "~font-awesome/less/font-awesome.less";
@import "~react-bootstrap-toggle/src/bootstrap2-toggle.css";
body {
padding-top: @navbar-height + 10px;
@ -75,3 +76,8 @@ div.sweet-alert > h2 {
.player-modal {
width: 90%;
}
.admin-edit-user-modal {
margin-left: 3px;
margin-right: 3px;
}

View File

@ -60,4 +60,5 @@ func setupRoutes(env *web.Env) {
// Admin routes
env.Handle("/admins/users", admin.GetUsersHandler).WithRole(users.AdminRole).Methods("GET")
env.Handle("/admins/users", admin.UpdateUserHandler).WithRole(users.AdminRole).Methods("POST")
}

View File

@ -1125,6 +1125,14 @@ core-util-is@~1.0.0:
version "1.0.2"
resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
create-react-class@^15.6.0:
version "15.6.0"
resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.0.tgz#ab448497c26566e1e29413e883207d57cfe7bed4"
dependencies:
fbjs "^0.8.9"
loose-envify "^1.3.1"
object-assign "^4.1.1"
cryptiles@2.x.x:
version "2.0.5"
resolved "https://registry.yarnpkg.com/cryptiles/-/cryptiles-2.0.5.tgz#3bdfecdc608147c1c67202fa291e7dca59eaa3b8"
@ -1613,6 +1621,18 @@ fbjs@^0.8.4:
promise "^7.1.1"
ua-parser-js "^0.7.9"
fbjs@^0.8.9:
version "0.8.14"
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.14.tgz#d1dbe2be254c35a91e09f31f9cd50a40b2a0ed1c"
dependencies:
core-js "^1.0.0"
isomorphic-fetch "^2.1.1"
loose-envify "^1.0.0"
object-assign "^4.1.0"
promise "^7.1.1"
setimmediate "^1.0.5"
ua-parser-js "^0.7.9"
figures@^1.3.5:
version "1.7.0"
resolved "https://registry.yarnpkg.com/figures/-/figures-1.7.0.tgz#cbe1e3affcf1cd44b80cadfed28dc793a9701d2e"
@ -2703,6 +2723,12 @@ loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.2.0:
dependencies:
js-tokens "^2.0.0"
loose-envify@^1.3.1:
version "1.3.1"
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.3.1.tgz#d1a8ad33fa9ce0e713d65fdd0ac8b748d478c848"
dependencies:
js-tokens "^3.0.0"
loud-rejection@^1.0.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/loud-rejection/-/loud-rejection-1.6.0.tgz#5b46f80147edee578870f086d04821cf998e551f"
@ -2971,6 +2997,10 @@ object-assign@^4.0.1, object-assign@^4.1.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.0.tgz#7a3b3d0e98063d43f4c03f2e8ae6cd51a86883a0"
object-assign@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
object.omit@^2.0.0:
version "2.0.1"
resolved "https://registry.yarnpkg.com/object.omit/-/object.omit-2.0.1.tgz#1a9c744829f39dbb858c76ca3579ae2a54ebd1fa"
@ -3406,6 +3436,13 @@ promise@^7.1.1:
dependencies:
asap "~2.0.3"
prop-types@^15.5.10:
version "15.5.10"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.10.tgz#2797dfc3126182e3a95e3dfbb2e893ddd7456154"
dependencies:
fbjs "^0.8.9"
loose-envify "^1.3.1"
prr@~0.0.0:
version "0.0.0"
resolved "https://registry.yarnpkg.com/prr/-/prr-0.0.0.tgz#1a84b85908325501411853d0081ee3fa86e2926a"
@ -3477,10 +3514,27 @@ react-bootstrap-sweetalert:
dependencies:
object-assign "^4.1.0"
react-bootstrap-toggle@^2.0.8:
version "2.0.8"
resolved "https://registry.yarnpkg.com/react-bootstrap-toggle/-/react-bootstrap-toggle-2.0.8.tgz#04e951527ffdd3b2a18de753b4992fa2a7d25792"
dependencies:
prop-types "^15.5.10"
react "^15.4.2"
react-dom "^15.4.2"
react-dom@^15.3.2:
version "15.3.2"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.3.2.tgz#c46b0aa5380d7b838e7a59c4a7beff2ed315531f"
react-dom@^15.4.2:
version "15.6.1"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.6.1.tgz#2cb0ed4191038e53c209eb3a79a23e2a4cf99470"
dependencies:
fbjs "^0.8.9"
loose-envify "^1.1.0"
object-assign "^4.1.0"
prop-types "^15.5.10"
react-infinite-scroller:
version "1.0.4"
resolved "https://registry.yarnpkg.com/react-infinite-scroller/-/react-infinite-scroller-1.0.4.tgz#cb171113c4c8ee6aa44669392a55ad50938e2028"
@ -3539,6 +3593,16 @@ react@^15.3.2:
loose-envify "^1.1.0"
object-assign "^4.1.0"
react@^15.4.2:
version "15.6.1"
resolved "https://registry.yarnpkg.com/react/-/react-15.6.1.tgz#baa8434ec6780bde997cdc380b79cd33b96393df"
dependencies:
create-react-class "^15.6.0"
fbjs "^0.8.9"
loose-envify "^1.1.0"
object-assign "^4.1.0"
prop-types "^15.5.10"
read-pkg-up@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-1.0.1.tgz#9d63c13276c065918d57f002a57f40a1b643fb02"
@ -3845,6 +3909,10 @@ set-immediate-shim@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz#4b2b1b27eb808a9f8dcc481a58e5e56f599f3f61"
setimmediate@^1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
sha.js@2.2.6:
version "2.2.6"
resolved "https://registry.yarnpkg.com/sha.js/-/sha.js-2.2.6.tgz#17ddeddc5f722fb66501658895461977867315ba"