d8dfun/claudecodeui
1
0
Fork 0
mirror of https://github.com/siteboon/claudecodeui.git synced 2025-12-14 22:59:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(App): wrap session handlers in useCallback to avoid warnings on depth

Browse Source 
Wrap markSessionAsActive, markSessionAsInactive, markSessionAsProcessing,
markSessionAsNotProcessing, and replaceTemporarySession functions in
useCallback hooks to prevent unnecessary re-renders and stabilize
function references across component lifecycle. This optimization
ensures child components receiving these callbacks won't re-render
unnecessarily when AppContent re-renders.
This commit is contained in:
simos
2025-10-31 00:46:56 +00:00
parent 1bc2cf49ec
commit 53c1af33fa
1 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/App.jsx
View File

@@ -18,7 +18,7 @@
* Handles both existing sessions (with real IDs) and new sessions (with temporary IDs).
*/
import React, { useState, useEffect } from 'react';
import React, { useState, useEffect, useCallback } from 'react';
import { BrowserRouter as Router, Routes, Route, useNavigate, useParams } from 'react-router-dom';
import Sidebar from './components/Sidebar';
import MainContent from './components/MainContent';
@@ -478,14 +478,14 @@ function AppContent() {
// markSessionAsActive: Called when user sends a message to mark session as protected
// This includes both real session IDs and temporary "new-session-*" identifiers
const markSessionAsActive = (sessionId) => {
const markSessionAsActive = useCallback((sessionId) => {
if (sessionId) {
setActiveSessions(prev => new Set([...prev, sessionId]));
}
};
}, []);
// markSessionAsInactive: Called when conversation completes/aborts to re-enable project updates
const markSessionAsInactive = (sessionId) => {
const markSessionAsInactive = useCallback((sessionId) => {
if (sessionId) {
setActiveSessions(prev => {
const newSet = new Set(prev);
@@ -493,19 +493,19 @@ function AppContent() {
return newSet;
});
}
};
}, []);
// Processing Session Functions: Track which sessions are currently thinking/processing
// markSessionAsProcessing: Called when Claude starts thinking/processing
const markSessionAsProcessing = (sessionId) => {
const markSessionAsProcessing = useCallback((sessionId) => {
if (sessionId) {
setProcessingSessions(prev => new Set([...prev, sessionId]));
}
};
}, []);
// markSessionAsNotProcessing: Called when Claude finishes thinking/processing
const markSessionAsNotProcessing = (sessionId) => {
const markSessionAsNotProcessing = useCallback((sessionId) => {
if (sessionId) {
setProcessingSessions(prev => {
const newSet = new Set(prev);
@@ -513,12 +513,12 @@ function AppContent() {
return newSet;
});
}
};
}, []);
// replaceTemporarySession: Called when WebSocket provides real session ID for new sessions
// Removes temporary "new-session-*" identifiers and adds the real session ID
// This maintains protection continuity during the transition from temporary to real session
const replaceTemporarySession = (realSessionId) => {
const replaceTemporarySession = useCallback((realSessionId) => {
if (realSessionId) {
setActiveSessions(prev => {
const newSet = new Set();
@@ -532,7 +532,7 @@ function AppContent() {
return newSet;
});
}
};
}, []);
// Version Upgrade Modal Component
const VersionUpgradeModal = () => {