diff --git a/frontend/app/components/Session_/Player/Controls/Controls.js b/frontend/app/components/Session_/Player/Controls/Controls.js
index 0601e092f..1dcbbaa21 100644
--- a/frontend/app/components/Session_/Player/Controls/Controls.js
+++ b/frontend/app/components/Session_/Player/Controls/Controls.js
@@ -48,6 +48,8 @@ function getStorageIconName(type) {
return 'vendors/vuex';
case STORAGE_TYPES.NGRX:
return 'vendors/ngrx';
+ case STORAGE_TYPES.ZUSTAND:
+ return 'vendors/zustand';
case STORAGE_TYPES.NONE:
return 'store';
}
@@ -73,6 +75,8 @@ function getStorageName(type) {
return 'VUEX';
case STORAGE_TYPES.NGRX:
return 'NGRX';
+ case STORAGE_TYPES.ZUSTAND:
+ return 'ZUSTAND';
case STORAGE_TYPES.NONE:
return 'STATE';
}
diff --git a/frontend/app/components/Session_/Storage/Storage.js b/frontend/app/components/Session_/Storage/Storage.js
index b1cf53dfc..62e9eda19 100644
--- a/frontend/app/components/Session_/Storage/Storage.js
+++ b/frontend/app/components/Session_/Storage/Storage.js
@@ -121,6 +121,9 @@ export default class Storage extends React.PureComponent {
const { type, listNow, list } = this.props;
let src;
let name;
+
+ // ZUSTAND TODO
+ console.log(item, type)
switch(type) {
case STORAGE_TYPES.REDUX:
case STORAGE_TYPES.NGRX:
@@ -208,6 +211,7 @@ export default class Storage extends React.PureComponent {
{'Inspect your application state while you’re replaying your users sessions. OpenReplay supports '}
Redux{', '}
VueX{', '}
+ {/* ZUSTAND TODO */}
MobX{' and '}
NgRx.
diff --git a/frontend/app/player/MessageDistributor/Lists.ts b/frontend/app/player/MessageDistributor/Lists.ts
index 0173b2667..a65eff52f 100644
--- a/frontend/app/player/MessageDistributor/Lists.ts
+++ b/frontend/app/player/MessageDistributor/Lists.ts
@@ -1,7 +1,7 @@
import type { Message } from './messages'
import ListWalker from './managers/ListWalker';
-export const LIST_NAMES = ["redux", "mobx", "vuex", "ngrx", "graphql", "exceptions", "profiles", "longtasks"] as const;
+export const LIST_NAMES = ["redux", "mobx", "vuex", "zustand", "ngrx", "graphql", "exceptions", "profiles", "longtasks"] as const;
export const INITIAL_STATE = {}
LIST_NAMES.forEach(name => {
diff --git a/frontend/app/player/MessageDistributor/MessageDistributor.ts b/frontend/app/player/MessageDistributor/MessageDistributor.ts
index 2d73081fb..8c47debe2 100644
--- a/frontend/app/player/MessageDistributor/MessageDistributor.ts
+++ b/frontend/app/player/MessageDistributor/MessageDistributor.ts
@@ -123,7 +123,7 @@ export default class MessageDistributor extends StatedScreen {
// TODO: fix types for events, remove immutable js
eventList.forEach((e: Record) => {
if (e.type === EVENT_TYPES.LOCATION) { //TODO type system
- this.locationEventManager.append(e);
+ this.locationEventManager.append(e);
}
});
this.session.errors.forEach((e: Record) => {
@@ -233,7 +233,7 @@ export default class MessageDistributor extends StatedScreen {
this.waitingForFiles = false
this.setMessagesLoading(false)
})
-
+
})
}
@@ -479,6 +479,12 @@ export default class MessageDistributor extends StatedScreen {
this.lists.vuex.append(decoded);
}
break;
+ case "zustand":
+ decoded = this.decodeMessage(msg, ["state", "mutation"])
+ logger.log(decoded)
+ if (decoded != null) {
+ this.lists.zustand.append(decoded)
+ }
case "mob_x":
decoded = this.decodeMessage(msg, ["payload"]);
logger.log(decoded)
diff --git a/frontend/app/player/store/selectors.js b/frontend/app/player/store/selectors.js
index 1a6f0dc2d..36750b56d 100644
--- a/frontend/app/player/store/selectors.js
+++ b/frontend/app/player/store/selectors.js
@@ -2,6 +2,7 @@ const REDUX = "redux";
const MOBX = "mobx";
const VUEX = "vuex";
const NGRX = "ngrx";
+const ZUSTAND = 'zustand';
const NONE = 0;
@@ -10,6 +11,7 @@ export const STORAGE_TYPES = {
MOBX,
VUEX,
NGRX,
+ ZUSTAND,
NONE,
};
@@ -24,6 +26,8 @@ export function selectStorageType(state) {
return MOBX;
} else if (state.ngrxList.length > 0) {
return NGRX;
+ } else if (state.zustandList.length > 0) {
+ return ZUSTAND;
}
return NONE;
}
@@ -41,4 +45,4 @@ export function selectStorageListNow(state) {
return state[`${key}ListNow`] || [];
}
return [];
-}
\ No newline at end of file
+}