Fix traffic row highlight after closing details pane

app/src/components/mode-specific/desktop/InterceptTraffic/WebTraffic/TrafficTableV2/NetworkInspector/NetworkTable/VirtualTableV2.tsx

@@ -15,10 +15,19 @@ interface Props {
   renderLogRow: any;
   selectedRowData: RQNetworkLog | null;
   onReplayRequest: () => void;
+  selectedRowId: string | null;
+  onSelectedRowChange: (id: string | null) => void;
 }
 
-const VirtualTableV2: React.FC<Props> = ({ logs = [], header, renderLogRow, selectedRowData, onReplayRequest }) => {
-  const [selected, setSelected] = useState<string | null>(null);
+const VirtualTableV2: React.FC<Props> = ({
+  logs = [],
+  header,
+  renderLogRow,
+  selectedRowData,
+  onReplayRequest,
+  selectedRowId,
+  onSelectedRowChange,
+}) => {
   const [lastKnownBottomIndex, setLastKnownBottomIndex] = useState<number | null>(null);
   const [isScrollToBottomEnabled, setIsScrollToBottomEnabled] = useState(true);
   const [headerHeight, setHeaderHeight] = useState(0);
@@ -147,12 +156,12 @@ const VirtualTableV2: React.FC<Props> = ({ logs = [], header, renderLogRow, sele
               "--virtualPaddingBottom": paddingBottom + "px",
             } as React.CSSProperties
           }
-          selected={selected ?? undefined}
+          selected={selectedRowId ?? undefined}
           onSelected={(id: string) => {
-            setSelected(id);
+            onSelectedRowChange(id);
             setIsScrollToBottomEnabled(false); // Disable autoscroll when row is selected
           }}
-          onContextMenu={(e: any) => setSelected(e.target?.parentElement.id)}
+          onContextMenu={(e: any) => onSelectedRowChange(e.target?.parentElement.id)}
         >
           {header}
           <ContextMenu log={selectedRowData ?? ({} as RQNetworkLog)} onReplayRequest={onReplayRequest}>

app/src/components/mode-specific/desktop/InterceptTraffic/WebTraffic/TrafficTableV2/NetworkInspector/NetworkTable/index.tsx

@@ -27,6 +27,8 @@ interface Props {
   setSelectedMockRequests: Function;
   showMockRequestSelector: boolean;
   selectedMockRequests: Record<string, any>;
+  selectedRowId: string | null;
+  onSelectedRowChange: (id: string | null) => void;
 }
 
 const NetworkTable: React.FC<Props> = ({
@@ -36,6 +38,8 @@ const NetworkTable: React.FC<Props> = ({
   setSelectedMockRequests,
   showMockRequestSelector,
   selectedMockRequests,
+  selectedRowId,
+  onSelectedRowChange,
 }) => {
   const [selectedRowData, setSelectedRowData] = useState<RQNetworkLog | null>(null);
   const [isReplayRequestModalOpen, setIsReplayRequestModalOpen] = useState(false);
@@ -271,6 +275,8 @@ const NetworkTable: React.FC<Props> = ({
           logs={logs}
           selectedRowData={selectedRowData}
           onReplayRequest={onReplayRequest}
+          selectedRowId={selectedRowId}
+          onSelectedRowChange={onSelectedRowChange}
         />
       </div>
       {isReplayRequestModalOpen ? (

app/src/components/mode-specific/desktop/InterceptTraffic/WebTraffic/TrafficTableV2/NetworkInspector/index.tsx

@@ -10,6 +10,8 @@ interface Props {
   setSelectedMockRequests: Function;
   showMockRequestSelector: boolean;
   selectedMockRequests: Record<string, any>;
+  selectedRowId: string | null;
+  onSelectedRowChange: (id: string | null) => void;
 }
 
 const NetworkInspector: React.FC<Props> = (props) => {
@@ -22,6 +24,8 @@ const NetworkInspector: React.FC<Props> = (props) => {
         setSelectedMockRequests={props.setSelectedMockRequests}
         showMockRequestSelector={props.showMockRequestSelector}
         selectedMockRequests={props.selectedMockRequests}
+        selectedRowId={props.selectedRowId}
+        onSelectedRowChange={props.onSelectedRowChange}
       />
     </AutoThemeProvider>
   );

app/src/components/mode-specific/desktop/InterceptTraffic/WebTraffic/TrafficTableV2/Tables/GroupByNone.jsx

@@ -15,6 +15,8 @@ const GroupByNone = ({
   showMockRequestSelector,
   selectedMockRequests,
   showMockFilters,
+  selectedRowId,
+  onSelectedRowChange,
 }) => {
   const renderNoTrafficCTA = () => {
     if (emptyCtaAction && emptyCtaText) {
@@ -49,6 +51,8 @@ const GroupByNone = ({
       setSelectedMockRequests={setSelectedMockRequests}
       showMockRequestSelector={showMockRequestSelector}
       selectedMockRequests={selectedMockRequests}
+      selectedRowId={selectedRowId}
+      onSelectedRowChange={onSelectedRowChange}
     />
   );
 };

app/src/components/mode-specific/desktop/InterceptTraffic/WebTraffic/TrafficTableV2/index.jsx

@@ -81,6 +81,7 @@ const CurrentTrafficTable = ({
   // Component State
   const [isPreviewOpen, setIsPreviewOpen] = useState(false);
   const [selectedRequestData, setSelectedRequestData] = useState({});
+  const [selectedRowId, setSelectedRowId] = useState(null);
   const [rulePaneSizes, setRulePaneSizes] = useState([100, 0]);
   const [isSSLProxyingModalVisible, setIsSSLProxyingModalVisible] = useState(false);
 
@@ -98,6 +99,10 @@ const CurrentTrafficTable = ({
 
   const mounted = useRef(false);
 
+  const handleSelectedRowChange = useCallback((id) => {
+    setSelectedRowId(id);
+  }, []);
+
   const selectedRequestResponse =
     useSelector(getLogResponseById(selectedRequestData?.id)) || selectedRequestData?.response?.body;
 
@@ -131,13 +136,15 @@ const CurrentTrafficTable = ({
 
   const handleRowClick = useCallback((row) => {
     setSelectedRequestData(row);
+    setSelectedRowId(row.id);
     handlePreviewVisibility(true);
     trackTrafficTableRequestClicked();
     trackRQDesktopLastActivity(TRAFFIC_TABLE.TRAFFIC_TABLE_REQUEST_CLICKED);
   }, []);
 
   const handleClosePane = () => {
     handlePreviewVisibility(false);
+    setSelectedRowId(null);
   };
 
   // const printLogsToConsole = useCallback(
@@ -461,6 +468,8 @@ const CurrentTrafficTable = ({
           showMockRequestSelector={showMockRequestSelector}
           selectedMockRequests={selectedMockRequests}
           showMockFilters={createMocksMode}
+          selectedRowId={selectedRowId}
+          onSelectedRowChange={handleSelectedRowChange}
         />
       );
     },
@@ -476,6 +485,8 @@ const CurrentTrafficTable = ({
       showMockRequestSelector,
       selectedMockRequests,
       createMocksMode,
+      selectedRowId,
+      handleSelectedRowChange,
     ]
   );