pinokiod 3.180.0 → 3.181.0

package/server/views/app.ejs

@@ -905,6 +905,9 @@ body.dark .tab-link-popover .tab-link-popover-header {
   background: transparent;
   cursor: pointer;
 }
+.tab-link-popover .tab-link-popover-item.qr-inline { flex-direction: row; align-items: center; gap: 10px; }
+.tab-link-popover .tab-link-popover-item.qr-inline .textcol { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
+.tab-link-popover .tab-link-popover-item.qr-inline .qr { width: 64px; height: 64px; image-rendering: pixelated; flex: 0 0 auto; margin-left: auto; }
 .tab-link-popover .tab-link-popover-item:hover,
 .tab-link-popover .tab-link-popover-item:focus-visible {
   background: rgba(15, 23, 42, 0.06);
@@ -2232,6 +2235,19 @@ body.dark {
   cursor: not-allowed;
 }
 
+.pinokio-history-actions {
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.pinokio-history-branch-select.pinokio-modal-input {
+  width: auto;
+  min-width: 160px;
+  padding: 6px 10px;
+  font-size: 13px;
+}
+
 .pinokio-pill {
   display: inline-flex;
   align-items: center;
@@ -2957,6 +2973,15 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
     overflow: auto;
     flex-wrap: nowrap;
   }
+  /* Keep minimized header horizontal and compact on small screens */
+  header.navheader.minimized,
+  header.navheader.minimized h1 {
+    display: inline-flex;
+    flex-direction: row;
+  }
+  header.navheader.minimized h1 .btn2 {
+    width: auto;
+  }
   .appcanvas {
     margin-left: 0;
     flex: 1 1 auto;
@@ -3508,6 +3533,8 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
     return false
   }
 
+  const isIPv4Host = (host) => /^(\d{1,3}\.){3}\d{1,3}$/.test((host || '').trim())
+
   const extractProjectSlug = (node) => {
     if (!node) {
       return ""
@@ -3662,22 +3689,36 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
     if (!trimmed) {
       return ""
     }
-    if (!/^https?:\/\//i.test(trimmed)) {
-      trimmed = `https://${trimmed}`
-    } else {
-      trimmed = trimmed.replace(/^http:/i, "https:")
+    // If it's already a URL, ensure it's HTTPS and not an IP host
+    if (/^https?:\/\//i.test(trimmed)) {
+      try {
+        const parsed = new URL(trimmed)
+        const host = (parsed.hostname || '').toLowerCase()
+        if (!host || isIPv4Host(host)) {
+          return ""
+        }
+        // Only accept domains (prefer *.localhost) for HTTPS targets
+        if (!(host === 'localhost' || host.endsWith('.localhost') || host.includes('.'))) {
+          return ""
+        }
+        let pathname = parsed.pathname || ""
+        if (pathname === "/") pathname = ""
+        const search = parsed.search || ""
+        return `https://${host}${pathname}${search}`
+      } catch (_) {
+        return ""
+      }
     }
+    // Not a full URL: accept plain domains (prefer *.localhost), reject IPs
     try {
-      const parsed = new URL(trimmed)
-      if (!parsed.host) {
+      const hostCandidate = trimmed.split('/')[0].toLowerCase()
+      if (!hostCandidate || isIPv4Host(hostCandidate)) {
         return ""
       }
-      let pathname = parsed.pathname || ""
-      if (pathname === "/") {
-        pathname = ""
+      if (!(hostCandidate === 'localhost' || hostCandidate.endsWith('.localhost') || hostCandidate.includes('.'))) {
+        return ""
       }
-      const search = parsed.search || ""
-      return `https://${parsed.host}${pathname}${search}`
+      return `https://${hostCandidate}`
     } catch (_) {
       return ""
     }
@@ -3736,7 +3777,8 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
   const ensureRouterInfoMapping = async () => {
     const now = Date.now()
     if (!tabLinkRouterInfoPromise || now > tabLinkRouterInfoExpiry) {
-      tabLinkRouterInfoPromise = fetch("/info/system", {
+      // Use lightweight router mapping to avoid favicon/installed overhead
+      tabLinkRouterInfoPromise = fetch("/info/router", {
         method: "GET",
         headers: {
           "Accept": "application/json"
@@ -3758,6 +3800,8 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
             : []
           const portMap = new Map()
           const hostPortMap = new Map()
+          const externalHttpByExtPort = new Map() // ext port -> Set of host:port (external_ip)
+          const externalHttpByIntPort = new Map() // internal port -> Set of host:port (external_ip)
           const hostAliasPortMap = new Map()
           if (data?.router && typeof data.router === "object") {
             Object.entries(data.router).forEach(([dial, hosts]) => {
@@ -3902,11 +3946,29 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
             mergeTargets(entry.external_domain)
             mergeTargets(entry.https_href)
             mergeTargets(entry.app_href)
-            mergeTargets(entry.external_ip)
-            mergeTargets(entry.internal_router)
-            mergeTargets(entry.match)
-            mergeTargets(entry.host)
+            // Some rewrite mapping entries expose domain candidates under `hosts`
             mergeTargets(entry.hosts)
+            // Internal router can also include domain aliases (e.g., comfyui.localhost)
+            mergeTargets(entry.internal_router)
+
+            // Record external http host:port candidates by external and internal ports for later
+            if (entry.external_ip && typeof entry.external_ip === 'string') {
+              const parsed = parseHostPort(entry.external_ip)
+              if (parsed && parsed.port) {
+                const keyExt = parsed.port
+                if (!externalHttpByExtPort.has(keyExt)) {
+                  externalHttpByExtPort.set(keyExt, new Set())
+                }
+                externalHttpByExtPort.get(keyExt).add(`${parsed.host}:${parsed.port}`)
+                const keyInt = String(entry.internal_port || '')
+                if (keyInt) {
+                  if (!externalHttpByIntPort.has(keyInt)) {
+                    externalHttpByIntPort.set(keyInt, new Set())
+                  }
+                  externalHttpByIntPort.get(keyInt).add(`${parsed.host}:${parsed.port}`)
+                }
+              }
+            }
 
             if (httpsTargets.size === 0) {
               return
@@ -3982,14 +4044,18 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
 
           return {
             portMap,
-            hostPortMap
+            hostPortMap,
+            externalHttpByExtPort,
+            externalHttpByIntPort
           }
         })
         .catch(() => {
           tabLinkRouterHttpsActive = null
           return {
             portMap: new Map(),
-            hostPortMap: new Map()
+            hostPortMap: new Map(),
+            externalHttpByExtPort: new Map(),
+            externalHttpByIntPort: new Map()
           }
         })
       tabLinkRouterInfoExpiry = now + 3000
@@ -4042,7 +4108,7 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
     const projectSlug = extractProjectSlug(link).toLowerCase()
     const entries = []
     const entryByUrl = new Map()
-    const addEntry = (type, label, url) => {
+    const addEntry = (type, label, url, opts = {}) => {
       if (!url) {
         return
       }
@@ -4067,13 +4133,16 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
         return
       }
       if (entryByUrl.has(canonical)) {
+        const existing = entryByUrl.get(canonical)
+        if (opts && opts.qr === true) existing.qr = true
         return
       }
       const entry = {
         type,
         label,
         url: canonical,
-        display: formatDisplayUrl(canonical)
+        display: formatDisplayUrl(canonical),
+        qr: opts && opts.qr === true
       }
       entryByUrl.set(canonical, entry)
       entries.push(entry)
@@ -4087,11 +4156,11 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
       addEntry("url", "URL", baseHref)
     }
 
-    const httpCandidates = new Set()
+    const httpCandidates = new Map() // url -> { qr: boolean }
     const httpsCandidates = new Set()
 
     if (isHttpUrl(baseHref)) {
-      httpCandidates.add(canonicalizeUrl(baseHref))
+      httpCandidates.set(canonicalizeUrl(baseHref), { qr: false })
     } else if (isHttpsUrl(baseHref)) {
       httpsCandidates.add(canonicalizeUrl(baseHref))
     }
@@ -4109,7 +4178,7 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
         const normalizedPath = pathname.toLowerCase()
         if (normalizedPath.includes(`/asset/api/${projectSlug}`)) {
           const fallbackHttp = `http://127.0.0.1:42000${pathname}`
-          httpCandidates.add(canonicalizeUrl(fallbackHttp))
+          httpCandidates.set(canonicalizeUrl(fallbackHttp), { qr: false })
         }
       } catch (_) {
         // ignore fallback errors
@@ -4133,15 +4202,16 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
           if (isHttpsUrl(canonical)) {
             httpsCandidates.add(canonical)
           } else if (isHttpUrl(canonical)) {
-            httpCandidates.add(canonical)
+            const prev = httpCandidates.get(canonical)
+            httpCandidates.set(canonical, { qr: prev ? prev.qr === true : false })
           }
         })
       })
     }
 
+    const routerData = await ensureRouterInfoMapping()
     if (httpCandidates.size > 0) {
-      const routerData = await ensureRouterInfoMapping()
-      httpCandidates.forEach((httpUrl) => {
+      Array.from(httpCandidates.keys()).forEach((httpUrl) => {
         const mapped = collectHttpsUrlsFromRouter(httpUrl, routerData)
         mapped.forEach((httpsUrl) => {
           httpsCandidates.add(httpsUrl)
@@ -4149,6 +4219,28 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
       })
     }
 
+    // Add external 192.168.* http host:port candidates mapped from the same internal port as base HTTP
+    try {
+      const base = new URL(baseHref, location.origin)
+      let basePort = base.port
+      if (!basePort) {
+        basePort = base.protocol.toLowerCase() === 'https:' ? '443' : '80'
+      }
+      const samePortHosts = routerData && routerData.externalHttpByIntPort ? routerData.externalHttpByIntPort.get(basePort) : null
+      if (samePortHosts && samePortHosts.size > 0) {
+        samePortHosts.forEach((hostport) => {
+          try {
+            const hpUrl = `http://${hostport}${base.pathname || '/'}${base.search || ''}`
+            const canonical = canonicalizeUrl(hpUrl)
+            if (isHttpUrl(canonical)) {
+              const prev = httpCandidates.get(canonical)
+              httpCandidates.set(canonical, { qr: true || (prev ? prev.qr === true : false) })
+            }
+          } catch (_) {}
+        })
+      }
+    } catch (_) {}
+
     const httpsList = Array.from(httpsCandidates).sort()
 
     if (httpsList.length > 0) {
@@ -4163,17 +4255,20 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
           }
           const hostPort = parsed.port ? `${parsed.hostname}:${parsed.port}` : parsed.hostname
           const httpUrl = `http://${hostPort}${parsed.pathname || "/"}${parsed.search || ""}`
-          httpCandidates.add(canonicalizeUrl(httpUrl))
+          const key = canonicalizeUrl(httpUrl)
+          const prev = httpCandidates.get(key)
+          httpCandidates.set(key, { qr: prev ? prev.qr === true : false })
         } catch (_) {
           // ignore failures
         }
       })
     }
 
-    const httpList = Array.from(httpCandidates).sort()
+    const httpList = Array.from(httpCandidates.keys()).sort()
 
     httpList.forEach((url) => {
-      addEntry("http", "HTTP", url)
+      const meta = httpCandidates.get(url) || { qr: false }
+      addEntry("http", "HTTP", url, { qr: meta.qr === true })
     })
     httpsList.forEach((url) => {
       addEntry("https", "HTTPS", url)
@@ -4273,6 +4368,26 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
       tabLinkHideTimer = null
     }
 
+    // Show lightweight loading popover immediately while mapping fetch runs
+    try {
+      const pop = ensureTabLinkPopoverEl()
+      pop.innerHTML = ''
+      const header = document.createElement('div')
+      header.className = 'tab-link-popover-header'
+      header.innerHTML = `<i class="fa-solid fa-arrow-up-right-from-square"></i><span>Open in browser</span>`
+      const item = document.createElement('div')
+      item.className = 'tab-link-popover-item'
+      const label = document.createElement('span')
+      label.className = 'label'
+      label.textContent = 'Loading…'
+      const value = document.createElement('span')
+      value.className = 'value muted'
+      value.textContent = 'Discovering routes'
+      item.append(label, value)
+      pop.append(header, item)
+      positionTabLinkPopover(pop, link)
+    } catch (_) {}
+
     let entries
     try {
       entries = await buildTabLinkEntries(link)
@@ -4356,7 +4471,6 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
     entries.forEach((entry) => {
       const item = document.createElement("button")
       item.type = "button"
-      item.className = "tab-link-popover-item"
       item.setAttribute("data-url", entry.url)
       const labelSpan = document.createElement("span")
       labelSpan.className = "label"
@@ -4364,7 +4478,24 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
       const valueSpan = document.createElement("span")
       valueSpan.className = "value"
       valueSpan.textContent = entry.display
-      item.append(labelSpan, valueSpan)
+
+      if (entry.type === 'http' && entry.qr === true) {
+        item.className = "tab-link-popover-item qr-inline"
+        const textCol = document.createElement('div')
+        textCol.className = 'textcol'
+        textCol.append(labelSpan, valueSpan)
+        const qrImg = document.createElement('img')
+        qrImg.className = 'qr'
+        qrImg.alt = 'QR'
+        qrImg.decoding = 'async'
+        qrImg.loading = 'lazy'
+        qrImg.src = `/qr?data=${encodeURIComponent(entry.url)}&s=4&m=0`
+        item.append(textCol, qrImg)
+      } else {
+        item.className = "tab-link-popover-item"
+        // Keep label and value as direct children so column layout applies
+        item.append(labelSpan, valueSpan)
+      }
       popover.appendChild(item)
     })
 
@@ -7879,6 +8010,10 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
       const commits = historyData.log || []
       const remote = historyData.remote || ''
       const currentRef = historyData.ref || 'HEAD'
+      const branchEntries = Array.isArray(historyData.branches) ? historyData.branches : []
+      const isOid = (s) => typeof s === 'string' && /^[0-9a-f]{7,40}$/i.test(s)
+      const realBranchEntries = branchEntries.filter((entry) => entry && typeof entry.branch === 'string' && entry.branch.length > 0 && !isOid(entry.branch))
+      const selectedBranchName = (historyData && typeof historyData.branch === 'string' && !isOid(historyData.branch)) ? historyData.branch : null
       
       const commitCountLabel = `${commits.length} commit${commits.length === 1 ? '' : 's'}`
       const lastCommit = commits[0]
@@ -7910,9 +8045,21 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
             <div class="pinokio-history-latest-text">
               Currently viewing ${escapeHtml(currentRef)}
             </div>
-            <button type="button" class="pinokio-history-latest-btn" data-history-return-head>
-              <i class="fa-solid fa-arrow-rotate-left"></i> Return to newest commit
-            </button>
+            <div class="pinokio-history-actions">
+              <button type="button" class="pinokio-history-latest-btn" data-history-return-head>
+                <i class="fa-solid fa-arrow-rotate-left"></i> Return to newest commit
+              </button>
+              ${realBranchEntries.length ? `
+                <select class="pinokio-modal-input pinokio-history-branch-select" data-history-branch-select aria-label="Select branch">
+                  ${realBranchEntries.map(e => `
+                    <option value="${escapeHtml(e.branch)}"${selectedBranchName === e.branch ? ' selected' : ''}>${escapeHtml(e.branch)}</option>
+                  `).join('')}
+                </select>
+                <button type="button" class="pinokio-history-latest-btn" data-history-branch-switch>
+                  <i class="fa-solid fa-code-branch"></i> Switch
+                </button>
+              ` : ''}
+            </div>
           </div>
           <div class="pinokio-modal-body pinokio-modal-body--history">
             ${commits.length === 0 ? 
@@ -7949,7 +8096,9 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
 
           const returnBtn = document.querySelector('[data-history-return-head]')
           const banner = document.querySelector('[data-history-latest-banner]')
-          if (returnBtn && typeof showIframeView === 'function') {
+          const branchSelect = document.querySelector('[data-history-branch-select]')
+          const branchSwitchBtn = document.querySelector('[data-history-branch-switch]')
+          if (typeof showIframeView === 'function') {
             const repoParam = options && typeof options === 'object' ? options.repoParam : null
             let checkoutCwd = null
             if (historyData && typeof historyData.dir === 'string' && historyData.dir.length > 0) {
@@ -7958,31 +8107,52 @@ body.dark .pinokio-fork-dropdown-remote, body.dark .pinokio-publish-dropdown-rem
               checkoutCwd = repoParam
             }
 
+            const isOid = (s) => typeof s === 'string' && /^[0-9a-f]{7,40}$/i.test(s)
             const branchEntries = Array.isArray(historyData.branches) ? historyData.branches : []
-            let checkoutTarget = null
-
-            if (repoData && typeof repoData.branch === 'string' && repoData.branch.length > 0 && repoData.branch !== currentRef) {
-              checkoutTarget = repoData.branch
-            }
-            if (!checkoutTarget) {
-              const nonCurrent = branchEntries.find((entry) => entry && typeof entry.branch === 'string' && entry.branch.length > 0 && entry.branch !== currentRef)
-              if (nonCurrent) {
-                checkoutTarget = nonCurrent.branch
-              }
+            const realBranches = branchEntries
+              .map((entry) => entry && typeof entry.branch === 'string' ? entry.branch : null)
+              .filter((name) => name && !isOid(name))
+
+            // Wire the branch selector
+            if (branchSelect && checkoutCwd) {
+              branchSelect.addEventListener('change', () => {
+                const value = branchSelect.value
+                if (!value) return
+                const url = `/run/scripts/git/checkout.json?cwd=${encodeURIComponent(checkoutCwd)}&commit=${encodeURIComponent(value)}&callback_target=parent&callback=$location.href`
+                openCheckoutTerminal(url)
+              })
             }
-            if (!checkoutTarget && branchEntries.length > 0) {
-              checkoutTarget = branchEntries[0].branch
+            if (branchSwitchBtn && branchSelect && checkoutCwd) {
+              branchSwitchBtn.addEventListener('click', () => {
+                const value = branchSelect.value
+                if (!value) return
+                const url = `/run/scripts/git/checkout.json?cwd=${encodeURIComponent(checkoutCwd)}&commit=${encodeURIComponent(value)}&callback_target=parent&callback=$location.href`
+                openCheckoutTerminal(url)
+              })
             }
 
-            if (checkoutCwd && checkoutTarget) {
-              const checkoutUrl = `/run/scripts/git/checkout.json?cwd=${encodeURIComponent(checkoutCwd)}&commit=${encodeURIComponent(checkoutTarget)}&callback_target=parent&callback=$location.href`
-              returnBtn.addEventListener('click', () => {
-                openCheckoutTerminal(checkoutUrl)
-              })
-            } else {
-              returnBtn.disabled = true
-              if (banner) {
-                banner.classList.add('pinokio-history-latest-banner--disabled')
+            // Fix "Return to newest commit" target selection
+            if (returnBtn) {
+              let checkoutTarget = null
+              if (repoData && typeof repoData.branch === 'string' && repoData.branch.length > 0 && !isOid(repoData.branch)) {
+                checkoutTarget = repoData.branch
+              } else if (historyData && typeof historyData.branch === 'string' && historyData.branch.length > 0 && !isOid(historyData.branch)) {
+                checkoutTarget = historyData.branch
+              } else if (realBranches.length > 0) {
+                const prefer = ['main', 'master', 'develop', 'dev']
+                checkoutTarget = prefer.find((n) => realBranches.includes(n)) || realBranches[0]
+              }
+
+              if (checkoutCwd && checkoutTarget) {
+                const checkoutUrl = `/run/scripts/git/checkout.json?cwd=${encodeURIComponent(checkoutCwd)}&commit=${encodeURIComponent(checkoutTarget)}&callback_target=parent&callback=$location.href`
+                returnBtn.addEventListener('click', () => {
+                  openCheckoutTerminal(checkoutUrl)
+                })
+              } else {
+                returnBtn.disabled = true
+                if (banner) {
+                  banner.classList.add('pinokio-history-latest-banner--disabled')
+                }
               }
             }
           } else if (banner) {

package/server/views/connect.ejs

@@ -924,6 +924,15 @@ document.addEventListener('DOMContentLoaded', function() {
   <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
   <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
   <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
 </aside>
 </main>
 </body>

package/server/views/index.ejs

@@ -731,6 +731,15 @@ body.dark aside .current.selected {
   <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
   <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
   <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
 </aside>
 </main>
 <script>

package/server/views/init/index.ejs

@@ -1587,7 +1587,6 @@ body.dark .ace-editor {
               <div><h5>Download</h5></div>
             </div>
           </button>
-          <!--
           <div class='category-label'>Create a web domain</div>
           <button type="button" class="tab-button" data-tab="dns">
             <div class='row'>
@@ -1595,7 +1594,6 @@ body.dark .ace-editor {
               <div><h5>Web Domain</h5></div>
             </div>
           </button>
-          -->
         </div>
 
         <form id="bootstrap-form">
@@ -1953,6 +1951,15 @@ body.dark .ace-editor {
   <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
   <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
   <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
 </aside>
 </main>
 <div id='terminal-container' class='hidden'>

package/server/views/layout.ejs

@@ -125,6 +125,8 @@
       sessionId: sessionId || null
     }) %>
   </script>
+  <script src="/Socket.js"></script>
+  <script src="/common.js"></script>
   <script src="/layout.js"></script>
 </body>
 </html>

package/server/views/net.ejs

@@ -823,6 +823,15 @@ document.addEventListener('DOMContentLoaded', function() {
   <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
   <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
   <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
 </aside>
 </main>
 <script>

package/server/views/network.ejs

@@ -1184,6 +1184,15 @@ document.addEventListener('DOMContentLoaded', function() {
     <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
     <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
     <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+    <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+    <div class='qr' style='padding:12px 10px; text-align:center;'>
+      <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+        <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+        <div class='caption'>Scan to open</div>
+        <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+      </a>
+    </div>
+    <% } %>
   </aside>
 </main>
 <script>

package/server/views/screenshots.ejs

@@ -776,6 +776,15 @@ document.addEventListener('DOMContentLoaded', function() {
   <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
   <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
   <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
 </aside>
 </main>
 <script>

package/server/views/settings.ejs

@@ -571,6 +571,15 @@ document.addEventListener('DOMContentLoaded', function() {
   <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
   <a class='tab' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
   <a class='tab selected' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
 </aside>
 </main>
 <script>

package/server/views/terminals.ejs

@@ -447,9 +447,18 @@ body.dark .plugin-option:hover {
     <a class='tab' id='genlog'><i class="fa-solid fa-laptop-code"></i><div class='caption'>Logs</div></a>
     <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><i class="fa-solid fa-download"></i><div class='caption'>Download logs</div></a>
     <a class='tab' href="/screenshots"><i class="fa-solid fa-camera"></i><div class='caption'>Screenshots</div></a>
-    <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
-    <a class='tab selected' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
-    <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <a class='tab' href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Installed Tools</div></a>
+  <a class='tab selected' href="/terminals"><i class="fa-solid fa-desktop"></i><div class='caption'>Terminals</div></a>
+  <a class='tab' href="/home?mode=settings"><i class="fa-solid fa-gear"></i><div class='caption'>Settings</div></a>
+  <% if (typeof peer_qr !== 'undefined' && peer_qr) { %>
+  <div class='qr' style='padding:12px 10px; text-align:center;'>
+    <a href="<%=peer_url%>" target="_blank" style="text-decoration:none; color:inherit; display:block;">
+      <img src="<%=peer_qr%>" alt="Open <%=peer_url%>" style="width:128px; height:128px; image-rendering: pixelated;"/>
+      <div class='caption'>Scan to open</div>
+      <div class='caption' style='font-size:10px; opacity:0.7;'><%=peer_url%></div>
+    </a>
+  </div>
+  <% } %>
   </aside>
 </main>
 <script type="application/json" id="plugin-data"><%- JSON.stringify(serializedPlugins) %></script>