class Sidebar extends Shadow {
    render() {
        VStack(() => {
            img(document.documentElement.classList.contains("red") ? "/_/icons/quillblack.svg" : "/_/icons/quill.svg", "2.25em")
                .paddingLeft(3, em)
                .paddingTop(5, vh)
                .onClick(() => {
                    window.navigateTo("/")
                })
        })
        .paddingRight(2, em)
        .position("fixed")
        .x(0).y(0)
        .height(100, vh)
        .borderRight("0.5px solid var(--accent)")
        .zIndex(3)
        .onAppear(async () => {
            if(!window.profile) {
                window.profile = await this.fetchProfile()
                this.rerender()
            }
        })
    }

    async fetchProfile() {
        try {
            const res = await fetch("/profile", {
                method: "GET",
                credentials: "include",
                headers: {
                    "Content-Type": "application/json"
                }
            });

            if (!res.ok) throw new Error("Failed to fetch profile");

            const profile = await res.json();
            console.log(profile);
            return profile
        } catch (err) {
            console.error(err);
        }
    }
}

register(Sidebar)