import { findComponentByCodeLazy } from "@webpack";
import { useStateFromStores } from "@webpack/common";
import { ChannelDeckStore } from "../ChannelDeckStore";
import DeckView from "./DeckView";
import { DeckContext } from "./util";

const PopoutWindow = findComponentByCodeLazy("Missing guestWindow reference");

export default function DeckPopout({ deckId, windowKey }: { deckId: string; windowKey?: string; }) {
    const deck = useStateFromStores([ChannelDeckStore], () => ChannelDeckStore.getDeck(deckId));

    return <PopoutWindow
        withTitleBar
        windowKey={windowKey}
        title={[deck?.name, "Channel Deck"].filter(Boolean).join(" | ")}
    >
        <DeckContext.Provider value={deck}>
            <DeckView />
        </DeckContext.Provider>
    </PopoutWindow>;
};