From af92d629474b292b231724ce179c58565650cdf0 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Gr=C3=A9goire=20Aubert?= <gregoire.aubert@sonarsource.com>
Date: Wed, 4 Apr 2018 09:22:11 +0200
Subject: [PATCH] SONAR-10481 Fix bad display of organization navigation bar

---
 .../components/nav/component/ComponentNav.css |  4 ---
 .../navigation/OrganizationNavigation.tsx     |  8 +++--
 .../OrganizationNavigation-test.tsx.snap      | 36 ++++++++++---------
 .../main/js/components/nav/ContextNavBar.css  |  5 +++
 4 files changed, 30 insertions(+), 23 deletions(-)

diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
index 6b87dcbcb6e..2362ba94a4e 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
+++ b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
@@ -17,10 +17,6 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-.navbar-context-justified {
-  display: flex;
-  justify-content: space-between;
-}
 
 .navbar-context-branches {
   display: inline-flex;
diff --git a/server/sonar-web/src/main/js/apps/organizations/navigation/OrganizationNavigation.tsx b/server/sonar-web/src/main/js/apps/organizations/navigation/OrganizationNavigation.tsx
index bbcca4c8768..636dc6cf0a1 100644
--- a/server/sonar-web/src/main/js/apps/organizations/navigation/OrganizationNavigation.tsx
+++ b/server/sonar-web/src/main/js/apps/organizations/navigation/OrganizationNavigation.tsx
@@ -33,9 +33,11 @@ interface Props {
 
 export default function OrganizationNavigation({ organization, location }: Props) {
   return (
-    <ContextNavBar id="context-navigation" height={theme.contextNavHeightRaw}>
-      <OrganizationNavigationHeaderContainer organization={organization} />
-      <OrganizationNavigationMeta organization={organization} />
+    <ContextNavBar height={theme.contextNavHeightRaw} id="context-navigation">
+      <div className="navbar-context-justified">
+        <OrganizationNavigationHeaderContainer organization={organization} />
+        <OrganizationNavigationMeta organization={organization} />
+      </div>
       <OrganizationNavigationMenu location={location} organization={organization} />
     </ContextNavBar>
   );
diff --git a/server/sonar-web/src/main/js/apps/organizations/navigation/__tests__/__snapshots__/OrganizationNavigation-test.tsx.snap b/server/sonar-web/src/main/js/apps/organizations/navigation/__tests__/__snapshots__/OrganizationNavigation-test.tsx.snap
index 07512698807..58a0d30113b 100644
--- a/server/sonar-web/src/main/js/apps/organizations/navigation/__tests__/__snapshots__/OrganizationNavigation-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/organizations/navigation/__tests__/__snapshots__/OrganizationNavigation-test.tsx.snap
@@ -5,24 +5,28 @@ exports[`render 1`] = `
   height={72}
   id="context-navigation"
 >
-  <Connect(OrganizationNavigationHeader)
-    organization={
-      Object {
-        "key": "foo",
-        "name": "Foo",
-        "projectVisibility": "public",
+  <div
+    className="navbar-context-justified"
+  >
+    <Connect(OrganizationNavigationHeader)
+      organization={
+        Object {
+          "key": "foo",
+          "name": "Foo",
+          "projectVisibility": "public",
+        }
       }
-    }
-  />
-  <Connect(OrganizationNavigationMeta)
-    organization={
-      Object {
-        "key": "foo",
-        "name": "Foo",
-        "projectVisibility": "public",
+    />
+    <Connect(OrganizationNavigationMeta)
+      organization={
+        Object {
+          "key": "foo",
+          "name": "Foo",
+          "projectVisibility": "public",
+        }
       }
-    }
-  />
+    />
+  </div>
   <OrganizationNavigationMenu
     location={
       Object {
diff --git a/server/sonar-web/src/main/js/components/nav/ContextNavBar.css b/server/sonar-web/src/main/js/components/nav/ContextNavBar.css
index 8c9ff6a53bb..f4116968f6b 100644
--- a/server/sonar-web/src/main/js/components/nav/ContextNavBar.css
+++ b/server/sonar-web/src/main/js/components/nav/ContextNavBar.css
@@ -32,6 +32,11 @@
   border-bottom: none;
 }
 
+.navbar-context-justified {
+  display: flex;
+  justify-content: space-between;
+}
+
 /* use `min-width: 0` to cut breadcrumb links (to end with "...") */
 /* https://stackoverflow.com/questions/38223879/white-space-nowrap-breaks-flexbox-layout */
 .navbar-context-header {
-- 
2.39.5