import React, { useEffect, useState } from 'react';
import { Game, User } from 'visions-types';
import { Client } from '../../client';

interface UserRowProps {
    user: User,
}

const UserRow = ({ user }: UserRowProps) => {
    let accountState = "Normal";

    switch (user.state.type) {
        case "Normal": {
            accountState = "Normal";
            break;
        }
        case "PasswordReset": {
            accountState = `PasswordReset until ${user.state.content}`;
            break;
        }
        case "Locked": {
            accountState = "Locked";
            break;
        }
    }

    return (<tr>
        <td> {user.name} </td>
        <td> {user.admin && "admin"} </td>
        <td> {accountState} </td>
    </tr>);
}

interface GameRowProps {
    game: Game,
}

const GameRow = ({ game }: GameRowProps) => {
    return (<tr>
        <td> {game.name} </td>
    </tr>);
}

interface AdminProps {
    client: Client,
}

export const AdminView = ({ client }: AdminProps) => {
    const [users, setUsers] = useState<Array<User>>([]);

    /*
    useEffect(() => {
        client.users("aoeu").then((u) => {
            console.log(u);
            setUsers(u);
        });
    }, [client]);
    */
    return (<table>
        <tbody>
            {users.map((user) => <UserRow user={user} />)}
        </tbody>
    </table>);
}