From e90d23d522e9a7bde5cc5ef4c245c2a46ed10d29 Mon Sep 17 00:00:00 2001
From: Michael Lange <dingoeatingfuzz@gmail.com>
Date: Fri, 22 Jan 2021 12:37:48 -0800
Subject: [PATCH 1/2] Use the same prefix pattern from the region switcher for
 the namespace switcher

---
 ui/app/templates/components/gutter-menu.hbs | 6 +-----
 ui/tests/acceptance/job-detail-test.js      | 3 +--
 ui/tests/acceptance/namespaces-test.js      | 8 ++++++--
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/ui/app/templates/components/gutter-menu.hbs b/ui/app/templates/components/gutter-menu.hbs
index acafdc6ccb29..74d130471ce4 100644
--- a/ui/app/templates/components/gutter-menu.hbs
+++ b/ui/app/templates/components/gutter-menu.hbs
@@ -37,11 +37,7 @@
                 @tagName="div"
                 @class="namespace-switcher"
                 as |namespace|>
-                {{#if (eq namespace.name "default")}}
-                  Default Namespace
-                {{else}}
-                  {{namespace.name}}
-                {{/if}}
+                <span class="ember-power-select-prefix">Namespace: </span>{{namespace.name}}
               </PowerSelect>
             </div>
           </li>
diff --git a/ui/tests/acceptance/job-detail-test.js b/ui/tests/acceptance/job-detail-test.js
index 0bbcaa117972..a086dfe176a3 100644
--- a/ui/tests/acceptance/job-detail-test.js
+++ b/ui/tests/acceptance/job-detail-test.js
@@ -130,12 +130,11 @@ module('Acceptance | job detail (with namespaces)', function(hooks) {
   test('when switching namespaces, the app redirects to /jobs with the new namespace', async function(assert) {
     const namespace = server.db.namespaces.find(job.namespaceId);
     const otherNamespace = server.db.namespaces.toArray().find(ns => ns !== namespace).name;
-    const label = otherNamespace === 'default' ? 'Default Namespace' : otherNamespace;
 
     await JobDetail.visit({ id: job.id, namespace: namespace.name });
 
     // TODO: Migrate to Page Objects
-    await selectChoose('[data-test-namespace-switcher]', label);
+    await selectChoose('[data-test-namespace-switcher]', otherNamespace);
     assert.equal(currentURL().split('?')[0], '/jobs', 'Navigated to /jobs');
 
     const jobs = server.db.jobs
diff --git a/ui/tests/acceptance/namespaces-test.js b/ui/tests/acceptance/namespaces-test.js
index 3dfd09ab76d0..61ae497ec80e 100644
--- a/ui/tests/acceptance/namespaces-test.js
+++ b/ui/tests/acceptance/namespaces-test.js
@@ -69,7 +69,7 @@ module('Acceptance | namespaces (enabled)', function(hooks) {
     );
     assert.equal(
       JobsList.namespaceSwitcher.options.objectAt(0).label,
-      'Default Namespace',
+      'Namespace: default',
       'The first namespace is always the default one'
     );
 
@@ -79,7 +79,11 @@ module('Acceptance | namespaces (enabled)', function(hooks) {
       if (index === 0) return;
 
       const namespace = sortedNamespaces[index - 1];
-      assert.equal(option.label, namespace.name, `index ${index}: ${namespace.name}`);
+      assert.equal(
+        option.label,
+        `Namespace: ${namespace.name}`,
+        `index ${index}: ${namespace.name}`
+      );
     });
   });
 

From ee58aeaceb7139a95504217baaefafafd21decab Mon Sep 17 00:00:00 2001
From: Michael Lange <dingoeatingfuzz@gmail.com>
Date: Fri, 22 Jan 2021 12:38:17 -0800
Subject: [PATCH 2/2] Clip long namespace names but make sure to keep the full
 name in the title attribute

---
 ui/app/styles/components/dropdown.scss      | 1 +
 ui/app/templates/components/gutter-menu.hbs | 1 +
 2 files changed, 2 insertions(+)

diff --git a/ui/app/styles/components/dropdown.scss b/ui/app/styles/components/dropdown.scss
index f68e704e4e80..550c3582ff87 100644
--- a/ui/app/styles/components/dropdown.scss
+++ b/ui/app/styles/components/dropdown.scss
@@ -122,6 +122,7 @@
 .ember-power-select-selected-item,
 .dropdown-item {
   text-overflow: ellipsis;
+  overflow: hidden;
   white-space: nowrap;
 }
 
diff --git a/ui/app/templates/components/gutter-menu.hbs b/ui/app/templates/components/gutter-menu.hbs
index 74d130471ce4..3fc455fe7b94 100644
--- a/ui/app/templates/components/gutter-menu.hbs
+++ b/ui/app/templates/components/gutter-menu.hbs
@@ -36,6 +36,7 @@
                 @onChange={{action this.gotoJobsForNamespace}}
                 @tagName="div"
                 @class="namespace-switcher"
+                title={{this.system.activeNamespace.name}}
                 as |namespace|>
                 <span class="ember-power-select-prefix">Namespace: </span>{{namespace.name}}
               </PowerSelect>