AdvU7baZ

1import React, {useState, useEffect} from "react";
2import API from "../../utils/API";
3
4const Sandbox = () => {
5
6    const [myListUser, setListUser] = useState({})
7    const [myLoading, setLoading] = useState(1)
8
9    useEffect(() => {
10        // récupération de la data en mode sync
11        initUserList()
12
13    }, []);
14
15    // récupération de la data en mode sync
16    async function initUserList() {
17        let res = await API.get('/user/ldap/list').then((res) => {
18            let formattedList = [];
19            let users = res.data;
20            // parsing de la data key/value ex
21            Object.keys(users).forEach((key) => {
22                let cn = users[key].value;
23                formattedList[cn] = users[key];
24            })
25            // ajout du state
26            setListUser(formattedList);
27            setLoading(0)
28        });
29    }
30
31    // retourne une liste d'option avec
32    const showUserList = () => {
33        console.log("list from users ", myListUser)
34        let options = [];
35        Object.keys(myListUser).forEach((key) => {
36            options.push(<option
37                key={key}
38                value={myListUser[key].label}>
39                {key}
40            </option>)
41        })
42        return options;
43    }
44
45    return (
46        <div className="main">
47            <div className="file">
48                <a href="/"> Sandbox page </a>
49                {myLoading ? 'Loading..' : <div><select name="" id="">{showUserList()}</select></div>}
50            </div>
51        </div>
52    );
53}
54
55export default Sandbox;