a bunch more fixes to making things observable. fixed calling super.componentDidUpdate on subsclasses

3 files changed, 9 insertions, 13 deletions

diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx
index 0d5fcdaeb..66aa29de0 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoState.tsx
@@ -3,7 +3,6 @@ import { observer } from 'mobx-react';
 import * as React from 'react';
 import { ObservableReactComponent } from '../../ObservableReactComponent';
 import './CollectionFreeFormView.scss';
-import { copyProps } from '../../../../Utils';
 
 /**
  * An Fsa Arc.  The first array element is a test condition function that will be observed.
@@ -83,7 +82,7 @@ export class CollectionFreeFormInfoState extends ObservableReactComponent<Collec
         this.initState();
     }
     componentDidUpdate(prevProps: Readonly<CollectionFreeFormInfoStateProps>) {
-        copyProps(this, prevProps);
+        super.componentDidUpdate(prevProps);
         this.clearState();
         this.initState();
     }
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx
index 4d3752c02..5637f9aeb 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormInfoUI.tsx
@@ -18,23 +18,19 @@ export interface CollectionFreeFormInfoUIProps {
 export class CollectionFreeFormInfoUI extends ObservableReactComponent<CollectionFreeFormInfoUIProps> {
     private _disposers: { [name: string]: IReactionDisposer } = {};
 
-    @observable _currState: infoState | undefined = undefined;
-    get currState() {
-        return this._currState!;
-    }
-    set currState(val) {
-        this._currState = val;
-    }
-
     constructor(props: any) {
         super(props);
         makeObservable(this);
         this.currState = this.setupStates();
     }
 
+    @observable _currState: infoState | undefined = undefined;
+    get currState() { return this._currState!; } // prettier-ignore
+    set currState(val) { runInAction(() => (this._currState = val)); } // prettier-ignore
+
     setCurrState = (state: infoState) => {
         if (state) {
-            runInAction(() => (this.currState = state));
+            this.currState = state;
             this.currState[StateEntryFunc]?.();
         }
     };
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeOptionsMenu.tsx b/src/client/views/collections/collectionFreeForm/MarqueeOptionsMenu.tsx
index 7aa68b0d9..79cc534dc 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeOptionsMenu.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeOptionsMenu.tsx
@@ -1,6 +1,6 @@
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { IconButton } from 'browndash-components';
-import { computed } from 'mobx';
+import { computed, makeObservable } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { unimplementedFunction } from '../../../../Utils';
@@ -18,8 +18,9 @@ export class MarqueeOptionsMenu extends AntimodeMenu<AntimodeMenuProps> {
     public hideMarquee: () => void = unimplementedFunction;
     public pinWithView: (e: KeyboardEvent | React.PointerEvent | undefined) => void = unimplementedFunction;
     public isShown = () => this._opacity > 0;
-    constructor(props: Readonly<{}>) {
+    constructor(props: any) {
         super(props);
+        makeObservable(this);
         MarqueeOptionsMenu.Instance = this;
     }