mirror of
https://github.com/olehomelchenko/astrolabe.git
synced 2025-12-21 21:22:25 +00:00
feat: add search functionality for snippets with input field in UI
This commit is contained in:
@@ -38,6 +38,7 @@
|
||||
<h2>Snippets</h2>
|
||||
<button class="button" id="new-snippet">New Snippet</button>
|
||||
</div>
|
||||
<input type="text" id="snippet-search" class="snippet-search" placeholder="Search snippets...">
|
||||
<div class="snippet-list" id="snippet-list">
|
||||
<!-- Snippets will be populated here -->
|
||||
</div>
|
||||
|
||||
@@ -2,6 +2,7 @@ export class UIManager {
|
||||
constructor(snippetManager) {
|
||||
this.snippetManager = snippetManager;
|
||||
this.setupEventListeners();
|
||||
this.setupSearchInput();
|
||||
}
|
||||
|
||||
setupEventListeners() {
|
||||
@@ -147,4 +148,25 @@ export class UIManager {
|
||||
'View Saved' :
|
||||
'View Draft';
|
||||
}
|
||||
|
||||
setupSearchInput() {
|
||||
const searchInput = document.getElementById('snippet-search');
|
||||
searchInput.addEventListener('input', (e) => {
|
||||
const query = e.target.value;
|
||||
let filteredSnippets;
|
||||
try {
|
||||
const regex = new RegExp(query, 'i');
|
||||
filteredSnippets = this.snippetManager.snippets.filter(snippet => {
|
||||
const snippetText = JSON.stringify(snippet);
|
||||
return regex.test(snippetText);
|
||||
});
|
||||
} catch (err) {
|
||||
filteredSnippets = this.snippetManager.snippets.filter(snippet => {
|
||||
const snippetText = JSON.stringify(snippet).toLowerCase();
|
||||
return snippetText.includes(query.toLowerCase());
|
||||
});
|
||||
}
|
||||
this.renderSnippetList(filteredSnippets, this.snippetManager.currentSnippetId);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -325,3 +325,12 @@
|
||||
.snippet-item:hover .comment-snippet {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.snippet-search {
|
||||
width: 100%;
|
||||
padding: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 4px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
Reference in New Issue
Block a user