Initial commit of work to create AI assisted search using Gemini Vertex

assets/js/vertex-search.js

@@ -0,0 +1,100 @@
+(function () {
+  'use strict';
+
+  // Only run on the search results page
+  const config = document.getElementById('vertex-search-config');
+  if (!config) return;
+
+  const FUNCTION_URL = config.dataset.searchUrl;
+  if (!FUNCTION_URL) {
+    console.warn('Vertex search URL not configured');
+    return;
+  }
+
+  // Get query from URL params (?q=...)
+  const urlParams = new URLSearchParams(window.location.search);
+  const query = urlParams.get('q') || '';
+
+  const statusEl  = document.getElementById('vertex-search-status');
+  const hitsEl    = document.getElementById('vertex-search-hits');
+  const summaryEl = document.getElementById('vertex-search-summary');
+  const summaryTxt = document.getElementById('summary-text');
+
+  function escapeHtml(str) {
+    if (!str) return '';
+    return str
+      .replace(/&/g, '&')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;');
+  }
+
+  async function doSearch(q) {
+    if (!q) {
+      statusEl.textContent = 'Enter a search query above.';
+      return;
+    }
+
+    // Update page title to reflect query
+    document.title = `Search: ${q}`;
+    statusEl.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Searching for <strong>' +
+      escapeHtml(q) + '</strong>…';
+
+    try {
+      const url = new URL(FUNCTION_URL);
+      url.searchParams.set('q', q);
+
+      // Pass referring section as context if coming from a content page
+      const ref = document.referrer;
+      if (ref) {
+        try {
+          const refPath = new URL(ref).pathname.split('/').filter(Boolean);
+          if (refPath.length > 0) url.searchParams.set('context', refPath[0]);
+        } catch (_) {}
+      }
+
+      const resp = await fetch(url.toString());
+      if (!resp.ok) throw new Error(`HTTP ${resp.status}`);
+      const data = await resp.json();
+
+      // Hide spinner
+      statusEl.style.display = 'none';
+
+      // Show AI summary if available
+      if (data.summary?.summaryText) {
+        summaryTxt.textContent = data.summary.summaryText;
+        summaryEl.style.display = 'block';
+      }
+
+      // Show results
+      if (!data.results || data.results.length === 0) {
+        hitsEl.innerHTML = `<p>No results found for <strong>${escapeHtml(q)}</strong>.</p>`;
+        return;
+      }
+
+      // Show result count
+      hitsEl.innerHTML = `<p class="text-muted mb-3">${data.results.length} results for <strong>${escapeHtml(q)}</strong></p>` +
+        data.results.map(r => `
+          <div class="td-search-hit mb-4">
+            <h5 class="mb-1">
+              <a href="${escapeHtml(r.url)}">${escapeHtml(r.title || 'Untitled')}</a>
+            </h5>
+            ${r.snippet ? `<p class="mb-1 text-muted small">${escapeHtml(r.snippet)}</p>` : ''}
+            <p class="mb-0"><small class="text-success">${escapeHtml(r.url)}</small></p>
+          </div>
+        `).join('');
+
+    } catch (err) {
+      statusEl.textContent = 'Search error: ' + err.message;
+      console.error('Vertex search error:', err);
+    }
+  }
+
+  // Run search on page load
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', () => doSearch(query));
+  } else {
+    doSearch(query);
+  }
+
+})();

assets/scss/_styles_project.scss

@@ -93,3 +93,55 @@
         padding: 0.5rem 0;
     }
 }
+
+// Vertex AI Search styles
+.ai-summary {
+  background: #f0f7ff;
+  border-left: 4px solid #1a73e8;
+  padding: 1rem 1.25rem;
+  margin-bottom: 1.5rem;
+  border-radius: 0 4px 4px 0;
+
+  .ai-badge {
+    font-size: 0.75rem;
+    font-weight: 600;
+    color: #1a73e8;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    display: block;
+    margin-bottom: 0.5rem;
+  }
+
+  p { margin: 0; }
+}
+
+.td-search-hit {
+  padding: 1rem 0;
+  border-bottom: 1px solid #e8e8e8;
+
+  &:last-child { border-bottom: none; }
+
+  &__title {
+    margin: 0 0 0.25rem;
+    font-size: 1rem;
+    a { color: #1a0dab; }
+  }
+
+  &__snippet {
+    font-size: 0.875rem;
+    color: #545454;
+    margin: 0.25rem 0;
+  }
+
+  &__url {
+    color: #006621;
+    margin: 0;
+  }
+}
+
+.td-search-loading,
+.td-search-no-results,
+.td-search-error {
+  padding: 1rem 0;
+  color: #666;
+}

config/_default/params.yaml

@@ -57,6 +57,15 @@ copyright:
 #  gcs_engine_id:  search engine 
 gcs_engine_id: 33ef4cbe0703b4f3a
 
+# Tell Docsy to show the search box but use offsite search
+# (we intercept it with our own JS)
+#offsite_search:
+#  enable: true
+#  custom_search_url: "https://us-central1-interlispsearch.cloudfunctions.net/search"
+
+# Vertex AI Search Cloud Function URL
+vertex_search_url: "https://us-central1-interlispsearch.cloudfunctions.net/search"
+
 # Zotero Group ID for bibliography management
 zotero_group_id:  2914042
 

layouts/_partials/hooks/head-end.html

@@ -1,2 +1,5 @@
 <link rel="canonical" href="{{ .Permalink }}">
 <link rel="me" href="https://fosstodon.org/@interlisp">
+
+{{ $searchJS := resources.Get "js/vertex-search.js" | js.Build | fingerprint }}
+<script src="{{ $searchJS.RelPermalink }}" defer></script>

layouts/search.html

@@ -0,0 +1,33 @@
+{{ define "main" }}
+<section class="row td-search-result">
+  <div class="col-12 col-md-8 offset-md-2">
+    <h2 class="ms-4">Search Results</h2>
+
+    <div id="vertex-search-container" class="ms-4 mt-4">
+
+      {{/* Pass the function URL to JS */}}
+      <div id="vertex-search-config"
+        data-search-url="{{ .Site.Params.vertex_search_url }}"
+        data-query="{{ .Params.q | default "" }}"
+        style="display:none">
+      </div>
+
+      <div id="vertex-search-summary" style="display:none">
+        <div class="ai-summary mb-4">
+          <span class="ai-badge">
+            <i class="fas fa-robot"></i> AI Summary
+          </span>
+          <p id="summary-text" class="mt-2 mb-0"></p>
+        </div>
+      </div>
+
+      <div id="vertex-search-status" class="text-muted">
+        <i class="fas fa-spinner fa-spin"></i> Searching...
+      </div>
+
+      <div id="vertex-search-hits"></div>
+
+    </div>
+  </div>
+</section>
+{{ end }}

search-function/.gcloudignore

@@ -0,0 +1,3 @@
+node_modules/
+.git/
+*.md

search-function/index.js

@@ -0,0 +1,136 @@
+const { GoogleAuth } = require('google-auth-library');
+
+const PROJECT_ID = process.env.PROJECT_ID;
+const ENGINE_ID  = process.env.ENGINE_ID;
+const LOCATION   = 'global';
+
+const auth = new GoogleAuth({
+  scopes: ['https://www.googleapis.com/auth/cloud-platform']
+});
+
+exports.search = async (req, res) => {
+
+  const allowedOrigins = [
+    'https://interlisp.org',
+    'https://www.interlisp.org',
+    'https://stumbo.github.io',
+    'http://localhost:1313',
+    'http://localhost:8080',
+  ];
+
+  const origin = req.headers.origin || '';
+  const allowedOrigin = allowedOrigins.includes(origin) ? origin : 'https://interlisp.org';
+
+  res.set('Access-Control-Allow-Origin', allowedOrigin);
+  res.set('Access-Control-Allow-Methods', 'GET, OPTIONS');
+  res.set('Access-Control-Allow-Headers', 'Content-Type');
+  res.set('Access-Control-Max-Age', '3600');
+
+  if (req.method === 'OPTIONS') {
+    res.status(204).send('');
+    return;
+  }
+
+  const query    = req.query.q || req.body?.q || '';
+  const context  = req.query.context || req.body?.context || '';
+  const pageSize = parseInt(req.query.pageSize) || 10;
+
+  if (!query.trim()) {
+    res.status(400).json({ error: 'Missing query parameter q' });
+    return;
+  }
+
+  try {
+    // Use raw REST API to avoid SDK auto-pagination swallowing the summary
+    const client = await auth.getClient();
+    const token = await client.getAccessToken();
+
+    const endpoint = `https://discoveryengine.googleapis.com/v1/projects/${PROJECT_ID}/locations/${LOCATION}/collections/default_collection/engines/${ENGINE_ID}/servingConfigs/default_config:search`;
+
+    const requestBody = {
+      query,
+      pageSize,
+      contentSearchSpec: {
+        summarySpec: {
+          summaryResultCount: 5,
+          includeCitations: true,
+          modelPromptSpec: {
+            preamble: buildPreamble(context)
+          }
+        },
+        snippetSpec: {
+          returnSnippet: true
+        },
+        extractiveContentSpec: {
+          maxExtractiveAnswerCount: 3
+        }
+      }
+    };
+
+    const response = await fetch(endpoint, {
+      method: 'POST',
+      headers: {
+        'Authorization': `Bearer ${token.token}`,
+        'Content-Type': 'application/json',
+        'x-goog-user-project': PROJECT_ID
+      },
+      body: JSON.stringify(requestBody)
+    });
+
+    if (!response.ok) {
+      const errText = await response.text();
+      throw new Error(`Vertex API error ${response.status}: ${errText}`);
+    }
+
+    const data = await response.json();
+
+    // Add this right after const data = await response.json();
+    console.log('FIRST RESULT:', JSON.stringify(data.results?.[0], null, 2));
+    console.log('SUMMARY FULL:', JSON.stringify(data.summary, null, 2));
+
+    console.log('RESPONSE KEYS:', Object.keys(data));
+    console.log('SUMMARY:', JSON.stringify(data.summary));
+    console.log('RESULT COUNT:', (data.results || []).length);
+
+    const results = (data.results || []).map(result => {
+      const derived = result.document?.derivedStructData;
+      if (!derived) return null;
+
+      const url = derived.link || null;
+      const snippet = derived.snippets?.[0]?.snippet || null;
+
+      return {
+        id:      result.document?.id,
+        title:   derived.title || null,
+        url,
+        snippet,
+        section: url?.replace('https://interlisp.org/', '')?.split('/')?.[0] || '',
+      };
+    }).filter(r => r?.url);
+
+    const summaryText = data.summary?.summaryText || null;
+
+    res.json({
+      summary: summaryText ? {
+        summaryText,
+        citations: data.summary?.summaryWithMetadata?.references || []
+      } : null,
+      results
+    });
+
+  } catch (err) {
+    console.error('Search error:', err);
+    res.status(500).json({ error: 'Search failed', detail: err.message });
+  }
+};
+
+function buildPreamble(context) {
+  const base = `You are a search assistant for the Interlisp documentation site.
+Answer questions clearly and concisely. Always cite the sources you used.
+If no relevant results exist, say so directly rather than guessing.`;
+
+  if (context) {
+    return `${base}\nThe user is currently browsing the "${context}" section — prioritize results from that section where relevant.`;
+  }
+  return base;
+}

search-function/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "search-function",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "commonjs",
+  "dependencies": {
+    "@google-cloud/discoveryengine": "^2.6.0",
+    "google-auth-library": "^10.6.2"
+  }
+}