openclacky 1.2.16 → 1.2.18

data/lib/clacky/web/billing.js

@@ -126,6 +126,9 @@ const Billing = (() => {
           <div class="billing-controls">
             <div class="billing-period-group">${periodBtns}</div>
             <select id="billing-model-filter" class="billing-model-filter">${modelOptions}</select>
+            <button id="billing-share-btn" class="billing-share-btn" title="${I18n.t('billing.share.tooltip') || 'Share scorecard'}">
+              📤 ${I18n.t('billing.share.btn') || 'Share scorecard'}
+            </button>
             <div class="billing-clear-container">
               <button id="billing-clear-btn" class="billing-clear-btn" title="${I18n.t('billing.clearData') || 'Clear Data'}">
                 🗑️
@@ -169,6 +172,10 @@ const Billing = (() => {
           </div>
         </div>
 
+        <div class="billing-heatmap-row">
+          ${_renderHeatmap()}
+        </div>
+
         <div class="billing-bottom-grid">
           ${_renderTokenBreakdown()}
           ${_renderModelBreakdown()}
@@ -201,8 +208,69 @@ const Billing = (() => {
     // Bind clear button handlers
     _bindClearHandlers();
 
+    // Bind scorecard share button
+    document.getElementById("billing-share-btn")?.addEventListener("click", _openScorecardShare);
+
     // Bind chart tooltip handlers
     _bindChartTooltip();
+    _bindHeatmapTooltip();
+  }
+
+  // Builds the per-period scorecard numbers from a raw summary object, using
+  // the same currency / formatting conventions as the billing dashboard.
+  function _scorecardStatsFor(summary, periodKey) {
+    const prompt = summary.prompt_tokens || 0;
+    const cacheRead = summary.cache_read_tokens || 0;
+    const rate = prompt === 0 ? "0" : ((cacheRead / prompt) * 100).toFixed(1);
+    return {
+      key:          periodKey,
+      period:       _periodLabel(periodKey),
+      cacheHitRate: rate,
+      costStr:      `${_getCurrencySymbol()}${_formatCost(_convertCost(summary.total_cost || 0))}`,
+      tokensStr:    _formatCompact(summary.total_tokens || 0),
+      requests:     _formatNumber(summary.record_count || 0)
+    };
+  }
+
+  // Daily token totals for the heatmap (GitHub-contribution style), oldest →
+  // newest. Each entry: { date: "YYYY-MM-DD", tokens: <total> }.
+  function _heatmapDays() {
+    return (_daily || []).map((d) => ({
+      date:   d.date,
+      tokens: (d.prompt_tokens || 0) + (d.completion_tokens || 0),
+      cost:   d.cost || 0
+    }));
+  }
+
+  function _openScorecardShare() {
+    if (!_summary || typeof Share === "undefined" || !Share.openScorecard) return;
+    const modelParam = (_currentModel && _currentModel !== "all") ? `&model=${encodeURIComponent(_currentModel)}` : "";
+
+    // Open instantly with the period the dashboard already has, then fetch the
+    // other periods in the background and hot-swap them in (no blocking await).
+    const periods = {};
+    periods[_currentPeriod] = _scorecardStatsFor(_summary, _currentPeriod);
+
+    Share.openScorecard({
+      periods:       periods,
+      defaultPeriod: _currentPeriod,
+      heatmap:       _heatmapDays(),
+      period:        periods[_currentPeriod].period,
+      cacheHitRate:  periods[_currentPeriod].cacheHitRate,
+      costStr:       periods[_currentPeriod].costStr,
+      tokensStr:     periods[_currentPeriod].tokensStr,
+      requests:      periods[_currentPeriod].requests
+    });
+
+    const others = ["day", "week", "month"].filter((p) => p !== _currentPeriod);
+    others.forEach((p) => {
+      fetch(`/api/billing/summary?period=${p}${modelParam}`)
+        .then((r) => r.json())
+        .then((summary) => {
+          if (Share.addScorecardPeriod) Share.addScorecardPeriod(p, _scorecardStatsFor(summary, p));
+        })
+        .catch(() => {});
+    });
   }
 
   function _bindChartTooltip() {
@@ -261,6 +329,42 @@ const Billing = (() => {
     });
   }
 
+  function _bindHeatmapTooltip() {
+    const grid = document.getElementById("billing-heat-grid");
+    const tooltip = document.getElementById("billing-tooltip");
+    if (!grid || !tooltip) return;
+
+    grid.addEventListener("mousemove", (e) => {
+      const cell = e.target.closest(".billing-heat-cell");
+      if (!cell || cell.classList.contains("is-empty") || !cell.dataset.date) {
+        tooltip.style.display = "none";
+        return;
+      }
+
+      tooltip.innerHTML = `
+        <div class="tooltip-header">
+          <span class="tooltip-date">${cell.dataset.date}</span>
+        </div>
+        <div class="tooltip-row">
+          <span class="tooltip-dot tooltip-total"></span>
+          <span class="tooltip-label">${I18n.t("billing.totalTokens") || "Total Tokens"}</span>
+          <span class="tooltip-value">${cell.dataset.tokens}</span>
+        </div>
+        <div class="tooltip-row">
+          <span class="tooltip-label">${I18n.t("billing.cost") || "Cost"}</span>
+          <span class="tooltip-value">${cell.dataset.cost}</span>
+        </div>
+      `;
+      tooltip.style.display = "block";
+      tooltip.style.left = `${e.clientX + 15}px`;
+      tooltip.style.top = `${e.clientY - 10}px`;
+    });
+
+    grid.addEventListener("mouseleave", () => {
+      tooltip.style.display = "none";
+    });
+  }
+
   function _bindClearHandlers() {
     const clearBtn = document.getElementById("billing-clear-btn");
     const clearPopup = document.getElementById("billing-clear-popup");
@@ -448,6 +552,46 @@ const Billing = (() => {
     `;
   }
 
+  function _renderHeatmap() {
+    const days = _heatmapDays();
+    if (!days || days.length === 0) {
+      return `<div class="billing-chart-card billing-chart-wide"><div class="billing-chart-empty">${I18n.t("billing.noData") || "No data available"}</div></div>`;
+    }
+
+    const maxTok = Math.max(...days.map(d => d.tokens), 1);
+    const firstDow = new Date(days[0].date + "T00:00:00").getDay();
+    const cells = [];
+    for (let i = 0; i < firstDow; i++) cells.push('<div class="billing-heat-cell is-empty"></div>');
+    days.forEach((d) => {
+      const ratio = d.tokens / maxTok;
+      const lvl = d.tokens === 0 ? 0 : ratio >= 0.75 ? 5 : ratio >= 0.5 ? 4 : ratio >= 0.25 ? 3 : ratio >= 0.08 ? 2 : 1;
+      const costStr = `${_getCurrencySymbol()}${_formatCost(_convertCost(d.cost))}`;
+      cells.push(`<div class="billing-heat-cell" data-level="${lvl}" data-date="${d.date}" data-tokens="${_formatCompact(d.tokens)}" data-cost="${costStr}"></div>`);
+    });
+
+    const dowLabels = (I18n.t("billing.heatmap.dow") || "S,M,T,W,T,F,S").split(",");
+    const dowHeader = dowLabels.map(l => `<span class="billing-heat-dow">${_esc(l)}</span>`).join("");
+
+    return `
+      <div class="billing-chart-card billing-chart-wide billing-heatmap-card">
+        <div class="billing-chart-header">
+          <h4>${I18n.t("billing.heatmap.title") || "Activity"}</h4>
+          <div class="billing-heat-legend">
+            <span>${I18n.t("billing.heatmap.less") || "Less"}</span>
+            <span class="billing-heat-cell" data-level="1"></span>
+            <span class="billing-heat-cell" data-level="2"></span>
+            <span class="billing-heat-cell" data-level="3"></span>
+            <span class="billing-heat-cell" data-level="4"></span>
+            <span class="billing-heat-cell" data-level="5"></span>
+            <span>${I18n.t("billing.heatmap.more") || "More"}</span>
+          </div>
+        </div>
+        <div class="billing-heat-dow-row">${dowHeader}</div>
+        <div class="billing-heat-grid" id="billing-heat-grid">${cells.join("")}</div>
+      </div>
+    `;
+  }
+
   function _renderCombinedChart() {
     if (!_daily || _daily.length === 0) {
       return `<div class="billing-chart-card billing-chart-wide"><div class="billing-chart-empty">${I18n.t("billing.noData") || "No data available"}</div></div>`;

data/lib/clacky/web/i18n.js

@@ -709,6 +709,67 @@ const I18n = (() => {
       "notify.tooltip.on":        "Sound on task complete: ON (click to mute)",
       "notify.tooltip.off":       "Sound on task complete: OFF (click to enable)",
 
+      "share.tooltip":            "Share",
+      "share.copy.1":             "Been running {{brand}} with domestic models (Kimi, DeepSeek, GLM…) — first-class support, no proxy hacks. Solid.",
+      "share.copy.2":             "{{brand}} is stingy with tokens in the best way — prompt caching keeps my AI bill tiny. Recommend.",
+      "share.copy.3":             "Installed {{brand}} in one line and it just worked. If you build with AI, give it a try.",
+      "share.copy.4":             "{{brand}}: works with domestic models, saves a ton of tokens, installs in seconds. My daily driver now.",
+      "share.copied":             "Copied to clipboard",
+      "share.copyFailed":         "Copy failed",
+      "share.modal.title":        "Share {{brand}}",
+      "share.modal.subtitle":     "Pick a poster style, tweak the text, then post it anywhere.",
+      "share.platform.weibo":     "Weibo",
+      "share.platform.xhs":       "Xiaohongshu",
+      "share.platform.wechat":    "WeChat",
+      "share.platform.bilibili":  "Bilibili",
+      "share.action.copyLink":    "Copy link",
+      "share.action.copyText":    "Copy text",
+      "share.action.download":    "Download poster",
+      "share.action.downloadAndCopy": "Download poster + copy text",
+      "share.action.toWeibo":     "Share to Weibo",
+      "share.action.shuffle":     "Shuffle text",
+      "share.action.systemShare": "Share…",
+      "share.editor.label":       "Edit before sharing",
+      "share.theme.label":        "Poster style",
+      "share.theme.geek":         "Geek dark",
+      "share.theme.light":        "Clean light",
+      "share.theme.warm":         "Warm vibe",
+      "share.hint.xhs":           "Poster downloaded + text copied — open Xiaohongshu, create a post and pick this image.",
+      "share.hint.wechat":        "Poster downloaded + text copied — open WeChat and share it to Moments.",
+      "share.hint.bilibili":      "Poster downloaded + text copied — open Bilibili and post it with this image.",
+      "share.poster.tagline":     "Domestic models · Token-thrifty · One-line install — {{brand}}.",
+      "share.poster.scan":        "Scan to learn more",
+      "share.prompt.message":     "Nice work! Loving {{brand}}? Share it with a friend.",
+      "share.prompt.action":      "Share",
+      // ── Scorecard share (B-line: spend / cache-hit bragging) ──
+      "billing.share.btn":              "Share scorecard",
+      "billing.share.tooltip":          "Share your usage scorecard",
+      "share.scorecard.modal.title":    "My {{brand}} scorecard",
+      "share.scorecard.modal.subtitle": "Pick a style, tweak the text — your numbers are filled in.",
+      "share.scorecard.poster.title":   "My AI Work Scorecard",
+      "share.scorecard.poster.cacheLabel":  "cache hit rate",
+      "share.scorecard.poster.costLabel":   "spent",
+      "share.scorecard.poster.tokensLabel": "tokens",
+      "share.scorecard.poster.scan":        "Scan to try it",
+      "share.scorecard.poster.heatmapLabel": "Daily usage this month",
+      "share.scorecard.period.day":     "Today",
+      "share.scorecard.period.week":    "This week",
+      "share.scorecard.period.month":   "This month",
+      "share.scorecard.golden.high":    "Almost free — {{cacheHitRate}}% of my context was cache hits.",
+      "share.scorecard.golden.mid":     "{{tokens}} tokens, {{cost}} total. Caching pays off.",
+      "share.scorecard.golden.low":     "{{requests}} tasks done for {{cost}}. Worth every cent.",
+      "share.scorecard.copy.weibo.1":   "Running my AI tasks on {{brand}} — {{cacheHitRate}}% cache hit rate, only {{cost}} this period 😎 #AICoding# #SaveTokens#",
+      "share.scorecard.copy.weibo.2":   "Did the math: {{requests}} tasks on {{brand}} this period for {{cost}}. Prompt caching is doing the heavy lifting 🔥 #AICoding#",
+      "share.scorecard.copy.weibo.3":   "{{cacheHitRate}}% cache hits, {{tokens}} tokens, {{cost}} total. {{brand}} keeps my AI bill tiny 😎 #SaveTokens#",
+      "share.scorecard.copy.xhs.1":     "Found a way to save on AI tokens‼️\nUsing {{brand}}, my cache hit rate is {{cacheHitRate}}%🤯\n{{tokens}} tokens this period for just {{cost}}💰\nIf you build with AI, try this ⬇️\n#AIGC #DevTools #SaveMoney",
+      "share.scorecard.copy.xhs.2":     "AI bill check 🧾\n{{brand}} got me {{cacheHitRate}}% cache hits this period ✨\nOnly {{cost}} for {{requests}} tasks 😱\nGenuinely saving money, had to share 👇\n#AIGC #DevTools #程序员",
+      "share.scorecard.copy.xhs.3":     "How is my AI cost this low 🤯\n{{cacheHitRate}}% cache hit rate on {{brand}}\n{{tokens}} tokens → {{cost}} 💰\nSave this one ⬇️\n#AIGC #效率工具 #SaveMoney",
+      "share.scorecard.copy.wechat.1":  "This period my AI tasks ran {{tokens}} tokens, {{cacheHitRate}}% cache hit, cost {{cost}}. Knowing the right tools really saves money.",
+      "share.scorecard.copy.wechat.2":  "Quick share: {{requests}} AI tasks done for {{cost}} this period on {{brand}}. The prompt caching genuinely cuts the bill.",
+      "share.scorecard.copy.wechat.3":  "{{cacheHitRate}}% cache hit rate this period — {{brand}} brought my AI cost down to {{cost}}. Worth a look if you build with AI.",
+      "share.scorecard.copy.bilibili.1":"Sharing some numbers: {{cacheHitRate}}% cache hit rate on {{brand}} this period, token cost down to {{cost}}. Its prompt caching is no joke.",
+      "share.scorecard.copy.bilibili.2":"Ran the numbers: {{tokens}} tokens, {{requests}} tasks, {{cost}} total on {{brand}}. Caching does most of the work.",
+      "share.scorecard.copy.copylink.1":"My {{brand}} scorecard: {{cacheHitRate}}% cache hit, {{tokens}} tokens, {{cost}}.",
       // ── Session info bar / Model switcher benchmark ──
       "sib.bench.btn":        "Benchmark",
       "sib.bench.tooltip":    "Test response latency for every configured model",
@@ -735,6 +796,10 @@ const I18n = (() => {
       "billing.model":           "Model",
       "billing.cost":            "Cost",
       "billing.dailyUsage":      "Usage Details",
+      "billing.heatmap.title":   "Daily Activity",
+      "billing.heatmap.dow":     "S,M,T,W,T,F,S",
+      "billing.heatmap.less":    "Less",
+      "billing.heatmap.more":    "More",
       "billing.period.day":      "Today",
       "billing.period.week":     "This Week",
       "billing.period.month":    "This Month",
@@ -1460,6 +1525,67 @@ const I18n = (() => {
       "notify.tooltip.on":        "任务完成提示音：已开启（点击关闭）",
       "notify.tooltip.off":       "任务完成提示音：已关闭（点击开启）",
 
+      "share.tooltip":            "分享",
+      "share.copy.1":             "{{brand}} 对国产模型（Kimi、DeepSeek、智谱…）适配很到位，原生支持不用折腾代理，好用。",
+      "share.copy.2":             "{{brand}} 是真省 Token —— 靠 Prompt 缓存把我的 AI 账单压得很低，推荐。",
+      "share.copy.3":             "一行命令装好 {{brand}}，开箱即用。做 AI 的可以试试。",
+      "share.copy.4":             "{{brand}}：适配国产模型、省 Token、安装超简单，现在每天都在用。",
+      "share.copied":             "已复制到剪贴板",
+      "share.copyFailed":         "复制失败",
+      "share.modal.title":        "分享 {{brand}}",
+      "share.modal.subtitle":     "选个海报风格，改改文案，发到任意平台。",
+      "share.platform.weibo":     "微博",
+      "share.platform.xhs":       "小红书",
+      "share.platform.wechat":    "微信",
+      "share.platform.bilibili":  "B站",
+      "share.action.copyLink":    "复制链接",
+      "share.action.copyText":    "复制文案",
+      "share.action.download":    "下载海报",
+      "share.action.downloadAndCopy": "下载海报 + 复制文案",
+      "share.action.toWeibo":     "一键发微博",
+      "share.action.shuffle":     "换一条",
+      "share.action.systemShare": "分享…",
+      "share.editor.label":       "分享前可以改",
+      "share.theme.label":        "海报风格",
+      "share.theme.geek":         "极客深色",
+      "share.theme.light":        "清爽浅色",
+      "share.theme.warm":         "种草暖色",
+      "share.hint.xhs":           "海报已下载、文案已复制 —— 打开小红书发笔记时选这张图就行。",
+      "share.hint.wechat":        "海报已下载、文案已复制 —— 打开微信分享到朋友圈吧。",
+      "share.hint.bilibili":      "海报已下载、文案已复制 —— 打开 B 站发动态时配上这张图。",
+      "share.poster.tagline":     "适配国产模型 · 省 Token · 一行安装 —— {{brand}}。",
+      "share.poster.scan":        "扫码了解更多",
+      "share.prompt.message":     "干得漂亮！喜欢 {{brand}} 的话，分享给朋友吧。",
+      "share.prompt.action":      "去分享",
+      // ── 成绩单分享（B 线：省钱 / 缓存命中炫耀）──
+      "billing.share.btn":              "晒成绩单",
+      "billing.share.tooltip":          "分享我的用量成绩单",
+      "share.scorecard.modal.title":    "我的 {{brand}} 成绩单",
+      "share.scorecard.modal.subtitle": "选个风格、改改文案 —— 数字已经帮你填好了。",
+      "share.scorecard.poster.title":   "我的 AI 工作成绩单",
+      "share.scorecard.poster.cacheLabel":  "缓存命中率",
+      "share.scorecard.poster.costLabel":   "花费",
+      "share.scorecard.poster.tokensLabel": "Token",
+      "share.scorecard.poster.scan":        "扫码也来试试",
+      "share.scorecard.poster.heatmapLabel": "本月每日用量",
+      "share.scorecard.period.day":     "当天",
+      "share.scorecard.period.week":    "当周",
+      "share.scorecard.period.month":   "当月",
+      "share.scorecard.golden.high":    "几乎零成本 —— {{cacheHitRate}}% 的上下文都命中了缓存。",
+      "share.scorecard.golden.mid":     "{{tokens}} token、共花 {{cost}}，缓存是真省。",
+      "share.scorecard.golden.low":     "{{requests}} 个任务只花了 {{cost}}，值。",
+      "share.scorecard.copy.weibo.1":   "我用 {{brand}} 跑 AI 任务，缓存命中率 {{cacheHitRate}}%，这段时间只花了 {{cost}} 😎 #AI编程# #省token#",
+      "share.scorecard.copy.weibo.2":   "算了笔账：本期 {{requests}} 个 AI 任务在 {{brand}} 上只花了 {{cost}}，prompt 缓存立大功 🔥 #AI编程#",
+      "share.scorecard.copy.weibo.3":   "缓存命中 {{cacheHitRate}}%、{{tokens}} token、共 {{cost}}。{{brand}} 把我的 AI 账单压得很低 😎 #省token#",
+      "share.scorecard.copy.xhs.1":     "姐妹们我发现个省 token 的神器‼️\n用 {{brand}} 做 AI 任务，缓存命中率居然有 {{cacheHitRate}}%🤯\n这段时间 {{tokens}} token 才花 {{cost}}💰\n做 AI 的真的可以试试⬇️\n#AIGC #程序员 #省钱攻略",
+      "share.scorecard.copy.xhs.2":     "查了下我的 AI 账单 🧾\n本期 {{brand}} 缓存命中 {{cacheHitRate}}% ✨\n{{requests}} 个任务只花 {{cost}} 😱\n是真省钱，必须分享 👇\n#AIGC #程序员 #效率工具",
+      "share.scorecard.copy.xhs.3":     "我的 AI 成本怎么这么低 🤯\n{{brand}} 缓存命中率 {{cacheHitRate}}%\n{{tokens}} token → {{cost}} 💰\n建议收藏这条 ⬇️\n#AIGC #效率工具 #省钱",
+      "share.scorecard.copy.wechat.1":  "这段时间 AI 任务跑了 {{tokens}} token，缓存命中 {{cacheHitRate}}%，花了 {{cost}}。会用工具是真省钱。",
+      "share.scorecard.copy.wechat.2":  "随手分享：本期在 {{brand}} 上做了 {{requests}} 个 AI 任务，只花 {{cost}}。prompt 缓存是真能省账单。",
+      "share.scorecard.copy.wechat.3":  "本期缓存命中率 {{cacheHitRate}}% —— {{brand}} 把我的 AI 花费压到了 {{cost}}。做 AI 的值得看看。",
+      "share.scorecard.copy.bilibili.1":"分享个数据：本期用 {{brand}} 缓存命中率 {{cacheHitRate}}%，token 成本压到 {{cost}}。prompt cache 这块它确实做得狠。",
+      "share.scorecard.copy.bilibili.2":"算了下账：{{tokens}} token、{{requests}} 个任务、共 {{cost}}，全靠缓存扛着。",
+      "share.scorecard.copy.copylink.1":"我的 {{brand}} 成绩单：缓存命中 {{cacheHitRate}}%，{{tokens}} token，{{cost}}。",
       // ── 会话信息栏 / 模型切换器 测速 ──
       "sib.bench.btn":        "测速",
       "sib.bench.tooltip":    "测试所有已配置模型的响应延迟",
@@ -1486,6 +1612,10 @@ const I18n = (() => {
       "billing.model":           "模型",
       "billing.cost":            "费用",
       "billing.dailyUsage":      "使用详情",
+      "billing.heatmap.title":   "每日活跃度",
+      "billing.heatmap.dow":     "日,一,二,三,四,五,六",
+      "billing.heatmap.less":    "少",
+      "billing.heatmap.more":    "多",
       "billing.period.day":      "今日",
       "billing.period.week":     "本周",
       "billing.period.month":    "本月",
@@ -1547,6 +1677,19 @@ const I18n = (() => {
     return str;
   }
 
+  // Collects numbered variant keys (`prefix.1`, `prefix.2`, …) into an array,
+  // each interpolated with vars. Stops at the first missing index.
+  function tList(prefix, vars = {}) {
+    const dict = TRANSLATIONS[_lang] || TRANSLATIONS[DEFAULT_LANG];
+    const out = [];
+    for (let i = 1; ; i++) {
+      const key = prefix + "." + i;
+      if (dict[key] == null && TRANSLATIONS[DEFAULT_LANG][key] == null) break;
+      out.push(t(key, vars));
+    }
+    return out;
+  }
+
   /**
    * Scan the DOM and apply translations to:
    *   data-i18n="key"             → element.textContent
@@ -1589,7 +1732,7 @@ const I18n = (() => {
   }
 
   // ── Public API ─────────────────────────────────────────────────────────────
-  return { lang, setLang, t, applyAll };
+  return { lang, setLang, t, tList, applyAll };
 })();
 
 // ── Thinking Verbs for Progress Animation ──────────────────────────────────

data/lib/clacky/web/index.html

@@ -44,6 +44,15 @@
       </div>
     </div>
     <div id="header-right">
+      <button id="share-toggle-header" class="theme-toggle-btn" data-i18n-title="share.tooltip" title="Share">
+        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon-sm">
+          <circle cx="18" cy="5" r="3"/>
+          <circle cx="6" cy="12" r="3"/>
+          <circle cx="18" cy="19" r="3"/>
+          <line x1="8.59" y1="13.51" x2="15.42" y2="17.49"/>
+          <line x1="15.41" y1="6.51" x2="8.59" y2="10.49"/>
+        </svg>
+      </button>
       <button id="notify-toggle-header" class="theme-toggle-btn" data-i18n-title="notify.tooltip.off" title="Sound on task complete"></button>
       <button id="theme-toggle-header" class="theme-toggle-btn" title="Toggle theme">
         <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon-sm">
@@ -1340,6 +1349,8 @@
 <script src="/profile.js"></script>
 <script src="/version.js"></script>
 <script src="/sidebar.js"></script>
+<script src="/vendor/qrcode/qrcode.min.js"></script>
+<script src="/share.js"></script>
 <script src="/app.js"></script>
 </body>
 </html>