Merge pull request #11181 from mvdbeek/history_sync_retries_backport

[21.01] History sync retries backport

client/src/components/History/HistoryTopNav.vue

@@ -35,7 +35,7 @@
                 key="use-legacy-history"
                 title="Return to legacy history panel"
                 icon="fas fa-exchange-alt"
-                @click="useLegacyHistoryPanel"
+                @click="switchToLegacyHistoryPanel"
             />
         </PriorityMenu>
     </div>
@@ -48,6 +48,7 @@ import HistorySelector from "./HistorySelector";
 import { createNewHistory } from "./model/queries";
 import { wipeDatabase, clearHistoryDateStore } from "./caching";
 import { legacyNavigationMixin } from "components/plugins";
+import { switchToLegacyHistoryPanel } from "./adapters/betaToggle";
 
 export default {
     mixins: [legacyNavigationMixin],
@@ -72,10 +73,7 @@ export default {
     methods: {
         ...mapActions("betaHistory", ["storeHistory"]),
 
-        useLegacyHistoryPanel() {
-            sessionStorage.removeItem("useBetaHistory");
-            location.reload();
-        },
+        switchToLegacyHistoryPanel,
 
         // create new server, store in vuex, switch to it
         async createHistory() {

client/src/components/History/adapters/HistoryPanelProxy.js

@@ -15,6 +15,7 @@ import Backbone from "backbone";
 import CurrentHistoryView from "mvc/history/history-view-edit-current";
 import { History } from "mvc/history/history-model";
 import "./HistoryPanelProxy.scss";
+import store from "store";
 
 // bypass polling while using the beta panel, skips contents loading
 const FakeHistoryViewModel = CurrentHistoryView.CurrentHistoryView.extend({
@@ -37,6 +38,7 @@ export const HistoryPanelProxy = Backbone.View.extend({
 
         // fake view of the current history
         this.historyView = new FakeHistoryViewModel({
+            fakeHistoryViewModel: true,
             className: `fake ${CurrentHistoryView.CurrentHistoryView.prototype.className} middle`,
             purgeAllowed: this.allow_user_dataset_purge,
             linkTarget: "galaxy_main",
@@ -59,6 +61,14 @@ export const HistoryPanelProxy = Backbone.View.extend({
                 url: `${Galaxy.user.urlRoot()}/${Galaxy.user.id || "current"}`,
             });
         });
+
+        // Watch the store, change the fake history model when it changs
+        store.subscribe(({ type, payload: newId }) => {
+            if (type == "betaHistory/setCurrentHistoryId") {
+                console.log("setCurrentHistoryId", newId);
+                Galaxy.currHistoryPanel.setModel(new History({ id: newId }));
+            }
+        });
     },
     render() {
         // Hack: For now, remove unused "unified-panel" elements until we can

client/src/components/History/adapters/betaToggle.js

@@ -0,0 +1,13 @@
+export const isBetaHistoryOpen = () => {
+    return sessionStorage.getItem("useBetaHistory");
+};
+
+export const switchToLegacyHistoryPanel = () => {
+    sessionStorage.removeItem("useBetaHistory");
+    location.reload();
+};
+
+export const switchToBetaHistoryPanel = () => {
+    sessionStorage.setItem("useBetaHistory", 1);
+    location.reload(false);
+};

client/src/components/History/model/syncCurrentHistoryToGalaxy.js

@@ -1,9 +1,11 @@
 // Sync Galaxy store to legacy galaxy current history
 
-import { fromEvent } from "rxjs";
-import { map, filter, switchMap, pluck, distinctUntilChanged } from "rxjs/operators";
+import { concat, fromEvent, throwError } from "rxjs";
+import { tap, map, filter, switchMap, pluck, distinctUntilChanged, retryWhen, take, delay } from "rxjs/operators";
+
+export function syncCurrentHistoryToGalaxy(galaxy$, store, cfg = {}) {
+    const { retryPeriod = 500, retries = 20 } = cfg;
 
-export function syncCurrentHistoryToGalaxy(galaxy$, store) {
     // prettier-ignore
     const historyId$ = galaxy$.pipe(
         pluck("currHistoryPanel"),
@@ -14,15 +16,22 @@ export function syncCurrentHistoryToGalaxy(galaxy$, store) {
                 map(() => panel.model.id)
             );
         }),
+        retryWhen(err$ => {
+            const retries$ = err$.pipe(
+                delay(retryPeriod),
+                take(retries)
+            );
+            const errMsg$ = throwError("Unable to sync to currHistoryPanel because it never appeared");
+            return concat(retries$, errMsg$);
+        }),
         filter(Boolean),
-        distinctUntilChanged()
+        distinctUntilChanged(),
+        tap(() => console.log("Vuex is now tracking galaxy.currHistoryPanel")),
     );
 
     return historyId$.subscribe(
-        (id) => {
-            store.commit("betaHistory/setCurrentHistoryId", id);
-        },
-        (err) => console.log("syncCurrentHistoryToGalaxy error", err),
+        (id) => store.commit("betaHistory/setCurrentHistoryId", id),
+        (err) => console.warn("syncCurrentHistoryToGalaxy error", err),
         () => console.log("syncCurrentHistoryToGalaxy complete")
     );
 }

client/src/components/Upload/UploadModal.vue

@@ -46,6 +46,7 @@ import RulesInput from "./RulesInput";
 import LoadingSpan from "components/LoadingSpan";
 import { mapState } from "vuex";
 import { BModal, BTabs, BTab } from "bootstrap-vue";
+import { isBetaHistoryOpen } from "components/History/adapters/betaToggle";
 
 const UploadModal = {
     components: {
@@ -336,8 +337,7 @@ const UploadModal = {
 };
 
 // Beta history patch
-const useBetaHistory = sessionStorage.getItem("useBetaHistory");
-if (useBetaHistory) {
+if (isBetaHistoryOpen()) {
     UploadModal.computed.currentHistoryId = function () {
         return this.$store.getters["betaHistory/currentHistoryId"];
     };

client/src/entry/analysis/index.js

@@ -6,14 +6,14 @@ import Page from "layout/page";
 
 // Vue adapter emulates current features of backbone history panel
 import { HistoryPanelProxy } from "components/History";
+import { isBetaHistoryOpen } from "components/History/adapters/betaToggle";
 
 addInitialization((Galaxy, { options = {} }) => {
     console.log("Analysis custom page setup");
 
     // Handle beta history panel
     // Need to mock Galaxy.currHistoryPanel
-    const useBeta = sessionStorage.getItem("useBetaHistory");
-    const HistoryPanel = useBeta ? HistoryPanelProxy : MvcHistoryPanel;
+    const HistoryPanel = isBetaHistoryOpen() ? HistoryPanelProxy : MvcHistoryPanel;
 
     const pageOptions = Object.assign({}, options, {
         config: Object.assign({}, options.config, {

client/src/mvc/history/options-menu.js

@@ -6,6 +6,7 @@ import _l from "utils/localization";
 import PopupMenu from "mvc/ui/popup-menu";
 import historyCopyDialog from "mvc/history/copy-dialog";
 import Webhooks from "mvc/webhooks";
+import { switchToBetaHistoryPanel } from "../../components/History/adapters/betaToggle";
 
 // ============================================================================
 var menu = [
@@ -165,8 +166,7 @@ var menu = [
         html: _l("Use Beta History Panel"),
         anon: false,
         func: function () {
-            sessionStorage.setItem("useBetaHistory", 1);
-            window.location.reload(false);
+            switchToBetaHistoryPanel();
         },
     },
 ];

client/src/store/syncVuextoGalaxy.js

@@ -13,6 +13,7 @@ import { waitForInit } from "utils/observable/waitForInit";
 import { syncUserToGalaxy } from "store/userStore/syncUserToGalaxy";
 import { syncConfigToGalaxy } from "store/configStore/syncConfigToGalaxy";
 import { syncCurrentHistoryToGalaxy } from "components/History/model/syncCurrentHistoryToGalaxy";
+import { isBetaHistoryOpen } from "components/History/adapters/betaToggle";
 
 export const syncVuextoGalaxy = (store) => {
     const globalGalaxy$ = defer(() => {
@@ -25,6 +26,8 @@ export const syncVuextoGalaxy = (store) => {
     // configuration
     syncConfigToGalaxy(globalGalaxy$, store);
 
-    // Current History object (from legacy history panel)
-    syncCurrentHistoryToGalaxy(globalGalaxy$, store);
+    // Update Vuex with legacy galaxy history changes only when beta panel is closed.
+    if (!isBetaHistoryOpen()) {
+        syncCurrentHistoryToGalaxy(globalGalaxy$, store);
+    }
 };