Fix: Always show autocompact threshold ui (#5701)

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This commit is contained in:
David Katz
2025-11-12 13:50:07 -05:00
committed by GitHub
parent c842621645
commit a747ba7a84
2 changed files with 90 additions and 97 deletions
+7 -13
View File
@@ -27,19 +27,17 @@ const alertStyles: Record<AlertType, string> = {
export const AlertBox = ({ alert, className }: AlertBoxProps) => { export const AlertBox = ({ alert, className }: AlertBoxProps) => {
const { read } = useConfig(); const { read } = useConfig();
const [isEditingThreshold, setIsEditingThreshold] = useState(false); const [isEditingThreshold, setIsEditingThreshold] = useState(false);
const [loadedThreshold, setLoadedThreshold] = useState<number | null>(null); const [loadedThreshold, setLoadedThreshold] = useState<number>(0.8);
const [thresholdValue, setThresholdValue] = useState( const [thresholdValue, setThresholdValue] = useState(80);
alert.autoCompactThreshold ? Math.max(1, Math.round(alert.autoCompactThreshold * 100)) : 80
);
const [isSaving, setIsSaving] = useState(false); const [isSaving, setIsSaving] = useState(false);
useEffect(() => { useEffect(() => {
const loadThreshold = async () => { const loadThreshold = async () => {
try { try {
const threshold = await read('GOOSE_AUTO_COMPACT_THRESHOLD', false); const threshold = await read('GOOSE_AUTO_COMPACT_THRESHOLD', false);
if (threshold !== undefined && threshold !== null) { if (threshold !== undefined && threshold !== null && typeof threshold === 'number') {
setLoadedThreshold(threshold as number); setLoadedThreshold(threshold);
setThresholdValue(Math.max(1, Math.round((threshold as number) * 100))); setThresholdValue(Math.max(1, Math.round(threshold * 100)));
} }
} catch (err) { } catch (err) {
console.error('Error fetching auto-compact threshold:', err); console.error('Error fetching auto-compact threshold:', err);
@@ -49,7 +47,7 @@ export const AlertBox = ({ alert, className }: AlertBoxProps) => {
loadThreshold(); loadThreshold();
}, [read]); }, [read]);
const currentThreshold = loadedThreshold !== null ? loadedThreshold : alert.autoCompactThreshold; const currentThreshold = loadedThreshold;
const handleSaveThreshold = async () => { const handleSaveThreshold = async () => {
if (isSaving) return; // Prevent double-clicks if (isSaving) return; // Prevent double-clicks
@@ -103,7 +101,6 @@ export const AlertBox = ({ alert, className }: AlertBoxProps) => {
<span className="text-[11px]">{alert.message}</span> <span className="text-[11px]">{alert.message}</span>
{/* Auto-compact threshold indicator with edit */} {/* Auto-compact threshold indicator with edit */}
{currentThreshold !== undefined && (
<div className="flex items-center justify-center gap-1 min-h-[20px]"> <div className="flex items-center justify-center gap-1 min-h-[20px]">
{isEditingThreshold ? ( {isEditingThreshold ? (
<> <>
@@ -138,9 +135,7 @@ export const AlertBox = ({ alert, className }: AlertBoxProps) => {
handleSaveThreshold(); handleSaveThreshold();
} else if (e.key === 'Escape') { } else if (e.key === 'Escape') {
setIsEditingThreshold(false); setIsEditingThreshold(false);
const resetValue = currentThreshold const resetValue = Math.round(currentThreshold * 100);
? Math.round(currentThreshold * 100)
: 80;
setThresholdValue(Math.max(1, resetValue)); setThresholdValue(Math.max(1, resetValue));
} }
}} }}
@@ -191,7 +186,6 @@ export const AlertBox = ({ alert, className }: AlertBoxProps) => {
</> </>
)} )}
</div> </div>
)}
<div className="flex justify-between w-full relative"> <div className="flex justify-between w-full relative">
{(() => { {(() => {
@@ -20,6 +20,5 @@ export interface Alert {
compactButtonDisabled?: boolean; compactButtonDisabled?: boolean;
onCompact?: () => void; onCompact?: () => void;
compactIcon?: React.ReactNode; compactIcon?: React.ReactNode;
autoCompactThreshold?: number;
onThresholdChange?: (threshold: number) => void; onThresholdChange?: (threshold: number) => void;
} }