feat: enhance TeamDataService and UI components for lead session management and message deduplication

- Refactored TeamDataService to improve lead session message handling, including deduplication logic to prevent double-rendering of messages. - Added leadSessionId to InboxMessage type for better session tracking. - Updated ActivityTimeline to visually separate messages by session, enhancing user experience. - Improved LeadThoughtsGroupRow to support live indicators and auto-scroll functionality for new messages. - Enhanced AddMemberDialog, LaunchTeamDialog, and MemberDraftRow with updated placeholder text for clarity.
2026-03-05 21:52:55 +02:00 · 2026-03-05 21:52:55 +02:00 · 65eb788097
commit 65eb788097
parent 1326c099fb
8 changed files with 203 additions and 98 deletions
--- a/src/main/services/team/TeamDataService.ts
+++ b/src/main/services/team/TeamDataService.ts
@ -258,8 +258,9 @@ export class TeamDataService {
    }
    mark('messages');

+    let leadTexts: InboxMessage[] = [];
    try {
-      const leadTexts = await this.extractLeadSessionTexts(config);
+      leadTexts = await this.extractLeadSessionTexts(config);
      if (leadTexts.length > 0) {
        messages = [...messages, ...leadTexts];
      }
@ -268,8 +269,9 @@ export class TeamDataService {
    }
    mark('leadTexts');

+    let sentMessages: InboxMessage[] = [];
    try {
-      const sentMessages = await this.sentMessagesStore.readMessages(teamName);
+      sentMessages = await this.sentMessagesStore.readMessages(teamName);
      if (sentMessages.length > 0) {
        messages = [...messages, ...sentMessages];
      }
@ -278,6 +280,33 @@ export class TeamDataService {
    }
    mark('sentMessages');

+    // Dedup: if a lead_process message text is also present in lead_session, prefer lead_session.
+    // This avoids double-rendering when we persist lead process messages and later load the lead JSONL.
+    if (leadTexts.length > 0 && sentMessages.length > 0) {
+      const normalizeText = (text: string): string => text.trim().replace(/\r\n/g, '\n');
+      const leadSessionFingerprints = new Set<string>();
+      for (const msg of leadTexts) {
+        if (msg.source !== 'lead_session') continue;
+        leadSessionFingerprints.add(`${msg.from}\0${normalizeText(msg.text)}`);
+      }
+      messages = messages.filter((m) => {
+        if (m.source !== 'lead_process') return true;
+        const fp = `${m.from}\0${normalizeText(m.text ?? '')}`;
+        return !leadSessionFingerprints.has(fp);
+      });
+    }
+
+    // Enrich messages without leadSessionId: assign current session for lead_process/user_sent.
+    // lead_process messages surviving dedup are from the current session;
+    // user_sent messages written before this feature lack the field.
+    if (config.leadSessionId) {
+      for (const msg of messages) {
+        if (!msg.leadSessionId && (msg.source === 'lead_process' || msg.source === 'user_sent')) {
+          msg.leadSessionId = config.leadSessionId;
+        }
+      }
+    }
+
    messages.sort((a, b) => Date.parse(b.timestamp) - Date.parse(a.timestamp));

    let metaMembers: TeamConfig['members'] = [];
@ -1102,6 +1131,15 @@ export class TeamDataService {
    attachments?: AttachmentMeta[]
  ): Promise<SendMessageResult> {
    const messageId = randomUUID();
+
+    let leadSessionId: string | undefined;
+    try {
+      const config = await this.configReader.getConfig(teamName);
+      leadSessionId = config?.leadSessionId;
+    } catch {
+      // non-critical — proceed without sessionId
+    }
+
    const msg: InboxMessage = {
      from: 'user',
      to: leadName,
@ -1112,6 +1150,7 @@ export class TeamDataService {
      messageId,
      source: 'user_sent',
      attachments: attachments?.length ? attachments : undefined,
+      leadSessionId,
    };
    await this.sentMessagesStore.appendMessage(teamName, msg);
    return { deliveredToInbox: false, deliveredViaStdin: true, messageId };
@ -1214,7 +1253,8 @@ export class TeamDataService {
        name: (() => {
          const name = member.name.trim();
          if (!name) throw new Error('Member name cannot be empty');
-          if (name.toLowerCase() === 'team-lead') throw new Error('Member name "team-lead" is reserved');
+          if (name.toLowerCase() === 'team-lead')
+            throw new Error('Member name "team-lead" is reserved');
          const suffixInfo = parseNumericSuffixName(name);
          if (suffixInfo && suffixInfo.suffix >= 2) {
            throw new Error(
@ -1374,6 +1414,7 @@ export class TeamDataService {
              timestamp,
              read: true,
              source: 'lead_session',
+              leadSessionId: config.leadSessionId,
            });
            if (textsReversed.length >= MAX_LEAD_TEXTS) break;
          }
--- a/src/main/services/team/TeamSentMessagesStore.ts
+++ b/src/main/services/team/TeamSentMessagesStore.ts
@ -75,6 +75,7 @@ export class TeamSentMessagesStore {
        color: typeof row.color === 'string' ? row.color : undefined,
        attachments: Array.isArray(row.attachments) ? row.attachments : undefined,
        source: typeof row.source === 'string' ? (row.source as InboxMessage['source']) : undefined,
+        leadSessionId: typeof row.leadSessionId === 'string' ? row.leadSessionId : undefined,
      });
    }

--- a/src/renderer/components/team/activity/ActivityTimeline.tsx
+++ b/src/renderer/components/team/activity/ActivityTimeline.tsx
@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
+import React, { useEffect, useMemo, useRef, useState } from 'react';

 import { buildMemberColorMap } from '@renderer/utils/memberHelpers';

@ -213,7 +213,8 @@ export const ActivityTimeline = ({
  const newItemKeys = useMemo(() => {
    const getItemKey = (item: TimelineItem): string => {
      if (item.type === 'lead-thoughts') {
-        return `thoughts-${item.group.thoughts[0].messageId ?? item.originalIndices[0]}-${item.group.thoughts.length}`;
+        // Stable key: identify group by its first thought, not by count (which changes)
+        return `thoughts-${item.group.thoughts[0].messageId ?? item.originalIndices[0]}`;
      }
      const msg = item.message;
      return `${msg.messageId ?? item.originalIndex}-${msg.timestamp}-${msg.from}`;
@ -274,22 +275,47 @@ export const ActivityTimeline = ({
    );
  }

+  const getItemSessionId = (item: TimelineItem): string | undefined =>
+    item.type === 'lead-thoughts'
+      ? item.group.thoughts[0].leadSessionId
+      : item.message.leadSessionId;
+
  return (
    <div className="space-y-1">
      {timelineItems.map((item, index) => {
+        // Session boundary separator (messages sorted desc — new on top)
+        let sessionSeparator: React.JSX.Element | null = null;
+        if (index > 0) {
+          const prevSessionId = getItemSessionId(timelineItems[index - 1]);
+          const currSessionId = getItemSessionId(item);
+          if (prevSessionId && currSessionId && prevSessionId !== currSessionId) {
+            sessionSeparator = (
+              <div className="flex items-center gap-3 py-4">
+                <div className="h-px flex-1 bg-[var(--color-border-emphasis)]" />
+                <span className="whitespace-nowrap text-[11px] text-[var(--color-text-muted)]">
+                  Новая сессия
+                </span>
+                <div className="h-px flex-1 bg-[var(--color-border-emphasis)]" />
+              </div>
+            );
+          }
+        }
+
        if (item.type === 'lead-thoughts') {
          const { group } = item;
          const firstThought = group.thoughts[0];
          const info = memberInfo.get(firstThought.from);
-          const itemKey = `thoughts-${firstThought.messageId ?? item.originalIndices[0]}-${group.thoughts.length}`;
+          const itemKey = `thoughts-${firstThought.messageId ?? item.originalIndices[0]}`;
          return (
-            <LeadThoughtsGroupRow
-              key={itemKey}
-              group={group}
-              memberColor={info?.color}
-              isNew={newItemKeys.has(itemKey)}
-              onVisible={onMessageVisible}
-            />
+            <React.Fragment key={itemKey}>
+              {sessionSeparator}
+              <LeadThoughtsGroupRow
+                group={group}
+                memberColor={info?.color}
+                isNew={newItemKeys.has(itemKey)}
+                onVisible={onMessageVisible}
+              />
+            </React.Fragment>
          );
        }

@ -303,24 +329,26 @@ export const ActivityTimeline = ({
          ? !message.read && !readState.readSet.has(readState.getMessageKey(message))
          : !message.read;
        return (
-          <MessageRowWithObserver
-            key={messageKey}
-            message={message}
-            teamName={teamName}
-            memberRole={info?.role}
-            memberColor={info?.color}
-            recipientColor={recipientColor}
-            isUnread={isUnread}
-            isNew={newItemKeys.has(messageKey)}
-            zebraShade={zebraShadeSet.has(index)}
-            memberColorMap={colorMap}
-            onMemberNameClick={onMemberClick ? handleMemberNameClick : undefined}
-            onCreateTask={onCreateTaskFromMessage}
-            onReply={onReplyToMessage}
-            onVisible={onMessageVisible}
-            onTaskIdClick={onTaskIdClick}
-            onRestartTeam={onRestartTeam}
-          />
+          <React.Fragment key={messageKey}>
+            {sessionSeparator}
+            <MessageRowWithObserver
+              message={message}
+              teamName={teamName}
+              memberRole={info?.role}
+              memberColor={info?.color}
+              recipientColor={recipientColor}
+              isUnread={isUnread}
+              isNew={newItemKeys.has(messageKey)}
+              zebraShade={zebraShadeSet.has(index)}
+              memberColorMap={colorMap}
+              onMemberNameClick={onMemberClick ? handleMemberNameClick : undefined}
+              onCreateTask={onCreateTaskFromMessage}
+              onReply={onReplyToMessage}
+              onVisible={onMessageVisible}
+              onTaskIdClick={onTaskIdClick}
+              onRestartTeam={onRestartTeam}
+            />
+          </React.Fragment>
        );
      })}
      {hiddenCount > 0 && (
--- a/src/renderer/components/team/activity/LeadThoughtsGroup.tsx
+++ b/src/renderer/components/team/activity/LeadThoughtsGroup.tsx
@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';

 import { MemberBadge } from '@renderer/components/team/MemberBadge';
 import {
@ -8,7 +8,6 @@ import {
  CARD_TEXT_LIGHT,
 } from '@renderer/constants/cssVariables';
 import { getTeamColorSet } from '@renderer/constants/teamColors';
-import { ChevronRight } from 'lucide-react';

 import type { InboxMessage } from '@shared/types';

@ -74,6 +73,8 @@ export function groupTimelineItems(messages: InboxMessage[]): TimelineItem[] {
 }

 const VIEWPORT_THRESHOLD = 0.15;
+const LIVE_WINDOW_MS = 10_000;
+const AUTO_SCROLL_THRESHOLD = 30;

 interface LeadThoughtsGroupRowProps {
  group: LeadThoughtGroup;
@ -94,34 +95,61 @@ function formatTimeWithSec(timestamp: string): string {
  return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
 }

+function isRecentTimestamp(timestamp: string): boolean {
+  const t = Date.parse(timestamp);
+  if (Number.isNaN(t)) return false;
+  return Date.now() - t <= LIVE_WINDOW_MS;
+}
+
 export const LeadThoughtsGroupRow = ({
  group,
  memberColor,
  isNew,
  onVisible,
 }: LeadThoughtsGroupRowProps): React.JSX.Element => {
-  const [expanded, setExpanded] = useState(false);
  const ref = useRef<HTMLDivElement>(null);
-  const reportedRef = useRef(false);
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const isUserScrolledUpRef = useRef(false);

  const colors = getTeamColorSet(memberColor ?? '');
  const { thoughts } = group;
-  const first = thoughts[0];
-  const last = thoughts[thoughts.length - 1];
-  const leadName = first.from;
+  // thoughts is newest-first; first=newest, last=oldest
+  const newest = thoughts[0];
+  const oldest = thoughts[thoughts.length - 1];
+  const leadName = newest.from;
+
+  // Chronological order for rendering (oldest at top, newest at bottom)
+  const chronologicalThoughts = useMemo(() => [...thoughts].reverse(), [thoughts]);
+
+  // Live indicator: newest thought is from lead_process and recent
+  const computeIsLive = useCallback(
+    () => newest.source === 'lead_process' && isRecentTimestamp(newest.timestamp),
+    [newest.source, newest.timestamp]
+  );
+  const [isLive, setIsLive] = useState(computeIsLive);
+
+  useEffect(() => {
+    setIsLive(computeIsLive());
+    const id = window.setInterval(() => setIsLive(computeIsLive()), 1000);
+    return () => window.clearInterval(id);
+  }, [computeIsLive]);
+
+  // Track how many thoughts have been reported as visible so far.
+  const reportedCountRef = useRef(0);

-  // Mark all thoughts as visible when the group enters the viewport
  useEffect(() => {
    if (!onVisible) return;
    const el = ref.current;
    if (!el) return;
    const observer = new IntersectionObserver(
      ([entry]) => {
-        if (!entry?.isIntersecting || reportedRef.current) return;
-        reportedRef.current = true;
-        for (const thought of thoughts) {
-          onVisible(thought);
+        if (!entry?.isIntersecting) return;
+        const alreadyReported = reportedCountRef.current;
+        if (alreadyReported >= thoughts.length) return;
+        for (let i = alreadyReported; i < thoughts.length; i++) {
+          onVisible(thoughts[i]);
        }
+        reportedCountRef.current = thoughts.length;
      },
      { threshold: VIEWPORT_THRESHOLD, rootMargin: '0px' }
    );
@ -129,10 +157,20 @@ export const LeadThoughtsGroupRow = ({
    return () => observer.disconnect();
  }, [onVisible, thoughts]);

-  // Preview: summary of newest thought (first in array since newest-first)
-  const previewText = first.summary || first.text.split('\n')[0];
-  const previewTruncated =
-    previewText.length > 120 ? previewText.slice(0, 117) + '...' : previewText;
+  // Auto-scroll to bottom when new thoughts arrive
+  useEffect(() => {
+    if (isUserScrolledUpRef.current) return;
+    const el = scrollRef.current;
+    if (!el) return;
+    el.scrollTop = el.scrollHeight;
+  }, [thoughts.length]);
+
+  const handleScroll = useCallback(() => {
+    const el = scrollRef.current;
+    if (!el) return;
+    const distanceFromBottom = el.scrollHeight - el.scrollTop - el.clientHeight;
+    isUserScrolledUpRef.current = distanceFromBottom > AUTO_SCROLL_THRESHOLD;
+  }, []);

  return (
    <div ref={ref} className={isNew ? 'message-enter-animate min-h-px' : 'min-h-px'}>
@ -142,62 +180,53 @@ export const LeadThoughtsGroupRow = ({
          backgroundColor: CARD_BG,
          border: CARD_BORDER_STYLE,
          borderLeft: `3px solid ${colors.border}`,
-          opacity: 0.75,
+          opacity: isLive ? undefined : 0.75,
        }}
      >
-        {/* Header — click to expand/collapse */}
-        {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions -- role=button + tabIndex + onKeyDown below */}
-        <div
-          role="button"
-          tabIndex={0}
-          className="flex cursor-pointer select-none items-center gap-2 px-3 py-1.5 hover:bg-[rgba(255,255,255,0.02)]"
-          onClick={() => setExpanded((v) => !v)}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter' || e.key === ' ') {
-              e.preventDefault();
-              setExpanded((v) => !v);
-            }
-          }}
-        >
-          <ChevronRight
-            className="size-3 shrink-0 transition-transform duration-150"
-            style={{
-              color: CARD_ICON_MUTED,
-              transform: expanded ? 'rotate(90deg)' : undefined,
-            }}
-          />
+        {/* Header */}
+        <div className="flex select-none items-center gap-2 px-3 py-1.5">
+          {/* Live / offline indicator */}
+          {isLive ? (
+            <span className="pointer-events-none relative inline-flex size-2 shrink-0">
+              <span className="absolute inline-flex size-full animate-ping rounded-full bg-emerald-400 opacity-50" />
+              <span className="relative inline-flex size-2 rounded-full bg-emerald-400" />
+            </span>
+          ) : (
+            <span className="inline-flex size-2 shrink-0 rounded-full bg-zinc-500" />
+          )}
          <MemberBadge name={leadName} color={memberColor} hideAvatar />
          <span className="text-[10px]" style={{ color: CARD_ICON_MUTED }}>
            {thoughts.length} thoughts
          </span>
          <span className="text-[10px]" style={{ color: CARD_ICON_MUTED }}>
-            {formatTime(last.timestamp)}–{formatTime(first.timestamp)}
+            {formatTime(oldest.timestamp)}–{formatTime(newest.timestamp)}
          </span>
-          {!expanded && (
-            <span className="flex-1 truncate text-[11px]" style={{ color: CARD_TEXT_LIGHT }}>
-              {previewTruncated}
-            </span>
-          )}
        </div>

-        {/* Expanded: all thoughts as compact timestamped lines */}
-        {expanded && (
-          <div
-            className="space-y-px border-t px-3 py-1.5"
-            style={{ borderColor: 'var(--color-border-subtle)' }}
-          >
-            {thoughts.map((thought, idx) => (
-              <div key={thought.messageId ?? idx} className="flex gap-2 py-0.5 text-[11px]">
-                <span className="shrink-0 font-mono" style={{ color: CARD_ICON_MUTED }}>
-                  {formatTimeWithSec(thought.timestamp)}
-                </span>
-                <span className="flex-1 leading-relaxed" style={{ color: CARD_TEXT_LIGHT }}>
-                  {thought.text.length > 300 ? thought.text.slice(0, 297) + '...' : thought.text}
-                </span>
-              </div>
-            ))}
-          </div>
-        )}
+        {/* Scrollable body — fixed height, always visible */}
+        <div
+          ref={scrollRef}
+          className="space-y-px border-t px-3 py-1.5"
+          style={{
+            borderColor: 'var(--color-border-subtle)',
+            maxHeight: '200px',
+            overflowY: 'auto',
+            scrollbarWidth: 'thin',
+            scrollbarColor: 'var(--scrollbar-thumb) transparent',
+          }}
+          onScroll={handleScroll}
+        >
+          {chronologicalThoughts.map((thought, idx) => (
+            <div key={thought.messageId ?? idx} className="flex gap-2 py-0.5 text-[11px]">
+              <span className="shrink-0 font-mono" style={{ color: CARD_ICON_MUTED }}>
+                {formatTimeWithSec(thought.timestamp)}
+              </span>
+              <span className="flex-1 leading-relaxed" style={{ color: CARD_TEXT_LIGHT }}>
+                {thought.text.length > 300 ? thought.text.slice(0, 297) + '...' : thought.text}
+              </span>
+            </div>
+          ))}
+        </div>
      </article>
    </div>
  );
--- a/src/renderer/components/team/dialogs/AddMemberDialog.tsx
+++ b/src/renderer/components/team/dialogs/AddMemberDialog.tsx
@ -170,7 +170,7 @@ export const AddMemberDialog = ({
              onValueChange={handleWorkflowChange}
              suggestions={mentionSuggestions}
              projectPath={projectPath ?? undefined}
-              placeholder="How this agent should behave, what tasks it handles. Use @ to mention teammates or add files."
+              placeholder="How this agent should behave, what tasks it handles..."
              footerRight={
                workflowDraft.isSaved ? (
                  <span className="text-[10px] text-[var(--color-text-muted)]">Draft saved</span>
--- a/src/renderer/components/team/dialogs/LaunchTeamDialog.tsx
+++ b/src/renderer/components/team/dialogs/LaunchTeamDialog.tsx
@ -362,7 +362,11 @@ export const LaunchTeamDialog = ({
                {prepareWarnings.length > 0 ? (
                  <div className="space-y-0.5">
                    {prepareWarnings.map((warning) => (
-                      <p key={warning} className="text-[11px]" style={{ color: 'var(--warning-text)' }}>
+                      <p
+                        key={warning}
+                        className="text-[11px]"
+                        style={{ color: 'var(--warning-text)' }}
+                      >
                        {warning}
                      </p>
                    ))}
@ -406,7 +410,7 @@ export const LaunchTeamDialog = ({
              chips={chipDraft.chips}
              onChipRemove={chipDraft.removeChip}
              onFileChipInsert={chipDraft.addChip}
-              placeholder="Instructions for team lead... Use @ to mention team members."
+              placeholder="Instructions for team lead..."
              footerRight={
                promptDraft.isSaved ? (
                  <span className="text-[10px] text-[var(--color-text-muted)]">Draft saved</span>
--- a/src/renderer/components/team/members/MemberDraftRow.tsx
+++ b/src/renderer/components/team/members/MemberDraftRow.tsx
@ -144,7 +144,7 @@ export const MemberDraftRow = ({
          onCustomRoleChange={(customRole) => onCustomRoleChange(member.id, customRole)}
          triggerClassName="h-8 text-xs"
          inputClassName="h-8 text-xs"
-/>
+        />
      </div>
      <div className="flex flex-col gap-2 sm:flex-row">
        {showWorkflow && onWorkflowChange ? (
@ -191,7 +191,7 @@ export const MemberDraftRow = ({
            onChipRemove={handleChipRemove}
            projectPath={projectPath ?? undefined}
            onFileChipInsert={handleFileChipInsert}
-            placeholder="How this agent should behave, interact with others. Use @ to mention teammates or add files."
+            placeholder="How this agent should behave, interact with others..."
            footerRight={
              workflowDraft.isSaved ? (
                <span className="text-[10px] text-[var(--color-text-muted)]">Draft saved</span>
--- a/src/shared/types/team.ts
+++ b/src/shared/types/team.ts
@ -196,6 +196,8 @@ export interface InboxMessage {
  messageId?: string;
  source?: 'inbox' | 'lead_session' | 'lead_process' | 'user_sent';
  attachments?: AttachmentMeta[];
+  /** Lead session ID that produced this message (for session boundary detection). */
+  leadSessionId?: string;
 }

 export interface SendMessageRequest {