Bohdan Triapitsyn
8587db89b1
- Cut broad render fanout across the app by replacing shared-store whole-object subscriptions with leaf selectors, memoizing hot chrome boundaries, and isolating disabled global providers from live session/message state. This keeps header controls, composer toolbars, side panels, and other non-hot UI surfaces from repainting on every assistant update or keystroke. - Rework sidebar session ordering so recent, project groups, and worktree groups derive from one ordering source while avoiding streaming-time thrash. The sidebar now uses a stabilized session snapshot, preserves structural identity for unchanged rows, reads live row status/details per session, and applies a one-shot sort bump on idle->busy instead of continuously resorting during activity. - Fix chat/input scroll instability by separating viewport-resize handling from message-growth handling, disabling conflicting native scroll anchoring, and stopping textarea autosize from collapsing on every growth keystroke. This removes the multiline typing jiggle during streaming and reduces unnecessary composer rerenders. - Also gate voice context wiring behind voice-mode enablement and codify the learned render/scroll/order anti-patterns in AGENTS.md so future changes avoid the same classes of regressions.
39 lines
1.4 KiB
TypeScript
39 lines
1.4 KiB
TypeScript
import React from 'react';
|
|
import { cn } from '@/lib/utils';
|
|
import { useConfigStore } from '@/stores/useConfigStore';
|
|
import { getModelDisplayName } from './mobileControlsUtils';
|
|
|
|
interface MobileModelButtonProps {
|
|
onOpenModel: () => void;
|
|
className?: string;
|
|
}
|
|
|
|
export const MobileModelButton: React.FC<MobileModelButtonProps> = ({ onOpenModel, className }) => {
|
|
const currentModelId = useConfigStore((state) => state.currentModelId);
|
|
const getCurrentProvider = useConfigStore((state) => state.getCurrentProvider);
|
|
const currentProvider = getCurrentProvider();
|
|
const modelLabel = getModelDisplayName(currentProvider, currentModelId);
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={onOpenModel}
|
|
className={cn(
|
|
'inline-flex min-w-0 items-center justify-center',
|
|
'rounded-lg border border-border/50 px-1.5',
|
|
'typography-micro font-medium text-foreground/80',
|
|
'focus:outline-none hover:bg-[var(--interactive-hover)]',
|
|
className
|
|
)}
|
|
style={{ height: '26px', maxHeight: '26px', minHeight: '26px' }}
|
|
title={modelLabel}
|
|
>
|
|
<span className="min-w-0 max-w-full overflow-x-auto whitespace-nowrap scrollbar-hidden">
|
|
{modelLabel}
|
|
</span>
|
|
</button>
|
|
);
|
|
};
|
|
|
|
export default MobileModelButton;
|