semanticSearch.html•6.2 kB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Security-Policy"
content="default-src 'none'; style-src 'unsafe-inline' vscode-resource:; script-src 'unsafe-inline' vscode-resource:; font-src vscode-resource:; img-src vscode-resource: https:;">
<title>Semantic Search</title>
<link rel="stylesheet" href="{{styleUri}}">
</head>
<body>
<!-- Search View -->
<div id="searchView" class="view">
<div class="search-container">
<div class="header-section">
<div class="title-section">
<h3>🔍 Semantic Code Search</h3>
<p class="subtitle">built by <a href="https://github.com/zilliztech/claude-context"
target="_blank">Claude Context</a></p>
</div>
<button id="settingsButton" class="settings-button" title="Settings">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="1.5">
<path
d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z" />
<circle cx="12" cy="12" r="3" />
</svg>
</button>
</div>
<label for="searchInput" class="input-label">Semantic search query</label>
<input type="text" id="searchInput" class="search-input"
placeholder="e.g. 'The main function of the codebase'" />
<label for="extFilterInput" class="input-label" style="margin-top: 10px; display: block;">Extension filter
(optional)</label>
<input type="text" id="extFilterInput" class="search-input" style="margin-top: 6px;"
placeholder="e.g. .ts,.py,.java" />
<button id="searchButton" class="search-button">Search</button>
<button id="indexButton" class="search-button"
style="margin-top: 4px; background-color: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground);">
Index Current Codebase
</button>
</div>
<div id="resultsContainer" class="results-container" style="display: none;">
<div id="resultsHeader" class="results-header"></div>
<div id="resultsList"></div>
</div>
</div>
<!-- Settings View -->
<div id="settingsView" class="view" style="display: none;">
<div class="container">
<div class="header">
<div class="header-section">
<h2>⚙️ Settings</h2>
<button id="backButton" class="settings-button" title="Back to Search">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="1.5">
<path d="M19 12H5M12 19l-7-7 7-7" />
</svg>
</button>
</div>
</div>
<form id="configForm">
<h3>Embedding Configuration</h3>
<div class="form-group">
<label for="provider">Embedding Provider</label>
<select id="provider" required>
<option value="">Please select...</option>
</select>
</div>
<!-- Dynamic form fields will be inserted here -->
<div id="dynamicFields"></div>
<div class="button-group">
<button type="button" id="testBtn" class="secondary-btn" disabled>Test Embedding</button>
</div>
<div class="form-separator"></div>
<h3>Code Splitter Configuration</h3>
<div class="form-group">
<label for="splitterType">Splitter Type</label>
<select id="splitterType" required>
<option value="langchain">LangChain Splitter</option>
<option value="ast">AST Splitter</option>
</select>
</div>
<div class="form-group">
<label for="chunkSize">Chunk Size</label>
<input type="number" id="chunkSize" min="100" max="5000" value="1000" required>
</div>
<div class="form-group">
<label for="chunkOverlap">Chunk Overlap</label>
<input type="number" id="chunkOverlap" min="0" max="1000" value="200" required>
</div>
<div class="form-separator"></div>
<h3>Vector Database Configuration</h3>
<div class="form-group">
<label for="milvusAddress">Milvus Address</label>
<input type="url" id="milvusAddress" placeholder="http://localhost:19530" required>
</div>
<div class="form-group">
<label for="milvusToken">Milvus Token (optional)</label>
<input type="password" id="milvusToken" placeholder="">
</div>
<div class="button-group">
<button type="submit" id="saveBtn" class="primary-btn" disabled>Save Configuration</button>
</div>
</form>
<div id="status" class="status-message" style="display: none;"></div>
</div>
</div>
<script src="{{scriptUri}}"></script>
</body>
</html>