import { action, computed, makeObservable, observable } from 'mobx';
import * as React from 'react';
import { returnFalse } from '../../Utils';
import { DateField } from '../../fields/DateField';
import { Doc, DocListCast, Field, Opt } from '../../fields/Doc';
import { AclAdmin, AclAugment, AclEdit, AclPrivate, AclReadonly, DocData } from '../../fields/DocSymbols';
import { List } from '../../fields/List';
import { GetEffectiveAcl, inheritParentAcls } from '../../fields/util';
import { DocumentType } from '../documents/DocumentTypes';
import { DocUtils } from '../documents/Documents';
import { DocumentManager } from '../util/DocumentManager';
import { ObservableReactComponent } from './ObservableReactComponent';
import { CollectionFreeFormView } from './collections/collectionFreeForm';
import { FieldViewProps, FocusViewOptions } from './nodes/FieldView';
import { DocumentView, OpenWhere } from './nodes/DocumentView';
import { PinProps } from './nodes/trails';
import { RefField } from '../../fields/RefField';
import { DragManager } from '../util/DragManager';

/**
 * Shared interface among all viewBox'es (ie, react classes that render the contents of a Doc)
 * Many of these methods only make sense for specific viewBox'es, but they should be written to
 * be as general as possible
 */
export interface ViewBoxInterface {
    fieldKey?: string;
    annotationKey?: string;
    updateIcon?: () => void; // updates the icon representation of the document
    getAnchor?: (addAsAnnotation: boolean, pinData?: PinProps) => Doc; // returns an Anchor Doc that represents the current state of the doc's componentview (e.g., the current playhead location of a an audio/video box)
    restoreView?: (viewSpec: Doc) => boolean;
    scrollPreview?: (docView: DocumentView, doc: Doc, focusSpeed: number, options: FocusViewOptions) => Opt<number>; // returns the duration of the focus
    brushView?: (view: { width: number; height: number; panX: number; panY: number }, transTime: number, holdTime: number) => void; // highlight a region of a view (used by freeforms)
    getView?: (doc: Doc, options: FocusViewOptions) => Promise<Opt<DocumentView>>; // returns a nested DocumentView for the specified doc or undefined
    addDocTab?: (doc: Doc, where: OpenWhere) => boolean; // determines how to add a document - used in following links to open the target ina local lightbox
    addDocument?: (doc: Doc | Doc[], annotationKey?: string) => boolean; // add a document (used only by collections)
    select?: (ctrlKey: boolean, shiftKey: boolean) => void;
    focus?: (textAnchor: Doc, options: FocusViewOptions) => Opt<number>;
    isAnyChildContentActive?: () => boolean; // is any child content of the document active
    onClickScriptDisable?: () => 'never' | 'always'; // disable click scripts : never, always, or undefined = only when selected
    getKeyFrameEditing?: () => boolean; // whether the document is in keyframe editing mode (if it is, then all hidden documents that are not active at the keyframe time will still be shown)
    setKeyFrameEditing?: (set: boolean) => void; // whether the document is in keyframe editing mode (if it is, then all hidden documents that are not active at the keyframe time will still be shown)
    playFrom?: (time: number, endTime?: number) => void;
    Pause?: () => void; // pause a media document (eg, audio/video)
    IsPlaying?: () => boolean; // is a media document playing
    TogglePause?: (keep?: boolean) => void; // toggle media document playing state
    setFocus?: () => void; // sets input focus to the componentView
    setData?: (data: Field | Promise<RefField | undefined>) => boolean;
    componentUI?: (boundsLeft: number, boundsTop: number) => JSX.Element | null;
    dragStarting?: (snapToDraggedDoc: boolean, showGroupDragTarget: boolean, visited: Set<Doc>) => void;
    dragConfig?: (dragData: DragManager.DocumentDragData) => void;
    incrementalRendering?: () => void;
    infoUI?: () => JSX.Element | null;
    screenBounds?: () => Opt<{ left: number; top: number; right: number; bottom: number; center?: { X: number; Y: number } }>;
    ptToScreen?: (pt: { X: number; Y: number }) => { X: number; Y: number };
    ptFromScreen?: (pt: { X: number; Y: number }) => { X: number; Y: number };
    snapPt?: (pt: { X: number; Y: number }, excludeSegs?: number[]) => { nearestPt: { X: number; Y: number }; distance: number };
    search?: (str: string, bwd?: boolean, clear?: boolean) => boolean;
}
/**
 * DocComponent returns a React base class used by Doc views with accessors for unpacking he Document,layoutDoc, and dataDoc's
 *  (note: this should not be used for the 'Box' views that render the contents of Doc views)
 *  Example derived views: CollectionFreeFormDocumentView, DocumentView, DocumentViewInternal)
 * */
export interface DocComponentProps {
    Document: Doc;
    LayoutTemplate?: () => Opt<Doc>;
    LayoutTemplateString?: string;
}
export function DocComponent<P extends DocComponentProps>() {
    class Component extends ObservableReactComponent<React.PropsWithChildren<P>> {
        constructor(props: P) {
            super(props);
            makeObservable(this);
        }

        //TODO This might be pretty inefficient if doc isn't observed, because computed doesn't cache then
        get Document() {
            return this._props.Document;
        }
        // This is the rendering data of a document -- it may be "The Document", or it may be some template document that holds the rendering info
        @computed get layoutDoc() {
            return this._props.LayoutTemplateString ? this.Document : Doc.Layout(this.Document, this._props.LayoutTemplate?.());
        }
        // This is the data part of a document -- ie, the data that is constant across all views of the document
        @computed get dataDoc() {
            return this.Document[DocData];
        }
    }
    return Component;
}

/**
 *   base class for non-annotatable views that render the interior contents of a DocumentView.
 *   this unpacks the Document/layout/data docs as well as the fieldKey being rendered,
 *   and provides accessors for DocumentView and ScreenToLocalBoxXf
 *   Example views include: InkingStroke, FontIconBox, EquationBox, etc
 */
export function ViewBoxBaseComponent<P extends FieldViewProps>() {
    class Component extends ObservableReactComponent<React.PropsWithChildren<P>> {
        constructor(props: P) {
            super(props);
            makeObservable(this);
        }

        ScreenToLocalBoxXf = () => this._props.ScreenToLocalTransform();

        get DocumentView() {
            return this._props.DocumentView;
        }
        //TODO This might be pretty inefficient if doc isn't observed, because computed doesn't cache then
        get Document() {
            return this._props.Document;
        }
        // This is the rendering data of a document -- it may be "The Document", or it may be some template document that holds the rendering info
        @computed get layoutDoc() {
            return Doc.Layout(this.Document);
        }
        // This is the data part of a document -- ie, the data that is constant across all views of the document
        @computed get dataDoc() {
            return this.Document.isTemplateForField || this.Document.isTemplateDoc ? this._props.TemplateDataDocument ?? this.Document[DocData] : this.Document[DocData];
        }
        // key where data is stored
        get fieldKey() {
            return this._props.fieldKey;
        }
    }
    return Component;
}

/**
 * base class for annotatable views that render the interior contents of a DocumentView
 * This does what ViewBoxBaseComponent does and additionally provides accessor for the
 * field key where annotations are stored as well as add/move/remove methods for handing
 * annotations.
 * This also provides methods to determine when the contents should be interactive
 * (respond to pointerEvents) such as when the DocumentView container is selected or a
 * peer child of the container is selected
 * Example views include: PDFBox, ImageBox, MapBox, etc
 */
export function ViewBoxAnnotatableComponent<P extends FieldViewProps>() {
    class Component extends ObservableReactComponent<React.PropsWithChildren<P>> {
        @observable _annotationKeySuffix = () => 'annotations';
        @observable _isAnyChildContentActive = false;

        constructor(props: P) {
            super(props);
            makeObservable(this);
        }

        ScreenToLocalBoxXf = () => this._props.ScreenToLocalTransform();

        get DocumentView() {
            return this._props.DocumentView;
        }
        //TODO This might be pretty inefficient if doc isn't observed, because computed doesn't cache then
        @computed get Document() {
            return this._props.Document;
        }
        // This is the rendering data of a document -- it may be "The Document", or it may be some template document that holds the rendering info
        @computed get layoutDoc() {
            return Doc.Layout(this.Document);
        }
        // This is the data part of a document -- ie, the data that is constant across all views of the document
        @computed get dataDoc() {
            return this.Document.isTemplateForField || this.Document.isTemplateDoc ? this._props.TemplateDataDocument ?? this.Document[DocData] : this.Document[DocData];
        }

        // key where data is stored
        @computed get fieldKey() {
            return this._props.fieldKey;
        }
        @computed public get annotationKey() {
            return this.fieldKey + (this._annotationKeySuffix() ? '_' + this._annotationKeySuffix() : '');
        }

        @action.bound
        removeDocument(doc: Doc | Doc[], annotationKey?: string, leavePushpin?: boolean, dontAddToRemoved?: boolean): boolean {
            const effectiveAcl = GetEffectiveAcl(this.dataDoc);
            const indocs = doc instanceof Doc ? [doc] : doc;
            const docs = indocs.filter(doc => [AclEdit, AclAdmin].includes(effectiveAcl) || GetEffectiveAcl(doc) === AclAdmin);

            // docs.forEach(doc => doc.annotationOn === this.Document && Doc.SetInPlace(doc, 'annotationOn', undefined, true));
            const targetDataDoc = this.dataDoc;
            const value = DocListCast(targetDataDoc[annotationKey ?? this.annotationKey]);
            const toRemove = value.filter(v => docs.includes(v));

            if (toRemove.length !== 0) {
                const recent = this.Document !== Doc.MyRecentlyClosed ? Doc.MyRecentlyClosed : undefined;
                toRemove.forEach(doc => {
                    leavePushpin && DocUtils.LeavePushpin(doc, annotationKey ?? this.annotationKey);
                    Doc.RemoveDocFromList(targetDataDoc, annotationKey ?? this.annotationKey, doc, true);
                    Doc.RemoveDocFromList(doc[DocData], 'proto_embeddings', doc, true);
                    doc.embedContainer = undefined;
                    if (recent && !dontAddToRemoved) {
                        doc.type !== DocumentType.LOADING && Doc.AddDocToList(recent, 'data', doc, undefined, true, true);
                    }
                });
                if (targetDataDoc.isGroup && DocListCast(targetDataDoc[annotationKey ?? this.annotationKey]).length < 2) {
                    (DocumentManager.Instance.getFirstDocumentView(targetDataDoc)?.ComponentView as CollectionFreeFormView)?.promoteCollection();
                } else {
                    this.isAnyChildContentActive() && this._props.select(false);
                }
                return true;
            }

            return false;
        }
        // this is called with the document that was dragged and the collection to move it into.
        // if the target collection is the same as this collection, then the move will be allowed.
        // otherwise, the document being moved must be able to be removed from its container before
        // moving it into the target.
        @action.bound
        moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[], annotationKey?: string) => boolean, annotationKey?: string): boolean => {
            if (Doc.AreProtosEqual(this._props.Document, targetCollection)) {
                return true;
            }
            const first = doc instanceof Doc ? doc : doc[0];
            if (!first?._dragOnlyWithinContainer && addDocument !== returnFalse) {
                return this.removeDocument(doc, annotationKey, false, true) && addDocument(doc, annotationKey);
            }
            return false;
        };
        @action.bound
        addDocument = (doc: Doc | Doc[], annotationKey?: string): boolean => {
            const docs = doc instanceof Doc ? [doc] : doc;
            if (this._props.filterAddDocument?.(docs) === false || docs.find(doc => Doc.AreProtosEqual(doc, this.Document) && Doc.LayoutField(doc) === Doc.LayoutField(this.Document))) {
                return false;
            }
            const targetDataDoc = this.dataDoc;
            const effectiveAcl = GetEffectiveAcl(targetDataDoc);

            if (effectiveAcl === AclPrivate || effectiveAcl === AclReadonly) {
                return false;
            }
            const added = docs;
            if (added.length) {
                if ([AclAugment, AclEdit, AclAdmin].includes(effectiveAcl)) {
                    added.forEach(doc => {
                        doc._dragOnlyWithinContainer = undefined;
                        if (annotationKey ?? this._annotationKeySuffix()) doc[DocData].annotationOn = this.Document;
                        else doc[DocData].annotationOn = undefined;
                        Doc.SetContainer(doc, this.Document);
                        inheritParentAcls(targetDataDoc, doc, true);
                    });

                    const annoDocs = Doc.Get(targetDataDoc, annotationKey ?? this.annotationKey, true) as List<Doc>; // get the dataDoc directly ... when using templates there may be some default items already there, but we can't change them.  maybe we should copy them over, though...
                    if (annoDocs instanceof List) annoDocs.push(...added.filter(add => !annoDocs.includes(add)));
                    else targetDataDoc[annotationKey ?? this.annotationKey] = new List<Doc>(added);
                    targetDataDoc[(annotationKey ?? this.annotationKey) + '_modificationDate'] = new DateField();
                }
            }
            return true;
        };

        isAnyChildContentActive = () => this._isAnyChildContentActive;

        whenChildContentsActiveChanged = action((isActive: boolean) => this._props.whenChildContentsActiveChanged((this._isAnyChildContentActive = isActive)));
    }
    return Component;
}