@cccarv82/freya 1.0.56 → 1.0.58

package/cli/web-ui.css

@@ -155,22 +155,24 @@ body {
   color: var(--muted);
 }
 
-.statusPill {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 6px 10px;
-  border: 1px solid var(--line);
-  border-radius: 999px;
-  background: var(--paper2);
-  font-family: var(--mono);
-  font-size: 12px;
-  color: var(--muted);
-}
-
 .dot { width: 10px; height: 10px; border-radius: 6px; background: rgba(148,163,184,.6); }
 .dot.ok { background: rgba(16,185,129,.85); }
 .dot.err { background: rgba(239,68,68,.85); }
+.dot.run { background: rgba(56,189,248,.9); }
+.dot.plan { background: rgba(250,204,21,.9); }
+
+.railStatus {
+  width: 16px;
+  height: 16px;
+  border-radius: 999px;
+  border: 1px solid var(--line2);
+  background: rgba(148,163,184,.6);
+  box-shadow: 0 0 0 4px rgba(0,0,0,.25);
+}
+.railStatus.ok { background: rgba(16,185,129,.9); }
+.railStatus.err { background: rgba(239,68,68,.9); }
+.railStatus.run { background: rgba(56,189,248,.9); }
+.railStatus.plan { background: rgba(250,204,21,.9); }
 
 .sidePath {
   margin: 10px 6px 10px;
@@ -285,6 +287,52 @@ body {
   color: var(--muted);
   margin-bottom: 10px;
 }
+
+.reportsHeader {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 12px;
+}
+
+.reportsTitle { font-size: 18px; font-weight: 700; }
+.reportsSubtitle { font-size: 12px; color: var(--faint); margin-top: 4px; }
+.reportsActions { display: flex; gap: 10px; }
+
+.reportsTools { margin-bottom: 12px; }
+.reportsTools input { width: 100%; }
+
+.reportsGrid {
+  display: grid;
+  gap: 14px;
+}
+
+.reportCard {
+  border: 1px solid var(--line);
+  border-radius: 16px;
+  padding: 14px;
+  background: var(--paper);
+  box-shadow: var(--shadow2);
+  display: grid;
+  gap: 12px;
+}
+
+.reportHead {
+  display: flex;
+  justify-content: space-between;
+  gap: 14px;
+}
+
+.reportName { font-weight: 700; }
+.reportMeta { font-size: 12px; color: var(--faint); margin-top: 4px; }
+.reportHeadActions { display: flex; gap: 8px; align-items: center; }
+
+.reportBody { display: grid; gap: 10px; }
+.reportPreview { border: 1px solid var(--line); border-radius: 12px; padding: 12px; background: rgba(0,0,0,.18); }
+.reportRaw { display: none; }
+.reportCard.raw .reportPreview { display: none; }
+.reportCard.raw .reportRaw { display: block; }
 .centerHead { display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; margin-bottom: 14px; }
 .statusLine { display:flex; align-items:center; justify-content:flex-end; gap: 12px; }
 

package/cli/web-ui.js

@@ -8,6 +8,8 @@
     lastReportPath: null,
     lastText: '',
     reports: [],
+    reportTexts: {},
+    reportModes: {},
     selectedReport: null,
     lastPlan: '',
     lastApplied: null,
@@ -18,24 +20,18 @@
     chatLoaded: false
   };
 
-  function applyTheme(theme) {
-    document.documentElement.setAttribute('data-theme', theme);
-    localStorage.setItem('freya.theme', theme);
-    const t = $('themeToggle');
-    if (t) t.textContent = theme === 'dark' ? 'Claro' : 'Escuro';
-  }
-
-  function toggleTheme() {
-    const t = localStorage.getItem('freya.theme') || 'dark';
-    applyTheme(t === 'dark' ? 'light' : 'dark');
+  function applyDarkTheme() {
+    document.documentElement.setAttribute('data-theme', 'dark');
   }
 
   function setPill(kind, text) {
     const dot = $('dot');
-    if (!dot) return;
-    dot.classList.remove('ok', 'err');
-    if (kind === 'ok') dot.classList.add('ok');
-    if (kind === 'err') dot.classList.add('err');
+    const rail = $('railStatus');
+    const classes = ['ok', 'err', 'run', 'plan'];
+    if (dot) dot.classList.remove(...classes);
+    if (rail) rail.classList.remove(...classes);
+    if (dot && classes.includes(kind)) dot.classList.add(kind);
+    if (rail && classes.includes(kind)) rail.classList.add(kind);
     const pill = $('pill');
     if (pill) pill.textContent = text;
     const status = $('status');
@@ -378,9 +374,13 @@
     const def = (window.__FREYA_DEFAULT_DIR && window.__FREYA_DEFAULT_DIR !== '__FREYA_DEFAULT_DIR__')
       ? window.__FREYA_DEFAULT_DIR
       : (localStorage.getItem('freya.dir') || './freya');
-    $('dir').value = def;
-    $('sidePath').textContent = def || './freya';
-    localStorage.setItem('freya.dir', $('dir').value || './freya');
+    const dirEl = $('dir');
+    if (dirEl) {
+      dirEl.value = def;
+      localStorage.setItem('freya.dir', dirEl.value || './freya');
+    }
+    const side = $('sidePath');
+    if (side) side.textContent = def || './freya';
   }
 
   async function api(p, body) {
@@ -409,8 +409,9 @@
   }
 
   function dirOrDefault() {
-    const d = $('dir').value.trim();
-    return d || './freya';
+    const dEl = $('dir');
+    const d = dEl ? dEl.value.trim() : '';
+    return d || (localStorage.getItem('freya.dir') || './freya');
   }
 
   function fmtWhen(ms) {
@@ -492,6 +493,116 @@
     }
   }
 
+  function renderReportsPage() {
+    const grid = $('reportsGrid');
+    if (!grid) return;
+    const q = ($('reportsFilter') ? $('reportsFilter').value : '').trim().toLowerCase();
+    const list = (state.reports || []).filter((it) => {
+      if (!q) return true;
+      return (it.name + ' ' + it.kind).toLowerCase().includes(q);
+    });
+
+    grid.innerHTML = '';
+    for (const item of list) {
+      const card = document.createElement('div');
+      const mode = state.reportModes[item.relPath] || 'preview';
+      card.className = 'reportCard' + (mode === 'raw' ? ' raw' : '');
+
+      const meta = fmtWhen(item.mtimeMs);
+      card.innerHTML =
+        '<div class="reportHead">'
+        + '<div>'
+        + '<div class="reportName">' + escapeHtml(item.name) + '</div>'
+        + '<div class="reportMeta">' + escapeHtml(item.relPath) + ' • ' + escapeHtml(meta) + '</div>'
+        + '</div>'
+        + '<div class="reportHeadActions">'
+        + '<button class="btn small" data-action="toggle">' + (mode === 'raw' ? 'Preview' : 'Markdown') + '</button>'
+        + '<button class="btn small primary" data-action="save">Salvar</button>'
+        + '</div>'
+        + '</div>'
+        + '<div class="reportBody">'
+        + '<div class="reportPreview"></div>'
+        + '<textarea class="reportRaw" rows="12"></textarea>'
+        + '</div>';
+
+      const text = state.reportTexts[item.relPath] || '';
+      const preview = card.querySelector('.reportPreview');
+      if (preview) preview.innerHTML = renderMarkdown(text || '');
+      const raw = card.querySelector('.reportRaw');
+      if (raw) raw.value = text;
+
+      const toggleBtn = card.querySelector('[data-action="toggle"]');
+      if (toggleBtn) {
+        toggleBtn.onclick = () => {
+          state.reportModes[item.relPath] = (state.reportModes[item.relPath] === 'raw') ? 'preview' : 'raw';
+          renderReportsPage();
+        };
+      }
+
+      const saveBtn = card.querySelector('[data-action="save"]');
+      if (saveBtn) {
+        saveBtn.onclick = async () => {
+          try {
+            const content = (raw && typeof raw.value === 'string') ? raw.value : '';
+            setPill('run', 'salvando…');
+            await api('/api/reports/write', { dir: dirOrDefault(), relPath: item.relPath, text: content });
+            state.reportTexts[item.relPath] = content;
+            setPill('ok', 'salvo');
+            setTimeout(() => setPill('ok', 'pronto'), 800);
+            renderReportsPage();
+          } catch (e) {
+            setPill('err', 'falhou');
+          }
+        };
+      }
+
+      grid.appendChild(card);
+    }
+  }
+
+  async function refreshReportsPage() {
+    try {
+      setPill('run', 'carregando…');
+      const r = await api('/api/reports/list', { dir: dirOrDefault() });
+      state.reports = (r.reports || []);
+      state.reportTexts = {};
+      await Promise.all(state.reports.map(async (item) => {
+        try {
+          const rr = await api('/api/reports/read', { dir: dirOrDefault(), relPath: item.relPath });
+          state.reportTexts[item.relPath] = rr.text || '';
+        } catch {
+          state.reportTexts[item.relPath] = '';
+        }
+      }));
+      renderReportsPage();
+      setPill('ok', 'pronto');
+    } catch (e) {
+      setPill('err', 'falhou');
+    }
+  }
+
+  function wireRailNav() {
+    const dash = $('railDashboard');
+    const rep = $('railReports');
+    if (dash) {
+      dash.onclick = () => {
+        const isReports = document.body && document.body.dataset && document.body.dataset.page === 'reports';
+        if (isReports) {
+          window.location.href = '/';
+          return;
+        }
+        const c = document.querySelector('.centerBody');
+        if (c) c.scrollTo({ top: 0, behavior: 'smooth' });
+      };
+    }
+    if (rep) {
+      rep.onclick = () => {
+        const isReports = document.body && document.body.dataset && document.body.dataset.page === 'reports';
+        if (!isReports) window.location.href = '/reports';
+      };
+    }
+  }
+
   async function editTask(t) {
     try {
       const currentSlug = t.projectSlug ? String(t.projectSlug) : '';
@@ -988,10 +1099,11 @@
   }
 
   // init
-  applyTheme('dark');
-  try { localStorage.setItem('freya.theme', 'dark'); } catch (err) {}
-  $('chipPort').textContent = location.host;
+  applyDarkTheme();
+  const chipPort = $('chipPort');
+  if (chipPort) chipPort.textContent = location.host;
   loadLocal();
+  wireRailNav();
 
   // Developer drawer (persist open/close)
   try {
@@ -1005,23 +1117,34 @@
     }
   } catch {}
 
+  const isReportsPage = document.body && document.body.dataset && document.body.dataset.page === 'reports';
+
   // Load persisted settings from the workspace + bootstrap (auto-init + auto-health)
   (async () => {
     let defaults = null;
     try {
       defaults = await api('/api/defaults', { dir: dirOrDefault() });
       if (defaults && defaults.workspaceDir) {
-        $('dir').value = defaults.workspaceDir;
-        $('sidePath').textContent = defaults.workspaceDir;
+        const dirEl = $('dir');
+        if (dirEl) dirEl.value = defaults.workspaceDir;
+        const side = $('sidePath');
+        if (side) side.textContent = defaults.workspaceDir;
       }
       if (defaults && defaults.settings) {
-        $('discord').value = defaults.settings.discordWebhookUrl || '';
-        $('teams').value = defaults.settings.teamsWebhookUrl || '';
+        const discord = $('discord');
+        const teams = $('teams');
+        if (discord) discord.value = defaults.settings.discordWebhookUrl || '';
+        if (teams) teams.value = defaults.settings.teamsWebhookUrl || '';
       }
     } catch (e) {
       // ignore
     }
 
+    if (isReportsPage) {
+      await refreshReportsPage();
+      return;
+    }
+
     // If workspace isn't initialized yet, auto-init (reduces clicks)
     try {
       if (defaults && defaults.workspaceOk === false) {
@@ -1058,12 +1181,13 @@
   window.exportObsidian = exportObsidian;
   window.rebuildIndex = rebuildIndex;
   window.renderReportsList = renderReportsList;
+  window.renderReportsPage = renderReportsPage;
+  window.refreshReportsPage = refreshReportsPage;
   window.copyOut = copyOut;
   window.copyPath = copyPath;
   window.openSelected = openSelected;
   window.downloadSelected = downloadSelected;
   window.clearOut = clearOut;
-  window.toggleTheme = toggleTheme;
   window.saveInbox = saveInbox;
   window.saveAndPlan = saveAndPlan;
   window.toggleAutoApply = toggleAutoApply;

package/cli/web.js

@@ -881,6 +881,11 @@ function html(defaultDir) {
   return buildHtml(safeDefault, APP_VERSION);
 }
 
+function reportsHtml(defaultDir) {
+  const safeDefault = String(defaultDir || './freya').replace(/\\/g, '\\\\').replace(/"/g, '\\"');
+  return buildReportsHtml(safeDefault, APP_VERSION);
+}
+
 function buildHtml(safeDefault, appVersion) {
   const safeVersion = escapeHtml(appVersion || 'unknown');
   return `<!doctype html>
@@ -901,14 +906,11 @@ function buildHtml(safeDefault, appVersion) {
             <div class="railLogo">F</div>
           </div>
           <div class="railNav">
-            <button class="railBtn active" type="button" title="Dashboard">H</button>
-            <button class="railBtn" type="button" title="Workspace">W</button>
-            <button class="railBtn" type="button" title="Relatórios">R</button>
-            <button class="railBtn" type="button" title="Preview">P</button>
-            <button class="railBtn" type="button" title="Conversa">C</button>
+            <button class="railBtn active" id="railDashboard" type="button" title="Dashboard">D</button>
+            <button class="railBtn" id="railReports" type="button" title="Relatórios">R</button>
           </div>
           <div class="railBottom">
-            <button class="railBtn railToggle" id="themeToggle" type="button" onclick="toggleTheme()">Claro</button>
+            <div class="railStatus" id="railStatus" title="status"></div>
           </div>
         </aside>
 
@@ -920,7 +922,6 @@ function buildHtml(safeDefault, appVersion) {
                 <div class="brand">FREYA</div>
                 <div class="brandSub">Assistente de status local-first</div>
               </div>
-              <div class="statusPill"><span class="dot" id="dot"></span><span id="pill">pronto</span></div>
             </div>
             <div class="topActions">
               <span class="chip" id="chipVersion">v${safeVersion}</span>
@@ -954,7 +955,7 @@ function buildHtml(safeDefault, appVersion) {
               </div>
             </section>
 
-            <section class="utilityGrid">
+            <section class="utilityGrid" id="reportsSection">
               <div class="utilityCard">
                 <div class="utilityHead">Área de trabalho</div>
                 <div class="sidePath" id="sidePath">./freya</div>
@@ -1130,6 +1131,82 @@ function buildHtml(safeDefault, appVersion) {
 </html>`;
 }
 
+function buildReportsHtml(safeDefault, appVersion) {
+  const safeVersion = escapeHtml(appVersion || 'unknown');
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>FREYA Reports</title>
+  <link rel="stylesheet" href="/app.css" />
+</head>
+<body data-page="reports">
+  <div class="app">
+    <div class="frame">
+      <div class="shell">
+
+        <aside class="rail">
+          <div class="railTop">
+            <div class="railLogo">F</div>
+          </div>
+          <div class="railNav">
+            <button class="railBtn" id="railDashboard" type="button" title="Dashboard">D</button>
+            <button class="railBtn active" id="railReports" type="button" title="Relatórios">R</button>
+          </div>
+          <div class="railBottom">
+            <div class="railStatus" id="railStatus" title="status"></div>
+          </div>
+        </aside>
+
+        <main class="center reportsPage" id="reportsPage">
+          <div class="topbar">
+            <div class="brandLine">
+              <span class="spark"></span>
+              <div class="brandStack">
+                <div class="brand">FREYA</div>
+                <div class="brandSub">Relatórios</div>
+              </div>
+            </div>
+            <div class="topActions">
+              <span class="chip" id="chipVersion">v${safeVersion}</span>
+              <span class="chip" id="chipPort">127.0.0.1:3872</span>
+            </div>
+          </div>
+
+          <div class="centerBody">
+            <input id="dir" type="hidden" />
+
+            <section class="reportsHeader">
+              <div>
+                <div class="reportsTitle">Relatórios</div>
+                <div class="reportsSubtitle">Edite e refine seus relatórios com preview em Markdown.</div>
+              </div>
+              <div class="reportsActions">
+                <button class="btn small" type="button" onclick="refreshReportsPage()">Atualizar</button>
+              </div>
+            </section>
+
+            <section class="reportsTools">
+              <input id="reportsFilter" placeholder="filtrar (ex: daily, executive, 2026-01-29)" oninput="renderReportsPage()" />
+            </section>
+
+            <section class="reportsGrid" id="reportsGrid"></section>
+          </div>
+        </main>
+
+      </div>
+    </div>
+  </div>
+
+  <script>
+    window.__FREYA_DEFAULT_DIR = "${safeDefault}";
+  </script>
+  <script src="/app.js"></script>
+</body>
+</html>`;
+}
+
 function ensureDir(p) {
   fs.mkdirSync(p, { recursive: true });
 }
@@ -1316,6 +1393,14 @@ async function cmdWeb({ port, dir, open, dev }) {
         return;
       }
 
+      if (req.method === 'GET' && req.url === '/reports') {
+        try { res.__freyaDebug.workspaceDir = normalizeWorkspaceDir(dir || './freya'); } catch {}
+        const body = reportsHtml(dir || './freya');
+        res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8', 'Cache-Control': 'no-store' });
+        res.end(body);
+        return;
+      }
+
       if (req.method === 'GET' && req.url === '/app.css') {
         const css = fs.readFileSync(path.join(__dirname, 'web-ui.css'), 'utf8');
         res.writeHead(200, { 'Content-Type': 'text/css; charset=utf-8', 'Cache-Control': 'no-store' });
@@ -1412,6 +1497,23 @@ async function cmdWeb({ port, dir, open, dev }) {
           return safeJson(res, 200, { relPath: rel, fullPath: full });
         }
 
+        if (req.url === '/api/reports/write') {
+          const rel = payload.relPath;
+          const text = payload.text;
+          if (!rel) return safeJson(res, 400, { error: 'Missing relPath' });
+          if (typeof text !== 'string') return safeJson(res, 400, { error: 'Missing text' });
+          const reportsDir = path.join(workspaceDir, 'docs', 'reports');
+          const full = path.join(workspaceDir, rel);
+          const safeReportsDir = path.resolve(reportsDir);
+          const safeFull = path.resolve(full);
+          if (!safeFull.startsWith(safeReportsDir + path.sep)) {
+            return safeJson(res, 400, { error: 'Invalid report path' });
+          }
+          if (!exists(safeFull)) return safeJson(res, 404, { error: 'Report not found' });
+          fs.writeFileSync(safeFull, text, 'utf8');
+          return safeJson(res, 200, { ok: true, relPath: rel });
+        }
+
         if (req.url === '/api/inbox/add') {
           const text = String(payload.text || '').trim();
           if (!text) return safeJson(res, 400, { error: 'Missing text' });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cccarv82/freya",
-  "version": "1.0.56",
+  "version": "1.0.58",
   "description": "Personal AI Assistant with local-first persistence",
   "scripts": {
     "health": "node scripts/validate-data.js",