diff --git a/src/ObservableGroupMap.ts b/src/ObservableGroupMap.ts index 1456f2e..136787b 100644 --- a/src/ObservableGroupMap.ts +++ b/src/ObservableGroupMap.ts @@ -9,7 +9,15 @@ import { Lambda, } from "mobx" -interface GrouperItemInfo { +// ObservableGroupMaps actually each use their own symbol, so that an item can be tracked by +// multiple OGMs. We declare this here so we can type the arrays properly. +declare const OGM_INFO_KEY: unique symbol + +interface GroupItem { + [OGM_INFO_KEY]?: GroupItemInfo +} + +interface GroupItemInfo { groupByValue: any reaction: IReactionDisposer groupArrIndex: number @@ -39,17 +47,17 @@ interface GrouperItemInfo { * slicesByDay.get("we"))) // outputs 1, undefined * slices[0].day = "we" // outputs 0, [{ day: "we", hours: 12 }] */ -export class ObservableGroupMap extends ObservableMap> { +export class ObservableGroupMap extends ObservableMap> { /** * Base observable array which is being sorted into groups. */ - private readonly _base: IObservableArray + private readonly _base: IObservableArray /** * The ObservableGroupMap needs to track some state per-item. This is the name/symbol of the * property used to attach the state. */ - private readonly _ogmInfoKey: string + private readonly _ogmInfoKey: typeof OGM_INFO_KEY /** * The function used to group the items. @@ -84,17 +92,16 @@ export class ObservableGroupMap extends ObservableMap { + this._disposeBaseObserver = observe(this._base, (change) => { if ("splice" === change.type) { transaction(() => { for (const removed of change.removed) { @@ -127,6 +134,11 @@ export class ObservableGroupMap extends ObservableMap | undefined { + // override get to return IObservableArray instead of IObservableArray + return super.get(key) + } + /** * Disposes all observers created during construction and removes state added to base array * items. @@ -135,10 +147,10 @@ export class ObservableGroupMap extends ObservableMap extends ObservableMap extends ObservableMap this._groupBy(item), (newGroupByValue, _r) => { console.log("new group by value ", newGroupByValue) - const grouperItemInfo = (item as any)[this._ogmInfoKey] + const grouperItemInfo = item[this._ogmInfoKey]! this._removeFromGroupArr( grouperItemInfo.groupByValue, grouperItemInfo.groupArrIndex @@ -197,11 +209,11 @@ export class ObservableGroupMap extends ObservableMap