danvics/zerobyte
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

feat: add volume column to snapshots table and display backup volume names

Browse source
This commit is contained in:
Jakub Trávník 2025-12-22 14:16:57 +01:00
parent e992c6739a
commit 299469728e
1 changed files with 18 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
app/client/components/snapshots-table.tsx
View file

@ -1,6 +1,6 @@
import { useState } from "react"; import { useState } from "react";
import { useMutation, useQueryClient } from "@tanstack/react-query"; import { useMutation, useQueryClient } from "@tanstack/react-query";
import { Calendar, Clock, Database, FolderTree, HardDrive, Trash2 } from "lucide-react"; import { Calendar, Clock, Database, FolderTree, HardDrive, Server, Trash2 } from "lucide-react";
import { Link, useNavigate } from "react-router"; import { Link, useNavigate } from "react-router";
import { toast } from "sonner"; import { toast } from "sonner";
import { ByteSize } from "~/client/components/bytes-size"; import { ByteSize } from "~/client/components/bytes-size";
@ -79,6 +79,7 @@ export const SnapshotsTable = ({ snapshots, repositoryName, backups }: Props) =>
<TableHead className="uppercase">Date & Time</TableHead> <TableHead className="uppercase">Date & Time</TableHead>
<TableHead className="uppercase">Size</TableHead> <TableHead className="uppercase">Size</TableHead>
<TableHead className="uppercase hidden md:table-cell text-right">Duration</TableHead> <TableHead className="uppercase hidden md:table-cell text-right">Duration</TableHead>
<TableHead className="uppercase hidden text-right lg:table-cell">Volume</TableHead>
<TableHead className="uppercase hidden text-right lg:table-cell">Paths</TableHead> <TableHead className="uppercase hidden text-right lg:table-cell">Paths</TableHead>
<TableHead className="uppercase text-right">Actions</TableHead> <TableHead className="uppercase text-right">Actions</TableHead>
</TableRow> </TableRow>
@ -135,6 +136,22 @@ export const SnapshotsTable = ({ snapshots, repositoryName, backups }: Props) =>
<span className="text-sm text-muted-foreground">{formatDuration(snapshot.duration / 1000)}</span> <span className="text-sm text-muted-foreground">{formatDuration(snapshot.duration / 1000)}</span>
</div> </div>
</TableCell> </TableCell>
<TableCell className="hidden lg:table-cell">
<div className="flex items-center justify-end gap-2">
<Server className="h-4 w-4 text-muted-foreground" />
{backup ? (
<Link
to={`/volumes/${backup.volume.id}`}
onClick={(e) => e.stopPropagation()}
className="text-sm hover:underline"
>
{backup.volume.name}
</Link>
) : (
<span className="text-sm text-muted-foreground">-</span>
)}
</div>
</TableCell>
<TableCell className="hidden lg:table-cell"> <TableCell className="hidden lg:table-cell">
<div className="flex items-center justify-end gap-2"> <div className="flex items-center justify-end gap-2">
<FolderTree className="h-4 w-4 text-muted-foreground" /> <FolderTree className="h-4 w-4 text-muted-foreground" />