Prevent Android chats from freezing or going blank (#1989)

* fix(app): stabilize streamed chat rendering

Use deterministic Markdown AST keys and preserve unique row identities when an assistant message resumes after a tool. Keep native gesture and plan-card children correctly keyed to avoid unsupported Fabric reconciliation paths.

* fix(app): stabilize retained native panels

Keep retained workspace roots in a stable native order and make active
panels present in the selection commit. Hidden panels now stop expensive
subscriptions and animations without losing mounted state.

* fix(app): harden retained panel activity
This commit is contained in:
Mohamed Boudra
2026-07-11 15:39:14 +08:00
committed by GitHub
parent 860fcb2e35
commit 28a27b02d3
40 changed files with 1244 additions and 543 deletions
@@ -1,6 +1,6 @@
import type { SidebarStatusWorkspacePlacement } from "@/hooks/sidebar-workspaces-view-model";
import type { SidebarWorkspaceEntry } from "@/hooks/sidebar-workspaces-view-model";
export type StatusBucket = SidebarStatusWorkspacePlacement["statusBucket"];
export type StatusBucket = SidebarWorkspaceEntry["statusBucket"];
export const STATUS_BUCKET_ORDER: readonly StatusBucket[] = [
"needs_input",
@@ -21,14 +21,14 @@ export const STATUS_BUCKET_LABELS: Record<StatusBucket, string> = {
export interface StatusGroup {
bucket: StatusBucket;
label: string;
rows: SidebarStatusWorkspacePlacement[];
rows: SidebarWorkspaceEntry[];
}
export function buildStatusGroups(
workspaces: SidebarStatusWorkspacePlacement[],
workspaces: SidebarWorkspaceEntry[],
projectNamesByKey: Map<string, string>,
): StatusGroup[] {
const bucketRows = new Map<StatusBucket, SidebarStatusWorkspacePlacement[]>();
const bucketRows = new Map<StatusBucket, SidebarWorkspaceEntry[]>();
for (const ws of workspaces) {
const bucket: StatusBucket = ws.statusBucket;
@@ -54,8 +54,8 @@ export function buildStatusGroups(
}
function compareStatusRows(
a: SidebarStatusWorkspacePlacement,
b: SidebarStatusWorkspacePlacement,
a: SidebarWorkspaceEntry,
b: SidebarWorkspaceEntry,
projectNamesByKey: Map<string, string>,
): number {
const aTime = a.statusEnteredAt?.getTime() ?? null;
@@ -4,7 +4,7 @@ import type { WorkspaceStructureProject } from "@/projects/workspace-structure";
import {
appendMissingOrderKeys,
applyStoredOrdering,
buildSidebarStatusWorkspacePlacements,
buildSidebarWorkspaceEntries,
buildSidebarWorkspacePlacementModel,
buildSidebarProjectsFromStructure,
computeSidebarOrderUpdates,
@@ -226,7 +226,7 @@ describe("shared sidebar workspace model", () => {
}),
],
});
const statusRows = buildSidebarStatusWorkspacePlacements({
const workspaceEntries = buildSidebarWorkspaceEntries({
placements: model.workspaces,
sessions: [
{
@@ -290,14 +290,66 @@ describe("shared sidebar workspace model", () => {
],
}),
]);
expect(statusRows.map((entry) => [entry.workspaceKey, entry.statusBucket, entry.name])).toEqual(
[
["host-a:main", "done", "main"],
["host-b:feature", "running", "feature/status-flow"],
],
);
expect(
Array.from(workspaceEntries.values()).map((entry) => [
entry.workspaceKey,
entry.statusBucket,
entry.name,
]),
).toEqual([
["host-a:main", "done", "main"],
["host-b:feature", "running", "feature/status-flow"],
]);
expect(model.projectNamesByKey).toEqual(new Map([["getpaseo/paseo", "getpaseo/paseo"]]));
});
it("preserves unchanged row identities when another workspace updates", () => {
const model = buildSidebarWorkspacePlacementModel({
projects: [project({ projectKey: "project", workspaceKeys: ["srv:one", "srv:two"] })],
});
const one = workspace({
id: "one",
name: "one",
projectId: "project",
projectDisplayName: "project",
});
const two = workspace({
id: "two",
name: "two",
projectId: "project",
projectDisplayName: "project",
});
const previousEntries = buildSidebarWorkspaceEntries({
placements: model.workspaces,
sessions: [
{
serverId: "srv",
workspaceAgentActivity: new Map(),
workspaces: new Map([
["one", one],
["two", two],
]),
},
],
});
const nextEntries = buildSidebarWorkspaceEntries({
placements: model.workspaces,
sessions: [
{
serverId: "srv",
workspaceAgentActivity: new Map(),
workspaces: new Map([
["one", one],
["two", { ...two, status: "running" }],
]),
},
],
previousEntries,
});
expect(nextEntries.get("srv:one")).toBe(previousEntries.get("srv:one"));
expect(nextEntries.get("srv:two")).not.toBe(previousEntries.get("srv:two"));
});
});
describe("shouldShowSidebarHostLabels", () => {
@@ -63,12 +63,59 @@ export interface SidebarWorkspacePlacementModel {
projectNamesByKey: Map<string, string>;
}
export interface SidebarStatusWorkspaceSession {
export interface SidebarWorkspaceSession {
serverId: string;
workspaces: Map<string, WorkspaceDescriptor>;
workspaceAgentActivity: Map<string, WorkspaceAgentActivity>;
}
interface SidebarWorkspaceSessionSource {
workspaces: Map<string, WorkspaceDescriptor>;
workspaceAgentActivity: Map<string, WorkspaceAgentActivity>;
}
export function selectSidebarWorkspaceSessions(
sessions: Record<string, SidebarWorkspaceSessionSource | undefined>,
serverIds: readonly string[],
): SidebarWorkspaceSession[] {
const selected: SidebarWorkspaceSession[] = [];
for (const serverId of serverIds) {
const session = sessions[serverId];
if (!session) {
continue;
}
selected.push({
serverId,
workspaces: session.workspaces,
workspaceAgentActivity: session.workspaceAgentActivity,
});
}
return selected;
}
export function areSidebarWorkspaceSessionsEqual(
left: readonly SidebarWorkspaceSession[],
right: readonly SidebarWorkspaceSession[],
): boolean {
if (left.length !== right.length) {
return false;
}
for (let index = 0; index < left.length; index += 1) {
const leftSession = left[index];
const rightSession = right[index];
if (
!leftSession ||
!rightSession ||
leftSession.serverId !== rightSession.serverId ||
leftSession.workspaces !== rightSession.workspaces ||
leftSession.workspaceAgentActivity !== rightSession.workspaceAgentActivity
) {
return false;
}
}
return true;
}
interface EffectiveWorkspaceStatus {
status: WorkspaceDescriptor["status"];
enteredAt: Date | null;
@@ -245,17 +292,18 @@ function resolveStructuralWorkspaceIdentity(input: {
};
}
export function buildSidebarStatusWorkspacePlacements(input: {
export function buildSidebarWorkspaceEntries(input: {
placements: readonly SidebarWorkspacePlacement[];
sessions: SidebarStatusWorkspaceSession[];
sessions: SidebarWorkspaceSession[];
pendingCreateAttempts?: Record<string, PendingCreateAttempt>;
}): SidebarStatusWorkspacePlacement[] {
previousEntries?: ReadonlyMap<string, SidebarWorkspaceEntry>;
}): Map<string, SidebarWorkspaceEntry> {
if (input.placements.length === 0 || input.sessions.length === 0) {
return [];
return new Map();
}
const sessionByServerId = new Map(input.sessions.map((session) => [session.serverId, session]));
const rows: SidebarStatusWorkspacePlacement[] = [];
const entries = new Map<string, SidebarWorkspaceEntry>();
for (const placement of input.placements) {
const session = sessionByServerId.get(placement.serverId);
@@ -267,24 +315,46 @@ export function buildSidebarStatusWorkspacePlacements(input: {
const workspace = workspaceKey ? session.workspaces.get(workspaceKey) : null;
if (!workspace) continue;
const effectiveStatus = deriveEffectiveWorkspaceStatus({
const entry = createSidebarWorkspaceEntry({
serverId: placement.serverId,
workspace,
pendingCreateAttempts: input.pendingCreateAttempts,
workspaceAgentActivity: session.workspaceAgentActivity,
});
rows.push({
...placement,
name: workspace.name,
workspaceDirectory: workspace.workspaceDirectory,
workspaceKind: workspace.workspaceKind,
statusBucket: effectiveStatus.status,
statusEnteredAt: effectiveStatus.enteredAt,
});
const previousEntry = input.previousEntries?.get(placement.workspaceKey);
entries.set(
placement.workspaceKey,
previousEntry && areSidebarWorkspaceEntriesEqual(previousEntry, entry)
? previousEntry
: entry,
);
}
return rows;
return entries;
}
function areSidebarWorkspaceEntriesEqual(
left: SidebarWorkspaceEntry,
right: SidebarWorkspaceEntry,
): boolean {
const keys = Object.keys(left) as Array<keyof SidebarWorkspaceEntry>;
if (keys.length !== Object.keys(right).length) return false;
return keys.every((key) => {
if (key !== "prHint") return Object.is(left[key], right[key]);
const leftHint = left.prHint;
const rightHint = right.prHint;
return (
leftHint === rightHint ||
(leftHint !== null &&
rightHint !== null &&
leftHint.url === rightHint.url &&
leftHint.number === rightHint.number &&
leftHint.state === rightHint.state &&
leftHint.checks === rightHint.checks &&
leftHint.checksStatus === rightHint.checksStatus &&
leftHint.reviewDecision === rightHint.reviewDecision)
);
});
}
export function buildSidebarProjectsFromStructure(input: {
@@ -0,0 +1,84 @@
import { describe, expect, it } from "vitest";
import type { WorkspaceDescriptor } from "@/stores/session-store";
import type { WorkspaceAgentActivity } from "@/utils/workspace-agent-activity";
import {
areSidebarWorkspaceSessionsEqual,
selectSidebarWorkspaceSessions,
type SidebarWorkspaceSession,
} from "./sidebar-workspaces-view-model";
function workspaceMap(): Map<string, WorkspaceDescriptor> {
return new Map();
}
function activityMap(): Map<string, WorkspaceAgentActivity> {
return new Map();
}
function sidebarSession(input?: Partial<Omit<SidebarWorkspaceSession, "serverId">>) {
return {
workspaces: input?.workspaces ?? workspaceMap(),
workspaceAgentActivity: input?.workspaceAgentActivity ?? activityMap(),
};
}
describe("sidebar workspace session selection", () => {
it("selects only sessions needed by sidebar placements", () => {
const hostA = sidebarSession();
const hostB = sidebarSession();
const unusedHost = sidebarSession();
expect(
selectSidebarWorkspaceSessions(
{
"host-a": hostA,
"host-b": hostB,
unused: unusedHost,
},
["host-b", "missing", "host-a"],
),
).toEqual([
{
serverId: "host-b",
workspaces: hostB.workspaces,
workspaceAgentActivity: hostB.workspaceAgentActivity,
},
{
serverId: "host-a",
workspaces: hostA.workspaces,
workspaceAgentActivity: hostA.workspaceAgentActivity,
},
]);
});
it("ignores high-frequency session changes outside the sidebar indexes", () => {
const workspaces = workspaceMap();
const workspaceAgentActivity = activityMap();
const previous = selectSidebarWorkspaceSessions(
{ "host-a": sidebarSession({ workspaces, workspaceAgentActivity }) },
["host-a"],
);
const next = selectSidebarWorkspaceSessions(
{ "host-a": sidebarSession({ workspaces, workspaceAgentActivity }) },
["host-a"],
);
expect(previous).not.toBe(next);
expect(areSidebarWorkspaceSessionsEqual(previous, next)).toBe(true);
});
it("detects changes to a selected workspace or activity index", () => {
const workspaceAgentActivity = activityMap();
const previous = selectSidebarWorkspaceSessions(
{ "host-a": sidebarSession({ workspaceAgentActivity, workspaces: workspaceMap() }) },
["host-a"],
);
const next = selectSidebarWorkspaceSessions(
{ "host-a": sidebarSession({ workspaceAgentActivity, workspaces: workspaceMap() }) },
["host-a"],
);
expect(areSidebarWorkspaceSessionsEqual(previous, next)).toBe(false);
});
});
@@ -0,0 +1,54 @@
import { useMemo, useRef } from "react";
import { useStoreWithEqualityFn } from "zustand/traditional";
import { useCreateFlowStore } from "@/stores/create-flow-store";
import { useSessionStore } from "@/stores/session-store";
import {
areSidebarWorkspaceSessionsEqual,
buildSidebarWorkspaceEntries,
selectSidebarWorkspaceSessions,
type SidebarWorkspaceEntry,
type SidebarWorkspacePlacement,
type SidebarWorkspaceSession,
} from "./sidebar-workspaces-view-model";
const EMPTY_ENTRIES = new Map<string, SidebarWorkspaceEntry>();
const EMPTY_SESSIONS: SidebarWorkspaceSession[] = [];
const EMPTY_PENDING_CREATE_ATTEMPTS: Record<string, never> = {};
export function useSidebarWorkspaceEntries(
placements: readonly SidebarWorkspacePlacement[],
enabled = true,
): ReadonlyMap<string, SidebarWorkspaceEntry> {
const serverIds = useMemo(
() => Array.from(new Set(placements.map((placement) => placement.serverId))),
[placements],
);
const sessions = useStoreWithEqualityFn(
useSessionStore,
(state) =>
enabled ? selectSidebarWorkspaceSessions(state.sessions, serverIds) : EMPTY_SESSIONS,
areSidebarWorkspaceSessionsEqual,
);
const pendingCreateAttempts = useCreateFlowStore((state) =>
enabled ? state.pendingByDraftId : EMPTY_PENDING_CREATE_ATTEMPTS,
);
const previousEntriesRef = useRef<ReadonlyMap<string, SidebarWorkspaceEntry>>(EMPTY_ENTRIES);
// Collection ownership is intentional: retained sidebars have one cheap
// subscription to structurally shared indexes, never one session-store
// subscription per mounted row.
return useMemo(() => {
if (!enabled || placements.length === 0 || sessions.length === 0) {
previousEntriesRef.current = EMPTY_ENTRIES;
return EMPTY_ENTRIES;
}
const entries = buildSidebarWorkspaceEntries({
placements,
sessions,
pendingCreateAttempts,
previousEntries: previousEntriesRef.current,
});
previousEntriesRef.current = entries;
return entries;
}, [enabled, pendingCreateAttempts, placements, sessions]);
}
@@ -1,10 +1,7 @@
import { useCallback, useEffect, useMemo } from "react";
import equal from "fast-deep-equal";
import { shallow } from "zustand/shallow";
import { useStoreWithEqualityFn } from "zustand/traditional";
import { useCreateFlowStore } from "@/stores/create-flow-store";
import { useSessionStore, type WorkspaceDescriptor } from "@/stores/session-store";
import { selectWorkspace, workspaceEqualityFns } from "@/stores/session-store-hooks/selectors";
import { useHostProjects } from "@/projects/host-projects";
import { fetchAllWorkspaceDescriptors } from "@/projects/workspace-fetching";
import { getHostRuntimeStore, useHostRegistryLoaded, useHosts } from "@/runtime/host-runtime";
@@ -14,7 +11,6 @@ import { shouldSuppressWorkspaceForLocalArchive } from "@/contexts/session-works
import {
buildSidebarWorkspacePlacementModel,
computeSidebarOrderUpdates,
createSidebarWorkspaceEntry,
deriveSidebarLoadingState,
type SidebarProjectEntry,
type SidebarWorkspaceEntry,
@@ -26,10 +22,9 @@ export {
applyStoredOrdering,
buildSidebarProjectsFromHostProjects,
buildSidebarProjectsFromStructure,
buildSidebarStatusWorkspacePlacements,
createSidebarWorkspaceEntry,
buildSidebarWorkspacePlacementModel,
computeSidebarOrderUpdates,
createSidebarWorkspaceEntry,
deriveSidebarLoadingState,
shouldShowSidebarHostLabels,
type SidebarLoadingState,
@@ -42,39 +37,6 @@ export {
type SidebarWorkspaceEntry,
} from "./sidebar-workspaces-view-model";
export function useSidebarWorkspaceEntry(
serverId: string | null,
workspaceId: string | null,
): SidebarWorkspaceEntry | null {
// Deep-compare so that adding/removing unrelated pending creates doesn't re-render this row.
const pendingCreateAttempts = useStoreWithEqualityFn(
useCreateFlowStore,
(state) => state.pendingByDraftId,
workspaceEqualityFns.deep,
);
// Single subscription: reads workspace + agents together, computes the full entry, and
// deep-compares the output. Agents-Map identity churn (setAgents replaces the Map on every
// status transition) never causes a React re-render unless the derived entry actually changes.
return useStoreWithEqualityFn(
useSessionStore,
(state) => {
const workspace = selectWorkspace(state, serverId, workspaceId);
if (!workspace) return null;
const workspaceAgentActivity = serverId
? state.sessions[serverId]?.workspaceAgentActivity
: undefined;
return createSidebarWorkspaceEntry({
serverId: serverId ?? "",
workspace,
pendingCreateAttempts,
workspaceAgentActivity,
});
},
equal,
);
}
const EMPTY_ORDER: string[] = [];
const EMPTY_PROJECTS: SidebarProjectEntry[] = [];
const EMPTY_WORKSPACES: SidebarWorkspacePlacement[] = [];
@@ -1,84 +0,0 @@
import { describe, expect, it } from "vitest";
import {
areStatusModeSessionsEqual,
selectStatusModeSessions,
type StatusModeSession,
} from "./use-status-mode-workspaces";
import type { WorkspaceAgentActivity } from "@/utils/workspace-agent-activity";
import type { WorkspaceDescriptor } from "@/stores/session-store";
function workspaceMap(): Map<string, WorkspaceDescriptor> {
return new Map();
}
function activityMap(): Map<string, WorkspaceAgentActivity> {
return new Map();
}
function statusSession(input?: Partial<Omit<StatusModeSession, "serverId">>) {
return {
workspaces: input?.workspaces ?? workspaceMap(),
workspaceAgentActivity: input?.workspaceAgentActivity ?? activityMap(),
};
}
describe("status mode session selection", () => {
it("selects only sessions needed by visible placements", () => {
const hostA = statusSession();
const hostB = statusSession();
const unusedHost = statusSession();
expect(
selectStatusModeSessions(
{
"host-a": hostA,
"host-b": hostB,
unused: unusedHost,
},
["host-b", "missing", "host-a"],
),
).toEqual([
{
serverId: "host-b",
workspaces: hostB.workspaces,
workspaceAgentActivity: hostB.workspaceAgentActivity,
},
{
serverId: "host-a",
workspaces: hostA.workspaces,
workspaceAgentActivity: hostA.workspaceAgentActivity,
},
]);
});
it("keeps selector output equal when only wrapper objects change", () => {
const workspaces = workspaceMap();
const workspaceAgentActivity = activityMap();
const previous = selectStatusModeSessions(
{ "host-a": statusSession({ workspaces, workspaceAgentActivity }) },
["host-a"],
);
const next = selectStatusModeSessions(
{ "host-a": statusSession({ workspaces, workspaceAgentActivity }) },
["host-a"],
);
expect(previous).not.toBe(next);
expect(areStatusModeSessionsEqual(previous, next)).toBe(true);
});
it("detects workspace or activity index changes for selected hosts", () => {
const workspaceAgentActivity = activityMap();
const previous = selectStatusModeSessions(
{ "host-a": statusSession({ workspaceAgentActivity, workspaces: workspaceMap() }) },
["host-a"],
);
const next = selectStatusModeSessions(
{ "host-a": statusSession({ workspaceAgentActivity, workspaces: workspaceMap() }) },
["host-a"],
);
expect(areStatusModeSessionsEqual(previous, next)).toBe(false);
});
});
@@ -1,100 +0,0 @@
import { useMemo } from "react";
import { useStoreWithEqualityFn } from "zustand/traditional";
import { useCreateFlowStore } from "@/stores/create-flow-store";
import { useSessionStore, type SessionState } from "@/stores/session-store";
import {
buildSidebarStatusWorkspacePlacements,
type SidebarStatusWorkspacePlacement,
type SidebarWorkspacePlacement,
} from "./use-sidebar-workspaces-list";
const EMPTY_WORKSPACES: SidebarStatusWorkspacePlacement[] = [];
const EMPTY_STATUS_SESSIONS: StatusModeSession[] = [];
const EMPTY_PENDING_CREATE_ATTEMPTS: ReturnType<
typeof useCreateFlowStore.getState
>["pendingByDraftId"] = {};
interface StatusModeSessionSource {
workspaces: SessionState["workspaces"];
workspaceAgentActivity: SessionState["workspaceAgentActivity"];
}
export interface StatusModeSession {
serverId: string;
workspaces: SessionState["workspaces"];
workspaceAgentActivity: SessionState["workspaceAgentActivity"];
}
export function selectStatusModeSessions(
sessions: Record<string, StatusModeSessionSource | undefined>,
serverIds: readonly string[],
): StatusModeSession[] {
const statusSessions: StatusModeSession[] = [];
for (const serverId of serverIds) {
const session = sessions[serverId];
if (!session) {
continue;
}
statusSessions.push({
serverId,
workspaces: session.workspaces,
workspaceAgentActivity: session.workspaceAgentActivity,
});
}
return statusSessions;
}
export function areStatusModeSessionsEqual(
left: readonly StatusModeSession[],
right: readonly StatusModeSession[],
): boolean {
if (left.length !== right.length) {
return false;
}
for (let index = 0; index < left.length; index += 1) {
const leftSession = left[index];
const rightSession = right[index];
if (
!leftSession ||
!rightSession ||
leftSession.serverId !== rightSession.serverId ||
leftSession.workspaces !== rightSession.workspaces ||
leftSession.workspaceAgentActivity !== rightSession.workspaceAgentActivity
) {
return false;
}
}
return true;
}
export function useStatusModeWorkspacePlacements(input: {
placements: SidebarWorkspacePlacement[];
enabled?: boolean;
}): SidebarStatusWorkspacePlacement[] {
const isEnabled = input.enabled !== false && input.placements.length > 0;
const serverIds = useMemo(
() => Array.from(new Set(input.placements.map((placement) => placement.serverId))),
[input.placements],
);
const statusSessions = useStoreWithEqualityFn(
useSessionStore,
(state) =>
isEnabled ? selectStatusModeSessions(state.sessions, serverIds) : EMPTY_STATUS_SESSIONS,
areStatusModeSessionsEqual,
);
const pendingCreateAttempts = useCreateFlowStore((state) =>
isEnabled ? state.pendingByDraftId : EMPTY_PENDING_CREATE_ATTEMPTS,
);
return useMemo(() => {
if (!isEnabled) {
return EMPTY_WORKSPACES;
}
return buildSidebarStatusWorkspacePlacements({
placements: input.placements,
sessions: statusSessions,
pendingCreateAttempts,
});
}, [input.placements, isEnabled, pendingCreateAttempts, statusSessions]);
}