Merge pull request #113 from KMX415/feat/pluck-full-release-notes

Full release-notes modal on Updates

Author: KMX415

frontend/css/update_release_notes_modal.css

@@ -0,0 +1,73 @@
+/* Full release-notes modal (Updates panel). */
+
+.update-release-notes__more {
+    margin-top: 10px;
+    background: none;
+    border: none;
+    padding: 0;
+    color: var(--accent-cyan, #22d3ee);
+    font: inherit;
+    font-size: 12px;
+    cursor: pointer;
+    text-decoration: underline;
+}
+
+.update-release-notes__more:hover {
+    color: var(--text-primary, #e2e8f0);
+}
+
+.rn-modal-overlay {
+    position: fixed;
+    inset: 0;
+    z-index: 1000;
+    background: rgba(3, 8, 20, 0.6);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 24px;
+}
+
+.rn-modal {
+    background: var(--bg-secondary, #12161f);
+    border: 1px solid var(--border-color, #232a38);
+    border-radius: 12px;
+    width: min(760px, 100%);
+    max-height: 84vh;
+    display: flex;
+    flex-direction: column;
+    box-shadow: 0 24px 60px rgba(3, 8, 20, 0.5);
+}
+
+.rn-modal__head {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    padding: 16px 20px;
+    border-bottom: 1px solid var(--border-color, #232a38);
+}
+
+.rn-modal__title {
+    margin: 0;
+    font-size: 15px;
+    color: var(--text-primary, #e2e8f0);
+}
+
+.rn-modal__close {
+    background: none;
+    border: none;
+    color: var(--text-muted, #64748b);
+    font-size: 22px;
+    line-height: 1;
+    cursor: pointer;
+}
+
+.rn-modal__close:hover {
+    color: var(--text-primary, #e2e8f0);
+}
+
+.rn-modal__list {
+    margin: 0;
+    padding: 16px 20px;
+    overflow-y: auto;
+}

frontend/index.html

@@ -36,6 +36,7 @@
     <link rel="stylesheet" href="css/radio_readout.css" />
     <link rel="stylesheet" href="css/stats.css" />
     <link rel="stylesheet" href="css/settings.css" />
+    <link rel="stylesheet" href="css/update_release_notes_modal.css" />
     <link rel="stylesheet" href="css/configuration.css" />
     <link rel="stylesheet" href="css/gps.css" />
     <link rel="stylesheet" href="css/packet_detail_modal.css" />

frontend/js/settings/release_notes_view.js

@@ -50,6 +50,8 @@ class ReleaseNotesView {
             return;
         }
         const section = body.preview_section;
+        // Full (un-truncated) notes for the "Read full release notes" modal.
+        this._fullSection = body.full_section || null;
         const eyebrow = section.is_unreleased
             ? "What's coming"
             : "What's new";
@@ -59,6 +61,9 @@ class ReleaseNotesView {
         const installed = body.current_installed_version
             ? `<p class="update-release-notes__date">Installed: v${this._escape(body.current_installed_version)}</p>`
             : '';
+        const moreBtn = (this._fullSection && (this._fullSection.bullets || []).length)
+            ? '<button type="button" class="update-release-notes__more" data-rn-more>Read full release notes</button>'
+            : '';
         this.root.dataset.state = 'ready';
         this.root.innerHTML = `
             <header class="update-release-notes__head">
@@ -70,7 +75,44 @@ class ReleaseNotesView {
             <ul class="update-release-notes__list">
                 ${bullets || '<li class="update-release-notes__empty">No bullets in this section.</li>'}
             </ul>
+            ${moreBtn}
+        `;
+        this.root.querySelector('[data-rn-more]')
+            ?.addEventListener('click', () => this._openFullModal());
+    }
+
+    _openFullModal() {
+        if (!this._fullSection) return;
+        const s = this._fullSection;
+        const title = s.header || s.version || 'Release notes';
+        const overlay = document.createElement('div');
+        overlay.className = 'rn-modal-overlay';
+        overlay.setAttribute('role', 'dialog');
+        overlay.setAttribute('aria-modal', 'true');
+        overlay.setAttribute('aria-label', 'Full release notes');
+        overlay.innerHTML = `
+            <div class="rn-modal">
+                <header class="rn-modal__head">
+                    <h3 class="rn-modal__title">${this._escape(title)}</h3>
+                    <button type="button" class="rn-modal__close" aria-label="Close">&times;</button>
+                </header>
+                <ul class="rn-modal__list update-release-notes__list">
+                    ${this._renderBullets(s.bullets || [])}
+                </ul>
+            </div>
         `;
+        const close = () => {
+            overlay.remove();
+            document.removeEventListener('keydown', onKey);
+        };
+        const onKey = (e) => { if (e.key === 'Escape') close(); };
+        overlay.addEventListener('click', (e) => {
+            if (e.target === overlay) close();
+        });
+        overlay.querySelector('.rn-modal__close').addEventListener('click', close);
+        document.addEventListener('keydown', onKey);
+        document.body.appendChild(overlay);
+        overlay.querySelector('.rn-modal__close').focus();
     }
 
     _renderBullets(bullets) {

src/api/routes/update_routes.py

@@ -39,6 +39,7 @@
 from src.api.update.release_notes import (
     ChangelogParser,
     format_section_for_preview,
+    format_section_full,
     select_preview_section,
 )
 from src.version import __version__ as INSTALLED_VERSION
@@ -167,6 +168,9 @@ async def release_notes(
         "preview_section": (
             format_section_for_preview(preview) if preview is not None else None
         ),
+        "full_section": (
+            format_section_full(preview) if preview is not None else None
+        ),
     }
 
 

src/api/update/release_notes.py

@@ -154,6 +154,15 @@ def sanitize_detail_for_preview(detail: str, *, max_len: int = _PREVIEW_DETAIL_M
     return cut.rstrip(".,;") + "…"
 
 
+def sanitize_detail_full(detail: str) -> str:
+    """De-markdown detail text for the full-notes modal (no truncation)."""
+    if not detail:
+        return ""
+    text = _LINK_RE.sub(r"\1", detail)
+    text = text.replace("`", "")
+    return re.sub(r"\s+", " ", text).strip()
+
+
 def format_bullet_for_preview(bullet: ChangelogBullet) -> dict:
     """Serialize one bullet for the dashboard (truncated detail)."""
     return {
@@ -163,6 +172,15 @@ def format_bullet_for_preview(bullet: ChangelogBullet) -> dict:
     }
 
 
+def format_bullet_full(bullet: ChangelogBullet) -> dict:
+    """Serialize one bullet with its full (un-truncated) detail."""
+    return {
+        "headline": bullet.headline,
+        "detail": sanitize_detail_full(bullet.detail),
+        "category": bullet.category,
+    }
+
+
 def format_section_for_preview(section: ChangelogSection) -> dict:
     """Serialize a section with operator-friendly bullets."""
     return {
@@ -174,6 +192,17 @@ def format_section_for_preview(section: ChangelogSection) -> dict:
     }
 
 
+def format_section_full(section: ChangelogSection) -> dict:
+    """Serialize a section with full-text bullets for the modal."""
+    return {
+        "header": section.header,
+        "version": section.version,
+        "date": section.date,
+        "is_unreleased": section.is_unreleased,
+        "bullets": [format_bullet_full(b) for b in section.bullets],
+    }
+
+
 def _version_tuple(version: str) -> tuple[int, ...]:
     parts: list[int] = []
     for piece in version.split("."):

tests/test_update_release_notes.py

@@ -13,7 +13,9 @@
     ChangelogParser,
     ChangelogSection,
     format_section_for_preview,
+    format_section_full,
     sanitize_detail_for_preview,
+    sanitize_detail_full,
     select_preview_section,
 )
 
@@ -306,5 +308,30 @@ def test_format_section_truncates_bullet_details(self) -> None:
         self.assertTrue(payload["bullets"][1]["detail"].endswith("…"))
 
 
+class TestFullFormatting(unittest.TestCase):
+    def test_sanitize_detail_full_keeps_long_text(self) -> None:
+        long = "A" * 300
+        self.assertEqual(sanitize_detail_full(long), long)
+
+    def test_format_section_full_does_not_truncate(self) -> None:
+        from src.api.update.release_notes import ChangelogBullet
+
+        detail = "See [docs](https://example.com) and `code` path. " + ("B" * 200)
+        section = ChangelogSection(
+            header="v0.7.3.1",
+            version="0.7.3.1",
+            date=None,
+            is_unreleased=False,
+            bullets=[ChangelogBullet(headline="Long", detail=detail)],
+        )
+        payload = format_section_full(section)
+        out = payload["bullets"][0]["detail"]
+        self.assertNotIn("…", out)
+        self.assertIn("docs", out)
+        self.assertNotIn("https://", out)
+        self.assertNotIn("`", out)
+        self.assertGreater(len(out), 200)
+
+
 if __name__ == "__main__":
     unittest.main()