teste.js

      function main() {
        const nav = document.createElement('nav')
        nav.classList.add('routes')
        nav.innerHTML = `
          <ul>
            <li>Routes:</li>
            <li>
              <a href="/">Home</a>
            </li>
            <li>
              <a href="/upload">Upload</a>
            </li>
            <li>
              <a href="/column-association">Column Association</a>
            </li>
          </ul>
        `
        document.body.append(nav)

        Array.from(document.querySelectorAll('nav.routes ul li a'))
        .map(link => {
          link.onclick = e => {
            e.preventDefault()
            history.pushState({}, '', link.href)
          }
          if (link.parentElement.tagName === 'LI') {
            link.parentElement.onclick = link.onclick
          }
        })
      }
main()
      const style = document.createElement('style')
      document.body.appendChild(style)
      style.innerHTML = `
        nav.routes {
          position: fixed;
          bottom: 0;
          right: 0;
        }
        nav.routes ul {
          display: flex;
        }
        nav.routes li {
          list-style: none;
          padding: 8px 16px;
          border: 1px solid black;
          background: black;
          cursor: pointer;
        }
        nav.routes li:first-of-type {
          cursor: initial;
          color: #aaa;
          user-select: none;
          border-top-left-radius: 8px;
        }
        nav.routes li:last-of-type {
          border-top-right-radius: 8px;
        }
        nav.routes li:not(:first-of-type):hover {
          background: #444;
        }
        nav.routes a {
          color: white;
          text-decoration: none;
          font-weight: bold;
        }
        nav.routes a:visited {
          color: white;
        }`