From 939e18624af4252551f38c43335ee8ef0acd144c Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Sun, 21 Apr 2024 19:03:49 -0400
Subject: more lint cleanup

---
 .../views/collections/CollectionTreeView.tsx       | 79 +++++++++++++---------
 1 file changed, 48 insertions(+), 31 deletions(-)

(limited to 'src/client/views/collections/CollectionTreeView.tsx')

diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 32473f20b..538a6fd5e 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -1,3 +1,5 @@
+/* eslint-disable jsx-a11y/no-static-element-interactions */
+/* eslint-disable jsx-a11y/click-events-have-key-events */
 import { action, computed, IReactionDisposer, makeObservable, observable, reaction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
@@ -23,13 +25,13 @@ import { ContextMenu } from '../ContextMenu';
 import { ContextMenuProps } from '../ContextMenuItem';
 import { EditableView } from '../EditableView';
 import { DocumentView } from '../nodes/DocumentView';
-import { FieldViewProps } from '../nodes/FieldView';
 import { FormattedTextBox } from '../nodes/formattedText/FormattedTextBox';
 import { StyleProp } from '../StyleProvider';
 import { CollectionFreeFormView } from './collectionFreeForm';
 import { CollectionSubView } from './CollectionSubView';
 import './CollectionTreeView.scss';
 import { TreeView } from './TreeView';
+
 const _global = (window /* browser */ || global) /* node */ as any;
 
 export type collectionTreeViewProps = {
@@ -94,8 +96,10 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
 
     // these should stay in synch with counterparts in DocComponent.ts ViewBoxAnnotatableComponent
     @observable _isAnyChildContentActive = false;
-    whenChildContentsActiveChanged = action((isActive: boolean) => this._props.whenChildContentsActiveChanged((this._isAnyChildContentActive = isActive)));
-    isContentActive = (outsideReaction?: boolean) => (this._isAnyChildContentActive ? true : this._props.isContentActive() ? true : false);
+    whenChildContentsActiveChanged = action((isActive: boolean) => {
+        this._props.whenChildContentsActiveChanged((this._isAnyChildContentActive = isActive));
+    });
+    isContentActive = () => (this._isAnyChildContentActive ? true : !!this._props.isContentActive());
 
     componentWillUnmount() {
         this._isDisposing = true;
@@ -105,7 +109,7 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
     }
 
     componentDidMount() {
-        //this._props.setContentView?.(this);
+        // this._props.setContentView?.(this);
         this._disposers.autoheight = reaction(
             () => this.layoutDoc.layout_autoHeight,
             auto => auto && this.computeHeight(),
@@ -128,20 +132,19 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
     observeHeight = (ref: any) => {
         if (ref) {
             this.refList.add(ref);
-            this.observer = new _global.ResizeObserver(
-                action((entries: any) => {
-                    if (this.layoutDoc.layout_autoHeight && ref && this.refList.size && !SnappingManager.IsDragging) {
-                        this.computeHeight();
-                    }
-                })
-            );
+            this.observer = new _global.ResizeObserver(() => {
+                if (this.layoutDoc.layout_autoHeight && ref && this.refList.size && !SnappingManager.IsDragging) {
+                    this.computeHeight();
+                }
+            });
             this.layoutDoc.layout_autoHeight && this.computeHeight();
             this.observer.observe(ref);
         }
     };
     protected createTreeDropTarget = (ele: HTMLDivElement) => {
         this._treedropDisposer?.();
-        if ((this._mainEle = ele)) this._treedropDisposer = DragManager.MakeDropTarget(ele, this.onInternalDrop.bind(this), this.Document, this.onInternalPreDrop.bind(this));
+        this._mainEle = ele;
+        if (ele) this._treedropDisposer = DragManager.MakeDropTarget(ele, this.onInternalDrop.bind(this), this.Document, this.onInternalPreDrop.bind(this));
     };
 
     protected onInternalDrop(e: Event, de: DragManager.DropEvent) {
@@ -169,7 +172,7 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         }
     };
 
-    dragConfig = (dragData: DragManager.DocumentDragData) => (dragData.treeViewDoc = this.Document);
+    dragConfig = (dragData: DragManager.DocumentDragData) => { dragData.treeViewDoc = this.Document; }; // prettier-ignore
 
     screenToLocalTransform = () => this.ScreenToLocalBoxXf().translate(0, -this._headerHeight);
 
@@ -198,10 +201,10 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
 
     @action
     addDoc = (docs: Doc | Doc[], relativeTo: Opt<Doc>, before?: boolean): boolean => {
-        const doclist = docs instanceof Doc ? [docs] : docs;
-        const addDocRelativeTo = (doc: Doc | Doc[]) => doclist.reduce((flg, doc) => flg && Doc.AddDocToList(this.Document[DocData], this._props.fieldKey, doc, relativeTo, before), true);
+        const addDocRelativeTo = (adocs: Doc | Doc[]) => (adocs as Doc[]).reduce((flg, doc) => flg && Doc.AddDocToList(this.Document[DocData], this._props.fieldKey, doc, relativeTo, before), true);
         if (this.Document.resolvedDataDoc instanceof Promise) return false;
-        const res = relativeTo === undefined ? this._props.addDocument?.(docs) || false : addDocRelativeTo(docs);
+        const doclist = docs instanceof Doc ? [docs] : docs;
+        const res = relativeTo === undefined ? this._props.addDocument?.(doclist) || false : addDocRelativeTo(doclist);
         res &&
             doclist.forEach(doc => {
                 Doc.SetContainer(doc, this.Document);
@@ -209,7 +212,7 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
             });
         return res;
     };
-    onContextMenu = (e: React.MouseEvent): void => {
+    onContextMenu = (): void => {
         // need to test if propagation has stopped because GoldenLayout forces a parallel react hierarchy to be created for its top-level layout
         const layoutItems: ContextMenuProps[] = [];
         const menuDoc = ScriptCast(Cast(this.layoutDoc.layout_headerButton, Doc, null)?.onClick).script.originalScript === CollectionTreeView.AddTreeFunc;
@@ -217,11 +220,11 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         if (!Doc.noviceMode) {
             layoutItems.push({
                 description: 'Make tree state ' + (this.Document.treeView_OpenIsTransient ? 'persistent' : 'transient'),
-                event: () => (this.Document.treeView_OpenIsTransient = !this.Document.treeView_OpenIsTransient),
+                event: () => { this.Document.treeView_OpenIsTransient = !this.Document.treeView_OpenIsTransient; }, // prettier-ignore
                 icon: 'paint-brush',
             });
-            layoutItems.push({ description: (this.Document.treeView_HideHeaderFields ? 'Show' : 'Hide') + ' Header Fields', event: () => (this.Document.treeView_HideHeaderFields = !this.Document.treeView_HideHeaderFields), icon: 'paint-brush' });
-            layoutItems.push({ description: (this.Document.treeView_HideTitle ? 'Show' : 'Hide') + ' Title', event: () => (this.Document.treeView_HideTitle = !this.Document.treeView_HideTitle), icon: 'paint-brush' });
+            layoutItems.push({ description: (this.Document.treeView_HideHeaderFields ? 'Show' : 'Hide') + ' Header Fields', event: () => { this.Document.treeView_HideHeaderFields = !this.Document.treeView_HideHeaderFields; }, icon: 'paint-brush' }); // prettier-ignore
+            layoutItems.push({ description: (this.Document.treeView_HideTitle ? 'Show' : 'Hide') + ' Title', event: () => { this.Document.treeView_HideTitle = !this.Document.treeView_HideTitle; }, icon: 'paint-brush' }); // prettier-ignore
         }
         ContextMenu.Instance.addItem({ description: 'Options...', subitems: layoutItems, icon: 'eye' });
         if (!Doc.noviceMode) {
@@ -240,9 +243,9 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         return (
             <EditableView
                 contents={this.dataDoc.title}
-                display={'block'}
+                display="block"
                 maxHeight={72}
-                height={'auto'}
+                height="auto"
                 GetValue={() => StrCast(this.dataDoc.title)}
                 SetValue={undoBatch((value: string, shift: boolean, enter: boolean) => {
                     if (enter && this.Document.treeView_Type === TreeViewType.outline) this.makeTextCollection(this.treeChildren);
@@ -253,22 +256,24 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         );
     }
 
-    onKey = (e: React.KeyboardEvent, fieldProps: FieldViewProps) => {
+    onKey = (e: React.KeyboardEvent /* , fieldProps: FieldViewProps */) => {
         if (this.outlineMode && e.key === 'Enter') {
             e.stopPropagation();
             this.makeTextCollection(this.treeChildren);
             return true;
         }
+        return undefined;
     };
     get documentTitle() {
         return (
             <FormattedTextBox
+                // eslint-disable-next-line react/jsx-props-no-spreading
                 {...this._props}
                 fieldKey="text"
                 renderDepth={this._props.renderDepth + 1}
                 isContentActive={this.isContentActive}
                 isDocumentActive={this.isContentActive}
-                forceAutoHeight={true} // needed to make the title resize even if the rest of the tree view is not layout_autoHeight
+                forceAutoHeight // needed to make the title resize even if the rest of the tree view is not layout_autoHeight
                 PanelWidth={this.documentTitleWidth}
                 PanelHeight={this.documentTitleHeight}
                 NativeDimScaling={returnOne}
@@ -296,7 +301,12 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         const dragAction = StrCast(this.Document.childDragAction) as any as dropActionType;
         const addDoc = (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => this.addDoc(doc, relativeTo, before);
         const moveDoc = (d: Doc | Doc[], target: Doc | undefined, addDoc: (doc: Doc | Doc[]) => boolean) => this._props.moveDocument?.(d, target, addDoc) || false;
-        if (this._renderCount < this.treeChildren.length) setTimeout(action(() => (this._renderCount = Math.min(this.treeChildren.length, this._renderCount + 20))));
+        if (this._renderCount < this.treeChildren.length)
+            setTimeout(
+                action(() => {
+                    this._renderCount = Math.min(this.treeChildren.length, this._renderCount + 20);
+                })
+            );
         return TreeView.GetChildElements(
             this.treeChildren,
             this,
@@ -326,7 +336,6 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
             this.observeHeight,
             this.unobserveHeight,
             this.childContextMenuItems(),
-            //TODO: [AL] add these
             this._props.AddToMap,
             this._props.RemFromMap,
             this._props.hierarchyIndex,
@@ -337,7 +346,9 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         return this.dataDoc === null ? null : (
             <div
                 className="collectionTreeView-titleBar"
-                ref={action((r: any) => (this._titleRef = r) && (this._titleHeight = r.getBoundingClientRect().height * this.ScreenToLocalBoxXf().Scale))}
+                ref={action((r: any) => {
+                    (this._titleRef = r) && (this._titleHeight = r.getBoundingClientRect().height * this.ScreenToLocalBoxXf().Scale);
+                })}
                 key={this.Document[Id]}
                 style={!this.outlineMode ? { marginLeft: this.marginX(), paddingTop: this.marginTop() } : {}}>
                 {this.outlineMode ? this.documentTitle : this.editableTitle}
@@ -420,7 +431,11 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
         return (
             <div style={{ display: 'flex', flexDirection: 'column', height: '100%', pointerEvents: 'all' }}>
                 {!this.buttonMenu && !this.noviceExplainer ? null : (
-                    <div className="documentButtonMenu" ref={action((r: HTMLDivElement | null) => r && (this._headerHeight = DivHeight(r)))}>
+                    <div
+                        className="documentButtonMenu"
+                        ref={action((r: HTMLDivElement | null) => {
+                            r && (this._headerHeight = DivHeight(r));
+                        })}>
                         {this.buttonMenu}
                         {this.noviceExplainer}
                     </div>
@@ -453,7 +468,7 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
                                 minHeight: '100%',
                             }}
                             onWheel={e => e.stopPropagation()}
-                            onClick={e => (!this.layoutDoc.forceActive ? this._props.select(false) : SelectionManager.DeselectAll())}
+                            onClick={() => (!this.layoutDoc.forceActive ? this._props.select(false) : SelectionManager.DeselectAll())}
                             onDrop={this.onTreeDrop}>
                             <ul className={`no-indent${this.outlineMode ? '-outline' : ''}`}>{this.treeViewElements}</ul>
                         </div>
@@ -470,13 +485,14 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
             <div style={{ transform: `scale(${scale})`, transformOrigin: 'top left', width: `${100 / scale}%`, height: `${100 / scale}%` }}>
                 {!(this.Document instanceof Doc) || !this.treeChildren ? null : this.Document.treeView_HasOverlay ? (
                     <CollectionFreeFormView
+                        // eslint-disable-next-line react/jsx-props-no-spreading
                         {...this._props}
                         setContentViewBox={emptyFunction}
                         NativeWidth={returnZero}
                         NativeHeight={returnZero}
                         pointerEvents={this._props.isContentActive() && SnappingManager.IsDragging ? returnAll : returnNone}
-                        isAnnotationOverlay={true}
-                        isAnnotationOverlayScrollable={true}
+                        isAnnotationOverlay
+                        isAnnotationOverlayScrollable
                         childDocumentsActive={this._props.isContentActive}
                         fieldKey={this._props.fieldKey + '_annotations'}
                         dropAction={dropActionType.move}
@@ -500,6 +516,7 @@ export class CollectionTreeView extends CollectionSubView<Partial<collectionTree
     }
 }
 
+// eslint-disable-next-line prefer-arrow-callback
 ScriptingGlobals.add(function addTreeFolder(doc: Doc) {
     CollectionTreeView.addTreeFolder(doc);
 });
-- 
cgit v1.2.3-70-g09d2