ui fix linting errors

This commit is contained in:
Ishaan Jaff
2025-03-10 12:23:33 -07:00
parent 629ce6c19a
commit 24a8dfd540
2 changed files with 39 additions and 33 deletions
@@ -156,7 +156,7 @@ ${formattedBody}
}}>
<div style={{ marginBottom: '24px' }}>
<h2 style={{ fontSize: '24px', fontWeight: 'bold', margin: '0 0 4px 0' }}>Original Request</h2>
<p style={{ color: '#666', margin: 0 }}>The request you would send to LiteLLM's /chat/completions endpoint.</p>
<p style={{ color: '#666', margin: 0 }}>The request you would send to LiteLLM /chat/completions endpoint.</p>
</div>
<textarea
@@ -37,41 +37,47 @@ export const columns: ColumnDef<LogEntry>[] = [
id: "expander",
header: () => null,
cell: ({ row }) => {
const [localExpanded, setLocalExpanded] = React.useState(row.getIsExpanded());
// Convert the cell function to a React component to properly use hooks
const ExpanderCell = () => {
const [localExpanded, setLocalExpanded] = React.useState(row.getIsExpanded());
// Memoize the toggle handler to prevent unnecessary re-renders
const toggleHandler = React.useCallback(() => {
setLocalExpanded((prev) => !prev);
row.getToggleExpandedHandler()();
}, [row]);
// Memoize the toggle handler to prevent unnecessary re-renders
const toggleHandler = React.useCallback(() => {
setLocalExpanded((prev) => !prev);
row.getToggleExpandedHandler()();
}, [row]);
return row.getCanExpand() ? (
<button
onClick={toggleHandler}
style={{ cursor: "pointer" }}
aria-label={localExpanded ? "Collapse row" : "Expand row"}
className="w-6 h-6 flex items-center justify-center focus:outline-none"
>
<svg
className={`w-4 h-4 transform transition-transform duration-75 ${
localExpanded ? 'rotate-90' : ''
}`}
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
return row.getCanExpand() ? (
<button
onClick={toggleHandler}
style={{ cursor: "pointer" }}
aria-label={localExpanded ? "Collapse row" : "Expand row"}
className="w-6 h-6 flex items-center justify-center focus:outline-none"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M9 5l7 7-7 7"
/>
</svg>
</button>
) : (
<span className="w-6 h-6 flex items-center justify-center"></span>
);
<svg
className={`w-4 h-4 transform transition-transform duration-75 ${
localExpanded ? 'rotate-90' : ''
}`}
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M9 5l7 7-7 7"
/>
</svg>
</button>
) : (
<span className="w-6 h-6 flex items-center justify-center"></span>
);
};
// Return the component
return <ExpanderCell />;
},
},
{