diff options
Diffstat (limited to 'src/client/util')
| -rw-r--r-- | src/client/util/DocumentManager.ts | 11 | ||||
| -rw-r--r-- | src/client/util/Import & Export/DirectoryImportBox.tsx | 3 | ||||
| -rw-r--r-- | src/client/util/LinkManager.ts | 14 | ||||
| -rw-r--r-- | src/client/util/RTFMarkup.tsx | 2 | ||||
| -rw-r--r-- | src/client/util/SelectionManager.ts | 20 | ||||
| -rw-r--r-- | src/client/util/ServerStats.tsx | 6 | ||||
| -rw-r--r-- | src/client/util/SettingsManager.tsx | 8 | ||||
| -rw-r--r-- | src/client/util/SharingManager.tsx | 4 | ||||
| -rw-r--r-- | src/client/util/SnappingManager.ts | 2 |
9 files changed, 36 insertions, 34 deletions
diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts index ad5a1654d..7f82ff70a 100644 --- a/src/client/util/DocumentManager.ts +++ b/src/client/util/DocumentManager.ts @@ -1,4 +1,4 @@ -import { action, computed, observable, ObservableSet, observe } from 'mobx'; +import { action, computed, makeObservable, observable, ObservableSet, observe } from 'mobx'; import { Doc, DocListCast, Opt } from '../../fields/Doc'; import { AclAdmin, AclEdit, Animation } from '../../fields/DocSymbols'; import { Id } from '../../fields/FieldSymbols'; @@ -22,8 +22,8 @@ const { Howl } = require('howler'); export class DocumentManager { //global holds all of the nodes (regardless of which collection they're in) @observable _documentViews = new Set<DocumentView>(); - @observable public LinkAnchorBoxViews: DocumentView[] = []; - @observable public LinkedDocumentViews: { a: DocumentView; b: DocumentView; l: Doc }[] = []; + @observable public LinkAnchorBoxViews: DocumentView[] = observable([]); + @observable public LinkedDocumentViews: { a: DocumentView; b: DocumentView; l: Doc }[] = observable([]); @computed public get DocumentViews() { return Array.from(this._documentViews).filter(view => !(view.ComponentView instanceof KeyValueBox) && (!LightboxView.LightboxDoc || LightboxView.IsLightboxDocView(view.docViewPath))); } @@ -38,11 +38,12 @@ export class DocumentManager { public static get Instance(): DocumentManager { return this._instance || (this._instance = new this()); } + @observable public CurrentlyLoading: Doc[] = observable([]); // this assignment doesn't work. the actual assignment happens in DocumentManager's constructor //private constructor so no other class can create a nodemanager private constructor() { - if (!LoadingBox.CurrentlyLoading) LoadingBox.CurrentlyLoading = []; - observe(LoadingBox.CurrentlyLoading, change => { + makeObservable(this); + observe(this.CurrentlyLoading, change => { // watch CurrentlyLoading-- when something is loaded, it's removed from the list and we have to update its icon if it were iconified since LoadingBox icons are different than the media they become switch (change.type as any) { case 'update': diff --git a/src/client/util/Import & Export/DirectoryImportBox.tsx b/src/client/util/Import & Export/DirectoryImportBox.tsx index 30e448797..55aac5eb0 100644 --- a/src/client/util/Import & Export/DirectoryImportBox.tsx +++ b/src/client/util/Import & Export/DirectoryImportBox.tsx @@ -21,7 +21,6 @@ import { DocumentManager } from '../DocumentManager'; import './DirectoryImportBox.scss'; import ImportMetadataEntry, { keyPlaceholder, valuePlaceholder } from './ImportMetadataEntry'; import * as React from 'react'; -import * as _ from 'lodash'; const unsupported = ['text/html', 'text/plain']; @@ -157,7 +156,7 @@ export class DirectoryImportBox extends React.Component<FieldViewProps> { x: NumCast(doc.x), y: NumCast(doc.y) + offset, }; - const parent = this.props.DocumentView?.().props.docViewPath().lastElement(); + const parent = this.props.DocumentView?.()._props.docViewPath().lastElement(); if (parent?.Document.type === DocumentType.COL) { let importContainer: Doc; if (docs.length < 50) { diff --git a/src/client/util/LinkManager.ts b/src/client/util/LinkManager.ts index 3e98ea379..8346949ba 100644 --- a/src/client/util/LinkManager.ts +++ b/src/client/util/LinkManager.ts @@ -1,4 +1,4 @@ -import { action, observable, observe, runInAction } from 'mobx'; +import { action, makeObservable, observable, observe, runInAction } from 'mobx'; import { computedFn } from 'mobx-utils'; import { Doc, DocListCast, DocListCastAsync, Field, Opt } from '../../fields/Doc'; import { DirectLinks } from '../../fields/DocSymbols'; @@ -22,7 +22,7 @@ import { ScriptingGlobals } from './ScriptingGlobals'; */ export class LinkManager { @observable static _instance: LinkManager; - @observable static userLinkDBs: Doc[] = []; + @observable userLinkDBs: Doc[] = observable([]); @observable public static currentLink: Opt<Doc>; @observable public static currentLinkAnchor: Opt<Doc>; public static get Instance() { @@ -32,21 +32,21 @@ export class LinkManager { public static Links(doc: Doc | undefined) { return doc ? LinkManager.Instance.getAllRelatedLinks(doc) : []; } - public static addLinkDB = async (linkDb: any) => { + public addLinkDB = async (linkDb: any) => { await Promise.all( ((await DocListCastAsync(linkDb.data)) ?? []).map(link => // makes sure link anchors are loaded to avoid incremental updates to computedFns in LinkManager [PromiseValue(link?.link_anchor_1), PromiseValue(link?.link_anchor_2)] ) ); - LinkManager.userLinkDBs.push(linkDb); + this.userLinkDBs.push(linkDb); }; public static AutoKeywords = 'keywords:Usages'; static _links: Doc[] = []; constructor() { + makeObservable(this); LinkManager._instance = this; this.createlink_relationshipLists(); - LinkManager.userLinkDBs = []; // since this is an action, not a reaction, we get only one shot to add this link to the Anchor docs // Thus make sure all promised values are resolved from link -> link.proto -> link.link_anchor_[1,2] -> link.link_anchor_[1,2].proto // Then add the link to the anchor protos. @@ -124,7 +124,7 @@ export class LinkManager { } }; observe( - LinkManager.userLinkDBs, + this.userLinkDBs, change => { switch (change.type as any) { case 'splice': @@ -136,7 +136,7 @@ export class LinkManager { true ); runInAction(() => (FieldLoader.ServerLoadStatus.message = 'links')); - LinkManager.addLinkDB(Doc.LinkDBDoc()); + this.addLinkDB(Doc.LinkDBDoc()); } public createlink_relationshipLists = () => { diff --git a/src/client/util/RTFMarkup.tsx b/src/client/util/RTFMarkup.tsx index c8940194c..495af6abd 100644 --- a/src/client/util/RTFMarkup.tsx +++ b/src/client/util/RTFMarkup.tsx @@ -26,7 +26,7 @@ export class RTFMarkup extends React.Component<{}> { RTFMarkup.Instance = this; } - @observable _stats: { [key: string]: any } | undefined; + @observable _stats: { [key: string]: any } | undefined = undefined; /** * @returns the main interface of the SharingManager. diff --git a/src/client/util/SelectionManager.ts b/src/client/util/SelectionManager.ts index 25f158f40..d36a360a1 100644 --- a/src/client/util/SelectionManager.ts +++ b/src/client/util/SelectionManager.ts @@ -1,4 +1,4 @@ -import { action, observable } from 'mobx'; +import { action, makeObservable, observable } from 'mobx'; import { Doc, Opt } from '../../fields/Doc'; import { DocViews } from '../../fields/DocSymbols'; import { List } from '../../fields/List'; @@ -12,9 +12,13 @@ import { UndoManager } from './UndoManager'; export namespace SelectionManager { class Manager { - @observable SelectedViews: DocumentView[] = []; + @observable SelectedViews: DocumentView[] = observable([]); @observable IsDragging: boolean = false; - @observable SelectedSchemaDocument: Doc | undefined; + @observable SelectedSchemaDocument: Doc | undefined = undefined; + + constructor() { + makeObservable(this); + } @action SelectSchemaViewDoc(doc: Opt<Doc>) { @@ -26,7 +30,7 @@ export namespace SelectionManager { if (!extendSelection) this.DeselectAll(); manager.SelectedViews.push(docView); docView.SELECTED = true; - docView.props.whenChildContentsActiveChanged(true); + docView._props.whenChildContentsActiveChanged(true); } } @action @@ -34,7 +38,7 @@ export namespace SelectionManager { if (docView && manager.SelectedViews.includes(docView)) { docView.SELECTED = false; manager.SelectedViews.splice(manager.SelectedViews.indexOf(docView), 1); - docView.props.whenChildContentsActiveChanged(false); + docView._props.whenChildContentsActiveChanged(false); } } @action @@ -44,7 +48,7 @@ export namespace SelectionManager { manager.SelectedSchemaDocument = undefined; manager.SelectedViews.forEach(dv => { dv.SELECTED = false; - dv.props.whenChildContentsActiveChanged(false); + dv._props.whenChildContentsActiveChanged(false); }); manager.SelectedViews.length = 0; } @@ -87,7 +91,7 @@ export namespace SelectionManager { ScriptingGlobals.add(function SelectionManager_selectedDocType(type: string, expertMode: boolean, checkContext?: boolean) { if (Doc.noviceMode && expertMode) return false; if (type === 'tab') { - return SelectionManager.Views().lastElement()?.props.renderDepth === 0; + return SelectionManager.Views().lastElement()?._props.renderDepth === 0; } let selected = (sel => (checkContext ? DocCast(sel?.embedContainer) : sel))(SelectionManager.SelectedSchemaDoc() ?? SelectionManager.Docs().lastElement()); return selected?.type === type || selected?.type_collection === type || !type; @@ -115,7 +119,7 @@ ScriptingGlobals.add(function redo() { }); ScriptingGlobals.add(function selectedDocs(container: Doc, excludeCollections: boolean, prevValue: any) { const docs = SelectionManager.Views() - .map(dv => dv.props.Document) + .map(dv => dv.Document) .filter(d => !Doc.AreProtosEqual(d, container) && !d.annotationOn && d.type !== DocumentType.KVP && (!excludeCollections || d.type !== DocumentType.COL || !Cast(d.data, listSpec(Doc), null))); return docs.length ? new List(docs) : prevValue; }); diff --git a/src/client/util/ServerStats.tsx b/src/client/util/ServerStats.tsx index 08dbaac5d..7d5e0458d 100644 --- a/src/client/util/ServerStats.tsx +++ b/src/client/util/ServerStats.tsx @@ -36,7 +36,7 @@ export class ServerStats extends React.Component<{}> { ServerStats.Instance = this; } - @observable _stats: { [key: string]: any } | undefined; + @observable _stats: { [key: string]: any } | undefined = undefined; /** * @returns the main interface of the SharingManager. @@ -56,9 +56,7 @@ export class ServerStats extends React.Component<{}> { <br /> <span>Active users:{this._stats?.socketMap.length}</span> - {this._stats?.socketMap.map((user: any) => ( - <p>{user.username}</p> - ))} + {this._stats?.socketMap.map((user: any) => <p>{user.username}</p>)} </div> </div> ); diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx index 39c471970..ccf6fb820 100644 --- a/src/client/util/SettingsManager.tsx +++ b/src/client/util/SettingsManager.tsx @@ -1,6 +1,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { Button, ColorPicker, Dropdown, DropdownType, EditableText, Group, NumberDropdown, Size, Toggle, ToggleType, Type } from 'browndash-components'; -import { action, computed, observable, runInAction } from 'mobx'; +import { action, computed, makeObservable, observable, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; import { BsGoogle } from 'react-icons/bs'; @@ -45,11 +45,12 @@ export class SettingsManager extends React.Component<{}> { @observable private new_confirm = ''; @observable activeTab = 'Accounts'; - @observable public static propertiesWidth: number = 0; - @observable public static headerBarHeight: number = 0; + @observable public propertiesWidth: number = 0; + @observable public headerBarHeight: number = 0; constructor(props: {}) { super(props); + makeObservable(this); SettingsManager.Instance = this; this.matchSystem(); window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => { @@ -116,7 +117,6 @@ export class SettingsManager extends React.Component<{}> { }); @undoBatch - @action changeColorScheme = action((scheme: string) => { Doc.UserDoc().userTheme = scheme; switch (scheme) { diff --git a/src/client/util/SharingManager.tsx b/src/client/util/SharingManager.tsx index 403f4e090..a46c6363e 100644 --- a/src/client/util/SharingManager.tsx +++ b/src/client/util/SharingManager.tsx @@ -67,8 +67,8 @@ export class SharingManager extends React.Component<{}> { public static Instance: SharingManager; @observable private isOpen = false; // whether the SharingManager modal is open or not @observable public users: ValidatedUser[] = []; // the list of users with sharing docs - @observable private targetDoc: Doc | undefined; // the document being shared - @observable private targetDocView: DocumentView | undefined; // the DocumentView of the document being shared + @observable private targetDoc: Doc | undefined = undefined; // the document being shared + @observable private targetDocView: DocumentView | undefined = undefined; // the DocumentView of the document being shared // @observable private copied = false; @observable private dialogueBoxOpacity = 1; // for the modal @observable private overlayOpacity = 0.4; // for the modal diff --git a/src/client/util/SnappingManager.ts b/src/client/util/SnappingManager.ts index fce43eef6..715eb021f 100644 --- a/src/client/util/SnappingManager.ts +++ b/src/client/util/SnappingManager.ts @@ -6,7 +6,7 @@ export namespace SnappingManager { @observable ShiftKey = false; @observable CtrlKey = false; @observable IsDragging: boolean = false; - @observable IsResizing: Doc | undefined; + @observable IsResizing: Doc | undefined = undefined; @observable CanEmbed: boolean = false; @observable public horizSnapLines: number[] = []; @observable public vertSnapLines: number[] = []; |
