import { createComponentMounter } from "$lib/utils/component-mounter";
import Root from "./root.svelte";
import "./global.css";

function initializeApp() {
	// Initialize URL hash for client-side routing
	if (window.location.hash === "") {
		window.location.hash = "/";
	}

	// Ensure the host element has proper dimensions
	const hostElement = document.querySelector("#productbird-admin-settings");
	if (hostElement instanceof HTMLElement) {
		// Set minimum height to prevent collapse
		hostElement.style.minHeight = "100vh";
		hostElement.style.display = "block";
	}

	const mounter = createComponentMounter({
		component: Root,
		selector: "#productbird-admin-settings",
	});

	return mounter;
}

// Ensure DOM is ready before initializing
if (document.readyState === "loading") {
	document.addEventListener("DOMContentLoaded", () => {
		initializeApp();
	});
} else {
	// DOM is already ready
	initializeApp();
}

export default {};