makima/frontend/src/components/files/UpdateNotification.tsx


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

interface UpdateNotificationProps {
  updatedBy: "user" | "llm" | "system";
  onRefresh: () => void;
  onDismiss: () => void;
}

export function UpdateNotification({
  updatedBy,
  onRefresh,
  onDismiss,
}: UpdateNotificationProps) {
  const source = updatedBy === "llm" ? "AI assistant" : "another session";

  return (
    <div className="fixed bottom-4 right-4 max-w-md p-4 bg-[#1a2332] border border-[#3f6fb3]/50 shadow-lg z-50">
      <div className="flex items-start gap-3">
        <div className="text-[#75aafc] text-xl font-bold">i</div>
        <div className="flex-1">
          <h3 className="font-mono text-sm text-[#9bc3ff] font-semibold mb-1">
            File Updated
          </h3>
          <p className="font-mono text-xs text-white/70 mb-3">
            This file was updated by {source}.
          </p>
          <div className="flex gap-2">
            <button
              onClick={onRefresh}
              className="px-3 py-1 font-mono text-xs text-[#9bc3ff] border border-[rgba(117,170,252,0.25)] hover:border-[#3f6fb3] transition-colors"
            >
              Refresh Now
            </button>
            <button
              onClick={onDismiss}
              className="px-3 py-1 font-mono text-xs text-[#555] hover:text-white/70 transition-colors"
            >
              Dismiss
            </button>
          </div>
        </div>
      </div>
    </div>
  );
}