fixed up a bunch of things in face recognition

1 files changed, 20 insertions, 19 deletions

diff --git a/src/client/views/collections/collectionFreeForm/FaceCollectionBox.tsx b/src/client/views/collections/collectionFreeForm/FaceCollectionBox.tsx
index 1d3f88df1..50b91e8fe 100644
--- a/src/client/views/collections/collectionFreeForm/FaceCollectionBox.tsx
+++ b/src/client/views/collections/collectionFreeForm/FaceCollectionBox.tsx
@@ -1,26 +1,27 @@
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { IconButton, Size } from 'browndash-components';
+import * as faceapi from 'face-api.js';
+import { FaceMatcher } from 'face-api.js';
+import 'ldrs/ring';
+import { action, computed, makeObservable, observable } from 'mobx';
 import { observer } from 'mobx-react';
 import React from 'react';
-import { Docs } from '../../../documents/Documents';
-import { DocumentType } from '../../../documents/DocumentTypes';
-import { ViewBoxBaseComponent } from '../../DocComponent';
-import { FieldView, FieldViewProps } from '../../nodes/FieldView';
-import 'ldrs/ring';
-import { SnappingManager } from '../../../util/SnappingManager';
-import { action, computed, makeObservable, observable, reaction } from 'mobx';
-import { Doc, DocListCast, NumListCast } from '../../../../fields/Doc';
+import { Utils } from '../../../../Utils';
+import { Doc, DocListCast } from '../../../../fields/Doc';
 import { DocData } from '../../../../fields/DocSymbols';
+import { Id } from '../../../../fields/FieldSymbols';
+import { List } from '../../../../fields/List';
 import { ImageCast, StrCast } from '../../../../fields/Types';
+import { DocumentType } from '../../../documents/DocumentTypes';
+import { Docs } from '../../../documents/Documents';
+import { DragManager } from '../../../util/DragManager';
+import { SnappingManager } from '../../../util/SnappingManager';
+import { ViewBoxBaseComponent } from '../../DocComponent';
 import { ObservableReactComponent } from '../../ObservableReactComponent';
+import { DocumentView } from '../../nodes/DocumentView';
+import { FieldView, FieldViewProps } from '../../nodes/FieldView';
 import './FaceCollectionBox.scss';
-import { IconButton, Size } from 'browndash-components';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { MarqueeOptionsMenu } from './MarqueeOptionsMenu';
-import { List } from '../../../../fields/List';
-import { DocumentView } from '../../nodes/DocumentView';
-import { Utils } from '../../../../Utils';
-import { DragManager } from '../../../util/DragManager';
-import * as faceapi from 'face-api.js';
-import { FaceMatcher } from 'face-api.js';
 
 interface FaceDocumentProps {
     faceDoc: Doc;
@@ -36,7 +37,7 @@ export class FaceDocumentItem extends ObservableReactComponent<FaceDocumentProps
     private _dropDisposer?: DragManager.DragDropDisposer;
     private _inputRef = React.createRef<HTMLInputElement>();
 
-    constructor(props: any) {
+    constructor(props: FaceDocumentProps) {
         super(props);
         makeObservable(this);
         this.ref = React.createRef();
@@ -194,7 +195,7 @@ export class FaceCollectionBox extends ViewBoxBaseComponent<FieldViewProps>() {
         }
     }
 
-    constructor(props: any) {
+    constructor(props: FieldViewProps) {
         super(props);
         makeObservable(this);
         FaceCollectionBox.Instance = this;
@@ -204,7 +205,7 @@ export class FaceCollectionBox extends ViewBoxBaseComponent<FieldViewProps>() {
         return (
             <div className="searchBox-container" style={{ pointerEvents: 'all', color: SnappingManager.userColor, background: SnappingManager.userBackgroundColor }}>
                 {this.currentDocs.map(doc => {
-                    return <FaceDocumentItem faceDoc={doc} />;
+                    return <FaceDocumentItem key={doc[Id]} faceDoc={doc} />;
                 })}
             </div>
         );