Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy synced 2025-06-26 18:27:59 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Enhance ShowBackups component: add Database icon to title for improved UI clarity and wrap ShowBackups in a Card component for better layout in server settings page.

Browse Source
This commit is contained in:
Mauricio Siu 2025-03-29 19:53:25 -06:00
parent ffc2d593e4
commit 13d4dea504
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
apps/dokploy/components/dashboard/database/backups/show-backups.tsx
View File

@ -14,7 +14,7 @@ import {
TooltipTrigger, TooltipTrigger,
} from "@/components/ui/tooltip"; } from "@/components/ui/tooltip";
import { api } from "@/utils/api"; import { api } from "@/utils/api";
import { DatabaseBackup, Play, Trash2 } from "lucide-react"; import { Database, DatabaseBackup, Play, Trash2 } from "lucide-react";
import Link from "next/link"; import Link from "next/link";
import { useState } from "react"; import { useState } from "react";
import { toast } from "sonner"; import { toast } from "sonner";
@ -66,7 +66,10 @@ export const ShowBackups = ({ id, type }: Props) => {
<Card className="bg-background"> <Card className="bg-background">
<CardHeader className="flex flex-row justify-between gap-4 flex-wrap"> <CardHeader className="flex flex-row justify-between gap-4 flex-wrap">
<div className="flex flex-col gap-0.5"> <div className="flex flex-col gap-0.5">
<CardTitle className="text-xl">Backups</CardTitle> <CardTitle className="text-xl flex flex-row gap-2">
<Database className="size-6 text-muted-foreground" />
Backups
</CardTitle>
<CardDescription> <CardDescription>
Add backups to your database to save the data to a different Add backups to your database to save the data to a different
provider. provider.

7
apps/dokploy/pages/dashboard/settings/server.tsx
View File

@ -10,6 +10,7 @@ import type { ReactElement } from "react";
import superjson from "superjson"; import superjson from "superjson";
import { api } from "@/utils/api"; import { api } from "@/utils/api";
import { ShowBackups } from "@/components/dashboard/database/backups/show-backups"; import { ShowBackups } from "@/components/dashboard/database/backups/show-backups";
import { Card } from "@/components/ui/card";
const Page = () => { const Page = () => {
const { data: user } = api.user.get.useQuery(); const { data: user } = api.user.get.useQuery();
return ( return (
@ -17,7 +18,11 @@ const Page = () => {
<div className="h-full rounded-xl max-w-5xl mx-auto flex flex-col gap-4"> <div className="h-full rounded-xl max-w-5xl mx-auto flex flex-col gap-4">
<WebDomain /> <WebDomain />
<WebServer /> <WebServer />
<ShowBackups id={user?.userId ?? ""} type="web-server" /> <div className="w-full flex flex-col gap-4">
<Card className="h-full bg-sidebar p-2.5 rounded-xl max-w-5xl mx-auto">
<ShowBackups id={user?.userId ?? ""} type="web-server" />
</Card>
</div>
</div> </div>
</div> </div>
); );