fix(ui) - permission check updates

frontend/app/components/Client/Users/components/UserForm/UserForm.tsx

@@ -107,7 +107,7 @@ function UserForm(props: Props) {
                             options={ roles }
                             name="roleId"
                             defaultValue={ user.roleId }
-                            onChange={({ value }) => user.updateKey('roleId', value)}
+                            onChange={({ value }) => user.updateKey('roleId', value.value)}
                             className="block"
                             isDisabled={user.isSuperAdmin}
                         />

frontend/app/components/Dashboard/NewDashboard.tsx

@@ -7,6 +7,7 @@ import { Loader } from 'UI';
 import DashboardRouter from './components/DashboardRouter';
 import cn from 'classnames';
 import { withSiteId } from 'App/routes';
+import withPermissions from 'HOCs/withPermissions'
 
 function NewDashboard(props: RouteComponentProps<{}>) {
     const { history, match: { params: { siteId, dashboardId, metricId } } } = props;
@@ -27,7 +28,6 @@ function NewDashboard(props: RouteComponentProps<{}>) {
                 props.history.push(withSiteId('/dashboard', siteId));
             })
         }
-
     }, [siteId]);
 
     return useObserver(() => (
@@ -49,4 +49,4 @@ function NewDashboard(props: RouteComponentProps<{}>) {
     ));
 }
 
-export default withRouter(NewDashboard);
+export default withRouter(withPermissions(['METRICS'])(NewDashboard));

frontend/app/components/hocs/withPermissions.js

@@ -1,22 +1,34 @@
-import React from 'react';
-import { connect } from 'react-redux';
-import { NoPermission, NoSessionPermission } from 'UI';
+import React from "react";
+import { connect } from "react-redux";
+import { NoPermission, NoSessionPermission } from "UI";
 
-export default (requiredPermissions, className, isReplay = false) => BaseComponent => 
-@connect((state, props) => ({
-  permissions: state.getIn([ 'user', 'account', 'permissions' ]) || [],
-  isEnterprise: state.getIn([ 'user', 'account', 'edition' ]) === 'ee',
-}))
-class extends React.PureComponent {
-  render() {
-    const hasPermission = requiredPermissions.every(permission => this.props.permissions.includes(permission));
+export default (requiredPermissions, className, isReplay = false) =>
+    (BaseComponent) =>
+        (
+            @connect((state, props) => ({
+                permissions:
+                    state.getIn(["user", "account", "permissions"]) || [],
+                isEnterprise:
+                    state.getIn(["user", "account", "edition"]) === "ee",
+            }))
+            class extends React.PureComponent {
+                render() {
+                    const hasPermission = requiredPermissions.every(
+                        (permission) =>
+                            this.props.permissions.includes(permission)
+                    );
 
-    return (
-      (!this.props.isEnterprise || hasPermission) ?
-      <BaseComponent {...this.props} /> :
-      <div className={className}>
-        { isReplay ? <NoSessionPermission /> : <NoPermission /> }
-      </div>
-    )
-  }
-}
+                    return !this.props.isEnterprise || hasPermission ? (
+                        <BaseComponent {...this.props} />
+                    ) : (
+                        <div className={className}>
+                            {isReplay ? (
+                                <NoSessionPermission />
+                            ) : (
+                                <NoPermission />
+                            )}
+                        </div>
+                    );
+                }
+            }
+        );

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

@@ -1,27 +1,77 @@
-import React from 'react';
-import stl from './NoSessionPermission.module.css'
-import { Icon, Button, Link } from 'UI';
-import { connect } from 'react-redux';
+import React from "react";
+import stl from "./NoSessionPermission.module.css";
+import { Icon, Button, Link } from "UI";
+import { connect } from "react-redux";
+import {
+    sessions as sessionsRoute,
+    assist as assistRoute,
+    withSiteId,
+} from "App/routes";
+import { withRouter, RouteComponentProps } from "react-router-dom";
+const SESSIONS_ROUTE = sessionsRoute();
+const ASSIST_ROUTE = assistRoute();
 
-interface Props {
-  session: any
+interface Props extends RouteComponentProps {
+    session: any;
+    siteId: string;
+    history: any;
+    sessionPath: any;
+    isAssist: boolean;
 }
-function NoSessionPermission({ session }: Props) {
-  return (
-    <div className={stl.wrapper}>
-      <Icon name="shield-lock" size="50" className="py-16"/>
-      <div className={ stl.title }>Not allowed</div>
-      { session.isLive ? 
-        <span>This session is still live, and you don’t have the necessary permissions to access this feature. Please check with your admin.</span> :
-        <span>You don’t have the necessary permissions to access this feature. Please check with your admin.</span>
-      }
-      <Link to="/">
-        <Button variant="primary" className="mt-6">GO BACK</Button>
-      </Link>
-    </div>
-  );
+function NoSessionPermission(props: Props) {
+    const { session, history, siteId, sessionPath, isAssist } = props;
+
+    const backHandler = () => {
+        if (
+            sessionPath.pathname === history.location.pathname ||
+            sessionPath.pathname.includes("/session/") ||
+            isAssist
+        ) {
+            history.push(
+                withSiteId(isAssist ? ASSIST_ROUTE : SESSIONS_ROUTE, siteId)
+            );
+        } else {
+            history.push(
+                sessionPath
+                    ? sessionPath.pathname + sessionPath.search
+                    : withSiteId(SESSIONS_ROUTE, siteId)
+            );
+        }
+    };
+
+    return (
+        <div className={stl.wrapper}>
+            <Icon name="shield-lock" size="50" className="py-16" />
+            <div className={stl.title}>Not allowed</div>
+            {session.isLive ? (
+                <span>
+                    This session is still live, and you don’t have the necessary
+                    permissions to access this feature. Please check with your
+                    admin.
+                </span>
+            ) : (
+                <span>
+                    You don’t have the necessary permissions to access this
+                    feature. Please check with your admin.
+                </span>
+            )}
+            {/* <Link to="/"> */}
+            <Button variant="primary" onClick={backHandler} className="mt-6">
+                GO BACK
+            </Button>
+            {/* </Link> */}
+        </div>
+    );
 }
 
-export default connect(state => ({
-  session: state.getIn([ 'sessions', 'current' ]),
-}))(NoSessionPermission);
+export default withRouter(
+    connect((state: any) => {
+        const isAssist = window.location.pathname.includes("/assist/");
+        return {
+            isAssist,
+            session: state.getIn(["sessions", "current"]),
+            siteId: state.getIn(["site", "siteId"]),
+            sessionPath: state.getIn(["sessions", "sessionPath"]),
+        };
+    })(NoSessionPermission)
+);

frontend/app/player/MessageDistributor/MessageDistributor.ts

@@ -115,7 +115,7 @@ export default class MessageDistributor extends StatedScreen {
 
       eventList.forEach(e => {
         if (e.type === EVENT_TYPES.LOCATION) { //TODO type system
-          this.locationEventManager.append(e);
+          this.locationEventManager.append(e); 
         }
       });
       this.session.errors.forEach(e => {