import { createSignal } from "solid-js";
import { FilledButton } from "../components/FilledButton";
import { UserPlusIcon } from "../icons/UserPlusIcon";
import { MaterialInput } from "../components/MaterialInput";

export function ClassroomUserCreation() {
    const [email, setEmail] = createSignal("yuli.palo.apaza@gmail.com");
    const [loading, setLoading] = createSignal(false);

    return (
        <div class="px-4 pb-4">
            <p class="py-2">
                O cree un nuevo usuario:
            </p>

            <form>
                <MaterialInput
                    resourceName="Correo"
                    value={email()}
                    setValue={setEmail}
                    disabled={loading()}
                />
            </form>

            <FilledButton class="ml-2">
                <UserPlusIcon fill="var(--c-on-primary)" class="mr-2 relative scale-150" size={16} />
                Crear usuario
            </FilledButton>
        </div>
    );
}
