feat: handle forbidden request error.

src/components/Dashboard/PrivatePagesProvider.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import * as R from 'ramda';
 
-import { AuthenticatedUser } from './AuthenticatedUser';
 import { DashboardBoot } from '../../components';
 
 import withDashboard from '../../containers/Dashboard/withDashboard';
@@ -16,11 +15,10 @@ function PrivatePagesProviderComponent({
   children,
 }) {
   return (
-    <AuthenticatedUser>
+    <React.Fragment>
       <DashboardBoot />
-
       {splashScreenCompleted ? children : null}
-    </AuthenticatedUser>
+    </React.Fragment>
   );
 }
 

src/components/Dashboard/TopbarUser.js

@@ -14,10 +14,14 @@ import { firstLettersArgs } from 'utils';
 import { useAuthActions } from 'hooks/state';
 
 import withDialogActions from 'containers/Dialog/withDialogActions';
-import { compose } from 'utils';
 import withSubscriptions from '../../containers/Subscriptions/withSubscriptions';
-import { useAuthenticatedUser } from './AuthenticatedUser';
 
+import { useAuthenticatedAccount } from 'hooks/query'
+import { compose } from 'utils';
+
+/**
+ * Dashboard topbar user.
+ */
 function DashboardTopbarUser({
   openDialog,
 
@@ -28,7 +32,7 @@ function DashboardTopbarUser({
   const { setLogout } = useAuthActions();
 
   // Retrieve authenticated user information.
-  const { user } = useAuthenticatedUser();
+  const { data: user } = useAuthenticatedAccount();
 
   const onClickLogout = () => {
     setLogout();

src/components/Sidebar/SidebarHead.js

@@ -3,7 +3,7 @@ import { Button, Popover, Menu, Position } from '@blueprintjs/core';
 import Icon from 'components/Icon';
 import { compose, firstLettersArgs } from 'utils';
 import withCurrentOrganization from '../../containers/Organization/withCurrentOrganization';
-import { useAuthenticatedUser } from '../Dashboard/AuthenticatedUser';
+import { useAuthenticatedAccount } from '../../hooks/query';
 
 // Popover modifiers.
 const POPOVER_MODIFIERS = {
@@ -18,7 +18,7 @@ function SidebarHead({
   organization,
 }) {
   // Retrieve authenticated user information.
-  const { user } = useAuthenticatedUser();
+  const { data: user } = useAuthenticatedAccount();
 
   return (
     <div className="sidebar__head">

src/containers/GlobalErrors/GlobalErrors.js

@@ -1,7 +1,5 @@
-import React from 'react';
 import { Intent } from '@blueprintjs/core';
 import intl from 'react-intl-universal';
-import { useHistory } from 'react-router-dom';
 import AppToaster from 'components/AppToaster';
 
 import withGlobalErrors from './withGlobalErrors';
@@ -30,7 +28,6 @@ function GlobalErrors({
       toastKeySessionExpired,
     );
   }
-
   if (globalErrors.session_expired) {
     toastKeySomethingWrong = AppToaster.show(
       {
@@ -43,6 +40,18 @@ function GlobalErrors({
       toastKeySomethingWrong,
     );
   }
+  if (globalErrors.access_denied) {
+    toastKeySomethingWrong = AppToaster.show(
+      {
+        message: 'You do not have permissions to access this page.',
+        intent: Intent.DANGER,
+        onDismiss: () => {
+          globalErrorsSet({ access_denied: false });
+        },
+      },
+      toastKeySomethingWrong,
+    );
+  }
   return null;
 }