sessions sotre

frontend/app/components/shared/SessionsTabOverview/components/SessionTags/SessionTags.tsx

@@ -19,7 +19,6 @@ interface Tag {
 
 interface StateProps {
   activeTab: { type: string };
-  total: number;
 }
 
 interface DispatchProps {
@@ -36,8 +35,9 @@ const tagIcons = {
   [types.CRASH]: <Skull size={14} />,
 } as Record<string, any>;
 
-const SessionTags: React.FC<Props> = ({ activeTab, total, setActiveTab }) => {
-  const { projectsStore } = useStore();
+const SessionTags: React.FC<Props> = ({ activeTab, setActiveTab }) => {
+  const { projectsStore, sessionStore } = useStore();
+  const total = sessionStore.total;
   const platform = projectsStore.active?.platform || '';
   const tags = issues_types.filter(
     (tag) =>
@@ -123,9 +123,8 @@ export const TagItem: React.FC<{
 
 const mapStateToProps = (state: any): StateProps => {
   const activeTab = state.getIn(['search', 'activeTab']);
-  const total = state.getIn(['sessions', 'total']) || 0;
 
-  return { activeTab, total };
+  return { activeTab };
 };
 
 const mapDispatchToProps = (dispatch: any): DispatchProps =>

frontend/app/components/shared/SharePopup/SharePopup.tsx

@@ -28,7 +28,6 @@ const SharePopup = ({
 }) => {
   const { store } = React.useContext(PlayerContext);
   const { showModal, hideModal } = useModal();
-
   const openModal = () => {
     showModal(
       <ShareModal
@@ -49,7 +48,6 @@ const SharePopup = ({
 
 
 interface Props {
-  sessionId: string;
   tenantId: string;
   showCopyLink?: boolean;
   hideModal: () => void;
@@ -57,12 +55,12 @@ interface Props {
 }
 
 function ShareModalComp({
-  sessionId,
   showCopyLink,
   hideModal,
   time,
 }: Props) {
-  const { integrationsStore } = useStore();
+  const { integrationsStore, sessionStore } = useStore();
+  const sessionId = sessionStore.current.sessionId
   const channels = integrationsStore.slack.list;
   const slackLoaded = integrationsStore.slack.loaded;
   const msTeamsChannels = integrationsStore.msteams.list;
@@ -267,10 +265,9 @@ function ShareModalComp({
 }
 
 const mapStateToProps = (state: Record<string, any>) => ({
-  sessionId: state.getIn(['sessions', 'current']).sessionId,
   tenantId: state.getIn(['user', 'account', 'tenantId']),
 });
 
-const ShareModal = connect(mapStateToProps)(ShareModalComp);
+const ShareModal = connect(mapStateToProps)(observer(ShareModalComp));
 
 export default observer(SharePopup);

frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx

@@ -1,7 +1,6 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import ErrorFrame from '../ErrorFrame/ErrorFrame';
 import { Button, Icon } from 'UI';
-import { connect } from 'react-redux';
 import { observer } from 'mobx-react-lite';
 import { useStore } from 'App/mstore';
 
@@ -12,13 +11,13 @@ interface Props {
     sourcemapUploaded?: boolean;
     errorStack?: any;
     message?: string;
-    sessionId: string;
     error: any;
 }
 function ErrorDetails(props: Props) {
-    const { errorStore } = useStore();
+    const { errorStore, sessionStore } = useStore();
+    const sessionId = sessionStore.current.sessionId;
     const errorStack = errorStore.instanceTrace;
-    const { error, sessionId, message = '', sourcemapUploaded = false } = props;
+    const { error, message = '', sourcemapUploaded = false } = props;
     const [showRaw, setShowRaw] = useState(false);
     const firstFunc = errorStack[0] && errorStack[0].function;
 
@@ -72,8 +71,4 @@ function ErrorDetails(props: Props) {
 }
 
 ErrorDetails.displayName = 'ErrorDetails';
-export default connect(
-    (state: any) => ({
-        sessionId: state.getIn(['sessions', 'current']).sessionId,
-    })
-)(observer(ErrorDetails));
+export default observer(ErrorDetails);

frontend/app/components/ui/NoSessionPermission/NoSessionPermission.tsx

@@ -17,15 +17,16 @@ const SESSIONS_ROUTE = sessionsRoute();
 const ASSIST_ROUTE = assistRoute();
 
 interface Props extends RouteComponentProps {
-  session: any;
   history: any;
-  sessionPath: any;
-  isAssist: boolean;
+  isLive?: boolean;
 }
 function NoSessionPermission(props: Props) {
-  const { projectsStore } = useStore();
+  const { projectsStore, sessionStore } = useStore();
+  const session = sessionStore.current;
+  const sessionPath = sessionStore.sessionPath;
+  const isAssist = window.location.pathname.includes('/assist/');
   const siteId = projectsStore.siteId!;
-  const { session, history, sessionPath, isAssist } = props;
+  const { history } = props;
 
   const backHandler = () => {
     if (
@@ -70,12 +71,5 @@ function NoSessionPermission(props: Props) {
 }
 
 export default withRouter(
-  connect((state: any) => {
-    const isAssist = window.location.pathname.includes('/assist/');
-    return {
-      isAssist,
-      session: state.getIn(['sessions', 'current']),
-      sessionPath: state.getIn(['sessions', 'sessionPath']),
-    };
-  })(observer(NoSessionPermission))
+  observer(NoSessionPermission)
 );