File size: 3,127 Bytes
978caa8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100

import React from 'react';
import { RefreshCcw, Copy, Check, Trash2, RotateCcw } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { Message } from "@/types/chat";

interface MessageActionsProps {
  message: Message;
  onRetry?: (messageId: string) => void;
  onRegenerate?: (messageId: string) => void;
  onDelete?: () => void;
  onCopy?: () => void;
  copied?: boolean;
}

export const MessageActions: React.FC<MessageActionsProps> = ({
  message,
  onRetry,
  onRegenerate,
  onDelete,
  onCopy,
  copied = false
}) => {
  const isSystem = message.sender === "system";
  
  return (
    <>
      {/* Retry button for failed messages */}
      {message.error && onRetry && (
        <div className="flex">
          <Button
            variant="secondary"
            size="sm"
            onClick={() => onRetry(message.id)}
            className="text-xs flex items-center gap-1.5 text-muted-foreground hover:border border-financial-accent/30 bg-background/50 backdrop-blur-sm"
          >
            <RefreshCcw className="h-3 w-3" />
            Retry
          </Button>
        </div>
      )}
      
      {/* Regenerate button for system messages */}
      {isSystem && !message.isLoading && onRegenerate && (
        <TooltipProvider>
          <Tooltip>
            <TooltipTrigger asChild>
              <div className="flex opacity-0 group-hover:opacity-100 transition-opacity">
                <Button
                  variant="link"
                  size="sm"
                  onClick={() => onRegenerate(message.id)}
                >
                  <RotateCcw className="h-3 w-3" />
                </Button>
              </div>
            </TooltipTrigger>
            <TooltipContent>
              <p>Generate variation</p>
            </TooltipContent>
          </Tooltip>
        </TooltipProvider>
      )}
      
      {/* Delete button */}
      {onDelete && !message.isLoading && (
        <TooltipProvider>
          <Tooltip>
            <TooltipTrigger asChild>
              <div className="flex opacity-0 group-hover:opacity-100">
                <Button
                  variant="ghost"
                  size="sm"
                  onClick={onDelete}
                  className="text-xs flex items-center gap-1.5 text-muted-foreground hover:text-destructive hover:bg-background/50 backdrop-blur-sm"
                >
                  <Trash2 className="h-3 w-3" />
                </Button>
              </div>
            </TooltipTrigger>
            <TooltipContent>
              <p>Delete message</p>
            </TooltipContent>
          </Tooltip>
        </TooltipProvider>
      )}
      
      {/* Copy button */}
      {onCopy && !message.isLoading && (
        <div className="opacity-0 group-hover:opacity-100 transition-opacity">
          <Button variant="link" size="sm" onClick={onCopy}>
            {copied ? <Check className="h-4 w-4" /> : <Copy className="h-4 w-4" />}
          </Button>
        </div>
      )}
    </>
  );
};