import React from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import { Link } from '../../../../../../navigation';
import { i18nText } from '../../../../../../i18nKeys/';

export default function ChangePassword({ params: { locale } }: { params: { locale: string } }) {
    unstable_setRequestLocale(locale);

    return (
        <>
            <ol className="breadcrumb">
                <li className="breadcrumb-item">
                    <Link href={'/account/settings' as any}>
                        {i18nText('accountMenu.settings', locale)}
                    </Link>
                </li>
                <li className="breadcrumb-item active" aria-current="page">{i18nText('changePass', locale)}</li>
            </ol>
            <form className="form-settings" action="">
                <div className="form-field password-hide">
                    <input type="text" placeholder={i18nText('oldPass', locale)} className="base-input" id="" value="" />
                </div>
                <div className="form-field password-hide">
                    <input type="text" placeholder={i18nText('newPass', locale)} className="base-input" id="" value="" />
                </div>
                <div className="form-field password-show">
                    <input className="base-input" type="text" placeholder={i18nText('confirmPass', locale)} id="" value="" />
                </div>
                <button className="btn-apply">{i18nText('save', locale)}</button>
            </form>
        </>
    );
};