feat(navigation): hide/show account depending on data

packages/my-joy-navigation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "my-joy-navigation",
-  "version": "2.3.3",
+  "version": "2.4.0",
   "private": true,
   "license": "MPL-2.0",
   "main": "lib/index.js",

packages/my-joy-navigation/src/header.js

@@ -33,20 +33,19 @@ const GetHeader = gql`
   }
 `;
 
-// Needs to be revised
+const GetAccount = gql`
-// const GetAccount = gql`
+  {
-//   {
+    datacenter {
-//     datacenter {
+      name
-//       name
+    }
-//     }
+    account {
-//     account {
+      login
-//       login
+    }
-//     }
+  }
-//   }
+`;
-// `;
 
 const Navigation = ({
-  login,
+  account = {},
   datacenter = true,
   toggleSectionOpen,
   isOpen,
@@ -86,17 +85,18 @@ const Navigation = ({
         </HeaderItem>
       ) : null}
       {datacenter ? <HeaderDividerItem /> : null}
+      {account.login ? (
         <HeaderItem>
           <HeaderItemContent>
             <HeaderItemSubContent>Account:</HeaderItemSubContent>
             <HeaderSpace />
-          Raul Millais
+            {`${account.login}`}
           </HeaderItemContent>
           <HeaderItemIcon>
             <Avatar />
           </HeaderItemIcon>
         </HeaderItem>
-      )
+      ) : null}
     </HeaderRow>
     {keys(Overlays).map(panelName =>
       React.createElement(Overlays[panelName], {
@@ -107,23 +107,23 @@ const Navigation = ({
 );
 
 export default compose(
-  // graphql(GetAccount, {
+  graphql(GetAccount, {
-  //   options: () => ({
+    options: () => ({
-  //     ssr: false
+      ssr: false
-  //   }),
+    }),
-  //   props: ({ data }) => {
+    props: ({ data }) => {
-  //     const {
+      const {
-  //       account = {},
+        account = {},
-  //       datacenter = {},
+        datacenter = {},
-  //       loading = false,
+        loading = false,
-  //       error = null
+        error = null
-  //     } = data;
+      } = data;
-  //     const { login } = account;
-  //     const { name } = datacenter;
 
-  //     return { login, datacenter: name, loading, error };
+      const { name } = datacenter;
-  //   }
+
-  // }),
+      return { account, datacenter: name, loading, error };
+    }
+  }),
   graphql(GetHeader, {
     options: () => ({
       ssr: false