Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ function TextAreaInput(props: BudInputProps) {
onBlur={props.onBlur}
maxLength={400}
autoSize={{ minRows: 3, maxRows: 8 }}
className="!border !border-[#757575] hover:!border-[#CFCFCF] hover:!bg-[#FFFFFF08] shadow-none !placeholder-[#808080] !placeholder:text-[#808080]"
className="!border-none !shadow-none !border-[0] hover:!bg-[#FFFFFF08] shadow-none !placeholder-[#808080] !placeholder:text-[#808080]"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The className string contains several redundant utility classes. For example, !shadow-none is specified twice. Also, !border-none and !border-[0] are used together, while !border-none is sufficient. Similarly, !placeholder-[#808080] and !placeholder:text-[#808080] are duplicates. Simplifying this will improve code readability and maintainability.

Suggested change
className="!border-none !shadow-none !border-[0] hover:!bg-[#FFFFFF08] shadow-none !placeholder-[#808080] !placeholder:text-[#808080]"
className="!border-none !shadow-none hover:!bg-[#FFFFFF08] !placeholder-[#808080]"

/>
</Form.Item>
</FloatLabel>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1085,8 +1085,6 @@ const LogsTab: React.FC<LogsTabProps> = ({ promptName, promptId, projectId }) =>

// Handle incoming live trace data
const handleLiveTrace = useCallback((trace: TraceSpan) => {
console.log('[LiveTrace] Received trace:', trace);

// Validate required fields
if (!trace || !trace.span_id) {
console.warn('[LiveTrace] Invalid trace data - missing span_id:', trace);
Expand All @@ -1111,17 +1109,13 @@ const LogsTab: React.FC<LogsTabProps> = ({ promptName, promptId, projectId }) =>
.filter(t => t.timestamp > cutoffTime)
.slice(-MAX_CHART_TRACES);

console.log('[LiveTrace] Chart traces count:', liveChartTracesRef.current.length);

// In traces view, only show root spans (those with empty parent_span_id)
if (viewMode === 'traces' && trace.parent_span_id && trace.parent_span_id !== '') {
console.log('[LiveTrace] Skipping non-root span:', trace.span_id);
return;
}

// Deduplicate by span_id
if (liveSpanIdsRef.current.has(trace.span_id)) {
console.log('[LiveTrace] Duplicate span, skipping:', trace.span_id);
return;
}
liveSpanIdsRef.current.add(trace.span_id);
Expand All @@ -1148,14 +1142,11 @@ const LogsTab: React.FC<LogsTabProps> = ({ promptName, promptId, projectId }) =>
errorType,
};

console.log('[LiveTrace] Created LogEntry:', newEntry);
setLogsData(prev => [...prev, newEntry]);
setLogsData(prev => [...prev, newEntry].slice(-200));
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The number 200 is used here to limit the number of log entries, which is a good way to prevent performance degradation. However, it's a magic number. It would be better to define it as a named constant at the top of the component (e.g., const MAX_LOG_ENTRIES = 200;). This improves readability and makes it easier to maintain, especially since this value is used elsewhere in the file.

Suggested change
setLogsData(prev => [...prev, newEntry].slice(-200));
setLogsData(prev => [...prev, newEntry].slice(-MAX_LOG_ENTRIES));

}, [viewMode, timeRange]);

// Handle batch of live traces (for tree building in traces view)
const handleLiveTraceBatch = useCallback((traces: TraceSpan[]) => {
console.log('[LiveTrace] Received batch:', traces.length, 'spans');

if (!traces || traces.length === 0) return;

// Add all traces to chart data using arrival time
Expand All @@ -1178,13 +1169,9 @@ const LogsTab: React.FC<LogsTabProps> = ({ promptName, promptId, projectId }) =>
.filter(t => t.timestamp > cutoffTime)
.slice(-MAX_CHART_TRACES);

console.log('[LiveTrace] Batch - chart traces count:', liveChartTracesRef.current.length);

if (viewMode === 'traces') {
// In traces view, build proper tree structure from batch
const newTrees = buildTreeFromLiveSpans(traces);
console.log('[LiveTrace] Built', newTrees.length, 'trees from batch');

if (newTrees.length === 0) return;

// Track trace IDs for deduplication
Expand Down Expand Up @@ -1229,14 +1216,13 @@ const LogsTab: React.FC<LogsTabProps> = ({ promptName, promptId, projectId }) =>
errorType,
};

setLogsData(prev => [...prev, newEntry]);
setLogsData(prev => [...prev, newEntry].slice(-200));
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

This is another instance of using the magic number 200. As mentioned in the previous comment, this should be replaced with a shared constant like MAX_LOG_ENTRIES to ensure consistency and improve maintainability.

Suggested change
setLogsData(prev => [...prev, newEntry].slice(-200));
setLogsData(prev => [...prev, newEntry].slice(-MAX_LOG_ENTRIES));

});
}
}, [viewMode, timeRange]);

// Socket hook for live streaming
// Note: promptId (UUID) is used for socket subscription, promptName is used for API calls
console.log('[LogsTab] Socket params:', { projectId, promptId, promptName, isLive });
const { isSubscribed, connectionStatus, error: socketError } = useObservabilitySocket({
projectId: projectId || '',
promptId: promptId || '',
Expand Down
11 changes: 7 additions & 4 deletions services/budadmin/src/styles/globals.scss
Original file line number Diff line number Diff line change
Expand Up @@ -1469,21 +1469,21 @@ textArea {
}

.label {
top: -10px;
top: 0px;
display: block;
font-weight: 300;
position: absolute;
left: .75rem;
transition: 0.2s ease all;
color: white;
background: var(--color-background);
padding: 0 4px;
padding: 0 0.025rem;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The horizontal padding 0.025rem is very small (equivalent to 0.4px if 1rem=16px) and seems like a potential typo. The previous value was 4px which is 0.25rem. If the intention was to keep a similar spacing, it should probably be 0.25rem.

    padding: 0 0.25rem;

font-size: .75rem;
z-index: 1111;
}

.ant-input {
padding: 0.75rem 1rem;
padding: 1.3rem 1rem;
background: transparent !important;
font-size: 0.75rem;
}
Expand All @@ -1501,7 +1501,10 @@ textArea {
.ant-input-outlined {
background: transparent !important;
// background: black !important;
border: 0.5px solid #757575 !important;
border-width: 0.5px !important;
border-style: solid !important;
border-color: #757575 !important;
// border: 0.5px solid #757575 !important;
color: white;
border-radius: 6px !important;

Expand Down