import { setPageTitle } from '@/store/themeConfigSlice';
import { useEffect, useState } from 'react';
import { useDispatch } from 'react-redux';
import UserForm from '@/components/Users/Form';
import Link from 'next/link';

const AddUser = () => {
    const dispatch = useDispatch();
    useEffect(() => {
        dispatch(setPageTitle('User Add'));
    }, []);

    const [userForm, setUserForm] = useState<any>({
        name: '',
        email: '',
        password: '',
        role: '',
        phone: '+62',
        birthday: '',
        birthday_notification: false,
        gender: '',
        is_google: false,
        is_woo: false,
        is_fb: false,
        shipping: {
            name: '',
            phone: '+62',
            address: '',
            kecamatan: '',
            kelurahan: '',
            kota: '',
            provinsi: '',
            kodepos: '',
        },
    });

    return (
        <>
                <div className="mb-3">
                    <ul className="flex space-x-2 rtl:space-x-reverse">
                        <li>
                            <Link href="/setting/users" className="text-primary hover:underline">
                                Users
                            </Link>
                        </li>
                        <li className="before:content-['/'] ltr:before:mr-2 rtl:before:ml-2">
                            <span>new</span>
                        </li>
                    </ul>
                </div>
                <div className="flex flex-col gap-2.5 xl:flex-row">
                    <UserForm userForm={userForm} setUserForm={setUserForm} isCreate={true} isUpdate={false} />
                </div>
        </>
    );
};
export default AddUser;
