From 2a313f28fcb8675223708b0657de7517a3281095 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 17 Apr 2024 12:27:21 -0400
Subject: restoring eslint - updates not complete yet

---
 .../CollectionStackingViewFieldColumn.tsx          | 80 +++++++++++++---------
 1 file changed, 47 insertions(+), 33 deletions(-)

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

diff --git a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx
index c5292f880..35f330b44 100644
--- a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx
+++ b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx
@@ -1,7 +1,11 @@
+/* eslint-disable jsx-a11y/control-has-associated-label */
+/* eslint-disable jsx-a11y/no-static-element-interactions */
+/* eslint-disable jsx-a11y/click-events-have-key-events */
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { action, computed, IReactionDisposer, makeObservable, observable, reaction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
+import { DivHeight, DivWidth, returnEmptyString, setupMoveUpEvents } from '../../../ClientUtils';
 import { Doc, DocListCast, Opt } from '../../../fields/Doc';
 import { RichTextField } from '../../../fields/RichTextField';
 import { PastelSchemaPalette, SchemaHeaderField } from '../../../fields/SchemaHeaderField';
@@ -9,10 +13,11 @@ import { ScriptField } from '../../../fields/ScriptField';
 import { BoolCast, NumCast } from '../../../fields/Types';
 import { ImageField } from '../../../fields/URLField';
 import { TraceMobx } from '../../../fields/util';
-import { DivHeight, DivWidth, emptyFunction, returnEmptyString, setupMoveUpEvents } from '../../../Utils';
+import { emptyFunction } from '../../../Utils';
 import { Docs, DocUtils } from '../../documents/Documents';
 import { DocumentType } from '../../documents/DocumentTypes';
-import { DragManager, dropActionType } from '../../util/DragManager';
+import { DragManager } from '../../util/DragManager';
+import { dropActionType } from '../../util/DropActionTypes';
 import { SnappingManager } from '../../util/SnappingManager';
 import { Transform } from '../../util/Transform';
 import { undoBatch } from '../../util/UndoManager';
@@ -95,7 +100,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
         this._ele && this.props.refList.push(this._ele);
         this._disposers.collapser = reaction(
             () => this._props.headingObject?.collapsed,
-            collapsed => (this.collapsed = collapsed !== undefined ? BoolCast(collapsed) : false),
+            collapsed => { this.collapsed = collapsed !== undefined ? BoolCast(collapsed) : false; }, // prettier-ignore
             { fireImmediately: true }
         );
     }
@@ -105,7 +110,6 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
         this._ele = null;
     }
 
-    //TODO: what is scripting? I found it in SetInPlace def but don't know what that is
     @undoBatch
     columnDrop = action((e: Event, de: DragManager.DropEvent) => {
         const drop = { docs: de.complete.docDragData?.droppedDocuments, val: this.getValue(this._heading) };
@@ -121,13 +125,13 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
     };
 
     @action
-    headingChanged = (value: string, shiftDown?: boolean) => {
+    headingChanged = (value: string /* , shiftDown?: boolean */) => {
         const castedValue = this.getValue(value);
         if (castedValue) {
             if (this._props.colHeaderData?.map(i => i.heading).indexOf(castedValue.toString()) !== -1) {
                 return false;
             }
-            this._props.pivotField && this._props.docList.forEach(d => (d[this._props.pivotField] = castedValue));
+            this._props.pivotField && this._props.docList.forEach(d => { d[this._props.pivotField] = castedValue; }) // prettier-ignore
             if (this._props.headingObject) {
                 this._props.headingObject.setHeading(castedValue.toString());
                 this._heading = this._props.headingObject.heading;
@@ -143,9 +147,9 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
         this._color = color;
     };
 
-    @action pointerEntered = () => SnappingManager.IsDragging && (this._background = '#b4b4b4');
-    @action pointerLeave = () => (this._background = 'inherit');
-    @undoBatch typedNote = (char: string) => this.addNewTextDoc('-typed text-', false, true);
+    @action pointerEntered = () => { SnappingManager.IsDragging && (this._background = '#b4b4b4'); } // prettier-ignore
+    @action pointerLeave = () => { this._background = 'inherit'}; // prettier-ignore
+    @undoBatch typedNote = () => this.addNewTextDoc('-typed text-', false, true);
 
     @action
     addNewTextDoc = (value: string, shiftDown?: boolean, forceEmptyNote?: boolean) => {
@@ -163,7 +167,10 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
 
     @action
     deleteColumn = () => {
-        this._props.pivotField && this._props.docList.forEach(d => (d[this._props.pivotField] = undefined));
+        this._props.pivotField &&
+            this._props.docList.forEach(d => {
+                d[this._props.pivotField] = undefined;
+            });
         if (this._props.colHeaderData && this._props.headingObject) {
             const index = this._props.colHeaderData.indexOf(this._props.headingObject);
             this._props.colHeaderData.splice(index, 1);
@@ -178,8 +185,8 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
 
     headerDown = (e: React.PointerEvent<HTMLDivElement>) => setupMoveUpEvents(this, e, this.startDrag, emptyFunction, emptyFunction);
 
-    //TODO: I think this is where I'm supposed to edit stuff
-    startDrag = (e: PointerEvent, down: number[], delta: number[]) => {
+    // TODO: I think this is where I'm supposed to edit stuff
+    startDrag = (e: PointerEvent) => {
         // is MakeEmbedding a way to make a copy of a doc without rendering it?
         const embedding = Doc.MakeEmbedding(this._props.Document);
         embedding._width = this._props.columnWidth / (this._props.colHeaderData?.length || 1);
@@ -210,23 +217,23 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
         );
     };
 
-    renderMenu = () => {
-        return (
-            <div className="collectionStackingView-optionPicker">
-                <div className="optionOptions">
-                    <div className={'optionPicker' + (true ? ' active' : '')} onClick={action(() => {})}>
-                        Add options here
-                    </div>
+    renderMenu = () => (
+        <div className="collectionStackingView-optionPicker">
+            <div className="optionOptions">
+                <div className={'optionPicker' + (true ? ' active' : '')} onClick={action(() => {})}>
+                    Add options here
                 </div>
             </div>
-        );
-    };
+        </div>
+    );
 
     @observable private collapsed: boolean = false;
 
-    private toggleVisibility = action(() => (this.collapsed = !this.collapsed));
+    private toggleVisibility = action(() => {
+        this.collapsed = !this.collapsed;
+    });
 
-    menuCallback = (x: number, y: number) => {
+    menuCallback = () => {
         ContextMenu.Instance.clearItems();
         const layoutItems: ContextMenuProps[] = [];
         const docItems: ContextMenuProps[] = [];
@@ -257,6 +264,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
                             }
                             return this._props.addDocument?.(created);
                         }
+                        return false;
                     },
                     icon: 'compress-arrows-alt',
                 })
@@ -276,6 +284,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
                             }
                             return this._props.addDocument?.(created) || false;
                         }
+                        return false;
                     },
                     icon: 'compress-arrows-alt',
                 })
@@ -307,7 +316,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
         const columnYMargin = this._props.headingObject ? 0 : this._props.yMargin;
         const uniqueHeadings = headings.map((i, idx) => headings.indexOf(i) === idx);
         const noValueHeader = `NO ${key.toUpperCase()} VALUE`;
-        const evContents = heading ? heading : this._props?.type === 'number' ? '0' : noValueHeader;
+        const evContents = heading || (this._props?.type === 'number' ? '0' : noValueHeader);
         const headingView = this._props.headingObject ? (
             <div
                 key={heading}
@@ -324,14 +333,19 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
                     onPointerDown={this.headerDown}
                     title={evContents === noValueHeader ? `Documents that don't have a ${key} value will go here. This column cannot be removed.` : ''}
                     style={{ background: evContents !== noValueHeader ? this._color : 'inherit' }}>
-                    <EditableView GetValue={() => evContents} SetValue={this.headingChanged} contents={evContents} oneLine={true} />
+                    <EditableView GetValue={() => evContents} SetValue={this.headingChanged} contents={evContents} oneLine />
                     <div className="collectionStackingView-sectionColor" style={{ display: evContents === noValueHeader ? 'none' : undefined }}>
-                        <button className="collectionStackingView-sectionColorButton" onClick={action(e => (this._paletteOn = !this._paletteOn))}>
+                        <button
+                            type="button"
+                            className="collectionStackingView-sectionColorButton"
+                            onClick={action(() => {
+                                this._paletteOn = !this._paletteOn;
+                            })}>
                             <FontAwesomeIcon icon="palette" size="lg" />
                         </button>
                         {this._paletteOn ? this.renderColorPicker() : null}
                     </div>
-                    <button className="collectionStackingView-sectionDelete" onClick={this.deleteColumn}>
+                    <button type="button" className="collectionStackingView-sectionDelete" onClick={this.deleteColumn}>
                         <FontAwesomeIcon icon="trash" size="lg" />
                     </button>
                     {/* {evContents === noValueHeader ? null : (
@@ -352,7 +366,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
             </div>
         ) : null;
         const templatecols = `${this._props.columnWidth / this._props.numGroupColumns}px `;
-        const type = this._props.Document.type;
+        const { type } = this._props.Document;
         return (
             <>
                 {this._props.Document._columnsHideIfEmpty ? null : headingView}
@@ -364,7 +378,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
                             style={{
                                 padding: `${columnYMargin}px ${0}px ${this._props.yMargin}px ${0}px`,
                                 margin: 'auto',
-                                width: 'max-content', //singleColumn ? undefined : `${cols * (style.columnWidth + style.gridGap) + 2 * style.xMargin - style.gridGap}px`,
+                                width: 'max-content', // singleColumn ? undefined : `${cols * (style.columnWidth + style.gridGap) + 2 * style.xMargin - style.gridGap}px`,
                                 height: 'max-content',
                                 position: 'relative',
                                 gridGap: this._props.gridGap,
@@ -376,10 +390,10 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
                         {!this._props.chromeHidden && type !== DocumentType.PRES ? (
                             // TODO: this is the "new" button: see what you can work with here
                             // change cursor to pointer for this, and update dragging cursor
-                            //TODO: there is a bug that occurs when adding a freeform document and trying to move it around
-                            //TODO: would be great if there was additional space beyond the frame, so that you can actually see your
+                            //  TODO: there is a bug that occurs when adding a freeform document and trying to move it around
+                            //  TODO: would be great if there was additional space beyond the frame, so that you can actually see your
                             // bottom note
-                            //TODO: ok, so we are using a single column, and this is it!
+                            // TODO: ok, so we are using a single column, and this is it!
                             <div
                                 key={`${heading}-add-document`}
                                 onKeyDown={e => e.stopPropagation()}
@@ -390,7 +404,7 @@ export class CollectionStackingViewFieldColumn extends ObservableReactComponent<
                                     SetValue={this.addNewTextDoc}
                                     textCallback={this.typedNote}
                                     placeholder={"Type ':' for commands"}
-                                    contents={<FontAwesomeIcon icon={'plus'} />}
+                                    contents={<FontAwesomeIcon icon="plus" />}
                                     menuCallback={this.menuCallback}
                                 />
                             </div>
-- 
cgit v1.2.3-70-g09d2

