Wire the Dashboard Tabs

Open app.js and add a function that activates one .panel-view at a time.

Start with a focused version:

function switchTab(tab) {
  document.querySelectorAll(".panel-view").forEach(view => {
    view.classList.toggle("active", view.id === tab);
  });

  document.querySelectorAll("[data-tab]").forEach(link => {
    link.classList.toggle("active", link.dataset.tab === tab);
  });
}

Then connect the navigation buttons:

document.querySelectorAll("[data-tab]").forEach(link => {
  link.addEventListener("click", () => switchTab(link.dataset.tab));
});

switchTab("convert");

The existing HTML already gives both the desktop sidebar buttons and mobile buttons a data-tab value, so the same listener can support both layouts.

Test it

Click Convert, Rates, Favorites, and History. Only the selected panel should be visible.

Checkpoint

The navigation works without changing the URL or reloading the page. The selected tab remains visually active.