[OGUI-1593] Preserve layout tab in path in Layout Show View After Nav…

…igating Back from Object View (#2702)

This change adds the ability to restore the previous tab in Layout Show View when returning from Object View. It gets the tab info from the selected object's ID and includes it in the "Back to Layout" button path.
* Adds tab information of an specific object id from backend
* Updates 'back to layout' button to add tab to path in frontend

QualityControl/lib/services/JsonFileService.js

@@ -217,7 +217,7 @@ export class JsonFileService {
       for (const tab of layout.tabs) {
         for (const object of tab.objects) {
           if (object.id === id) {
-            return { object, layoutName: layout.name };
+            return { object, layoutName: layout.name, tabName: tab.name };
           }
         }
       }

QualityControl/lib/services/QcObject.service.js

@@ -158,14 +158,15 @@ export class QcObjectService {
    * @throws
    */
   async retrieveQcObjectByQcgId(qcgId, id, validFrom = undefined, filters = {}) {
-    const { object, layoutName } = this._dataService.getObjectById(qcgId);
+    const { object, layoutName, tabName } = this._dataService.getObjectById(qcgId);
     const { name, options = {}, ignoreDefaults = false } = object;
     const qcObject = await this.retrieveQcObject(name, validFrom, id, filters);
 
     return {
       ...qcObject,
       layoutDisplayOptions: options,
       layoutName,
+      tabName,
       ignoreDefaults,
     };
   }

QualityControl/public/pages/objectView/components/header.js

@@ -35,12 +35,12 @@ export const header = (model, title) => h('.flex-row.items-center.p2.g2', [
  */
 function getBackToQCGButton(model) {
   const { layoutId = undefined } = model.router.params;
-  const { objectViewModel: { filter } } = model;
+  const { objectViewModel: { filter, selected } } = model;
   let title = 'Back';
   let href = '?page=objectTree';
   if (layoutId) {
     title = 'Back to layout';
-    href = `?page=layoutShow&layoutId=${layoutId}${getUrlPathFromObject(filter)}`;
+    href = `?page=layoutShow&layoutId=${layoutId}${getUrlPathFromObject(filter)}${getTabFromObject(selected)}`;
   }
 
   return h(
@@ -87,3 +87,13 @@ function getCopyURLToClipboardButton(model) {
     [iconBook(), ' ', 'Copy URL'],
   ));
 }
+
+/**
+ * Extract tab name from the selected object
+ * @param {RemoteData} selected - contains the selected object
+ * @returns {string} - name of the tab where the object is placed or empty string if not applicable
+ */
+function getTabFromObject(selected) {
+  const tabName = selected?.payload?.tabName ?? '';
+  return tabName ? `&tab=${tabName}` : '';
+}

QualityControl/test/public/pages/object-view-from-layout-show.test.js

@@ -74,6 +74,9 @@ export const objectViewFromLayoutShowTests = async (url, page, timeout = 5000, t
     async () => {
       const layoutId = '671b95883d23cd0d67bdc787';
       const backToLayoutButtonPath = 'div > div > div > div > a';
+      const href = await page.evaluate((backToLayoutButtonPath) =>
+        document.querySelector(backToLayoutButtonPath).href, backToLayoutButtonPath);
+      strictEqual(true, href.includes('&tab=main'));
       await page.locator(backToLayoutButtonPath).click();
 
       await delay(500);