dsrptlab/clientsflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve pilot chat live traces and remove mock placeholders

Browse Source
This commit is contained in:
Ruslan Bakiev
2026-02-18 21:22:35 +07:00
parent 46e5908244
commit fdc85d5c42
6 changed files with 120 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
Frontend/app.vue
View File

@@ -190,7 +190,6 @@ type PilotMessage = {
at: string;
}> | null;
createdAt?: string;
pending?: boolean;
};
type ChatConversation = {
@@ -222,23 +221,6 @@ const loginPassword = ref("");
const loginError = ref<string | null>(null);
const loginBusy = ref(false);
const pilotTimeline = computed<PilotMessage[]>(() => {
if (!pilotSending.value) return pilotMessages.value;
return [
...pilotMessages.value,
{
id: "__pilot_pending__",
role: "assistant",
text: "Working on it...",
thinking: ["Reading your request", "Planning the next actions", "Preparing the final answer"],
tools: [],
toolRuns: [],
createdAt: new Date().toISOString(),
pending: true,
},
];
});
const activeChatConversation = computed<ChatConversation | null>(() => {
const activeId = authMe.value?.conversation.id;
if (!activeId) return null;
@@ -414,12 +396,17 @@ async function sendPilotMessage() {
pilotSending.value = true;
pilotInput.value = "";
await loadPilotMessages().catch(() => {});
const pollId = setInterval(() => {
loadPilotMessages().catch(() => {});
}, 450);
try {
await gqlFetch<{ sendPilotMessage: { ok: boolean } }>(sendPilotMessageMutation, { text });
await Promise.all([loadPilotMessages(), loadChatConversations()]);
} catch {
pilotInput.value = text;
} finally {
clearInterval(pollId);
pilotSending.value = false;
}
}
@@ -1258,13 +1245,12 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
{{ thread.title }}
</option>
</select>
<p v-if="chatThreadsLoading" class="mt-1 text-[11px] text-white/50">Loading threads...</p>
</div>
</div>
<div class="pilot-timeline min-h-0 flex-1 overflow-y-auto">
<div
v-for="message in pilotTimeline"
v-for="message in pilotMessages"
:key="message.id"
class="pilot-row"
>
@@ -1276,7 +1262,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
<div class="pilot-meta">
<span class="pilot-author">{{ pilotRoleName(message.role) }}</span>
<span class="pilot-time">{{ formatPilotStamp(message.createdAt) }}</span>
<span v-if="message.pending" class="pilot-live-dot">Live</span>
</div>
<div class="pilot-message-text">
@@ -1284,11 +1269,18 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
</div>
<div
v-if="message.role !== 'user' && ((message.thinking && message.thinking.length) || (message.toolRuns && message.toolRuns.length) || (message.tools && message.tools.length))"
v-if="message.role !== 'user' && ((message.plan && message.plan.length) || (message.thinking && message.thinking.length) || (message.toolRuns && message.toolRuns.length) || (message.tools && message.tools.length))"
class="pilot-debug mt-2"
>
<div v-if="message.plan && message.plan.length" class="pilot-debug-block">
<p class="pilot-debug-title">Plan</p>
<ol class="pilot-debug-list">
<li v-for="(step, idx) in message.plan" :key="`plan-${message.id}-${idx}`">{{ step }}</li>
</ol>
</div>
<div v-if="message.thinking && message.thinking.length" class="pilot-debug-block">
<p class="pilot-debug-title">Thinking</p>
<p class="pilot-debug-title">Trace</p>
<ol class="pilot-debug-list">
<li v-for="(step, idx) in message.thinking" :key="`thinking-${message.id}-${idx}`">{{ step }}</li>
</ol>
@@ -1317,6 +1309,7 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
</div>
</div>
</div>
</div>
<div class="pilot-input-wrap">
@@ -1328,7 +1321,7 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
@keyup.enter="sendPilotMessage"
>
<button class="btn btn-sm border-0 bg-[#5865f2] text-white hover:bg-[#4752c4]" :disabled="pilotSending" @click="sendPilotMessage">
{{ pilotSending ? "..." : "Send" }}
{{ pilotSending ? "Sending..." : "Send" }}
</button>
</div>
</div>
@@ -2316,18 +2309,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
color: rgba(255, 255, 255, 0.45);
}
.pilot-live-dot {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: 700;
color: #c6ceff;
border-radius: 999px;
border: 1px solid rgba(124, 144, 255, 0.55);
padding: 1px 7px;
}
.pilot-message-text {
margin-top: 2px;
font-size: 13px;