import BaseView from "../../core/BaseView.js";
import { viewRegistry } from "../../core/registries.js";

import SchemaLoader from "../runtime/SchemaLoader.js";
import { Runtime } from "../runtime/runtime.js";

import "../runtime/register-components.js";
import "../runtime/runtime-bootstrap.js";

import ProjectsTable from "../runtime/table/ProjectsTable.js";
import ProjectsToolbar from "../runtime/toolbar/ProjectsToolbar.js";
import ProjectEditModal from "../runtime/modal/ProjectEditModal.js";
import ProjectsRuntimeEvents from "../runtime/runtime/ProjectsRuntimeEvents.js";

const DBG_NS = "editfromauo";

function dbg(...args) {
    console.log(`[${DBG_NS}]`, ...args);
}

class editfromauo extends BaseView {

    static title = "Projects Runtime";

    constructor(props = {}) {
        super(props);

        this.api = props.api;

        this.schemaLoader = new SchemaLoader(this.api);

        this.table = null;
        this.toolbar = null;
        this.modal = null;
        this.runtimeEvents = null;
    }

    async render(container) {

        await super.render(container);

        const body = this.ref("body");

        // HTML ساختار اصلی شامل تولبار و جدول
        body.innerHTML = `
        <div class="projects-runtime-wrapper">
            <div class="projects-runtime-toolbar"></div>
            <div class="projects-runtime-table"></div>
        </div>
        `;

        dbg("Loading schema...");

        // بارگذاری schema برای استفاده در جدول و مودال
        const schema = await this.schemaLoader.load("projects");

        dbg("Schema loaded", schema);

        // 1. ساخت instance جدول
        this.table = new ProjectsTable({
            api: this.api,
            schema: schema // پاس دادن schema
        });

        // 2. ساخت instance تولبار و پاس دادن instance جدول به آن
        this.toolbar = new ProjectsToolbar({
            table: this.table // مهم: instance جدول به اینجا پاس داده می‌شود
        });

        // 3. ساخت instance مودال
        this.modal = new ProjectEditModal({
            api: this.api,
            table: this.table, // مودال هم به جدول دسترسی دارد
            schema: schema
        });

        // 4. ساخت instance event handlerها
        this.runtimeEvents = new ProjectsRuntimeEvents({
            modal: this.modal
        });

        // 5. Mount کردن جدول روی المان مربوطه
        this.table.mount(
            body.querySelector(".projects-runtime-table")
        );

        // 6. Mount کردن تولبار روی المان مربوطه
        this.toolbar.mount(
            body.querySelector(".projects-runtime-toolbar")
        );

        // 7. Mount کردن مودال
        this.modal.mount(body);

        return this;
    }

    destroy() {
        dbg("Destroying ProjectsRuntimeView...");
        // فراخوانی متدهای destroy برای پاکسازی منابع
        this.table?.destroy();
        this.toolbar?.destroy(); // اضافه کردن destroy برای toolbar
        this.modal?.destroy();
        this.runtimeEvents?.destroy(); // اگر runtimeEvents متد destroy دارد

        super.destroy();
    }

}

// ثبت ویو در رجیستری
viewRegistry.register("lands", editfromauo);

export default editfromauo;
