feat(Header): Remove notification bell (#630)

* feat(Header): Remove notification bell * Update snapshots
seek-oss · Jun 5, 2019 · f39ddd6 · f39ddd6
1 parent 92dfa10
commit f39ddd6
Show file tree

Hide file tree

Showing 14 changed files with 279 additions and 569 deletions.
diff --git a/react/BellIcon/BellIcon.js b/react/BellIcon/BellIcon.js
diff --git a/react/BellIcon/BellIcon.svg b/react/BellIcon/BellIcon.svg
diff --git a/react/Header/Header.less b/react/Header/Header.less
@@ -155,7 +155,3 @@
     display: inline-block;
   }
 }
-
-.bellWrapper {
-  display: inline-block;
-}
diff --git a/react/Header/NotificationsLink/NotificationsLink.js b/react/Header/NotificationsLink/NotificationsLink.js
diff --git a/react/Header/NotificationsLink/NotificationsLink.less b/react/Header/NotificationsLink/NotificationsLink.less
diff --git a/react/Header/NotificationsLink/NotificationsLink.test.js b/react/Header/NotificationsLink/NotificationsLink.test.js
diff --git a/react/Header/NotificationsLink/NotificationsLinkContainer.js b/react/Header/NotificationsLink/NotificationsLinkContainer.js
diff --git a/react/Header/NotificationsLink/__snapshots__/NotificationsLink.test.js.snap b/react/Header/NotificationsLink/__snapshots__/NotificationsLink.test.js.snap
diff --git a/react/Header/NotificationsLink/constants.js b/react/Header/NotificationsLink/constants.js
diff --git a/react/Header/NotificationsLink/utils.js b/react/Header/NotificationsLink/utils.js
diff --git a/react/Header/NotificationsLink/utils.test.js b/react/Header/NotificationsLink/utils.test.js
diff --git a/react/Header/UserAccount/UserAccount.js b/react/Header/UserAccount/UserAccount.js
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import ChevronIcon from '../../ChevronIcon/ChevronIcon';
 import Hidden from '../../Hidden/Hidden';
-import NotificationsLinkContainer from '../NotificationsLink/NotificationsLinkContainer';
 import ScreenReaderOnly from '../../ScreenReaderOnly/ScreenReaderOnly';
 import UserAccountMenu from '../UserAccountMenu/UserAccountMenu';
 import {
@@ -106,37 +105,30 @@ export default class UserAccount extends Component {
           </label>
         </div>
 
-        <div className={styles.accountContainer}>
-          <NotificationsLinkContainer
-            authenticationStatus={authenticationStatus}
-            linkRenderer={linkRenderer}
+        <label
+          data-automation="user-account-menu-toggle"
+          className={styles.toggleLabel}
+          htmlFor="user-account-menu-toggle"
+        >
+          <ScreenReaderOnly>Show user menu</ScreenReaderOnly>
+          <span data-hj-masked={true}>
+            <Hidden desktop className={styles.menuLabel}>
+              {mobileMenuLabel}
+            </Hidden>
+            <Hidden
+              mobile
+              className={styles.menuLabel}
+              data-automation="user-account-name"
+            >
+              {desktopMenuLabel}
+            </Hidden>
+          </span>
+          <ChevronIcon
+            direction="down"
+            className={styles.chevron}
+            svgClassName={styles.chevronSvg}
           />
-
-          <label
-            data-automation="user-account-menu-toggle"
-            className={styles.toggleLabel}
-            htmlFor="user-account-menu-toggle"
-          >
-            <ScreenReaderOnly>Show user menu</ScreenReaderOnly>
-            <span data-hj-masked={true}>
-              <Hidden desktop className={styles.menuLabel}>
-                {mobileMenuLabel}
-              </Hidden>
-              <Hidden
-                mobile
-                className={styles.menuLabel}
-                data-automation="user-account-name"
-              >
-                {desktopMenuLabel}
-              </Hidden>
-            </span>
-            <ChevronIcon
-              direction="down"
-              className={styles.chevron}
-              svgClassName={styles.chevronSvg}
-            />
-          </label>
-        </div>
+        </label>
 
         <div onClick={this.handleMenuClick} className={styles.toggleContainer}>
           <UserAccountMenu

diff --git a/react/Header/UserAccount/UserAccount.less b/react/Header/UserAccount/UserAccount.less
@@ -7,11 +7,6 @@
   }
 }
 
-.accountContainer {
-  display: flex;
-  align-items: center;
-}
-
 .toggleLabel {
   .touchableText();
   display: flex;
@@ -107,12 +102,12 @@
   text-overflow: ellipsis;
   display: inline-block;
   white-space: nowrap;
-  max-width: 90px; // ~ 10 characters
+  max-width: 120px; // ~ 12 characters
   @media only screen and (min-width: 385px) {
-    max-width: 150px; // ~ 16 characters
+    max-width: 170px; // ~ 18 characters
   }
   @media only screen and (min-width: 435px) {
-    max-width: 200px; // ~ 20 characters
+    max-width: 220px; // ~ 22 characters
   }
 }