fix(kb): search preview shows section-in-context for text sources

User reported the search card "looks broken" when the selected hit is the
law (Wikisource source 5) — the right preview pane just duplicates the
chunk text already visible in the left list card. For PDF sources the
right pane shows the PDF page, but for text-only sources it had nothing
useful to add and fell back to a copy.

Fix:
- /kb/search hits gained chunk_index (shira-hermes b127caf), and
  /kb/source/{id}/chunks gained an `around=<chunk_index>&ctx=<k>` window.
- Espo proxy plumbing: getActionChunks reads `around`/`ctx` query
  params and forwards them; KnowledgeBaseService::sourceChunks accepts
  optional $around + $ctx and appends them to the upstream URL.
- showSearchPreview for non-PDF hits now fetches the matched chunk plus
  2 sections before and 2 after, renders them as stacked panels: the
  matched section gets a yellow #fff3cd highlight, neighbors render as
  muted context blocks. The panel header carries a prominent
  "פתח ב-Wikisource" button so users can jump to the public source page.
  After render the matched section auto-scrolls into view.
- Race protection via _previewToken: a click on a different hit while a
  fetch is in flight cancels the stale render so the user always sees
  the section that matches the currently-selected card.

PDF path unchanged.

Refs Task Master #7

files/client/custom/modules/knowledge-base/src/views/kb/index.js

@@ -465,23 +465,114 @@ define('modules/knowledge-base/views/kb/index', ['view'], function (Dep) {
                 return;
             }
 
-            // Text source (law from Wikisource) — show the full chunk content
-            // and a link to the public source page.
+            // Text source (law from Wikisource): fetch the matched chunk +
+            // surrounding sections so the preview pane shows context, not a
+            // copy of what's already in the left card. While loading, show a
+            // placeholder; on failure fall back to the chunk-only view.
+            this._renderSectionContextPlaceholder(h);
+            const token = this._previewToken;
+            const sourceId = h.source_id;
+            const around = (typeof h.chunk_index === 'number') ? h.chunk_index : null;
+            if (sourceId == null || around == null) {
+                this._renderSectionContextSingle(h);
+                return;
+            }
+            const self = this;
+            Espo.Ajax.getRequest('KnowledgeBase/action/chunks', {
+                sourceId: sourceId,
+                around: around,
+                ctx: 2,
+            }).then(res => {
+                // Bail if user has clicked a different hit while we were waiting.
+                if (self._previewToken !== token) return;
+                self._renderSectionContext(h, res && res.chunks ? res.chunks : []);
+            }).catch(err => {
+                console.warn('KB: section-window fetch failed', err);
+                if (self._previewToken === token) self._renderSectionContextSingle(h);
+            });
+        },
+
+        _renderSectionContextPlaceholder: function (h) {
+            this._previewToken = (this._previewToken || 0) + 1;
+            const $slot = this.$el.find('.kb-preview-slot');
+            const title = this.escape(h.title || '');
+            $slot.html(
+                '<div class="panel panel-default" style="direction:rtl;text-align:right;height:100%;display:flex;flex-direction:column;">' +
+                '  <div class="panel-heading" style="flex:0 0 auto;">' + title +
+                '    <span class="text-muted small" style="margin-right:8px;">— טוען הקשר…</span>' +
+                '  </div>' +
+                '  <div class="panel-body" style="flex:1 1 auto;overflow-y:auto;">' +
+                '    <i class="fas fa-circle-notch fa-spin"></i>' +
+                '  </div>' +
+                '</div>'
+            );
+        },
+
+        _renderSectionContextSingle: function (h) {
+            // Fallback when we can't fetch the window — render just the
+            // matched chunk, which is at least the full section for the
+            // statute chunker (1 section = 1 chunk).
+            this._renderSectionContext(h, [{
+                chunk_index: h.chunk_index,
+                section_ref: h.section_ref || '',
+                heading_path: h.heading_path || '',
+                content: h.content || '',
+            }]);
+        },
+
+        _renderSectionContext: function (h, chunks) {
+            const $slot = this.$el.find('.kb-preview-slot');
             const bodyStyle =
                 'direction:rtl;unicode-bidi:plaintext;white-space:pre-wrap;' +
                 'font-family:"Segoe UI",Arial,sans-serif;line-height:1.7;text-align:right;';
             const srcLink = h.source_url
-                ? `<a href="${this.escape(h.source_url)}" target="_blank" rel="noopener">מקור ב-Wikisource</a>`
+                ? '<a href="' + this.escape(h.source_url) + '" target="_blank" rel="noopener" ' +
+                  'class="btn btn-xs btn-default" style="margin-right:6px;">' +
+                  '<i class="fas fa-external-link-alt"></i> פתח ב-Wikisource</a>'
                 : '';
-            $slot.html(`
-                <div class="panel panel-default" style="direction:rtl;text-align:right;height:100%;display:flex;flex-direction:column;">
-                  <div class="panel-heading" style="flex:0 0 auto;">${this.escape(h.title || '')}</div>
-                  <div class="panel-body" style="${bodyStyle};flex:1 1 auto;overflow-y:auto;">
-                    ${this.escape(h.content || '')}
-                  </div>
-                  ${srcLink ? '<div class="panel-footer small" style="flex:0 0 auto;">' + srcLink + '</div>' : ''}
-                </div>
-            `);
+            // The matched chunk is highlighted; siblings render as muted
+            // context blocks above and below so the user can read into the
+            // section without leaving the CRM.
+            const sectionsHtml = chunks.map(c => {
+                const isMatch = c.chunk_index === h.chunk_index;
+                const ref = c.section_ref || c.heading_path || '';
+                const headerStyle = isMatch
+                    ? 'background:#fff3cd;border-bottom:1px solid #ffe69c;color:#664d03;font-weight:600;'
+                    : 'background:#f5f5f7;border-bottom:1px solid #e7e7ea;color:#6c757d;';
+                return (
+                    '<div style="margin-bottom:12px;border:1px solid ' +
+                      (isMatch ? '#ffe69c' : '#e7e7ea') + ';border-radius:4px;overflow:hidden;">' +
+                    '  <div style="' + headerStyle + 'padding:6px 10px;direction:rtl;text-align:right;font-size:0.9em;">' +
+                         (isMatch ? 'התאמה — ' : '') + this.escape(ref) +
+                    '  </div>' +
+                    '  <div style="' + bodyStyle + ';padding:10px;">' +
+                         this.escape(c.content || '') +
+                    '  </div>' +
+                    '</div>'
+                );
+            }).join('');
+
+            $slot.html(
+                '<div class="panel panel-default" style="direction:rtl;text-align:right;height:100%;display:flex;flex-direction:column;">' +
+                '  <div class="panel-heading" style="flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;">' +
+                '    <div><strong>' + this.escape(h.title || '') + '</strong>' +
+                '      <span class="text-muted small" style="margin-right:6px;">— הסעיף בהקשרו</span>' +
+                '    </div>' +
+                     srcLink +
+                '  </div>' +
+                '  <div class="panel-body" style="flex:1 1 auto;overflow-y:auto;background:#fafbfc;">' +
+                     sectionsHtml +
+                '  </div>' +
+                '</div>'
+            );
+
+            // Scroll the matched chunk into view inside the preview pane.
+            const $body = $slot.find('.panel-body');
+            const $match = $body.find('div[style*="#fff3cd"]').closest('div[style*="border-radius:4px"]');
+            if ($match.length && $body.length) {
+                const offset = $match.position().top - 20;
+                $body.scrollTop(Math.max(0, offset));
+            }
         },
 
         renderAskAnswer: function (text, sources) {