From b1376d401e709515cee078cc08b05fd3fb89caeb Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 24 Apr 2024 18:12:30 -0400
Subject: completing eslint pass

---
 .../CollectionMulticolumnView.tsx                  | 57 +++++++++++++++-------
 1 file changed, 40 insertions(+), 17 deletions(-)

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

diff --git a/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx b/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx
index 125dd2781..b8509a005 100644
--- a/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx
+++ b/src/client/views/collections/collectionMulticolumn/CollectionMulticolumnView.tsx
@@ -1,3 +1,5 @@
+/* eslint-disable jsx-a11y/no-static-element-interactions */
+/* eslint-disable jsx-a11y/click-events-have-key-events */
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Tooltip } from '@mui/material';
 import { Button, IconButton } from 'browndash-components';
@@ -7,7 +9,7 @@ import * as React from 'react';
 import { FaChevronRight } from 'react-icons/fa';
 import { Doc, DocListCast } from '../../../../fields/Doc';
 import { BoolCast, NumCast, ScriptCast, StrCast } from '../../../../fields/Types';
-import { DragManager, dropActionType } from '../../../util/DragManager';
+import { DragManager } from '../../../util/DragManager';
 import { SettingsManager } from '../../../util/SettingsManager';
 import { Transform } from '../../../util/Transform';
 import { undoBatch, undoable } from '../../../util/UndoManager';
@@ -16,6 +18,7 @@ import { CollectionSubView } from '../CollectionSubView';
 import './CollectionMulticolumnView.scss';
 import ResizeBar from './MulticolumnResizer';
 import WidthLabel from './MulticolumnWidthLabel';
+import { dropActionType } from '../../../util/DropActionTypes';
 
 interface WidthSpecifier {
     magnitude: number;
@@ -80,7 +83,7 @@ export class CollectionMulticolumnView extends CollectionSubView() {
     private get resolvedLayoutInformation(): LayoutData {
         let starSum = 0;
         const widthSpecifiers: WidthSpecifier[] = [];
-        this.childLayouts.map(layout => {
+        this.childLayouts.forEach(layout => {
             const unit = StrCast(layout._dimUnit, '*');
             const magnitude = NumCast(layout._dimMagnitude, this.minimumDim);
             if (unit && magnitude && magnitude > 0 && resolvedUnits.includes(unit)) {
@@ -140,6 +143,7 @@ export class CollectionMulticolumnView extends CollectionSubView() {
         if (layoutInfoLen > 0 && this.totalFixedAllocation !== undefined) {
             return this._props.PanelWidth() - (this.totalFixedAllocation + resizerWidth * (layoutInfoLen - 1)) - 2 * NumCast(this.Document._xMargin);
         }
+        return undefined;
     }
 
     /**
@@ -159,6 +163,7 @@ export class CollectionMulticolumnView extends CollectionSubView() {
         if (this.resolvedLayoutInformation && this.totalRatioAllocation !== undefined) {
             return this.totalRatioAllocation / this.resolvedLayoutInformation.starSum;
         }
+        return undefined;
     }
 
     /**
@@ -175,7 +180,7 @@ export class CollectionMulticolumnView extends CollectionSubView() {
      * or the ratio width evaluated to a pixel value
      */
     private lookupPixels = (layout: Doc): number => {
-        const columnUnitLength = this.columnUnitLength;
+        const { columnUnitLength } = this;
         if (columnUnitLength === undefined) {
             return 0; // we're still waiting on promises to resolve
         }
@@ -193,19 +198,19 @@ export class CollectionMulticolumnView extends CollectionSubView() {
      * documents before the target.
      */
     private lookupIndividualTransform = (layout: Doc) => {
-        const columnUnitLength = this.columnUnitLength;
+        const { columnUnitLength } = this;
         if (columnUnitLength === undefined) {
             return Transform.Identity(); // we're still waiting on promises to resolve
         }
         let offset = 0;
-        var xf = Transform.Identity();
-        this.childLayouts.map(candidate => {
+        // eslint-disable-next-line no-restricted-syntax
+        for (const { layout: candidate } of this.childLayoutPairs) {
             if (candidate === layout) {
-                return (xf = this.ScreenToLocalBoxXf().translate(-offset / (this._props.NativeDimScaling?.() || 1), 0));
+                return this.ScreenToLocalBoxXf().translate(0, -offset / (this._props.NativeDimScaling?.() || 1));
             }
             offset += this.lookupPixels(candidate) + resizerWidth;
-        });
-        return xf;
+        }
+        return Transform.Identity();
     };
 
     @undoBatch
@@ -213,7 +218,9 @@ export class CollectionMulticolumnView extends CollectionSubView() {
         let dropInd = -1;
         if (de.complete.docDragData && this._mainCont) {
             let curInd = -1;
-            de.complete.docDragData?.droppedDocuments.forEach(d => (curInd = this.childDocs.indexOf(d)));
+            de.complete.docDragData?.droppedDocuments.forEach(d => {
+                curInd = this.childDocs.indexOf(d);
+            });
             Array.from(this._mainCont.children).forEach((child, index) => {
                 const brect = child.getBoundingClientRect();
                 if (brect.x < de.x && brect.x + brect.width > de.x) {
@@ -265,7 +272,6 @@ export class CollectionMulticolumnView extends CollectionSubView() {
             this.lookupIndividualTransform(childLayout)
                 .translate(-NumCast(this.layoutDoc._xMargin), -NumCast(this.layoutDoc._yMargin))
                 .scale(this._props.NativeDimScaling?.() || 1);
-        const shouldNotScale = () => this._props.fitContentsToBox?.() || BoolCast(childLayout.freeform_fitContentsToBox);
         return (
             <DocumentView
                 Document={childLayout}
@@ -281,11 +287,11 @@ export class CollectionMulticolumnView extends CollectionSubView() {
                 dragAction={StrCast(this.Document.childDragAction, this._props.childDragAction) as dropActionType}
                 onClickScript={this.onChildClickHandler}
                 onDoubleClickScript={this.onChildDoubleClickHandler}
-                suppressSetHeight={true}
+                suppressSetHeight
                 ScreenToLocalTransform={dxf}
                 isContentActive={this.isChildContentActive}
                 isDocumentActive={this._props.childDocumentsActive?.() || this.Document._childDocumentsActive ? this._props.isDocumentActive : this.isContentActive}
-                hideResizeHandles={childLayout.layout_fitWidth || this._props.childHideResizeHandles ? true : false}
+                hideResizeHandles={!!(childLayout.layout_fitWidth || this._props.childHideResizeHandles)}
                 hideDecorationTitle={this._props.childHideDecorationTitle}
                 fitContentsToBox={this._props.fitContentsToBox}
                 focus={this._props.focus}
@@ -312,17 +318,19 @@ export class CollectionMulticolumnView extends CollectionSubView() {
         const collector: JSX.Element[] = [];
         this.childLayouts.forEach((layout, i) => {
             collector.push(
+                // eslint-disable-next-line react/no-array-index-key
                 <Tooltip title={'Tab: ' + StrCast(layout.title)} key={'wrapper' + i}>
                     <div className="document-wrapper" style={{ flexDirection: 'column', width: this.lookupPixels(layout) }}>
                         {this.getDisplayDoc(layout)}
                         {this.layoutDoc._chromeHidden ? null : (
-                            <Button tooltip="Remove document from header bar" icon={<FontAwesomeIcon icon="times" size="lg" />} onClick={undoable(e => this._props.removeDocument?.(layout), 'close doc')} color={SettingsManager.userColor} />
+                            <Button tooltip="Remove document from header bar" icon={<FontAwesomeIcon icon="times" size="lg" />} onClick={undoable(() => this._props.removeDocument?.(layout), 'close doc')} color={SettingsManager.userColor} />
                         )}
                         <WidthLabel layout={layout} collectionDoc={this.Document} />
                     </div>
                 </Tooltip>,
                 <ResizeBar
                     width={resizerWidth}
+                    // eslint-disable-next-line react/no-array-index-key
                     key={'resizer' + i}
                     styleProvider={this._props.styleProvider}
                     isContentActive={this._props.isContentActive}
@@ -353,14 +361,29 @@ export class CollectionMulticolumnView extends CollectionSubView() {
                 {this.contents}
                 {!this._startIndex ? null : (
                     <Tooltip title="scroll back">
-                        <div style={{ position: 'absolute', bottom: 0, left: 0, background: SettingsManager.userVariantColor }} onClick={action(e => (this._startIndex = Math.min(this.childLayoutPairs.length - 1, this._startIndex + this.maxShown)))}>
-                            <Button tooltip="Scroll back" icon={<FontAwesomeIcon icon="chevron-left" size="lg" />} onClick={action(e => (this._startIndex = Math.max(0, this._startIndex - this.maxShown)))} color={SettingsManager.userColor} />
+                        <div
+                            style={{ position: 'absolute', bottom: 0, left: 0, background: SettingsManager.userVariantColor }}
+                            onClick={action(() => {
+                                this._startIndex = Math.min(this.childLayoutPairs.length - 1, this._startIndex + this.maxShown);
+                            })}>
+                            <Button
+                                tooltip="Scroll back"
+                                icon={<FontAwesomeIcon icon="chevron-left" size="lg" />}
+                                onClick={action(() => {
+                                    this._startIndex = Math.max(0, this._startIndex - this.maxShown);
+                                })}
+                                color={SettingsManager.userColor}
+                            />
                         </div>
                     </Tooltip>
                 )}
                 {this._startIndex > this.childLayoutPairs.length - 1 || !this.maxShown ? null : (
                     <Tooltip title="scroll forward">
-                        <div style={{ position: 'absolute', bottom: 0, right: 0, background: SettingsManager.userVariantColor }} onClick={action(e => (this._startIndex = Math.min(this.childLayoutPairs.length - 1, this._startIndex + this.maxShown)))}>
+                        <div
+                            style={{ position: 'absolute', bottom: 0, right: 0, background: SettingsManager.userVariantColor }}
+                            onClick={action(() => {
+                                this._startIndex = Math.min(this.childLayoutPairs.length - 1, this._startIndex + this.maxShown);
+                            })}>
                             <IconButton icon={<FaChevronRight />} color={SettingsManager.userColor} />
                         </div>
                     </Tooltip>
-- 
cgit v1.2.3-70-g09d2

