mirror of
https://github.com/Dokploy/dokploy.git
synced 2026-07-17 20:05:24 +02:00
* feat(databases): add copy button to User and Database Name fields Adds an enableCopyButton prop to the Input component and uses it on the User, Database Name, and Internal Host fields across Postgres, MySQL, MariaDB, MongoDB, Redis, and Libsql credential views. Closes #4495 * [autofix.ci] apply automated fixes --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
78 lines
2.8 KiB
TypeScript
78 lines
2.8 KiB
TypeScript
import { toast } from "sonner";
|
|
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
|
|
import { UpdateDatabasePassword } from "@/components/shared/update-database-password";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import { api } from "@/utils/api";
|
|
|
|
interface Props {
|
|
postgresId: string;
|
|
}
|
|
export const ShowInternalPostgresCredentials = ({ postgresId }: Props) => {
|
|
const { data } = api.postgres.one.useQuery({ postgresId });
|
|
const utils = api.useUtils();
|
|
const { mutateAsync: changePassword } =
|
|
api.postgres.changePassword.useMutation();
|
|
return (
|
|
<>
|
|
<div className="flex w-full flex-col gap-5 ">
|
|
<Card className="bg-background">
|
|
<CardHeader>
|
|
<CardTitle className="text-xl">Internal Credentials</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="flex w-full flex-row gap-4">
|
|
<div className="grid w-full md:grid-cols-2 gap-4 md:gap-8">
|
|
<div className="flex flex-col gap-2">
|
|
<Label>User</Label>
|
|
<Input enableCopyButton disabled value={data?.databaseUser} />
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
<Label>Database Name</Label>
|
|
<Input enableCopyButton disabled value={data?.databaseName} />
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
<Label>Password</Label>
|
|
<div className="flex flex-row gap-2 items-center">
|
|
<ToggleVisibilityInput
|
|
value={data?.databasePassword}
|
|
disabled
|
|
/>
|
|
<UpdateDatabasePassword
|
|
onUpdatePassword={async (newPassword) => {
|
|
await changePassword({
|
|
postgresId,
|
|
password: newPassword,
|
|
});
|
|
toast.success("Password updated successfully");
|
|
utils.postgres.one.invalidate({ postgresId });
|
|
}}
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
<Label>Internal Port (Container)</Label>
|
|
<Input disabled value="5432" />
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-2">
|
|
<Label>Internal Host</Label>
|
|
<Input enableCopyButton disabled value={data?.appName} />
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-2">
|
|
<Label>Internal Connection URL </Label>
|
|
<ToggleVisibilityInput
|
|
disabled
|
|
value={`postgresql://${data?.databaseUser}:${data?.databasePassword}@${data?.appName}:5432/${data?.databaseName}`}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
// ReplyError: MISCONF Redis is configured to save RDB snapshots, but it's currently unable to persist to disk. Commands that may modify the data set are disabled, because this instance is configured to report errors during writes if RDB snapshotting fails (stop-w
|