Merge branch 'moreUpgrading' into dataViz-annotations

1 files changed, 17 insertions, 20 deletions

diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index d68859e88..d0688c338 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -1,12 +1,12 @@
-import React = require('react');
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { ColorPicker, Group, IconButton, Popup, Size, Toggle, ToggleType, Type } from 'browndash-components';
-import { action, computed, IReactionDisposer, observable, ObservableMap, reaction } from 'mobx';
+import { IReactionDisposer, ObservableMap, action, computed, makeObservable, observable, reaction } from 'mobx';
 import { observer } from 'mobx-react';
-import { ColorState } from 'react-color';
+import * as React from 'react';
+import { ColorResult } from 'react-color';
+import { Utils, returnFalse, setupMoveUpEvents, unimplementedFunction } from '../../../Utils';
 import { Doc, Opt } from '../../../fields/Doc';
-import { returnFalse, setupMoveUpEvents, unimplementedFunction, Utils } from '../../../Utils';
-import { gptAPICall, GPTCallType } from '../../apis/gpt/GPT';
+import { GPTCallType, gptAPICall } from '../../apis/gpt/GPT';
 import { DocumentType } from '../../documents/DocumentTypes';
 import { SelectionManager } from '../../util/SelectionManager';
 import { SettingsManager } from '../../util/SettingsManager';
@@ -23,6 +23,13 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     private _commentRef = React.createRef<HTMLDivElement>();
     private _cropRef = React.createRef<HTMLDivElement>();
 
+    constructor(props: any) {
+        super(props);
+        makeObservable(this);
+        AnchorMenu.Instance = this;
+        AnchorMenu.Instance._canFade = false;
+    }
+
     @observable private highlightColor: string = 'rgba(245, 230, 95, 0.616)';
 
     @observable public Status: 'marquee' | 'annotation' | '' = '';
@@ -50,20 +57,13 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
         return this._left > 0;
     }
 
-    constructor(props: Readonly<{}>) {
-        super(props);
-
-        AnchorMenu.Instance = this;
-        AnchorMenu.Instance._canFade = false;
-    }
-
     componentWillUnmount() {
         this._disposer?.();
     }
 
     componentDidMount() {
         this._disposer = reaction(
-            () => SelectionManager.Views().slice(),
+            () => SelectionManager.Views.slice(),
             sel => AnchorMenu.Instance.fadeOut(true)
         );
     }
@@ -139,13 +139,10 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     }
 
     @action changeHighlightColor = (color: string) => {
-        const col: ColorState = {
+        const col: ColorResult = {
             hex: color,
-            hsl: { a: 0, h: 0, s: 0, l: 0, source: '' },
-            hsv: { a: 0, h: 0, s: 0, v: 0, source: '' },
-            rgb: { a: 0, r: 0, b: 0, g: 0, source: '' },
-            oldHue: 0,
-            source: '',
+            hsl: { a: 0, h: 0, s: 0, l: 0 },
+            rgb: { a: 0, r: 0, b: 0, g: 0 },
         };
         this.highlightColor = Utils.colorString(col);
     };
@@ -155,7 +152,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
      * all selected text available to summarize but its only supported for pdf and web ATM.
      * @returns Whether the GPT icon for summarization should appear
      */
-    canSummarize = () => SelectionManager.Docs().some(doc => [DocumentType.PDF, DocumentType.WEB].includes(doc.type as any));
+    canSummarize = () => SelectionManager.Docs.some(doc => [DocumentType.PDF, DocumentType.WEB].includes(doc.type as any));
 
     render() {
         const buttons =