mirror of
https://github.com/googleapis/genai-toolbox.git
synced 2026-02-19 03:14:29 -05:00
276cf604a2
## Description Add draggable resize handle to tool list panel with min/max width constraints, visual feedback, and localStorage persistence. ## PR Checklist > Thank you for opening a Pull Request! Before submitting your PR, there are a > few things you can do to make sure it goes smoothly: - [ ] Make sure you reviewed [CONTRIBUTING.md](https://github.com/googleapis/genai-toolbox/blob/main/CONTRIBUTING.md) - [ ] Make sure to open an issue as a [bug/issue](https://github.com/googleapis/genai-toolbox/issues/new/choose) before writing your code! That way we can discuss the change, evaluate designs, and agree on the general idea - [ ] Ensure the tests and linter pass - [ ] Code coverage does not decrease (if any source code was changed) - [ ] Appropriate docs were updated (if necessary) - [ ] Make sure to add `!` if this involve a breaking change 🛠️ Fixes #1729 --------- Co-authored-by: Wenxin Du <117315983+duwenxin99@users.noreply.github.com>
45 lines
1.8 KiB
HTML
45 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Toolsets View</title>
|
|
<link rel="stylesheet" href="/ui/css/style.css">
|
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
<script src="https://accounts.google.com/gsi/client" async defer></script>
|
|
</head>
|
|
<body>
|
|
<div id="navbar-container" data-active-nav="/ui/toolsets"></div>
|
|
|
|
<aside class="second-nav">
|
|
<h4>Retrieve Toolset</h4>
|
|
<div class="search-container">
|
|
<input type="text" id="toolset-search-input" placeholder="Enter toolset name...">
|
|
<button id="toolset-search-button" aria-label="Retrieve Tools">
|
|
<span class="material-icons">search</span>
|
|
</button>
|
|
</div>
|
|
<div id="secondary-panel-content">
|
|
<p>Retrieve toolset to see available tools.</p>
|
|
</div>
|
|
</aside>
|
|
|
|
<div id="main-content-container"></div>
|
|
|
|
<script type="module" src="/ui/js/toolsets.js"></script>
|
|
<script src="/ui/js/navbar.js"></script>
|
|
<script src="/ui/js/mainContent.js"></script>
|
|
<script type="module">
|
|
document.addEventListener('DOMContentLoaded', async () => {
|
|
const navbarContainer = document.getElementById('navbar-container');
|
|
const activeNav = navbarContainer.getAttribute('data-active-nav');
|
|
renderNavbar('navbar-container', activeNav);
|
|
renderMainContent('main-content-container', 'tool-display-area', getToolsetInstructions());
|
|
|
|
// Initialize resize functionality
|
|
const { initializeResize } = await import('/ui/js/resize.js');
|
|
initializeResize();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |