- Replace generic UI with dedicated Heroprompt web interface - Implement new Heroprompt-specific backend APIs - Develop client-side logic for file browsing and selection - Enhance workspace configuration and management capabilities - Remove deprecated generic UI modules and code
115 lines
4.1 KiB
HTML
115 lines
4.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>{{.title}} - Heroprompt</title>
|
|
<link rel="stylesheet" href="/static/css/main.css">
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<div class="toolbar">
|
|
<div class="title">{{.title}}</div>
|
|
<span class="spacer"></span>
|
|
<button id="toggleTheme" title="Toggle dark/light">🌓</button>
|
|
</div>
|
|
|
|
<div class="tabs">
|
|
<button class="tab active" data-tab="compose">Compose</button>
|
|
<button class="tab" data-tab="chat">Chat</button>
|
|
</div>
|
|
<div class="tab-content">
|
|
<section id="tab-compose" class="tab-pane active">
|
|
<div class="layout">
|
|
<div class="sidebar">
|
|
<div class="sidebar-header">
|
|
<select id="workspaceSelect"></select>
|
|
<button id="refreshWs">Refresh</button>
|
|
<button id="wsCreateBtn" title="Create a new workspace">+</button>
|
|
<button id="wsDetailsBtn" title="Workspace details">Details</button>
|
|
<span class="spacer"></span>
|
|
</div>
|
|
<div class="sidebar-body">
|
|
<div class="searchbar">
|
|
<input id="search" placeholder="Search files..." />
|
|
<div class="ws-info" id="wsInfo"></div>
|
|
<button id="doSearch">Search</button>
|
|
</div>
|
|
<div id="tree"></div>
|
|
</div>
|
|
</div>
|
|
<div class="main">
|
|
<div class="prompt">
|
|
<h3>Prompt</h3>
|
|
<textarea id="promptText" placeholder="Type your instructions here..."></textarea>
|
|
<div class="actions"><button id="copyPrompt">Copy Prompt</button></div>
|
|
</div>
|
|
<div class="selection">
|
|
<h3>Selected Files (<span id="selCount">0</span>) — Tokens: <span id="tokenCount">0</span></h3>
|
|
<ul id="selected"></ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section id="tab-chat" class="tab-pane">
|
|
<div class="chat">
|
|
<div id="chatMessages" class="messages"></div>
|
|
<div class="chat-input">
|
|
<textarea id="chatInput" placeholder="Type a message..."></textarea>
|
|
<button id="sendChat">Send</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<script src="/static/js/main.js" defer></script>
|
|
<!-- Modal: Create Workspace -->
|
|
<div id="wsCreate" class="modal" aria-hidden="true">
|
|
<div class="modal-backdrop"></div>
|
|
<div class="modal-dialog">
|
|
<div class="modal-header">
|
|
<h4>Create workspace</h4>
|
|
<button id="wcClose" class="icon">✕</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<label for="wcName">Workspace name (optional)</label>
|
|
<input id="wcName" placeholder="leave blank to auto-generate" />
|
|
<small class="hint">If blank we will generate one for you</small>
|
|
<label for="wcPath">Workspace path (required)</label>
|
|
<input id="wcPath" placeholder="/full/path e.g. ~/code/github/project1" />
|
|
<div id="wcError" class="error" role="alert"></div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button id="wcCancel">Cancel</button>
|
|
<button id="wcCreate">Create</button>
|
|
</div>
|
|
</div>
|
|
<!-- Modal: Workspace Details -->
|
|
<div id="wsDetails" class="modal" aria-hidden="true">
|
|
<div class="modal-backdrop"></div>
|
|
<div class="modal-dialog">
|
|
<div class="modal-header">
|
|
<h4>Workspace details</h4>
|
|
<button id="wdClose" class="icon">✕</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<label for="wdName">Name</label>
|
|
<input id="wdName" />
|
|
<label for="wdPath">Path</label>
|
|
<input id="wdPath" />
|
|
<div id="wdError" class="error" role="alert"></div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button id="wdDelete">Delete</button>
|
|
<span class="spacer"></span>
|
|
<button id="wdCancel">Close</button>
|
|
<button id="wdSave">Save</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |