@pheem49/mint 1.17.0 → 1.18.0

package/src/renderer/shared/components/activity/AgentActivityDrawer.tsx

@@ -31,6 +31,8 @@ export interface AgentActivityDrawerProps {
   isHistorical?: boolean
   pendingApproval?: boolean
   chatId?: string
+  workspacePath?: string
+  onReferenceFile?: (filePath: string) => void
   onOpenArtifact?: (artifact: ArtifactFile) => void
   key?: any
 }
@@ -47,6 +49,8 @@ export const AgentActivityDrawer = memo(function AgentActivityDrawer({
   isHistorical: isHistoricalProp,
   pendingApproval = false,
   chatId,
+  workspacePath,
+  onReferenceFile,
   onOpenArtifact,
 }: AgentActivityDrawerProps) {
   const effectiveProgress = progress ?? rawProgress ?? []
@@ -113,7 +117,7 @@ export const AgentActivityDrawer = memo(function AgentActivityDrawer({
               display: 'inline-flex',
               padding: '2px',
               background: 'var(--surface-strong)',
-              borderRadius: '6px',
+              borderRadius: 'var(--radius-xs, 6px)',
               border: '1px solid var(--border)',
             }}
           >
@@ -127,7 +131,7 @@ export const AgentActivityDrawer = memo(function AgentActivityDrawer({
                 background: viewMode === 'list' ? 'var(--accent)' : 'transparent',
                 color: viewMode === 'list' ? 'var(--text-on-accent)' : 'var(--text-muted)',
                 border: 'none',
-                borderRadius: '4px',
+                borderRadius: 'var(--radius-2xs, 4px)',
                 padding: '3px 8px',
                 fontSize: '0.74rem',
                 fontWeight: 500,
@@ -146,7 +150,7 @@ export const AgentActivityDrawer = memo(function AgentActivityDrawer({
                 background: viewMode === 'dag' ? 'var(--accent)' : 'transparent',
                 color: viewMode === 'dag' ? 'var(--text-on-accent)' : 'var(--text-muted)',
                 border: 'none',
-                borderRadius: '4px',
+                borderRadius: 'var(--radius-2xs, 4px)',
                 padding: '3px 8px',
                 fontSize: '0.74rem',
                 fontWeight: 500,
@@ -174,33 +178,72 @@ export const AgentActivityDrawer = memo(function AgentActivityDrawer({
       {viewMode === 'dag' && hasSubagents ? (
         <SubagentDagView progress={effectiveProgress} isLive={!isHistorical} />
       ) : activityView.items.length > 0 || (activityView.timeline && activityView.timeline.length > 0) ? (
-        <AgentActivityTable activityView={activityView} chatId={chatId} onOpenArtifact={onOpenArtifact} />
+        <AgentActivityTable
+          activityView={activityView}
+          progress={effectiveProgress}
+          chatId={chatId}
+          workspacePath={workspacePath}
+          onReferenceFile={onReferenceFile}
+          onOpenArtifact={onOpenArtifact}
+        />
       ) : null}
     </>
   )
 
-  const displaySummary =
+  const naturalActionSummary =
     latestPlan?.objective ||
+    activityView.naturalSummary ||
     activityView.summary ||
-    (latestRunSummary ? `Run telemetry (${latestRunSummary.outcome})` : 'Agent Activity')
+    (latestRunSummary ? `Run telemetry (${latestRunSummary.outcome})` : 'Working through task')
+
+  const durationText =
+    activityView.durationText ||
+    (latestRunSummary?.durationSecs ? `${Math.round(latestRunSummary.durationSecs)}s` : '')
+
+  const workedHeadline = durationText
+    ? `Worked for ${durationText}`
+    : (isHistorical || latestRunSummary) ? 'Worked' : 'Working'
 
   if (isHistorical) {
     return (
-      <div className="agent-activity-history">
-        <button type="button" className="agent-activity-toggle" aria-expanded={isOpen} onClick={handleToggle}>
-          <span>{displaySummary}</span>
-          <ChevronDown size={13} className={`agent-activity-toggle-chevron${isOpen ? ' is-open' : ''}`} aria-hidden="true" />
+      <div className="agent-activity-history modern-activity-history">
+        <button
+          type="button"
+          className="agent-activity-toggle modern-activity-toggle"
+          aria-expanded={isOpen}
+          onClick={handleToggle}
+        >
+          <div className="modern-activity-header-left">
+            <span className="modern-activity-duration">{workedHeadline}</span>
+            <ChevronDown
+              size={13}
+              className={`agent-activity-toggle-chevron${isOpen ? ' is-open' : ''}`}
+              aria-hidden="true"
+            />
+          </div>
+          <span className="modern-activity-natural-summary">{naturalActionSummary}</span>
         </button>
-        {isOpen && <div className="agent-activity-card agent-activity-card-history">{renderContent()}</div>}
+        {isOpen && (
+          <div className="agent-activity-card modern-activity-card agent-activity-card-history">
+            {renderContent()}
+          </div>
+        )}
       </div>
     )
   }
 
   return (
-    <div className="message ai-message agent-activity-message">
-      <div className="agent-activity-card">
-        <div className="agent-activity-header" style={{ cursor: 'pointer' }} onClick={handleToggle}>
-          <span>{displaySummary}</span>
+    <div className="message ai-message agent-activity-message modern-activity-message">
+      <div className="agent-activity-card modern-activity-card">
+        <div className="agent-activity-header modern-activity-header" style={{ cursor: 'pointer' }} onClick={handleToggle}>
+          <div className="modern-activity-header-left">
+            <span className="modern-activity-duration">{workedHeadline}</span>
+            <ChevronDown
+              size={13}
+              className={`agent-activity-toggle-chevron${isOpen ? ' is-open' : ''}`}
+              aria-hidden="true"
+            />
+          </div>
           <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
             <span
               className="agent-activity-status"
@@ -208,10 +251,17 @@ export const AgentActivityDrawer = memo(function AgentActivityDrawer({
             >
               {pendingApproval ? 'Waiting for approval' : latestRunSummary ? 'Completed' : 'Working'}
             </span>
-            <ChevronDown size={13} className={`agent-activity-toggle-chevron${isOpen ? ' is-open' : ''}`} aria-hidden="true" />
           </div>
         </div>
-        {isOpen && <div style={{ marginTop: '8px' }}>{renderContent()}</div>}
+        <div className="modern-activity-subheader" style={{ cursor: 'pointer' }} onClick={handleToggle}>
+          <span>{naturalActionSummary}</span>
+          <ChevronDown
+            size={12}
+            className={`modern-activity-subchevron${isOpen ? ' is-open' : ''}`}
+            aria-hidden="true"
+          />
+        </div>
+        {isOpen && <div className="modern-activity-content">{renderContent()}</div>}
       </div>
     </div>
   )