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

refactor(rclone-form): minor UI improvements

Browse source
This commit is contained in:
Nicolas Meienberger 2025-12-14 10:44:05 +01:00
parent dc20f209f7
commit fe5c9ea599
2 changed files with 6 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/client/modules/volumes/components/storage-chart.tsx
View file

@ -100,7 +100,7 @@ export function StorageChart({ statfs }: Props) {
<div className="flex items-center justify-between p-3 rounded-lg bg-muted/50"> <div className="flex items-center justify-between p-3 rounded-lg bg-muted/50">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<HardDrive className="h-4 w-4 text-muted-foreground" /> <HardDrive className="h-4 w-4 text-muted-foreground" />
<span className="font-medium">Total Capacity</span> <span className="font-medium">Total capacity</span>
</div> </div>
<ByteSize bytes={statfs.total} className="font-mono text-sm" /> <ByteSize bytes={statfs.total} className="font-mono text-sm" />
</div> </div>
@ -108,7 +108,7 @@ export function StorageChart({ statfs }: Props) {
<div className="flex items-center justify-between p-3 rounded-lg bg-strong-accent/10"> <div className="flex items-center justify-between p-3 rounded-lg bg-strong-accent/10">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="h-4 w-4 rounded-full bg-strong-accent" /> <div className="h-4 w-4 rounded-full bg-strong-accent" />
<span className="font-medium">Used Space</span> <span className="font-medium">Used space</span>
</div> </div>
<div className="text-right"> <div className="text-right">
<ByteSize bytes={statfs.used} className="font-mono text-sm" /> <ByteSize bytes={statfs.used} className="font-mono text-sm" />
@ -118,7 +118,7 @@ export function StorageChart({ statfs }: Props) {
<div className="flex items-center justify-between p-3 rounded-lg bg-primary/10"> <div className="flex items-center justify-between p-3 rounded-lg bg-primary/10">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="h-4 w-4 rounded-full bg-primary" /> <div className="h-4 w-4 rounded-full bg-primary" />
<span className="font-medium">Free Space</span> <span className="font-medium">Free space</span>
</div> </div>
<div className="text-right"> <div className="text-right">
<ByteSize bytes={statfs.free} className="font-mono text-sm" /> <ByteSize bytes={statfs.free} className="font-mono text-sm" />

6
app/client/modules/volumes/components/volume-forms/rclone-form.tsx
View file

@ -23,12 +23,12 @@ type Props = {
export const RcloneForm = ({ form }: Props) => { export const RcloneForm = ({ form }: Props) => {
const { capabilities } = useSystemInfo(); const { capabilities } = useSystemInfo();
const { data: rcloneRemotes, isLoading: isLoadingRemotes } = useQuery({ const { data: rcloneRemotes, isPending } = useQuery({
...listRcloneRemotesOptions(), ...listRcloneRemotesOptions(),
enabled: capabilities.rclone, enabled: capabilities.rclone,
}); });
if (!isLoadingRemotes && (!rcloneRemotes || rcloneRemotes.length === 0)) { if (!isPending && !rcloneRemotes?.length) {
return ( return (
<Alert> <Alert>
<AlertDescription className="space-y-2"> <AlertDescription className="space-y-2">
@ -65,7 +65,7 @@ export const RcloneForm = ({ form }: Props) => {
</SelectTrigger> </SelectTrigger>
</FormControl> </FormControl>
<SelectContent> <SelectContent>
{isLoadingRemotes ? ( {isPending ? (
<SelectItem value="loading" disabled> <SelectItem value="loading" disabled>
Loading remotes... Loading remotes...
</SelectItem> </SelectItem>