Show octant route history in the header

- Show descriptive page title
- Update octant content response to return empty namespace for non-namespaced resources
[vmware-archive#2472, vmware-archive#2640]

Signed-off-by: Vikram Yadav <yvikram@vmware.com>

changelogs/unreleased/2580-xtreme-vikram-yadav

@@ -0,0 +1 @@
+Added Octant route history dropdown and updated page title

internal/api/breadcrumb.go

@@ -39,6 +39,9 @@ func GenerateBreadcrumb(cm *ContentManager, contentPath string, state octant.Sta
 	parent, title := CreateNavigationBreadcrumb(navs, contentPath)
 	if title == nil {
 		return title
+	} else if parent.Title == "" {
+		title = append(title, component.NewText(path.Base(contentPath)))
+		return title
 	}
 
 	if strings.Contains(contentPath, crPath) {
@@ -76,6 +79,11 @@ func CreateNavigationBreadcrumb(navs []navigation.Navigation, contentPath string
 	var last LinkDefinition
 	var title []component.TitleComponent
 
+	if len(navs) == 1 && contentPath != navs[0].Path && strings.HasPrefix(contentPath, navs[0].Path) {
+		title = append(title, component.NewLink("", path.Base(navs[0].Title), path_util.PrefixedPath(navs[0].Path)))
+		return LinkDefinition{}, title
+	}
+
 	thisPath := contentPath
 	for {
 		if thisPath == "." { // done

internal/api/breadcrumb_test.go

@@ -10,12 +10,12 @@ import (
 	"path/filepath"
 	"testing"
 
-	"github.com/golang/mock/gomock"
 	"github.com/stretchr/testify/require"
 
 	"github.com/vmware-tanzu/octant/internal/api"
 	"github.com/vmware-tanzu/octant/internal/util/json"
 	"github.com/vmware-tanzu/octant/pkg/navigation"
+	"github.com/vmware-tanzu/octant/pkg/view/component"
 )
 
 func Test_NavigationFromPathNamespace(t *testing.T) {
@@ -94,8 +94,6 @@ func Test_NavigationFromPathNamespace(t *testing.T) {
 			expectedItems: 0,
 		},
 	}
-	controller := gomock.NewController(t)
-	defer controller.Finish()
 	data, err := ioutil.ReadFile(filepath.Join("testdata", "namespace_navigation.json"))
 	require.NoError(t, err)
 	var namespaceNavigation []navigation.Navigation
@@ -192,8 +190,6 @@ func Test_NavigationFromPathCluster(t *testing.T) {
 			expectedItems: 0,
 		},
 	}
-	controller := gomock.NewController(t)
-	defer controller.Finish()
 	data, err := ioutil.ReadFile(filepath.Join("testdata", "cluster_navigation.json"))
 	require.NoError(t, err)
 	var namespaceNavigation []navigation.Navigation
@@ -287,8 +283,6 @@ func Test_CreateNavigationBreadcrumbNamespace(t *testing.T) {
 			expectedItems: 0,
 		},
 	}
-	controller := gomock.NewController(t)
-	defer controller.Finish()
 	data, err := ioutil.ReadFile(filepath.Join("testdata", "namespace_navigation.json"))
 	require.NoError(t, err)
 	var namespaceNavigation []navigation.Navigation
@@ -377,8 +371,6 @@ func Test_CreateNavigationBreadcrumbCluster(t *testing.T) {
 			expectedItems: 0,
 		},
 	}
-	controller := gomock.NewController(t)
-	defer controller.Finish()
 	data, err := ioutil.ReadFile(filepath.Join("testdata", "cluster_navigation.json"))
 	require.NoError(t, err)
 	var namespaceNavigation []navigation.Navigation
@@ -399,3 +391,40 @@ func Test_CreateNavigationBreadcrumbCluster(t *testing.T) {
 		})
 	}
 }
+
+func Test_CreateNavigationBreadcrumbApplications(t *testing.T) {
+	data, err := ioutil.ReadFile(filepath.Join("testdata", "application_navigation.json"))
+	require.NoError(t, err)
+	var namespaceNavigation []navigation.Navigation
+
+	err = json.Unmarshal([]byte(data), &namespaceNavigation)
+	require.NoError(t, err)
+	require.Equal(t, 1, len(namespaceNavigation))
+
+	tests := []struct {
+		name          string
+		path          string
+		lastTitle     string
+		lastUrl       string
+		expectedTitle component.TitleComponent
+		expectedItems int
+	}{
+		{
+			name:          "Applications Detail Breadcumb",
+			path:          "workloads/namespace/milan/detail/simple-app",
+			expectedTitle: component.NewLink("", "Applications", "/workloads/namespace/milan"),
+			expectedItems: 1,
+		},
+	}
+
+	for _, test := range tests {
+		t.Run(test.name, func(t *testing.T) {
+			last, title := api.CreateNavigationBreadcrumb(namespaceNavigation, test.path)
+			require.Equal(t, test.expectedItems, len(title))
+			require.Equal(t, test.expectedTitle, title[0])
+			require.NotNil(t, title)
+			require.Equal(t, "", last.Title)
+			require.Equal(t, "", last.Url)
+		})
+	}
+}

internal/api/content_manager.go

@@ -168,7 +168,7 @@ func (cm *ContentManager) runUpdate(state octant.State, s api.OctantClient) Poll
 
 		if ctx.Err() == nil {
 			if content.Path == state.GetContentPath() {
-				s.Send(CreateContentEvent(content.Response, state.GetNamespace(), contentPath, state.GetQueryParams()))
+				s.Send(CreateContentEvent(content.Response, getNamespace(state, contentPath, cm), contentPath, state.GetQueryParams()))
 			}
 
 		}
@@ -346,3 +346,12 @@ func moduloIndex(key string, options [][]string) []string {
 	i := int(h.Sum32()) % len(options)
 	return options[i]
 }
+
+func getNamespace(state octant.State, contentPath string, cm *ContentManager) string {
+	m, ok := cm.moduleManager.ModuleForContentPath(contentPath)
+	if ok && m.Name() == "cluster-overview" {
+		return ""
+	}
+
+	return state.GetNamespace()
+}

internal/api/content_manager_test.go

@@ -76,7 +76,7 @@ func TestContentManager_GenerateContent(t *testing.T) {
 	octantClient.EXPECT().Send(contentEvent).AnyTimes()
 	octantClient.EXPECT().StopCh().Return(stopCh).AnyTimes()
 
-	moduleManager.EXPECT().ModuleForContentPath(gomock.Any()).Return(fakeModule, true)
+	moduleManager.EXPECT().ModuleForContentPath(gomock.Any()).Return(fakeModule, true).AnyTimes()
 	moduleManager.EXPECT().Navigation(gomock.Any(), "foo-namespace", "foo-module").Return([]navigation.Navigation{}, nil)
 	fakeModule.EXPECT().Name().Return("foo-module").AnyTimes()
 	fakeModule.EXPECT().Content(gomock.Any(), ".", gomock.Any()).
@@ -101,6 +101,53 @@ func TestContentManager_GenerateContent(t *testing.T) {
 	manager.Start(ctx, state, octantClient)
 }
 
+func TestContentManager_GenerateContent_ClusterOverviewNamespace(t *testing.T) {
+	controller := gomock.NewController(t)
+	defer controller.Finish()
+
+	params := map[string][]string{}
+	filters := []octant.Filter{{Key: "foo", Value: "bar"}}
+
+	dashConfig := configFake.NewMockDash(controller)
+	moduleManager := moduleFake.NewMockManagerInterface(controller)
+	fakeModule := moduleFake.NewMockModule(controller)
+	state := octantFake.NewMockState(controller)
+
+	dashConfig.EXPECT().CurrentContext().Return("foo-context")
+	state.EXPECT().GetClientID().Return("foo-client")
+	state.EXPECT().GetFilters().Return(filters).AnyTimes()
+	state.EXPECT().GetNamespace().Return("foo-namespace").AnyTimes()
+	state.EXPECT().GetQueryParams().Return(params).AnyTimes()
+	state.EXPECT().GetContentPath().Return(".").AnyTimes()
+	state.EXPECT().OnContentPathUpdate(gomock.Any()).DoAndReturn(func(fn octant.ContentPathUpdateFunc) octant.UpdateCancelFunc {
+		fn("foo")
+		return func() {}
+	})
+	octantClient := fake.NewMockOctantClient(controller)
+
+	stopCh := make(chan struct{}, 1)
+
+	contentResponse := component.ContentResponse{}
+	contentEvent := api.CreateContentEvent(contentResponse, "", ".", params)
+	octantClient.EXPECT().Send(contentEvent).AnyTimes()
+	octantClient.EXPECT().StopCh().Return(stopCh).AnyTimes()
+
+	moduleManager.EXPECT().ModuleForContentPath(gomock.Any()).Return(fakeModule, true).AnyTimes()
+	moduleManager.EXPECT().Navigation(gomock.Any(), "foo-namespace", "cluster-overview").Return([]navigation.Navigation{}, nil)
+	fakeModule.EXPECT().Name().Return("cluster-overview").AnyTimes()
+	fakeModule.EXPECT().Content(gomock.Any(), ".", gomock.Any()).Return(contentResponse, nil)
+
+	logger := log.NopLogger()
+
+	poller := api.NewSingleRunPoller()
+
+	manager := api.NewContentManager(moduleManager, dashConfig, logger,
+		api.WithContentGeneratorPoller(poller))
+
+	ctx := context.Background()
+	manager.Start(ctx, state, octantClient)
+}
+
 func TestContentManager_SetContentPath(t *testing.T) {
 	controller := gomock.NewController(t)
 	defer controller.Finish()

internal/api/testdata/application_navigation.json

@@ -0,0 +1,9 @@
+[
+  {
+    "title": "Applications",
+    "path": "workloads/namespace/milan",
+    "children": [],
+    "iconName": "application",
+    "isLoading": false
+  }
+]

internal/modules/workloads/detail_describer.go

@@ -90,9 +90,8 @@ func (d *DetailDescriber) Describe(ctx context.Context, namespace string, option
 	}
 
 	workloadName := fmt.Sprintf(`
-### %s
 _%s_
-`, cur.Name, cur.Owner.GroupVersionKind())
+`, cur.Owner.GroupVersionKind())
 
 	headerSection := component.FlexLayoutSection{
 		{

web/src/app/modules/shared/components/presentation/dropdown/dropdown.component.ts

@@ -100,7 +100,7 @@ export class DropdownComponent extends AbstractViewComponent<DropdownView> {
       });
     }
 
-    if (item.url && this.type === 'link') {
+    if (item.url && item.type === 'link') {
       setTimeout(() => {
         this.router.navigateByUrl(item.url);
       }, 0);

web/src/app/modules/shared/models/content.ts

@@ -7,6 +7,12 @@ export interface ContentResponse {
   currentPath: string;
 }
 
+export interface NamespacedTitle {
+  namespace: string;
+  title: string;
+  path: string;
+}
+
 export interface Content {
   extensionComponent: ExtensionView;
   viewComponents: View[];
@@ -16,10 +22,16 @@ export interface Content {
 
 export interface Metadata {
   type: string;
-  title?: View[];
+  title?: View[] | ValueConfig[];
   accessor?: string;
 }
 
+export interface ValueConfig extends View {
+  config?: {
+    value: string;
+  };
+}
+
 export interface View {
   metadata: Metadata;
   totalItems?: number;

web/src/app/modules/shared/services/content/content.service.spec.ts

@@ -20,12 +20,11 @@ import {
   Filter,
   LabelFilterService,
 } from '../label-filter/label-filter.service';
+import { Title } from '@angular/platform-browser';
 
 describe('ContentService', () => {
   let service: ContentService;
-  const mockRouter = {
-    navigate: jasmine.createSpy('navigate'),
-  };
+  const mockRouter = jasmine.createSpyObj('Router', ['navigate']);
 
   beforeEach(() => {
     TestBed.configureTestingModule({
@@ -40,6 +39,10 @@ describe('ContentService', () => {
           provide: Router,
           useValue: mockRouter,
         },
+        {
+          provide: Title,
+          useValue: jasmine.createSpyObj('Title', ['getTitle', 'setTitle']),
+        },
       ],
     });
 
@@ -71,6 +74,68 @@ describe('ContentService', () => {
         })
       );
     });
+
+    it('updates the title with namespace', () => {
+      const router = TestBed.inject(Router) as jasmine.SpyObj<Router>;
+      router.navigate.and.callFake(() => {
+        return new Promise(resolve => resolve(true));
+      });
+      const backendService = TestBed.inject(WebsocketService);
+      let newUpdate = Object.assign(
+        update,
+        { contentPath: '/newPath' },
+        {
+          content: {
+            viewComponents: [],
+            title: [{ config: { value: 'foo-title' } }],
+          },
+        }
+      );
+      backendService.triggerHandler(ContentUpdateMessage, newUpdate);
+
+      const titleServiceSpy = TestBed.inject(Title) as jasmine.SpyObj<Title>;
+      expect(titleServiceSpy.setTitle).toHaveBeenCalledOnceWith(
+        'Octant | foo-title | default'
+      );
+      service.title.subscribe(title => {
+        expect(title).toEqual({
+          namespace: 'default',
+          title: 'foo-title',
+          path: '/newPath',
+        });
+      });
+    });
+
+    it('updates the title without namespace', () => {
+      const router = TestBed.inject(Router) as jasmine.SpyObj<Router>;
+      router.navigate.and.callFake(() => {
+        return new Promise(resolve => resolve(true));
+      });
+      const backendService = TestBed.inject(WebsocketService);
+      let newUpdate = Object.assign(
+        update,
+        { contentPath: '/new-path', namespace: '' },
+        {
+          content: {
+            viewComponents: [],
+            title: [{ config: { value: 'foo-title' } }],
+          },
+        }
+      );
+      backendService.triggerHandler(ContentUpdateMessage, newUpdate);
+
+      const titleServiceSpy = TestBed.inject(Title) as jasmine.SpyObj<Title>;
+      expect(titleServiceSpy.setTitle).toHaveBeenCalledOnceWith(
+        'Octant | foo-title'
+      );
+      service.title.subscribe(title => {
+        expect(title).toEqual({
+          namespace: '',
+          title: 'foo-title',
+          path: '/new-path',
+        });
+      });
+    });
   });
 
   describe('label filters updated', () => {