Fix query cache not including newly created entities

Readme.md

@@ -13,13 +13,13 @@
 - Or for the latest changes `git clone https://github.com/Azure/BatchLabs`
 
 #### 3. Install the dependencies
-```
+```bash
 yarn install
 npm install -g gulp (Optional)
 ```
 
 #### 4. Build and run the application
-```
+```bash
 npm run build:prod
 npm run electron:prod
 
@@ -32,19 +32,19 @@ npm run electron
 [Dev docs](docs/readme.md)
 
 For developers, you can set up a development environment as follows:
-** Use `yarn install` instead of `npm install` this will makes sure everybody has the same exact set of depenencies [Migrating from npm to yarn](https://yarnpkg.com/lang/en/docs/migrating-from-npm/)**
+**Use `yarn install` instead of `npm install` this will makes sure everybody has the same exact set of depenencies [Migrating from npm to yarn](https://yarnpkg.com/lang/en/docs/migrating-from-npm/)**
 
 Start the dev server
-```
+```bash
 npm run dev-server
 ```
 
 Start electron
-```
-// In the command line
+```bash
+# In the command line
 npm run dev-electron
 
-// In VSCode just press F5
+# In VSCode just press F5
 ```
 
 The dev-server and dev-electron support hot reload for a better development experience. Simply saving a file will cause the UI to refresh to your updated changes.

app/services/core/query-cache.ts

@@ -26,6 +26,17 @@ export class QueryCache {
         this.cleanCache();
     }
 
+    public addKeyToQuery(filter: string, key: string) {
+        if (!filter) {
+            filter = noQueryKey;
+        }
+        const query = this._cache[filter];
+        if (!query) {
+            return;
+        }
+        query.keys = query.keys.add(key);
+    }
+
     public getKeys(filter: string): CachedKeyList {
         if (!filter) {
             filter = noQueryKey;

app/services/core/rx-list-proxy.ts

@@ -3,6 +3,7 @@ import { List, OrderedSet } from "immutable";
 import { AsyncSubject, BehaviorSubject, Observable } from "rxjs";
 
 import { LoadingStatus } from "app/components/base/loading";
+import { log } from "app/utils";
 import { CachedKeyList } from "./query-cache";
 import { RxEntityProxy } from "./rx-entity-proxy";
 import { RxProxyBase, RxProxyBaseConfig } from "./rx-proxy-base";
@@ -33,7 +34,7 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
         }).switch();
 
         this.deleted.subscribe((deletedKey) => {
-            this._itemKeys.next(OrderedSet<string>(this._itemKeys.getValue().filter((key) => key !== deletedKey)));
+            this._itemKeys.next(OrderedSet<string>(this._itemKeys.value.filter((key) => key !== deletedKey)));
         });
     }
 
@@ -72,7 +73,7 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
             next: (response: any) => {
                 const keys = OrderedSet(this.newItems(this.processResponse(response)));
                 this._hasMore.next(this.hasMoreItems());
-                const currentKeys = this._itemKeys.getValue();
+                const currentKeys = this._itemKeys.value;
                 if (currentKeys.size === 0) {
                     this.cache.queryCache.cacheQuery(this._options.filter, keys, this.putQueryCacheData());
                 }
@@ -116,17 +117,14 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
      * The cache system will handle updating it already.
      */
     public loadNewItem(entityProxy: RxEntityProxy<any, TEntity>): Observable<any> {
-        const obs = entityProxy.fetch();
-        obs.subscribe(() => {
-            entityProxy.item.first().subscribe((newItem) => {
-                if (!newItem) { return; }
-                const key = this.cache.getItemKey(newItem);
-                const itemKeys = this._itemKeys;
-                if (itemKeys.value.has(key)) {
-                    return;
-                }
-                this._itemKeys.next(OrderedSet(OrderedSet([key]).concat(this._itemKeys.value)));
-            });
+        const obs = entityProxy.fetch().flatMap(() => entityProxy.item.first());
+        obs.subscribe({
+            next: (newItem) => {
+                this._addItemToList(newItem);
+            }, error: (error) => {
+                log.error("Error loading new item into RxListProxy",
+                    { error, params: this._params, options: this._options });
+            },
         });
         return obs;
     }
@@ -174,4 +172,21 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
         this._status.next(LoadingStatus.Ready);
         return true;
     }
+
+    /**
+     * Add the given item to the list and the query cache.
+     * @param newItem newItem to be added
+     */
+    private _addItemToList(newItem: TEntity) {
+        if (!newItem) { return; }
+
+        const key = this.cache.getItemKey(newItem);
+        const itemKeys = this._itemKeys;
+        if (itemKeys.value.has(key)) {
+            return;
+        }
+
+        this._itemKeys.next(OrderedSet(OrderedSet([key]).concat(this._itemKeys.value)));
+        this._cache.queryCache.addKeyToQuery(null, key);
+    }
 }