import Alpine from "alpinejs";
import initializeApp from "@/core/bootstrap";
import DataError from "@/core/dataError";
import { resolve } from "@/core/di";
import makeCurrentUser from "@/domain/usecases/currentUser";
import makeLogin from "@/domain/usecases/login";

const data = () => ({
    email: "",
    password: "",
    remember: false,

    errors: {},
    showPassword: false,
    loading: false,

    currentUser: null,
    login: null,

    async init() {
        initializeApp();
        this.currentUser = makeCurrentUser({ authRepository: resolve("authRepository") });
        this.login = makeLogin({ authRepository: resolve("authRepository") });

        this.$watch("email", () => {
            delete this.errors.email;
            const pattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
            if (this.email && !pattern.test(this.email)) {
                this.errors.email = "Please enter a valid email address.";
            }
        });
        this.$watch("password", () => {
            delete this.errors.password;
            if (this.password && this.password.length < 6) {
                this.errors.password = "Password must be at least 6 characters long.";
            }
        });

        if ((await this.currentUser()) instanceof DataError === false) {
            window.location.href = "/";
        }
    },

    async handleSubmit() {
        this.errors = {};
        this.loading = true;

        const result = await this.login({
            email: this.email,
            password: this.password,
            remember: this.remember,
        });

        if (result instanceof DataError) this.handleError(result);
        else window.location.href = "/";
        this.loading = false;
    },

    handleError(error) {
        console.error("Login error:", error);
        this.errors = error.fields || {};
    },
});

document.addEventListener("alpine:init", () => {
    Alpine.data("authForm", data);
});

Alpine.start();