GeneralBots/botui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): resolve 404 asset paths and replace missing icons with SVGs

Browse source 
- Fixed 404 errors on desktop shell assets by explicitly routing to /suite/ absolute paths
- Replaced missing FontAwesome icons in window-manager.js with inline SVGs since CDNs are banned
This commit is contained in:
Rodrigo Rodriguez (Pragmatismo) 2026-02-24 19:20:41 -03:00
parent 2f53b65aeb
commit 6d07aa4bdd
2 changed files with 19 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
ui/suite/desktop.html
View file

@ -6,14 +6,14 @@
<title>BUILD V3 - Web Desktop Environment</title> <title>BUILD V3 - Web Desktop Environment</title>
<!-- Link to the existing compiled CSS --> <!-- Link to the existing compiled CSS -->
<link rel="stylesheet" href="css/app.css" /> <link rel="stylesheet" href="/suite/css/app.css" />
<link rel="stylesheet" href="css/base.css" /> <link rel="stylesheet" href="/suite/css/base.css" />
<link rel="stylesheet" href="css/theme-sentient.css" /> <link rel="stylesheet" href="/suite/css/theme-sentient.css" />
<link rel="stylesheet" href="css/desktop.css" /> <link rel="stylesheet" href="/suite/css/desktop.css" />
<!-- Local JS requirements per AGENTS.md / UI.md --> <!-- Local JS requirements per AGENTS.md / UI.md -->
<script src="js/vendor/htmx.min.js"></script> <script src="/suite/js/vendor/htmx.min.js"></script>
<script src="js/window-manager.js"></script> <script src="/suite/js/window-manager.js"></script>
<style> <style>
* { margin: 0; padding: 0; box-sizing: border-box; } * { margin: 0; padding: 0; box-sizing: border-box; }

26
ui/suite/js/window-manager.js
View file

@ -44,9 +44,9 @@ if (typeof window.WindowManager === 'undefined') {
<div class="window-header h-10 bg-white/95 backdrop-blur flex items-center justify-between px-4 border-b border-gray-200 select-none cursor-move"> <div class="window-header h-10 bg-white/95 backdrop-blur flex items-center justify-between px-4 border-b border-gray-200 select-none cursor-move">
<div class="font-mono text-xs font-bold text-brand-600 tracking-wide">${title}</div> <div class="font-mono text-xs font-bold text-brand-600 tracking-wide">${title}</div>
<div class="flex space-x-3 text-gray-400"> <div class="flex space-x-3 text-gray-400">
<button class="btn-minimize hover:text-gray-600" onclick="window.WindowManager.toggleMinimize('${id}')"><i class="fa-solid fa-minus"></i></button> <button class="btn-minimize hover:text-gray-600" onclick="window.WindowManager.toggleMinimize('${id}')"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"></line></svg></button>
<button class="btn-maximize hover:text-gray-600" onclick="window.WindowManager.toggleMaximize('${id}')"><i class="fa-regular fa-square"></i></button> <button class="btn-maximize hover:text-gray-600" onclick="window.WindowManager.toggleMaximize('${id}')"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect></svg></button>
<button class="btn-close hover:text-red-500" onclick="window.WindowManager.close('${id}')"><i class="fa-solid fa-xmark"></i></button> <button class="btn-close hover:text-red-500" onclick="window.WindowManager.close('${id}')"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></button>
</div> </div>
</div> </div>
<!-- Body (HTMX target) --> <!-- Body (HTMX target) -->
@ -68,16 +68,16 @@ if (typeof window.WindowManager === 'undefined') {
taskbarIcon.className = 'h-10 w-12 flex items-center justify-center cursor-pointer bg-brand-50 rounded border-b-2 border-brand-500 transition-all taskbar-icon'; taskbarIcon.className = 'h-10 w-12 flex items-center justify-center cursor-pointer bg-brand-50 rounded border-b-2 border-brand-500 transition-all taskbar-icon';
taskbarIcon.onclick = () => this.toggleMinimize(id); taskbarIcon.onclick = () => this.toggleMinimize(id);
let iconHtml = '<i class="fa-solid fa-window-maximize"></i>'; let iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect></svg>';
if (id === 'vibe') iconHtml = '<i class="fa-solid fa-microchip"></i>'; if (id === 'vibe') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"/></svg>';
else if (id === 'tasks') iconHtml = '<i class="fa-solid fa-clipboard-list"></i>'; else if (id === 'tasks') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg>';
else if (id === 'chat') iconHtml = '<i class="fa-solid fa-comment-dots"></i>'; else if (id === 'chat') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>';
else if (id === 'terminal') iconHtml = '<i class="fa-solid fa-terminal"></i>'; else if (id === 'terminal') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="4 17 10 11 4 5"/><line x1="12" y1="19" x2="20" y2="19"/></svg>';
else if (id === 'drive') iconHtml = '<i class="fa-regular fa-folder-open"></i>'; else if (id === 'drive') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></svg>';
else if (id === 'editor') iconHtml = '<i class="fa-solid fa-code"></i>'; else if (id === 'editor') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>';
else if (id === 'browser') iconHtml = '<i class="fa-regular fa-compass"></i>'; else if (id === 'browser') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"/></svg>';
else if (id === 'mail') iconHtml = '<i class="fa-regular fa-envelope"></i>'; else if (id === 'mail') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>';
else if (id === 'settings') iconHtml = '<i class="fa-solid fa-gear"></i>'; else if (id === 'settings') iconHtml = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg>';
taskbarIcon.innerHTML = ` taskbarIcon.innerHTML = `
<div class="app-icon w-8 h-8 rounded-md flex items-center justify-center text-white text-xs shadow-sm"> <div class="app-icon w-8 h-8 rounded-md flex items-center justify-center text-white text-xs shadow-sm">