fix: small ui issues in queues and tracing tabs (#1006)

Author: glauberfc

plugins/plugin-bullmq/src/components/jobs-table.tsx

@@ -91,7 +91,7 @@ const JobRow = memo<JobRowProps>(({ job, queueName, onSelect, isSelected }) => {
               <MoreVertical className="h-4 w-4" />
             </Button>
           </DropdownMenuTrigger>
-          <DropdownMenuContent align="end">
+          <DropdownMenuContent align="end" className="bg-background text-foreground">
             {job.failedReason && (
               <DropdownMenuItem onClick={handleRetry}>
                 <RefreshCw className="mr-2 h-4 w-4" />

plugins/plugin-bullmq/src/components/queue-detail.tsx

@@ -129,7 +129,7 @@ export const QueueDetail = memo(() => {
                       <MoreVertical className="h-4 w-4" />
                     </Button>
                   </DropdownMenuTrigger>
-                  <DropdownMenuContent align="end">
+                  <DropdownMenuContent align="end" className="bg-background text-foreground">
                     <DropdownMenuItem onClick={handleCleanCompleted}>
                       <Trash className="mr-2 h-4 w-4" />
                       Clean Completed

plugins/plugin-observability/src/components/trace-item/trace-item.tsx

@@ -46,8 +46,8 @@ export const TraceItem: React.FC<Props> = memo(
         onClick={handleClick}
         data-testid="trace-timeline-item"
       >
-        <div className="flex items-center min-w-[200px] max-w-[200px] h-[32px] max-h-[32px] py-4 px-2 text-sm font-semibold text-foreground truncate sticky left-0 bg-card z-9">
-          {traceName}
+        <div className="flex items-center min-w-[200px] max-w-[200px] h-[32px] max-h-[32px] py-4 px-2 text-sm font-semibold text-foreground sticky left-0 bg-card z-9">
+          <span className="truncate min-w-0">{traceName}</span>
         </div>
         <div className="flex w-full flex-row items-center hover:bg-muted/50 rounded-md">
           <div className="relative w-full h-[32px] flex items-center">