improvement(copilot): ui/ux

Author: emir-karabeg

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/command-list/command-list.tsx

@@ -2,10 +2,10 @@
 
 import { useCallback } from 'react'
 import { createLogger } from '@sim/logger'
-import { Layout, LibraryBig, Search } from 'lucide-react'
+import { Layout, Search } from 'lucide-react'
 import Image from 'next/image'
 import { useParams, useRouter } from 'next/navigation'
-import { Button } from '@/components/emcn'
+import { Button, Library } from '@/components/emcn'
 import { AgentIcon } from '@/components/icons'
 import { cn } from '@/lib/core/utils/cn'
 import { usePreventZoom } from '@/app/workspace/[workspaceId]/w/[workflowId]/hooks'
@@ -41,7 +41,7 @@ const commands: CommandItem[] = [
   },
   {
     label: 'Logs',
-    icon: LibraryBig,
+    icon: Library,
     shortcut: 'L',
   },
   {

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/components/copilot-message/components/thinking-block.tsx

@@ -184,7 +184,7 @@ export function ThinkingBlock({
   // During streaming: show header with shimmer effect + expanded content
   if (!isThinkingDone) {
     return (
-      <div className='mt-1 mb-0'>
+      <div>
         {/* Define shimmer keyframes */}
         <style>{`
           @keyframes thinking-shimmer {
@@ -201,7 +201,7 @@ export function ThinkingBlock({
               return next
             })
           }}
-          className='group mb-1 inline-flex items-center gap-1 text-left font-[470] font-season text-[var(--text-secondary)] text-sm transition-colors hover:text-[var(--text-primary)]'
+          className='group inline-flex items-center gap-1 text-left font-[470] font-season text-[var(--text-secondary)] text-sm transition-colors hover:text-[var(--text-primary)]'
           type='button'
         >
           <span className='relative inline-block'>
@@ -242,7 +242,7 @@ export function ThinkingBlock({
           ref={scrollContainerRef}
           className={clsx(
             'overflow-y-auto transition-all duration-300 ease-in-out',
-            isExpanded ? 'mt-1 max-h-[200px] opacity-100' : 'max-h-0 opacity-0'
+            isExpanded ? 'mt-1.5 max-h-[200px] opacity-100' : 'max-h-0 opacity-0'
           )}
         >
           {/* Render markdown during streaming with thinking text styling */}
@@ -257,12 +257,12 @@ export function ThinkingBlock({
 
   // After done: show collapsible header with duration
   return (
-    <div className='mt-1 mb-0'>
+    <div>
       <button
         onClick={() => {
           setIsExpanded((v) => !v)
         }}
-        className='group mb-1 inline-flex items-center gap-1 text-left font-[470] font-season text-[var(--text-secondary)] text-sm transition-colors hover:text-[var(--text-primary)]'
+        className='group inline-flex items-center gap-1 text-left font-[470] font-season text-[var(--text-secondary)] text-sm transition-colors hover:text-[var(--text-primary)]'
         type='button'
         disabled={!hasContent}
       >
@@ -282,7 +282,7 @@ export function ThinkingBlock({
         ref={scrollContainerRef}
         className={clsx(
           'overflow-y-auto transition-all duration-300 ease-in-out',
-          isExpanded ? 'mt-1 max-h-[200px] opacity-100' : 'max-h-0 opacity-0'
+          isExpanded ? 'mt-1.5 max-h-[200px] opacity-100' : 'max-h-0 opacity-0'
         )}
       >
         {/* Use markdown renderer for completed content */}

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/components/copilot-message/copilot-message.tsx

@@ -483,7 +483,7 @@ const CopilotMessage: FC<CopilotMessageProps> = memo(
             )}
 
             {message.errorType === 'usage_limit' && (
-              <div className='mt-3 flex gap-1.5'>
+              <div className='flex gap-1.5'>
                 <UsageLimitActions />
               </div>
             )}