pinokiod 8.0.39 → 8.0.41

package/server/views/app.ejs

@@ -2624,6 +2624,71 @@ body.dark .appcanvas > aside .menu-actions .header-item {
   color: var(--pinokio-sidebar-tab-active-color) !important;
   box-shadow: none;
 }
+#save-space-tab .save-space-copy {
+  display: flex;
+  flex: 1 1 auto;
+  min-width: 0;
+  flex-direction: column;
+  gap: 2px;
+}
+#save-space-tab .save-space-prompt {
+  display: none;
+  min-width: 0;
+  color: var(--pinokio-sidebar-tab-muted);
+  font-size: 10px;
+  font-weight: 400;
+  line-height: 1.25;
+  overflow-wrap: break-word;
+  white-space: normal;
+}
+#save-space-tab .save-space-status {
+  min-width: 28px;
+  height: 15px;
+  margin-left: auto;
+  padding: 0 5px;
+  box-sizing: border-box;
+  border-radius: 999px;
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  background: rgba(15, 23, 42, 0.07);
+  color: rgba(31, 41, 55, 0.62);
+  font-size: 9px;
+  font-weight: 700;
+  line-height: 1;
+  white-space: nowrap;
+}
+#save-space-tab .save-space-status[hidden] {
+  display: none !important;
+}
+#save-space-tab .save-space-status[data-state="new"] {
+  border: 1px solid rgba(71, 85, 105, 0.22);
+  background: transparent;
+  color: rgba(31, 41, 55, 0.72);
+}
+.appcanvas.vertical #save-space-tab {
+  width: 100%;
+  max-width: none;
+}
+.appcanvas.vertical #save-space-tab[data-vault-state="new"] {
+  background: var(--pinokio-sidebar-tab-hover) !important;
+}
+.appcanvas.vertical #save-space-tab[data-vault-state="new"] .tab {
+  align-items: flex-start;
+}
+.appcanvas.vertical #save-space-tab[data-vault-state="new"] .save-space-prompt:not([hidden]) {
+  display: block;
+}
+body.dark #save-space-tab .save-space-status {
+  background: rgba(255, 255, 255, 0.08);
+  color: rgba(229, 231, 235, 0.7);
+}
+body.dark #save-space-tab .save-space-status[data-state="new"] {
+  border-color: rgba(226, 232, 240, 0.22);
+  background: transparent;
+  color: rgba(248, 250, 252, 0.76);
+}
 body.dark .appcanvas > aside .menu-actions .header-item:hover,
 body.dark .appcanvas > aside .menu-actions .header-item:focus-visible {
   background: var(--pinokio-sidebar-tab-hover) !important;
@@ -8143,6 +8208,7 @@ body.dark .pinokio-custom-terminal-header {
 <script src="/sweetalert2.js"></script>
 <script src="/nav.js"></script>
 <script src="/common.js"></script>
+<script src="/storage-size.js"></script>
 <script src="/opener.js"></script>
 <script src="/report.js"></script>
 <script src="/normalize.js"></script>
@@ -8162,6 +8228,9 @@ body.dark .pinokio-custom-terminal-header {
 <script src="/tippy-bundle.umd.min.js"></script>
 <script src="/tab-link-popover.js"></script>
 <script src="/browser-popout-surface.js"></script>
+<% if (typeof vault_enabled !== 'undefined' && vault_enabled) { %>
+<script src="/vault-nav.js" defer></script>
+<% } %>
 <script>
 (function() {
   try {
@@ -8459,6 +8528,18 @@ body.dark .pinokio-custom-terminal-header {
             <div class='flexible'></div>
           </div>
         </button>
+        <% if (typeof vault_enabled !== 'undefined' && vault_enabled) { %>
+        <a id='save-space-tab' data-mode="refresh" target="app-vault" href="/vault/app/<%=encodeURIComponent(name)%>" class="btn header-item frame-link" data-index="vault" data-static="retain" data-tab-link-popover="false" data-app-vault-tab data-app-vault-name="<%=name%>">
+          <div class='tab'>
+            <i class="fa-solid fa-hard-drive menu-action-leading-icon"></i>
+            <div class="save-space-copy">
+              <div class='display'>Save space</div>
+              <div class="save-space-prompt" data-app-vault-prompt hidden>Find duplicate files and use less disk</div>
+            </div>
+            <span class="save-space-status" data-app-vault-status aria-hidden="true" hidden></span>
+          </div>
+        </a>
+        <% } %>
         <% if (typeof autolaunch_app !== 'undefined' && autolaunch_app) { %>
           <div class="app-autolaunch" data-app-autolaunch data-app-id="<%=name%>">
             <button type="button" class="app-autolaunch-row" data-app-autolaunch-button data-enabled="<%= autolaunch_app.autolaunch_enabled ? 'true' : 'false' %>" aria-haspopup="dialog" aria-expanded="false">
@@ -12570,19 +12651,7 @@ const rerenderMenuSection = (container, html) => {
         return res.json()
       }).then((res) => {
         if (res.du > 0) {
-          let val
-          //let k = 1024
-          let k = 1000
-          if (res.du > k * k * k) {
-            // GB
-            val = `${Math.floor(res.du/k/k/k * 100) / 100} GB`
-          } else if (res.du > k * k) {
-            // MB
-            val = `${Math.floor(res.du/k/k * 100) / 100} MB`
-          } else {
-            // KB
-            val = `${Math.floor(res.du/k * 100) / 100} KB`
-          }
+          const val = window.PinokioFormatStorageSize(res.du)
           els.forEach((el) => {
             const metricLabel = el.getAttribute("data-metric-label")
             el.innerHTML = `<i class="fa-solid fa-database"></i> ${metricLabel ? `${metricLabel} ` : ""}${val}`
@@ -16320,10 +16389,18 @@ const rerenderMenuSection = (container, html) => {
             ? (selected_tab.getAttribute("target") || "")
             : ""
           if (!selected_tab || !targetsMatch(selectedTarget, frameName)) {
-            match.click()
+            document.querySelectorAll(".frame-link").forEach((link) => {
+              link.classList.remove("selected")
+            })
+            match.classList.add("selected")
+            syncActiveNestedPath({ selectedLink: match })
+            if (typeof syncLogsSelectedState === "function") {
+              syncLogsSelectedState(match)
+            }
+            if (shouldPersistFrameLink(match)) {
+              persistFrameLinkSelection(match)
+            }
           }
-        } else if (selected_tab) {
-          selected_tab.click()
         }
       } else if (selected_tab) {
         selected_tab.click()

package/server/views/connect/huggingface.ejs

@@ -168,9 +168,9 @@
   <script>
     const LOGIN_URL = "/connect/huggingface/login"
     const LOGOUT_URL = "/connect/huggingface/logout"
-    const KEYS_URL = "/connect/huggingface/keys"
+    const STATUS_URL = "/connect/status/huggingface"
     const PROFILE_URL = "/connect/huggingface/profile"
-    const POLL_INTERVAL = 2000
+    const POLL_INTERVAL = 5000
     const POLL_TIMEOUT = 120000
 
     const badgeElement = document.getElementById("hf-badge")
@@ -261,9 +261,9 @@
       return res.json()
     }
 
-    async function readToken() {
-      const json = await postJSON(KEYS_URL)
-      return json && json.access_token && !json.error ? json.access_token : null
+    async function isConnected() {
+      const json = await fetch(STATUS_URL, { cache: "no-store" }).then((res) => res.json())
+      return Boolean(json && json.connected)
     }
 
     async function showConnected() {
@@ -326,8 +326,7 @@
     }
 
     async function pollLoginStatus() {
-      const token = await readToken()
-      if (token) {
+      if (await isConnected()) {
         await showConnected()
       }
     }
@@ -415,8 +414,7 @@
 
     window.addEventListener("load", async () => {
       try {
-        const token = await readToken()
-        if (token) {
+        if (await isConnected()) {
           await showConnected()
           return
         }

package/server/views/partials/main_sidebar.ejs

@@ -25,8 +25,10 @@
 
     <div class='main-sidebar-section' aria-label="Manage">
       <div class="main-sidebar-section-title">Manage</div>
+      <% if (typeof vaultEnabled === "undefined" || vaultEnabled) { %>
+        <a class="tab <%= sidebarSelected === 'vault' ? 'selected' : '' %>" href="/vault" data-main-sidebar-vault-tab><i class="fa-solid fa-hard-drive"></i><div class='caption'>Save space</div><span class="main-sidebar-status-badge" data-main-sidebar-vault-status aria-hidden="true" hidden></span></a>
+      <% } %>
       <a class="tab <%= sidebarSelected === 'checkpoints' ? 'selected' : '' %>" href="/checkpoints"><i class="fa-solid fa-clock-rotate-left"></i><div class='caption'>Checkpoints</div></a>
-      <a class="tab <%= sidebarSelected === 'vault' ? 'selected' : '' %>" href="/vault"><i class="fa-solid fa-hard-drive"></i><div class='caption'>Vault</div></a>
       <a class="tab <%= sidebarSelected === 'tools' ? 'selected' : '' %>" href="/tools"><i class="fa-solid fa-toolbox"></i><div class='caption'>Tools</div></a>
       <a class="tab <%= sidebarSelected === 'plugins' ? 'selected' : '' %>" href="/plugins"><i class="fa-solid fa-plug-circle-bolt"></i><div class='caption'>Plugins</div></a>
       <a class="tab <%= sidebarSelected === 'tasks' ? 'selected' : '' %>" href="/tasks"><i class="fa-solid fa-list-check"></i><div class='caption'>Tasks</div></a>
@@ -49,6 +51,9 @@
     </div>
   </nav>
 </aside>
+<% if (typeof vaultEnabled === "undefined" || vaultEnabled) { %>
+<script src="/vault-nav.js"></script>
+<% } %>
 <script>
   (() => {
     const body = document.body;

package/server/views/partials/vault_workspace.ejs

@@ -0,0 +1,55 @@
+<section class='task-shell vault-shell'>
+  <div class='task-shell-body'>
+    <div class='vault-body'>
+      <section class='vault-overview'>
+        <div class='vault-metrics' id='vault-metrics'></div>
+        <div class='vault-overview-actions'>
+          <label class='vault-candidate-size' for='vault-candidate-size'>
+            <span id='vault-candidate-size-label'></span>
+            <select id='vault-candidate-size'></select>
+          </label>
+          <button class='vault-button primary' id='btn-scan' type='button'></button>
+          <% if (!appMode) { %>
+          <details class='vault-advanced' id='vault-advanced'>
+            <summary class='vault-icon-button' id='btn-vault-options'><i class='fa-solid fa-ellipsis'></i></summary>
+            <div class='vault-advanced-menu'>
+              <div class='vault-storage-details' id='vault-storage-details'></div>
+              <div class='vault-advanced-divider'></div>
+              <div class='vault-advanced-title' id='vault-repair-title'></div>
+              <p class='vault-advanced-copy' id='vault-repair-description'></p>
+              <button class='vault-button' id='btn-repair' type='button'></button>
+            </div>
+          </details>
+          <% } %>
+        </div>
+      </section>
+      <div class='vault-scan-state' id='vault-scan-state' aria-live='polite'></div>
+      <div class='vault-result' id='vault-result' role='status' aria-live='polite'></div>
+      <div class='vault-feedback' id='vault-feedback' role='status' aria-live='polite'></div>
+      <div class='vault-cloud-warning' id='vault-cloud-warning' role='status'></div>
+      <section class='vault-explorer' id='vault-explorer'>
+        <aside class='vault-rail'>
+          <div class='vault-rail-section'>
+            <div class='vault-rail-label' id='views-label'></div>
+            <div class='vault-nav-list' id='vault-views'></div>
+          </div>
+          <div class='vault-rail-section'>
+            <div class='vault-rail-heading'>
+              <div class='vault-rail-label' id='locations-label'></div>
+              <% if (!appMode) { %>
+              <button class='vault-rail-add' id='btn-add-source' type='button'><i class='fa-solid fa-plus'></i></button>
+              <% } %>
+            </div>
+            <div id='vault-locations'></div>
+          </div>
+          <div class='vault-rail-footer' id='vault-rail-footer'></div>
+        </aside>
+        <section class='vault-pane' id='vault-pane'>
+          <div class='vault-toolbar' id='vault-toolbar'></div>
+          <div class='vault-table-wrap' id='vault-table-wrap'></div>
+          <footer class='vault-pane-footer' id='vault-pane-footer'></footer>
+        </section>
+      </section>
+    </div>
+  </div>
+</section>