Finding a tab parent panel through its tab ID (rc-dock)

example-layout.json

{
  "dockbox": {
    "id": "+147",
    "size": 200,
    "mode": "horizontal",
    "children": [
      {
        "id": "+135",
        "size": 280,
        "mode": "vertical",
        "children": [
          {
            "id": "+137",
            "size": 200,
            "mode": "horizontal",
            "children": [
              {
                "id": "+0",
                "size": 200,
                "tabs": [
                  {
                    "id": "tab1"
                  },
                  {
                    "id": "tab4"
                  }
                ],
                "activeId": "tab1"
              },
              {
                "id": "+143",
                "size": 200,
                "mode": "vertical",
                "children": [
                  {
                    "id": "+142",
                    "size": 200,
                    "tabs": [
                      {
                        "id": "tab9"
                      }
                    ],
                    "activeId": "tab9"
                  },
                  {
                    "id": "+145",
                    "size": 200,
                    "mode": "horizontal",
                    "children": [
                      {
                        "id": "+144",
                        "size": 200,
                        "tabs": [
                          {
                            "id": "tab8"
                          }
                        ],
                        "activeId": "tab8"
                      },
                      {
                        "id": "+146",
                        "size": 200,
                        "tabs": [
                          {
                            "id": "tab7"
                          }
                        ],
                        "activeId": "tab7"
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "id": "+136",
            "size": 200,
            "tabs": [
              {
                "id": "tab3"
              }
            ],
            "activeId": "tab3"
          }
        ]
      },
      {
        "id": "+149",
        "size": 120,
        "mode": "vertical",
        "children": [
          {
            "id": "+148",
            "size": 200,
            "tabs": [
              {
                "id": "tab6"
              }
            ],
            "activeId": "tab6"
          },
          {
            "id": "+150",
            "size": 200,
            "tabs": [
              {
                "id": "tab2"
              }
            ],
            "activeId": "tab2"
          }
        ]
      }
    ]
  },
  "floatbox": {
    "id": "+134",
    "size": 0,
    "mode": "float",
    "children": [
      {
        "id": "+151",
        "size": 200,
        "tabs": [
          {
            "id": "tab5"
          }
        ],
        "activeId": "tab5",
        "x": 185,
        "y": 149,
        "z": 1,
        "w": 300,
        "h": 300
      }
    ]
  }
}

find-tab-parent-panel.js

export function findParentPanelFromTab(panel, tabId) {
  for (let tab of panel.tabs) {
    if (tab.id === tabId) {
      return panel;
    }
  }
  return null;
}

export function findTabParentPanelInBox(box, tabId) {
  let result;
  for (let child of box.children) {
    if ("children" in child) {
      result = result = findTabParentPanelInBox(child, tabId);
      if (result) {
        break;
      }
    } else if ("tabs" in child) {
      result = findParentPanelFromTab(child, tabId);
      if (result) {
        break;
      }
    }
  }
  return result;
}

/**
 * Searches the entire layout tree for the parent panel of a tab node.
 *
 * @param {*} layout The dock & float component hierarchy.
 * @param {*} tabId The id of the tab to search for.
 */
export function findTabParentPanel(layout, tabId) {
  let result = findTabParentPanelInBox(layout.dockbox, tabId);
  if (!result) {
    result = findTabParentPanelInBox(layout.floatbox, tabId);
  }
  return result;
}

usage-example.js

import exampleLayout from './example-layout.json';
import { findTabParentPanel } from './find-tab-parent-panel';

const parentPanel = findTabParentPanel(exampleLayout, 'tab9');
console.log(parentPanel); // should print an object whose ID is "+143".