Kaynağa Gözat

fix: add className prop to CodeDisplay component

Add className prop support to CodeDisplayProps interface and apply it
to the component wrapper divs using cn() utility. This fixes the
TypeScript error where session-details-tabs.tsx was passing className
prop that didn't exist in the interface.

CI Run: https://github.com/ding113/claude-code-hub/actions/runs/20778497724

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
github-actions[bot] 1 ay önce
ebeveyn
işleme
c622705b
1 değiştirilmiş dosya ile 5 ekleme ve 2 silme
  1. 5 2
      src/components/ui/code-display.tsx

+ 5 - 2
src/components/ui/code-display.tsx

@@ -18,6 +18,7 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Input } from "@/components/ui/input";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
+import { cn } from "@/lib/utils";
 import { parseSSEDataForDisplay } from "@/lib/utils/sse";
 import { parseSSEDataForDisplay } from "@/lib/utils/sse";
 
 
 export type CodeDisplayLanguage = "json" | "sse" | "text";
 export type CodeDisplayLanguage = "json" | "sse" | "text";
@@ -37,6 +38,7 @@ export interface CodeDisplayProps {
   maxLines?: number;
   maxLines?: number;
   enableDownload?: boolean;
   enableDownload?: boolean;
   enableCopy?: boolean;
   enableCopy?: boolean;
+  className?: string;
 }
 }
 
 
 function safeJsonParse(text: string): { ok: true; value: unknown } | { ok: false } {
 function safeJsonParse(text: string): { ok: true; value: unknown } | { ok: false } {
@@ -83,6 +85,7 @@ export function CodeDisplay({
   maxLines,
   maxLines,
   enableDownload = true,
   enableDownload = true,
   enableCopy = true,
   enableCopy = true,
+  className,
 }: CodeDisplayProps) {
 }: CodeDisplayProps) {
   const t = useTranslations("dashboard.sessions");
   const t = useTranslations("dashboard.sessions");
   const tActions = useTranslations("dashboard.actions");
   const tActions = useTranslations("dashboard.actions");
@@ -241,7 +244,7 @@ export function CodeDisplay({
     const maxSizeMB = (resolvedMaxContentBytes / 1_000_000).toFixed(2);
     const maxSizeMB = (resolvedMaxContentBytes / 1_000_000).toFixed(2);
 
 
     return (
     return (
-      <div data-testid="code-display" className="rounded-md border bg-muted/30">
+      <div data-testid="code-display" className={cn("rounded-md border bg-muted/30", className)}>
         <div className="flex flex-col gap-3 p-3 md:flex-row md:items-center md:justify-between">
         <div className="flex flex-col gap-3 p-3 md:flex-row md:items-center md:justify-between">
           <div className="flex items-center gap-2">
           <div className="flex items-center gap-2">
             {fileName && (
             {fileName && (
@@ -379,7 +382,7 @@ export function CodeDisplay({
       data-language={language}
       data-language={language}
       data-expanded={String(isExpanded)}
       data-expanded={String(isExpanded)}
       data-resolved-theme={resolvedTheme}
       data-resolved-theme={resolvedTheme}
-      className="rounded-md border bg-muted/30 flex flex-col min-h-0"
+      className={cn("rounded-md border bg-muted/30 flex flex-col min-h-0", className)}
     >
     >
       <div className="flex flex-col gap-3 p-3 md:flex-row md:items-center md:justify-between">
       <div className="flex flex-col gap-3 p-3 md:flex-row md:items-center md:justify-between">
         <div className="flex items-center gap-2">
         <div className="flex items-center gap-2">