-
+
My polochons
diff --git a/frontend/js/components/polochons/polochon.js b/frontend/js/components/polochons/polochon.js
index 6e86c00..7efb43c 100644
--- a/frontend/js/components/polochons/polochon.js
+++ b/frontend/js/components/polochons/polochon.js
@@ -3,7 +3,7 @@ import PropTypes from "prop-types"
import { List } from "immutable"
import { connect } from "react-redux"
-import { PolochonUser } from "./user"
+import { PolochonUsers } from "./users"
import { PolochonEdit } from "./edit"
import { updatePolochon, deletePolochon } from "../../actions/polochon"
@@ -43,20 +43,12 @@ export const PolochonConnected = ({
ID: {id}
Egress token: {token}
Ingress token: {authToken}
-
- Users:
- {users.map((user, index) => (
-
- ))}
-
+
)
diff --git a/frontend/js/components/polochons/select.js b/frontend/js/components/polochons/select.js
new file mode 100644
index 0000000..b3fe9a6
--- /dev/null
+++ b/frontend/js/components/polochons/select.js
@@ -0,0 +1,30 @@
+import React from "react"
+import PropTypes from "prop-types"
+import { List } from "immutable"
+
+export const PolochonSelect = ({
+ value,
+ changeValue,
+ polochonList,
+}) => {
+ return (
+
+ );
+}
+PolochonSelect.propTypes = {
+ value: PropTypes.string,
+ changeValue: PropTypes.func,
+ polochonList: PropTypes.instanceOf(List),
+};
diff --git a/frontend/js/components/polochons/user.js b/frontend/js/components/polochons/user.js
index 4ed207b..fd86740 100644
--- a/frontend/js/components/polochons/user.js
+++ b/frontend/js/components/polochons/user.js
@@ -1,14 +1,82 @@
-import React from "react"
+import React, { useState, useEffect } from "react"
import PropTypes from "prop-types"
+import { connect } from "react-redux"
+
+import { editPolochonUser } from "../../actions/polochon"
+
+import Toggle from "react-bootstrap-toggle";
+
+import { FormModal } from "../forms/modal"
+import { FormInput } from "../forms/input"
+
+export const PolochonUserConnected = ({
+ polochonId,
+ id,
+ name,
+ initialToken,
+ initialActivated,
+ editPolochonUser,
+}) => {
+ const [edit, setEdit] = useState(false);
+ const [token, setToken] = useState(initialToken);
+ const [activated, setActivated] = useState(initialActivated);
+
+ useEffect(() => {
+ setActivated(initialActivated);
+ setToken(initialToken);
+ }, [initialActivated, initialToken])
+
+ const handleSubmit = () => {
+ editPolochonUser({
+ polochonId,
+ id,
+ token,
+ activated,
+ });
+ setEdit(false);
+ }
-export const PolochonUser = ({ id, name }) => {
return (
-
- {name} ({id})
-
+
+
+ {name}
+ |
+
+ {activated ? "Activated" : "Not activated"}
+ |
+
+ setEdit(true)} />
+
+
+
+
+ setActivated(!activated)} />
+
+
+ |
+
)
}
-PolochonUser.propTypes = {
+PolochonUserConnected.propTypes = {
+ polochonId: PropTypes.string,
id: PropTypes.string,
name: PropTypes.string,
+ initialToken: PropTypes.string,
+ initialActivated: PropTypes.bool,
+ editPolochonUser: PropTypes.func,
};
+
+export const PolochonUser = connect(null, {editPolochonUser})(PolochonUserConnected);
diff --git a/frontend/js/components/polochons/users.js b/frontend/js/components/polochons/users.js
new file mode 100644
index 0000000..3dba984
--- /dev/null
+++ b/frontend/js/components/polochons/users.js
@@ -0,0 +1,37 @@
+import React from "react"
+import PropTypes from "prop-types"
+import { List } from "immutable"
+
+import { PolochonUser } from "./user"
+
+export const PolochonUsers = ({ id, users }) => {
+ if (users === null || users.size === 0) { return null }
+
+ return (
+
+
+
+ User |
+ Status |
+ Actions |
+
+
+
+ {users.map((user, index) => (
+
+ ))}
+
+
+ )
+}
+PolochonUsers.propTypes = {
+ id: PropTypes.string,
+ users: PropTypes.instanceOf(List),
+};
diff --git a/frontend/js/components/users/edit.js b/frontend/js/components/users/edit.js
index 240dc4a..adecb62 100644
--- a/frontend/js/components/users/edit.js
+++ b/frontend/js/components/users/edit.js
@@ -7,13 +7,12 @@ import { List } from "immutable"
import { getUserInfos, updateUser } from "../../actions/users"
import { getPolochons } from "../../actions/polochon"
-import { FormInput } from "../forms/input"
+import { PolochonSelect } from "../polochons/select"
const mapStateToProps = (state) => ({
loading: state.userStore.get("loading"),
publicPolochons: state.polochon.get("public"),
polochonId: state.userStore.get("polochonId"),
- polochonToken: state.userStore.get("polochonToken"),
polochonActivated: state.userStore.get("polochonActivated"),
});
@@ -24,7 +23,6 @@ const mapDispatchToProps = {
const UserEditConnect = ({
loading,
polochonId,
- polochonToken,
polochonActivated,
updateUser,
getPolochons,
@@ -32,7 +30,6 @@ const UserEditConnect = ({
publicPolochons,
}) => {
const [id, setId] = useState(polochonId);
- const [token, setToken] = useState(polochonToken);
const [password, setPassword] = useState("");
const [passwordConfirm, setPasswordConfirm] = useState("");
@@ -43,8 +40,7 @@ const UserEditConnect = ({
useEffect(() => {
setId(polochonId);
- setToken(polochonToken);
- }, [polochonToken, polochonId])
+ }, [polochonId])
const handleSubmit = (ev) => {
ev.preventDefault();
@@ -52,7 +48,6 @@ const UserEditConnect = ({
"password": password,
"password_confirm": passwordConfirm,
"polochon_id": id,
- "polochon_token": token,
});
}
@@ -60,7 +55,7 @@ const UserEditConnect = ({
return (
-
+
-
-
@@ -123,7 +104,6 @@ const UserEditConnect = ({
UserEditConnect.propTypes = {
loading: PropTypes.bool.isRequired,
polochonId: PropTypes.string,
- polochonToken: PropTypes.string,
polochonActivated: PropTypes.bool,
updateUser: PropTypes.func,
getPolochons: PropTypes.func,