diff --git a/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx b/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx
index eb25b069e..d2df0431d 100644
--- a/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx
+++ b/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}
/>
diff --git a/frontend/app/components/Dashboard/NewDashboard.tsx b/frontend/app/components/Dashboard/NewDashboard.tsx
index 106852923..89af30897 100644
--- a/frontend/app/components/Dashboard/NewDashboard.tsx
+++ b/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));
diff --git a/frontend/app/components/hocs/withPermissions.js b/frontend/app/components/hocs/withPermissions.js
index b1c368712..1f4e6ade8 100644
--- a/frontend/app/components/hocs/withPermissions.js
+++ b/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) ?
-