From 55837205484ea8aeef8c7c8e1ecf808bba1a2b56 Mon Sep 17 00:00:00 2001
From: urjitc <135136842+urjitc@users.noreply.github.com>
Date: Wed, 15 Apr 2026 22:46:56 +0000
Subject: [PATCH 1/2] Add PostHog Feedback button and align Share button
 styling

---
 .../workspace-canvas/WorkspaceHeader.tsx      | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/components/workspace-canvas/WorkspaceHeader.tsx b/src/components/workspace-canvas/WorkspaceHeader.tsx
index f0e616c7..64afe451 100644
--- a/src/components/workspace-canvas/WorkspaceHeader.tsx
+++ b/src/components/workspace-canvas/WorkspaceHeader.tsx
@@ -4,7 +4,7 @@ import type React from "react";
 import { Fragment, useState, useRef, useEffect, useCallback, useMemo, useLayoutEffect } from "react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
-import { Search, X, ChevronRight, FolderOpen, Plus, Settings, Share2, Loader2, ExternalLink } from "lucide-react";
+import { Search, X, ChevronRight, FolderOpen, Plus, Settings, Share2, Loader2, ExternalLink, MessageSquareText } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { Kbd } from "@/components/ui/kbd";
@@ -1099,13 +1099,26 @@ export function WorkspaceHeader({
             {/* Collaborator Avatars - show who's in the workspace */}
             <CollaboratorAvatars />
 
+            {/* Feedback button — PostHog survey targets this via CSS selector */}
+            <Button
+              variant="ghost"
+              size="sm"
+              className="h-8 px-2 text-muted-foreground hover:text-foreground font-normal"
+              data-attr="feedback-button"
+            >
+              <MessageSquareText className="h-4 w-4" />
+              Feedback
+            </Button>
+
+            {/* Share button — now with icon */}
             {onOpenShare && (
               <Button
                 variant="ghost"
                 size="sm"
                 onClick={onOpenShare}
-                className="h-8 px-2 text-muted-foreground hover:text-foreground font-normal relative"
+                className="h-8 px-2 text-muted-foreground hover:text-foreground font-normal"
               >
+                <Share2 className="h-4 w-4" />
                 Share
               </Button>
             )}
@@ -1130,7 +1143,7 @@ export function WorkspaceHeader({
               </TooltipContent>
             </Tooltip>
 
-            {/* New Button */}
+            {/* New Button - keeps bordered style as primary CTA */}
             {addItem && (
               <DropdownMenu open={isNewMenuOpen} onOpenChange={setIsNewMenuOpen}>
                 <DropdownMenuTrigger asChild>

From 6c664319591d3a030531db60e96e01d4de310f76 Mon Sep 17 00:00:00 2001
From: Urjit Chakraborty <135136842+urjitc@users.noreply.github.com>
Date: Wed, 15 Apr 2026 19:10:14 -0400
Subject: [PATCH 2/2] refactor(workspace-header): align toolbar controls and
 text actions

Extract shared bordered toolbar tokens for Search and New so they stay
visually consistent. Style Feedback and Share as minimal text buttons
(borderless, color-only hover) with lighter padding. Keep controls in a
single gap-2 row: avatars, Feedback, Share, Search, New, then chat.

Made-with: Cursor
---
 .../workspace-canvas/WorkspaceHeader.tsx      | 48 +++++++++++--------
 1 file changed, 28 insertions(+), 20 deletions(-)

diff --git a/src/components/workspace-canvas/WorkspaceHeader.tsx b/src/components/workspace-canvas/WorkspaceHeader.tsx
index 64afe451..08e7162e 100644
--- a/src/components/workspace-canvas/WorkspaceHeader.tsx
+++ b/src/components/workspace-canvas/WorkspaceHeader.tsx
@@ -67,6 +67,22 @@ const BREADCRUMB_DRAG_TARGET_CLASS =
   "bg-blue-500/10 text-sidebar-foreground ring-1 ring-inset ring-blue-500/50";
 const BREADCRUMB_MENU_ITEM_CLASS =
   "flex items-center gap-1.5 rounded-md px-2 py-1.5 cursor-pointer";
+/** Shared shell for header toolbar controls — same border/hover as labeled actions; icon-only uses square hit target */
+const WORKSPACE_HEADER_TOOLBAR_BTN_BASE =
+  "h-8 rounded-md border border-sidebar-border text-muted-foreground hover:text-sidebar-foreground hover:bg-accent transition-colors pointer-events-auto cursor-pointer outline-none";
+/** Icon + label with border (primary toolbar CTA, e.g. New) */
+const WORKSPACE_HEADER_BORDERED_ACTION_CLASS = cn(
+  WORKSPACE_HEADER_TOOLBAR_BTN_BASE,
+  "inline-flex items-center gap-2 px-2 text-sm box-border whitespace-nowrap relative",
+);
+/** Text-only actions (Feedback, Share) — no border; hover shifts label/icon color only */
+const WORKSPACE_HEADER_TEXT_ACTION_CLASS =
+  "inline-flex h-8 items-center gap-1.5 rounded-md px-1 text-sm font-normal text-muted-foreground transition-colors hover:text-sidebar-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sidebar-ring/50 pointer-events-auto cursor-pointer bg-transparent border-0 shadow-none";
+/** Icon-only (Search) — same visual family; tooltip + aria-label carry the name */
+const WORKSPACE_HEADER_TOOLBAR_ICON_ONLY_CLASS = cn(
+  WORKSPACE_HEADER_TOOLBAR_BTN_BASE,
+  "w-8 shrink-0 flex items-center justify-center",
+);
 
 type BreadcrumbEntry =
   | {
@@ -1100,27 +1116,24 @@ export function WorkspaceHeader({
             <CollaboratorAvatars />
 
             {/* Feedback button — PostHog survey targets this via CSS selector */}
-            <Button
-              variant="ghost"
-              size="sm"
-              className="h-8 px-2 text-muted-foreground hover:text-foreground font-normal"
+            <button
+              type="button"
+              className={WORKSPACE_HEADER_TEXT_ACTION_CLASS}
               data-attr="feedback-button"
             >
-              <MessageSquareText className="h-4 w-4" />
+              <MessageSquareText className="h-4 w-4 shrink-0" />
               Feedback
-            </Button>
+            </button>
 
-            {/* Share button — now with icon */}
             {onOpenShare && (
-              <Button
-                variant="ghost"
-                size="sm"
+              <button
+                type="button"
                 onClick={onOpenShare}
-                className="h-8 px-2 text-muted-foreground hover:text-foreground font-normal"
+                className={WORKSPACE_HEADER_TEXT_ACTION_CLASS}
               >
-                <Share2 className="h-4 w-4" />
+                <Share2 className="h-4 w-4 shrink-0" />
                 Share
-              </Button>
+              </button>
             )}
 
             {/* Search - opens command palette */}
@@ -1128,10 +1141,7 @@ export function WorkspaceHeader({
               <TooltipTrigger asChild>
                 <button
                   onClick={() => onOpenSearch?.()}
-                  className={cn(
-                    "h-8 w-8 flex items-center justify-center rounded-md transition-colors pointer-events-auto cursor-pointer",
-                    "border border-sidebar-border text-muted-foreground hover:text-sidebar-foreground hover:bg-accent"
-                  )}
+                  className={WORKSPACE_HEADER_TOOLBAR_ICON_ONLY_CLASS}
                   data-tour="search-bar"
                   aria-label="Search workspace"
                 >
@@ -1149,9 +1159,7 @@ export function WorkspaceHeader({
                 <DropdownMenuTrigger asChild>
                   <button
                     className={cn(
-                      "h-8 outline-none rounded-md text-sm pointer-events-auto whitespace-nowrap relative cursor-pointer box-border",
-                      "inline-flex items-center gap-2 px-2",
-                      "border border-sidebar-border text-muted-foreground hover:text-sidebar-foreground hover:bg-accent transition-colors",
+                      WORKSPACE_HEADER_BORDERED_ACTION_CLASS,
                       isNewMenuOpen && "text-sidebar-foreground bg-accent"
                     )}
                     data-tour="add-card-button"