Reorganiza gestão de usuários e remove dados mock

This commit is contained in:
Esdras Renan 2025-10-18 01:15:15 -03:00
parent 630110bf3a
commit dded6d1927
20 changed files with 1863 additions and 1368 deletions

View file

@ -14,7 +14,7 @@ import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
import { Checkbox } from "@/components/ui/checkbox"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog"
import {
Table,
@ -1310,6 +1310,23 @@ export function MachineDetails({ machine }: MachineDetailsProps) {
<CardHeader>
<CardTitle>Detalhes</CardTitle>
<CardDescription>Resumo da máquina selecionada.</CardDescription>
{machine ? (
<CardAction>
<div className="flex flex-col items-end gap-2 text-xs sm:text-sm">
{companyName ? (
<div className="rounded-lg border border-slate-200 bg-white px-3 py-1 font-semibold text-neutral-600 shadow-sm">
{companyName}
</div>
) : null}
<MachineStatusBadge status={effectiveStatus} />
{!isActive ? (
<Badge variant="outline" className="h-7 border-rose-200 bg-rose-50 px-3 font-semibold uppercase text-rose-700">
Máquina desativada
</Badge>
) : null}
</div>
</CardAction>
) : null}
</CardHeader>
<CardContent className="space-y-6">
{!machine ? (
@ -1317,7 +1334,7 @@ export function MachineDetails({ machine }: MachineDetailsProps) {
) : (
<div className="space-y-6">
<section className="space-y-3">
<div className="flex items-start justify-between gap-2">
<div className="flex flex-wrap items-start gap-2">
<div className="space-y-1">
<div className="flex items-center gap-2">
<h1 className="break-words text-2xl font-semibold text-neutral-900">{machine.hostname}</h1>
@ -1330,19 +1347,6 @@ export function MachineDetails({ machine }: MachineDetailsProps) {
{machine.authEmail ?? "E-mail não definido"}
</p>
</div>
<div className="flex flex-col items-end gap-2 text-sm">
{companyName ? (
<div className="rounded-lg border border-slate-200 bg-white px-3 py-1 text-xs font-semibold text-neutral-600 shadow-sm">
{companyName}
</div>
) : null}
<MachineStatusBadge status={effectiveStatus} />
{!isActive ? (
<Badge variant="outline" className="h-7 border-rose-200 bg-rose-50 px-3 text-xs font-semibold uppercase text-rose-700">
Máquina desativada
</Badge>
) : null}
</div>
</div>
{/* ping integrado na badge de status */}
<div className="grid gap-3 sm:grid-cols-2 xl:grid-cols-3">
@ -1375,7 +1379,7 @@ export function MachineDetails({ machine }: MachineDetailsProps) {
{isActive ? (togglingActive ? "Desativando..." : "Desativar") : togglingActive ? "Reativando..." : "Reativar"}
</Button>
{machine.registeredBy ? (
<Badge variant="outline" className="h-7 border-slate-300 bg-slate-100 px-3 text-sm font-medium text-slate-700">
<Badge variant="outline" className="inline-flex h-9 items-center rounded-full border-slate-300 bg-slate-100 px-3 text-sm font-medium text-slate-700">
Registrada via {machine.registeredBy}
</Badge>
) : null}
@ -2667,14 +2671,14 @@ function MetricsGrid({ metrics, hardware, disks }: { metrics: MachineMetrics; ha
const percentLabel = card.percent !== null ? `${Math.round(card.percent)}%` : "—"
return (
<div key={card.key} className="flex items-center gap-4 rounded-xl border border-slate-200 bg-white px-4 py-3 shadow-sm">
<div className="relative h-20 w-20">
<div className="relative h-24 w-24">
<ChartContainer
config={{ usage: { label: card.label, color: card.color } }}
className="h-20 w-20 aspect-square"
className="h-24 w-24 aspect-square"
>
<RadialBarChart
data={[{ name: card.label, value: percentValue }]}
innerRadius="55%"
innerRadius="68%"
outerRadius="100%"
startAngle={90}
endAngle={-270}
@ -2683,7 +2687,7 @@ function MetricsGrid({ metrics, hardware, disks }: { metrics: MachineMetrics; ha
<RadialBar dataKey="value" cornerRadius={10} fill="var(--color-usage)" background />
</RadialBarChart>
</ChartContainer>
<div className="pointer-events-none absolute inset-0 flex items-center justify-center text-sm font-semibold text-neutral-800">
<div className="pointer-events-none absolute inset-[18%] flex items-center justify-center rounded-full bg-white/70 text-sm font-semibold text-neutral-900">
{percentLabel}
</div>
</div>