From 57086d2f6f8cf758b80a9beda0c0ef3a29634b34 Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 19 Jun 2026 21:13:32 +0000 Subject: [PATCH] Fix favicon, dark select dropdowns, add brand bookmark icons and Help page - Replace mislabeled Vite-logo favicon.svg with proper ArchNest mark extracted from the logo, generated at 32/48/256px PNGs - Force native setIcon(e.target.value)}> - {Object.keys(ICONS).map((key) => ( - - ))} - +
+ + {iconMode === 'manual' && ( + + )} +
+ {iconMode === 'auto' ? ( +
+
+ + + {isIconUrl(icon) ? 'Detected from title/URL' : 'No match yet — type a title or pick one'} + +
+ +
+ ) : ( + + )}
@@ -390,7 +451,7 @@ export default function BookNest() { [...groups] .sort((a, b) => b.links.length - a.links.length) .slice(0, 5) - .map((g) => ({ label: g.title, icons: g.links.slice(0, 5).map((l) => resolveIcon(l.icon)), count: g.links.length })), + .map((g) => ({ label: g.title, icons: g.links.slice(0, 5).map((l) => l.icon), count: g.links.length })), [groups] ) @@ -464,9 +525,9 @@ export default function BookNest() {
{qa.label}
- {qa.icons.map((Icon, i) => ( + {qa.icons.map((icon, i) => (
- +
))}
@@ -503,15 +564,12 @@ export default function BookNest() {

Favorites

{favorites.length > 0 ? ( - favorites.map((f) => { - const Icon = resolveIcon(f.icon) - return ( - - - {f.title} - - ) - }) + favorites.map((f) => ( + + + {f.title} + + )) ) : (

No favorites yet

)} diff --git a/src/pages/Help.tsx b/src/pages/Help.tsx new file mode 100644 index 0000000..d5cf4dc --- /dev/null +++ b/src/pages/Help.tsx @@ -0,0 +1,145 @@ +import { + LayoutGrid, + Server, + Bookmark, + Terminal, + Waypoints, + FolderOpen, + Box, + MonitorSmartphone, + Gauge, + Settings, + Search, + type LucideIcon, +} from 'lucide-react' + +const cardBase: React.CSSProperties = { + backgroundColor: 'rgba(10, 10, 12, 0.92)', + border: '1px solid rgba(200, 164, 52, 0.08)', + borderRadius: '12px', + padding: '22px', +} + +interface GuideEntry { + icon: LucideIcon + title: string + description: string + tips?: string[] +} + +const guideEntries: GuideEntry[] = [ + { + icon: LayoutGrid, + title: 'Glance', + description: + 'The home dashboard. Shows overall system health, a rollup of connected integrations, recent activity, and shortcuts into the rest of the app.', + tips: ['Click "Connected Integrations" entries to jump straight to Infrastructure.'], + }, + { + icon: Server, + title: 'Infrastructure', + description: + 'Lists every connected integration (Proxmox, AWS, Docker, NetBird, Cloudflare, Uptime Kuma, Weather, SSH hosts) and the live resources/health each one reports.', + tips: ['Add new integrations from Settings → Integrations — they show up here automatically.'], + }, + { + icon: Bookmark, + title: 'BookNest', + description: 'A categorized bookmark manager for the links you use most — internal tools, dashboards, docs, anything.', + tips: [ + 'Icons are auto-detected from the title or URL (e.g. typing "Proxmox" picks up the real Proxmox logo) — pick "Choose manually" if it guesses wrong.', + 'Star a bookmark to pin it to the Favorites panel.', + ], + }, + { + icon: Terminal, + title: 'Terminal', + description: 'A full SSH terminal to any host you\'ve added as an integration — supports tabs, split panes, jump hosts, and certificate auth.', + tips: ['Session output can be logged; theme and font preferences are remembered between visits.'], + }, + { + icon: Waypoints, + title: 'Tunnels', + description: 'Local, remote, and dynamic (SOCKS5) SSH tunnels. Tunnels can be set to auto-start whenever the backend boots.', + }, + { + icon: FolderOpen, + title: 'Files', + description: 'Browse, edit, upload, and download files over SFTP on any connected SSH host — and transfer files directly between two hosts without round-tripping through your machine.', + tips: ['Use the "Send to another host" action on a file row to start a host-to-host transfer; progress shows live in the panel at the bottom.'], + }, + { + icon: Box, + title: 'Containers', + description: 'Manage Docker containers on remote hosts — start, stop, view logs, and exec into a running container.', + }, + { + icon: MonitorSmartphone, + title: 'Remote Desktop', + description: 'RDP, VNC, and Telnet sessions to remote machines, streamed through the built-in Guacamole proxy — no separate client needed.', + }, + { + icon: Gauge, + title: 'Host Metrics', + description: 'Live CPU, memory, disk, network, listening-port, firewall, process, and login-activity widgets for any SSH-managed host.', + }, + { + icon: Settings, + title: 'Settings', + description: 'Your profile, integrations, appearance, notifications, and full data export/import (back up or migrate every integration, bookmark, and tunnel as a single JSON file).', + }, + { + icon: Search, + title: 'Search (top bar)', + description: 'The search box at the top of every page looks across pages, integrations, and bookmarks at once — press Enter to jump to the top match.', + }, +] + +export default function Help() { + return ( +
+
+

How ArchNest works

+

+ A quick tour of every page and what it's for. Use the sidebar to navigate, or the search bar at the top to jump straight to something. +

+
+ +
+ {guideEntries.map((entry) => { + const Icon = entry.icon + return ( +
+
+
+ +
+

{entry.title}

+
+

{entry.description}

+ {entry.tips && entry.tips.length > 0 && ( +
    + {entry.tips.map((tip, i) => ( +
  • + {tip} +
    • + ))} +
+ )} +
+ ) + })} +
+
+ ) +}