import {useEffect, useState} from "react";
import {InputText} from "primereact/inputtext";
import {Button} from "primereact/button";
import authorizedFetch from "../Utils";
import {SPRING_SERVER} from "../config";
import {useTranslation} from "react-i18next";

export default function (props) {
    const [newPassword, setNewPassword] = useState("")
    const [repeatPassword, setRepeatPassword] = useState("")
    const { t } = useTranslation(); // Initialize the hook


    function changePasswordClick() {
        if (newPassword === repeatPassword)
            authorizedFetch(SPRING_SERVER + "/api/setPassword/" + props.userData.login + "/" + newPassword)
    }

    return (
        <div className="shadow-4 flex flex-column p-2">
            <InputText className="" value={newPassword} placeholder={t("chgPass")} onChange={(e) => setNewPassword(e.target.value)}/>
            <InputText className="mt-2" value={repeatPassword} placeholder={t("repPass")} onChange={(e) => setRepeatPassword(e.target.value)}/>
            <Button onClick={changePasswordClick} className="mt-2">{t("chgPass")}</Button>
        </div>
    )
}