Merge pull request #861 from digma-ai/feature/navigation-ui

Feature/navigation UI

src/api/index.ts

@@ -27,7 +27,7 @@ export const initializeDigmaMessageListener = (
 export const sendMessage = <T>(
   message: DigmaOutgoingMessageData<T>
 ): string | undefined => {
-  console.debug("Message to send:", message);
+  console.debug("Digma message to send:", message);
 
   switch (platform) {
     case "Web":
@@ -36,19 +36,22 @@ export const sendMessage = <T>(
     case "VS Code":
       if (window.sendMessageToVSCode) {
         window.sendMessageToVSCode(message);
-        console.debug("Message has been sent to VS Code: ", message);
+        console.debug("Digma message has been sent to VS Code: ", message);
       }
       break;
     case "JetBrains":
       if (window.cefQuery) {
         return window.cefQuery({
           request: JSON.stringify(message),
           onSuccess: function (response) {
-            console.debug("cefQuery has been successfully sent: %s", response);
+            console.debug(
+              "Digma message cefQuery has been successfully sent: %s",
+              response
+            );
           },
           onFailure: function (error_code, error_message) {
             console.error(
-              "Failed to send cefQuery: %d, %s",
+              " Digma message failed to send cefQuery: %d, %s",
               error_code,
               error_message
             );

src/components/Navigation/ScopeNavigation/HistoryManager.ts

@@ -32,6 +32,7 @@ export class HistoryManager {
   private current: Node<HistoryStep> | null = null;
   private itemsCount = 0;
   private currentIndex = -1;
+  private debug = false;
 
   constructor(data?: HistoryData) {
     if (data) {
@@ -69,6 +70,8 @@ export class HistoryManager {
     } else {
       this.itemsCount++;
     }
+
+    this.debug && console.log("History pushed: ", this.getHistoryData());
   }
 
   canMoveBack() {
@@ -85,6 +88,8 @@ export class HistoryManager {
 
     this.current = this.current.previous;
     this.currentIndex--;
+
+    this.debug && console.log("History back: ", this.getHistoryData());
     return this.getCurrent();
   }
 
@@ -102,6 +107,8 @@ export class HistoryManager {
 
     this.current = this.current.next;
     this.currentIndex++;
+
+    this.debug && console.log("History forward: ", this.getHistoryData());
     return this.getCurrent();
   }
 
@@ -117,6 +124,9 @@ export class HistoryManager {
     if (this.current) {
       this.current.value = { ...this.current.value, ...newValue };
     }
+
+    this.debug &&
+      console.log("History current updated: ", this.getHistoryData());
   }
 
   getHistoryData() {

src/components/Navigation/ScopeNavigation/index.tsx

@@ -19,7 +19,8 @@ const changeScope = (scope: Scope | null) => {
   window.sendMessageToDigma<ChangeScopePayload>({
     action: globalActions.CHANGE_SCOPE,
     payload: {
-      span: scope?.span || null
+      span: scope?.span || null,
+      forceNavigation: true
     }
   });
 };
@@ -92,13 +93,15 @@ export const ScopeNavigation = (props: ScopeNavigationProps) => {
 
     const handleViewChange = (data: unknown) => {
       const payload = data as SetViewsPayload;
+      const view = payload.views.find((x) => x.isSelected);
+      const viewId = [view?.id, view?.path].filter((x) => Boolean(x)).join("/");
+
       const currentStep = historyManager.getCurrent();
-      if (!payload.triggeredByJcef) {
+      if (!payload.createHistoryStep) {
+        historyManager.updateCurrent({ tabId: viewId });
         return;
       }
 
-      const view = payload.views.find((x) => x.isSelected);
-      const viewId = [view?.id, view?.path].filter((x) => Boolean(x)).join("/");
       if (view && currentStep && currentStep?.tabId !== viewId) {
         historyManager.push({
           environment: environment,

src/components/Navigation/mockData.ts

@@ -67,5 +67,5 @@ export const mockedViewsData: SetViewsPayload = {
       cardName: "tests"
     }
   ],
-  triggeredByJcef: false
+  createHistoryStep: false
 };

src/components/Navigation/types.ts

@@ -34,7 +34,7 @@ export interface ChangeViewPayload {
 
 export interface SetViewsPayload {
   views: TabData[];
-  triggeredByJcef: boolean;
+  createHistoryStep: boolean;
 }
 
 export interface AutoFixMissingDependencyPayload {

src/types.ts

@@ -83,6 +83,7 @@ export interface ChangeScopePayload {
   span: {
     spanCodeObjectId: string;
   } | null;
+  forceNavigation?: boolean;
 }
 
 export interface ChangeViewPayload {