/* Shared app chrome (sidebar nav + sticky footer) for the static layout
   review pages. Mirrors src/gui/app.py:_build_navigation() ordering and
   src/gui/components/_legacy.py:render_sticky_footer(). Each page sets
   <body data-page="<tool_id|home>"> to mark the active nav item. */
(function () {
  // Front-door entry — rendered standalone above the section groups.
  var START = { id: "home", icon: "insert_chart_outlined", name: "Start here", href: "home.html" };

  // Sections + entries in pipeline / job order.
  var NAV = [
    { label: "Data Cleaners", items: [
      { id: "02_text_cleaner", icon: "text_format", name: "Clean Text", href: "02_text_cleaner.html" },
      { id: "03_format_standardizer", icon: "format_list_bulleted", name: "Standardize Formats", href: "03_format_standardizer.html" },
      { id: "04_missing_handler", icon: "help_outline", name: "Fix Missing Values", href: "04_missing_handler.html" },
      { id: "01_deduplicator", icon: "search", name: "Find Duplicates", href: "01_deduplicator.html" },
    ]},
    { label: "Transformations", items: [
      { id: "05_column_mapper", icon: "view_column", name: "Map Columns", href: "05_column_mapper.html" },
    ]},
    { label: "Automations", items: [
      { id: "09_pipeline_runner", icon: "auto_awesome", name: "Automated Workflows", href: "09_pipeline_runner.html" },
    ]},
    { label: "Finance", items: [
      { id: "11_reconciler", icon: "compare_arrows", name: "Reconcile Two Files", href: "11_reconciler.html" },
      { id: "10_pdf_extractor", icon: "picture_as_pdf", name: "PDF to CSV", href: "10_pdf_extractor.html" },
    ]},
    { label: "Coming soon", items: [
      { id: "06_outlier_detector", icon: "insights", name: "Find Unusual Values", href: "06_outlier_detector.html", soon: true },
      { id: "08_validator_reporter", icon: "check_circle", name: "Quality Check", href: "08_validator_reporter.html", soon: true },
      { id: "07_multi_file_merger", icon: "account_tree", name: "Combine Files", href: "07_multi_file_merger.html", soon: true },
    ]},
  ];

  var active = document.body.getAttribute("data-page") || "";

  // ---- Sidebar -----------------------------------------------------------
  var sb = document.getElementById("dt-sidebar");
  if (sb) {
    var html = '' +
      '<a class="dt-brand" href="index.html" style="text-decoration:none">' +
        '<span class="dt-brand-mark">D</span>' +
        '<span class="dt-brand-name">' +
          '<span class="dt-brand-eyebrow">UNALOGIX</span>' +
          '<span class="dt-brand-word">DataTools</span>' +
        '</span>' +
      '</a>' +
      '<nav class="dt-nav">';
    var startCls = "dt-nav-link dt-nav-start" + (START.id === active ? " is-active" : "");
    html += '<a class="' + startCls + '" href="' + START.href + '">' +
              '<span class="dt-mi">' + START.icon + '</span>' +
              '<span>' + START.name + '</span>' +
            '</a>';
    NAV.forEach(function (sec) {
      var indicator = "−";
      html += '<div class="dt-nav-section">' + sec.label +
              '<span class="dt-nav-indicator">' + indicator + '</span></div>';
      sec.items.forEach(function (it) {
        var cls = "dt-nav-link" + (it.id === active ? " is-active" : "") + (it.soon ? " is-soon" : "");
        html += '<a class="' + cls + '" href="' + it.href + '">' +
                  '<span class="dt-mi">' + it.icon + '</span>' +
                  '<span>' + it.name + '</span>' +
                  (it.soon ? '<span class="dt-nav-soon-tag">Soon</span>' : '') +
                '</a>';
      });
    });
    html += '</nav>' +
      '<div class="dt-sidebar-foot">' +
        '<div><div class="dt-sidebar-label">Language</div>' +
          '<div class="dt-select" style="pointer-events:none">English</div></div>' +
        '<div class="dt-license-badge">Core · 1,820 days left</div>' +
      '</div>';
    sb.innerHTML = html;
  }

  // ---- Sticky footer -----------------------------------------------------
  var ft = document.getElementById("dt-footer");
  if (ft) {
    ft.innerHTML =
      '<a class="dt-footer-btn" href="index.html"><span class="dt-mi">close</span>Close</a>' +
      '<button class="dt-footer-btn" type="button"><span class="dt-mi">help_outline</span>Help</button>' +
      '<span style="margin-left:auto;font-size:11.5px;color:var(--ink-tertiary)">DataTools · local-first · static layout preview</span>';
  }
})();
