Merge branch 'featrue/roles-permission' of https://github.com/bigcapitalhq/client into featrue/roles-permission

src/components/Dashboard/DashboardBoot.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import * as R from 'ramda';
 import {
   useAuthenticatedAccount,
   useCurrentOrganization,
@@ -10,9 +9,9 @@ import { useWatch, useWatchImmediate, useWhen } from '../../hooks';
 import { setCookie, getCookie } from '../../utils';
 
 /**
- * Boots dashboard meta.
+ * Dashboard meta async booting.
  */
-function useDashboardMetaBoot() {
+export function useDashboardMetaBoot() {
   const {
     data: dashboardMeta,
     isLoading: isDashboardMetaLoading,
@@ -28,12 +27,26 @@ function useDashboardMetaBoot() {
   useWatchImmediate(() => {
     isDashboardMetaSuccess && stopLoading();
   }, isDashboardMetaSuccess);
+
+  return {
+    isLoading: isDashboardMetaLoading,
+  };
 }
 
 /**
  * Dashboard async booting.
+ * @returns {{ isLoading: boolean }}
  */
-export function DashboardBoot({ authenticatedUserId }) {
+export function useDashboardBoot() {
+  const { isLoading } = useDashboardMetaBoot();
+
+  return { isLoading };
+}
+
+/**
+ * Application async booting.
+ */
+export function useApplicationBoot() {
   // Fetches the current user's organization.
   const {
     isSuccess: isCurrentOrganizationSuccess,
@@ -45,8 +58,6 @@ export function DashboardBoot({ authenticatedUserId }) {
   const { isSuccess: isAuthUserSuccess, isLoading: isAuthUserLoading } =
     useAuthenticatedAccount();
 
-  useDashboardMetaBoot();
-
   // Initial locale cookie value.
   const localeCookie = getCookie('locale');
 
@@ -109,5 +120,8 @@ export function DashboardBoot({ authenticatedUserId }) {
       isBooted.current = true;
     },
   );
-  return null;
+
+  return {
+    isLoading: isOrgLoading || isAuthUserLoading,
+  };
 }

src/components/Dashboard/DashboardProvider.js

@@ -1,9 +1,16 @@
 import React from 'react';
 import { DashboardAbilityProvider } from '../../components';
+import { useDashboardBoot } from './DashboardBoot';
 
 /**
  * Dashboard provider.
  */
 export default function DashboardProvider({ children }) {
-  return <DashboardAbilityProvider>{children}</DashboardAbilityProvider>;
+  const { isLoading } = useDashboardBoot();
+
+  return (
+    <DashboardAbilityProvider>
+      {isLoading ? null : children}
+    </DashboardAbilityProvider>
+  );
 }

src/components/Dashboard/PrivatePagesProvider.js

@@ -1,29 +1,15 @@
 import React from 'react';
-import * as R from 'ramda';
 
-import { DashboardBoot } from '../../components';
+import { useApplicationBoot } from '../../components';
-
-import withDashboard from '../../containers/Dashboard/withDashboard';
 
 /**
  * Private pages provider.
  */
-function PrivatePagesProviderComponent({
+export function PrivatePagesProvider({
-  splashScreenCompleted,
-
   // #ownProps
   children,
 }) {
-  return (
+  const { isLoading } = useApplicationBoot();
-    <React.Fragment>
-      <DashboardBoot />
-      {splashScreenCompleted ? children : null}
-    </React.Fragment>
-  );
-}
 
-export const PrivatePagesProvider = R.compose(
+  return <React.Fragment>{!isLoading ? children : null}</React.Fragment>;
-  withDashboard(({ splashScreenCompleted }) => ({
+}
-    splashScreenCompleted,
-  })),
-)(PrivatePagesProviderComponent);