import { useCollaborationContext, } from "./LexicalCollaborationContext";
import { useLexicalComposerContext } from "./LexicalComposerContext";
import { createBinding, } from "@lexical/yjs";
import { useYjsCollaboration, useYjsFocusTracking, useYjsHistory, } from "./shared/useYjsCollaboration";
import { createEffect, createRenderEffect, createSignal, on, onCleanup, Show, } from "solid-js";
export function CollaborationPlugin(props) {
    const isBindingInitialized = { current: false };
    const isProviderInitialized = { current: false };
    const collabContext = useCollaborationContext(props.username, props.cursorColor);
    const { yjsDocMap, name, color } = collabContext;
    const [editor] = useLexicalComposerContext();
    createEffect(() => {
        collabContext.isCollabActive = true;
        return () => {
            // Resetting flag only when unmount top level editor collab plugin. Nested
            // editors (e.g. image caption) should unmount without affecting it
            if (editor._parentEditor == null) {
                collabContext.isCollabActive = false;
            }
        };
    }, [collabContext, editor]);
    const [provider, setProvider] = createSignal();
    createEffect(on(() => [props.id, props.providerFactory, yjsDocMap], () => {
        if (isProviderInitialized.current) {
            return;
        }
        isProviderInitialized.current = true;
        const newProvider = props.providerFactory(props.id, yjsDocMap);
        setProvider(newProvider);
        onCleanup(() => newProvider.disconnect());
    }));
    const [doc, setDoc] = createSignal(yjsDocMap.get(props.id));
    const [binding, setBinding] = createSignal();
    createEffect(() => {
        const p = provider();
        if (!p) {
            return;
        }
        if (isBindingInitialized.current) {
            return;
        }
        isBindingInitialized.current = true;
        const newBinding = createBinding(editor, p, props.id, doc() || yjsDocMap.get(props.id), yjsDocMap, props.excludedProperties);
        setBinding(newBinding);
        return () => {
            newBinding.root.destroy(newBinding);
        };
    });
    return (<Show when={provider() && binding()}>
      <YjsCollaborationCursors awarenessData={props.awarenessData} binding={binding()} collabContext={collabContext} color={color} cursorsContainerRef={props.cursorsContainerRef} editor={editor} id={props.id} initialEditorState={props.initialEditorState} name={name} provider={provider()} setDoc={setDoc} shouldBootstrap={props.shouldBootstrap} yjsDocMap={yjsDocMap}/>
    </Show>);
}
function YjsCollaborationCursors(props) {
    const cursors = useYjsCollaboration(props.editor, props.id, () => props.provider, props.yjsDocMap, props.name, props.color, props.shouldBootstrap, () => props.binding, props.setDoc, props.cursorsContainerRef, props.initialEditorState, props.awarenessData);
    createRenderEffect(() => {
        props.collabContext.clientID = props.binding.clientID;
    });
    useYjsHistory(props.editor, () => props.binding);
    useYjsFocusTracking(props.editor, () => props.provider, props.name, props.color, props.awarenessData);
    return <>{cursors}</>;
}
