diff --git a/AgentCompany-New/src/renderer/src/shared/Shell.tsx b/AgentCompany-New/src/renderer/src/shared/Shell.tsx
index 3f69eb9e..e486239d 100644
--- a/AgentCompany-New/src/renderer/src/shared/Shell.tsx
+++ b/AgentCompany-New/src/renderer/src/shared/Shell.tsx
@@ -4,7 +4,7 @@ import { Avatar, Icon, IconButton } from "./ui";
export type RouteId = "home" | "team" | "work" | "chat" | "files" | "approvals" | "social" | "settings";
-const navItems: Array<{ id: RouteId; label: string; icon: string }> = [
+const mainNavItems: Array<{ id: RouteId; label: string; icon: string }> = [
{ id: "home", label: "Home", icon: "home" },
{ id: "team", label: "Team", icon: "team" },
{ id: "work", label: "Work", icon: "work" },
@@ -12,9 +12,10 @@ const navItems: Array<{ id: RouteId; label: string; icon: string }> = [
{ id: "files", label: "Files", icon: "docs" },
{ id: "approvals", label: "Approvals", icon: "approve" },
{ id: "social", label: "Social", icon: "social" },
- { id: "settings", label: "Settings", icon: "settings" },
];
+const navItems = [...mainNavItems, { id: "settings" as RouteId, label: "Settings", icon: "settings" }];
+
export function Shell({
snapshot,
route,
@@ -48,8 +49,13 @@ export function Shell({
{organization.name}
+
+
+ Search
+ ⌘K
+
-
-
-
{employee.displayName}
-
+
+
+
+
+
{employee.displayName}
+
+
@@ -78,7 +97,7 @@ export function Shell({
{actions}
{window.agentCompany.platform !== "darwin" && (
<>
- void window.agentCompany.windowMinimize()} />
+ void window.agentCompany.windowMinimize()} />
void window.agentCompany.windowClose()} />
>
)}
diff --git a/AgentCompany-New/src/renderer/src/shared/ui.tsx b/AgentCompany-New/src/renderer/src/shared/ui.tsx
index 1a7c864d..f2d70c78 100644
--- a/AgentCompany-New/src/renderer/src/shared/ui.tsx
+++ b/AgentCompany-New/src/renderer/src/shared/ui.tsx
@@ -10,10 +10,10 @@ import {
Grid2X2,
Hash,
Home,
- Inbox,
List,
Lock,
MessageCircle,
+ Minus,
MoreHorizontal,
Paperclip,
Plus,
@@ -21,7 +21,6 @@ import {
Send,
Settings,
ShieldCheck,
- Sparkles,
Upload,
Users,
X,
@@ -43,21 +42,38 @@ const icons: Record = {
grid: Grid2X2,
hash: Hash,
home: Home,
- inbox: Inbox,
list: List,
lock: Lock,
+ minus: Minus,
more: MoreHorizontal,
plus: Plus,
search: Search,
send: Send,
settings: Settings,
- social: Sparkles,
team: Users,
upload: Upload,
- work: Inbox,
x: X,
};
+const customIcons: Record ReactNode> = {
+ work: (size) => (
+
+ ),
+ social: (size) => (
+
+ ),
+};
+
const palette = [
["#5e6ad2", "#fff"],
["#e8b339", "#231600"],
@@ -76,6 +92,7 @@ function hashName(value: string): number {
}
export function Icon({ name, size = 14 }: { name: string; size?: number }) {
+ if (customIcons[name]) return <>{customIcons[name](size)}>;
const Component = icons[name] ?? FileText;
return ;
}
diff --git a/AgentCompany-New/src/renderer/src/styles.css b/AgentCompany-New/src/renderer/src/styles.css
index 946e2f05..847fb03c 100644
--- a/AgentCompany-New/src/renderer/src/styles.css
+++ b/AgentCompany-New/src/renderer/src/styles.css
@@ -21,7 +21,9 @@
--r-sm: 6px;
--r-md: 8px;
--r-lg: 12px;
+ --r-xl: 16px;
--shadow-sm: 0 1px 0 rgba(9, 9, 11, 0.04), 0 1px 2px rgba(9, 9, 11, 0.04);
+ --shadow-md: 0 1px 3px rgba(9, 9, 11, 0.06), 0 6px 24px rgba(9, 9, 11, 0.04);
--font-sans: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
--font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;
}
@@ -30,10 +32,11 @@
html, body, #root { width: 100%; height: 100%; margin: 0; }
body {
font-family: var(--font-sans);
+ font-feature-settings: "ss01", "cv11", "cv02";
color: var(--text-1);
background: var(--bg);
font-size: 13px;
- letter-spacing: 0;
+ letter-spacing: -0.005em;
-webkit-font-smoothing: antialiased;
}
button, input, textarea, select { font: inherit; }
@@ -74,6 +77,24 @@ button { cursor: pointer; }
font-weight: 600;
}
.brand-name { flex: 1; font-weight: 540; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.search-bar {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ padding: 6px 9px;
+ border-radius: var(--r-md);
+ background: var(--panel-2);
+ color: var(--text-3);
+ margin-bottom: 16px;
+ font-size: 12.5px;
+ cursor: text;
+}
+.search-kbd {
+ margin-left: auto;
+ font-size: 11px;
+ color: var(--text-3);
+ font-family: var(--font-mono);
+}
.nav { display: flex; flex-direction: column; gap: 1px; }
.nav-item {
display: flex;
@@ -91,7 +112,6 @@ button { cursor: pointer; }
.nav-item.active { background: var(--panel-3); color: var(--text-1); font-weight: 540; }
.nav-badge { margin-left: auto; font-size: 11px; color: var(--text-3); font-variant-numeric: tabular-nums; }
.sidebar-foot {
- margin-top: auto;
padding: 10px 8px 4px;
border-top: 1px solid var(--border-soft);
display: flex;