Merge branch 'redux-toolkit-move' into rtm-temp

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

@@ -18,7 +18,7 @@ interface Tag {
 }
 
 interface StateProps {
-  total: number;
+
 }
 
 type Props = StateProps;
@@ -31,8 +31,9 @@ const tagIcons = {
   [types.CRASH]: <Skull size={14} />,
 } as Record<string, any>;
 
-const SessionTags: React.FC<Props> = ({ total }) => {
-  const { projectsStore, searchStore } = useStore();
+const SessionTags: React.FC<Props> = ({ activeTab, setActiveTab }) => {
+  const { projectsStore, sessionStore } = useStore();
+  const total = sessionStore.total;
   const platform = projectsStore.active?.platform || '';
   const disable = searchStore.activeTab.type === 'all' && total === 0;
   const activeTab = searchStore.activeTab;
@@ -117,11 +118,4 @@ export const TagItem: React.FC<{
   </button>
 ));
 
-const mapStateToProps = (state: any): StateProps => {
-  const total = state.getIn(['sessions', 'total']) || 0;
-  return { total };
-};
-
-export default connect(
-  mapStateToProps
-)(observer(SessionTags));
+export default observer(SessionTags);

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)
 );