From ef80c8def0de5b8abea91c64a71a7b459aa04596 Mon Sep 17 00:00:00 2001
From: Matthieu Foucault <matthieu@button.is>
Date: Tue, 14 Dec 2021 08:32:01 -0800
Subject: [PATCH] feat: DefaultLayout passes `isAdmin` to Navigation

---
 app/components/Layout/DefaultLayout.tsx | 10 +++++++++-
 app/components/Layout/Navigation.tsx    |  4 +++-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/components/Layout/DefaultLayout.tsx b/app/components/Layout/DefaultLayout.tsx
index 5332f0e09c..80aa03a670 100644
--- a/app/components/Layout/DefaultLayout.tsx
+++ b/app/components/Layout/DefaultLayout.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useMemo } from "react";
 import Grid from "@button-inc/bcgov-theme/Grid";
 import { graphql, useFragment } from "react-relay";
 import type { DefaultLayout_session$key } from "DefaultLayout_session.graphql";
@@ -7,6 +7,7 @@ import Navigation from "components/Layout/Navigation";
 import Footer from "components/Layout/Footer";
 import SiteNoticeBanner from "components/Layout/SiteNoticeBanner";
 import UserProfile from "components/User/UserProfile";
+import { ADMIN_ROLES } from "data/group-constants";
 
 const runtimeConfig = getConfig()?.publicRuntimeConfig ?? {};
 
@@ -28,15 +29,22 @@ const DefaultLayout: React.FC<Props> = ({
         cifUserBySub {
           ...UserProfile_user
         }
+        userGroups
       }
     `,
     sessionFragment
   );
 
+  const isAdmin = useMemo(
+    () => ADMIN_ROLES.some((role) => session?.userGroups?.includes(role)),
+    [session?.userGroups]
+  );
+
   return (
     <div id="page-wrap">
       <Navigation
         isLoggedIn={Boolean(session)}
+        isAdmin={isAdmin}
         title={title}
         userProfileComponent={
           <UserProfile user={session ? session.cifUserBySub : null} />
diff --git a/app/components/Layout/Navigation.tsx b/app/components/Layout/Navigation.tsx
index 7866aadcec..fb62661468 100644
--- a/app/components/Layout/Navigation.tsx
+++ b/app/components/Layout/Navigation.tsx
@@ -7,6 +7,7 @@ import SubHeader from "./SubHeader";
 
 interface Props {
   isLoggedIn?: boolean;
+  isAdmin?: boolean;
   children?: React.ReactNode;
   title?: string;
   userProfileComponent?: React.ReactNode;
@@ -16,6 +17,7 @@ const DEFAULT_MOBILE_BREAK_POINT = "900";
 
 const Navigation: React.FC<Props> = ({
   isLoggedIn = false,
+  isAdmin = false,
   title = "CleanBC Industry Fund",
   userProfileComponent,
 }) => {
@@ -60,7 +62,7 @@ const Navigation: React.FC<Props> = ({
             {rightSide}
           </BaseHeader.Group>
         </BaseHeader>
-        {isLoggedIn && <SubHeader />}
+        {isLoggedIn && <SubHeader isAdmin={isAdmin} />}
       </BaseNavigation>
       <style jsx>{`
         h1 {