1 files changed, 31 insertions, 34 deletions

diff --git a/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.tsx b/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.tsx
index 24023077f..60bc8df18 100644
--- a/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.tsx
+++ b/src/client/views/nodes/DataVizBox/SchemaCSVPopUp.tsx
@@ -1,9 +1,12 @@
+/* eslint-disable jsx-a11y/label-has-associated-control */
+/* eslint-disable jsx-a11y/alt-text */
 import { IconButton } from 'browndash-components';
 import { action, makeObservable, observable } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { CgClose } from 'react-icons/cg';
-import { Utils, emptyFunction, setupMoveUpEvents } from '../../../../Utils';
+import { ClientUtils, setupMoveUpEvents } from '../../../../ClientUtils';
+import { emptyFunction } from '../../../../Utils';
 import { Doc } from '../../../../fields/Doc';
 import { StrCast } from '../../../../fields/Types';
 import { DragManager } from '../../../util/DragManager';
@@ -14,56 +17,52 @@ interface SchemaCSVPopUpProps {}
 
 @observer
 export class SchemaCSVPopUp extends React.Component<SchemaCSVPopUpProps> {
+    // eslint-disable-next-line no-use-before-define
     static Instance: SchemaCSVPopUp;
 
-    @observable
-    public dataVizDoc: Doc | undefined = undefined;
+    @observable public dataVizDoc: Doc | undefined = undefined;
+    @observable public view: DocumentView | undefined = undefined;
+    @observable public target: Doc | undefined = undefined;
+    @observable public visible: boolean = false;
+
+    constructor(props: SchemaCSVPopUpProps) {
+        super(props);
+        makeObservable(this);
+        SchemaCSVPopUp.Instance = this;
+    }
+
     @action
     public setDataVizDoc = (doc: Doc) => {
         this.dataVizDoc = doc;
     };
 
-    @observable
-    public view: DocumentView | undefined = undefined;
     @action
     public setView = (docView: DocumentView) => {
         this.view = docView;
     };
 
-    @observable
-    public target: Doc | undefined = undefined;
     @action
     public setTarget = (doc: Doc) => {
         this.target = doc;
     };
 
-    @observable
-    public visible: boolean = false;
     @action
     public setVisible = (vis: boolean) => {
         this.visible = vis;
     };
 
-    constructor(props: SchemaCSVPopUpProps) {
-        super(props);
-        makeObservable(this);
-        SchemaCSVPopUp.Instance = this;
-    }
-
-    dataBox = () => {
-        return (
-            <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
-                {this.heading('Schema Table as Data Visualization Doc')}
-                <div className="image-content-wrapper">
-                    <div className="img-wrapper">
-                        <div className="img-container" onPointerDown={e => this.drag(e)}>
-                            <img width={150} height={150} src={'/assets/dataVizBox.png'} />
-                        </div>
+    dataBox = () => (
+        <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
+            {this.heading('Schema Table as Data Visualization Doc')}
+            <div className="image-content-wrapper">
+                <div className="img-wrapper">
+                    <div className="img-container" onPointerDown={e => this.drag(e)}>
+                        <img width={150} height={150} src="/assets/dataVizBox.png" />
                     </div>
                 </div>
             </div>
-        );
-    };
+        </div>
+    );
 
     heading = (headingText: string) => (
         <div className="summary-heading">
@@ -78,24 +77,22 @@ export class SchemaCSVPopUp extends React.Component<SchemaCSVPopUpProps> {
         setupMoveUpEvents(
             {},
             e,
-            e => {
+            moveEv => {
                 const sourceAnchorCreator = () => this.dataVizDoc!;
-                const targetCreator = (annotationOn: Doc | undefined) => {
+                const targetCreator = () => {
                     const embedding = Doc.MakeEmbedding(this.dataVizDoc!);
                     return embedding;
                 };
-                if (this.view && sourceAnchorCreator && !Utils.isClick(e.clientX, e.clientY, downX, downY, Date.now())) {
-                    DragManager.StartAnchorAnnoDrag(e.target instanceof HTMLElement ? [e.target] : [], new DragManager.AnchorAnnoDragData(this.view, sourceAnchorCreator, targetCreator), downX, downY, {
-                        dragComplete: e => {
-                            this.setVisible(false);
-                        },
+                if (this.view && sourceAnchorCreator && !ClientUtils.isClick(moveEv.clientX, moveEv.clientY, downX, downY, Date.now())) {
+                    DragManager.StartAnchorAnnoDrag(moveEv.target instanceof HTMLElement ? [moveEv.target] : [], new DragManager.AnchorAnnoDragData(this.view, sourceAnchorCreator, targetCreator), downX, downY, {
+                        dragComplete: () => this.setVisible(false),
                     });
                     return true;
                 }
                 return false;
             },
             emptyFunction,
-            action(e => {})
+            action(() => {})
         );
     };