homeio

1import { X } from "@/components/icons/platform-icons";
2
3import type { ConfiguratorView } from "@/modules/apps/components/configurator/configurator-mapper";
4
5type ConfiguratorHeaderProps = {
6  title: string;
7  activeView: ConfiguratorView;
8  views: ConfiguratorView[];
9  onViewChange: (view: ConfiguratorView) => void;
10  onClose?: () => void;
11};
12
13function formatViewLabel(view: ConfiguratorView) {
14  if (view === "classic") return "Classic";
15  if (view === "compose") return "Docker Compose";
16  return "Docker Run";
17}
18
19export function ConfiguratorHeader({
20  title,
21  activeView,
22  views,
23  onViewChange,
24  onClose,
25}: ConfiguratorHeaderProps) {
26  return (
27    <header className="flex items-center justify-between border-b border-glass-border px-4 py-3">
28      <div className="min-w-0">
29        <h3 className="truncate text-lg font-semibold text-foreground">{title}</h3>
30        <div className="mt-2 flex items-center gap-1.5">
31          {views.map((view) => (
32            <button
33              key={view}
34              type="button"
35              onClick={() => onViewChange(view)}
36              className={`cursor-pointer rounded-md border px-2.5 py-1 text-2xs font-medium transition-colors ${
37                activeView === view
38                  ? "border-primary/50 bg-primary/15 text-primary"
39                  : "border-glass-border text-muted-foreground hover:bg-secondary/45 hover:text-foreground"
40              }`}
41            >
42              {formatViewLabel(view)}
43            </button>
44          ))}
45        </div>
46      </div>
47      {onClose ? (
48        <button
49          type="button"
50          onClick={onClose}
51          className="rounded-lg border border-glass-border p-1.5 text-muted-foreground transition-colors hover:bg-secondary/45 hover:text-foreground"
52          aria-label="Close configurator"
53          title="Close"
54        >
55          <X className="size-4" />
56        </button>
57      ) : null}
58    </header>
59  );
60}
61