Skip to content

Commit b2ca51c

Browse files
authored
Merge pull request #4144 from Dokploy/4041-add-ability-to-change-services-password-like-mysql-and-whatnot
feat(database-credentials): add password update functionality for Mar…
2 parents 987cb41 + 1cfc15c commit b2ca51c

17 files changed

Lines changed: 619 additions & 48 deletions

File tree

apps/dokploy/components/dashboard/mariadb/general/show-internal-mariadb-credentials.tsx

Lines changed: 30 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
2+
import { UpdateDatabasePassword } from "@/components/shared/update-database-password";
23
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
34
import { Input } from "@/components/ui/input";
45
import { Label } from "@/components/ui/label";
56
import { api } from "@/utils/api";
7+
import { toast } from "sonner";
68

79
interface Props {
810
mariadbId: string;
911
}
1012
export const ShowInternalMariadbCredentials = ({ mariadbId }: Props) => {
1113
const { data } = api.mariadb.one.useQuery({ mariadbId });
14+
const utils = api.useUtils();
15+
const { mutateAsync: changePassword } =
16+
api.mariadb.changePassword.useMutation();
1217
return (
1318
<>
1419
<div className="flex w-full flex-col gap-5 ">
@@ -28,20 +33,43 @@ export const ShowInternalMariadbCredentials = ({ mariadbId }: Props) => {
2833
</div>
2934
<div className="flex flex-col gap-2">
3035
<Label>Password</Label>
31-
<div className="flex flex-row gap-4">
36+
<div className="flex flex-row gap-2 items-center">
3237
<ToggleVisibilityInput
3338
disabled
3439
value={data?.databasePassword}
3540
/>
41+
<UpdateDatabasePassword
42+
onUpdatePassword={async (newPassword) => {
43+
await changePassword({
44+
mariadbId,
45+
password: newPassword,
46+
type: "user",
47+
});
48+
toast.success("Password updated successfully");
49+
utils.mariadb.one.invalidate({ mariadbId });
50+
}}
51+
/>
3652
</div>
3753
</div>
3854
<div className="flex flex-col gap-2">
3955
<Label>Root Password</Label>
40-
<div className="flex flex-row gap-4">
56+
<div className="flex flex-row gap-2 items-center">
4157
<ToggleVisibilityInput
4258
disabled
4359
value={data?.databaseRootPassword}
4460
/>
61+
<UpdateDatabasePassword
62+
label="Root Password"
63+
onUpdatePassword={async (newPassword) => {
64+
await changePassword({
65+
mariadbId,
66+
password: newPassword,
67+
type: "root",
68+
});
69+
toast.success("Root password updated successfully");
70+
utils.mariadb.one.invalidate({ mariadbId });
71+
}}
72+
/>
4573
</div>
4674
</div>
4775
<div className="flex flex-col gap-2">

apps/dokploy/components/dashboard/mongo/general/show-internal-mongo-credentials.tsx

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
2+
import { UpdateDatabasePassword } from "@/components/shared/update-database-password";
23
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
34
import { Input } from "@/components/ui/input";
45
import { Label } from "@/components/ui/label";
56
import { api } from "@/utils/api";
7+
import { toast } from "sonner";
68

79
interface Props {
810
mongoId: string;
911
}
1012
export const ShowInternalMongoCredentials = ({ mongoId }: Props) => {
1113
const { data } = api.mongo.one.useQuery({ mongoId });
14+
const utils = api.useUtils();
15+
const { mutateAsync: changePassword } =
16+
api.mongo.changePassword.useMutation();
1217
return (
1318
<>
1419
<div className="flex w-full flex-col gap-5 ">
@@ -25,11 +30,21 @@ export const ShowInternalMongoCredentials = ({ mongoId }: Props) => {
2530

2631
<div className="flex flex-col gap-2">
2732
<Label>Password</Label>
28-
<div className="flex flex-row gap-4">
33+
<div className="flex flex-row gap-2 items-center">
2934
<ToggleVisibilityInput
3035
disabled
3136
value={data?.databasePassword}
3237
/>
38+
<UpdateDatabasePassword
39+
onUpdatePassword={async (newPassword) => {
40+
await changePassword({
41+
mongoId,
42+
password: newPassword,
43+
});
44+
toast.success("Password updated successfully");
45+
utils.mongo.one.invalidate({ mongoId });
46+
}}
47+
/>
3348
</div>
3449
</div>
3550

apps/dokploy/components/dashboard/mysql/general/show-internal-mysql-credentials.tsx

Lines changed: 30 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
2+
import { UpdateDatabasePassword } from "@/components/shared/update-database-password";
23
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
34
import { Input } from "@/components/ui/input";
45
import { Label } from "@/components/ui/label";
56
import { api } from "@/utils/api";
7+
import { toast } from "sonner";
68

79
interface Props {
810
mysqlId: string;
911
}
1012
export const ShowInternalMysqlCredentials = ({ mysqlId }: Props) => {
1113
const { data } = api.mysql.one.useQuery({ mysqlId });
14+
const utils = api.useUtils();
15+
const { mutateAsync: changePassword } =
16+
api.mysql.changePassword.useMutation();
1217
return (
1318
<>
1419
<div className="flex w-full flex-col gap-5 ">
@@ -28,20 +33,43 @@ export const ShowInternalMysqlCredentials = ({ mysqlId }: Props) => {
2833
</div>
2934
<div className="flex flex-col gap-2">
3035
<Label>Password</Label>
31-
<div className="flex flex-row gap-4">
36+
<div className="flex flex-row gap-2 items-center">
3237
<ToggleVisibilityInput
3338
disabled
3439
value={data?.databasePassword}
3540
/>
41+
<UpdateDatabasePassword
42+
onUpdatePassword={async (newPassword) => {
43+
await changePassword({
44+
mysqlId,
45+
password: newPassword,
46+
type: "user",
47+
});
48+
toast.success("Password updated successfully");
49+
utils.mysql.one.invalidate({ mysqlId });
50+
}}
51+
/>
3652
</div>
3753
</div>
3854
<div className="flex flex-col gap-2">
3955
<Label>Root Password</Label>
40-
<div className="flex flex-row gap-4">
56+
<div className="flex flex-row gap-2 items-center">
4157
<ToggleVisibilityInput
4258
disabled
4359
value={data?.databaseRootPassword}
4460
/>
61+
<UpdateDatabasePassword
62+
label="Root Password"
63+
onUpdatePassword={async (newPassword) => {
64+
await changePassword({
65+
mysqlId,
66+
password: newPassword,
67+
type: "root",
68+
});
69+
toast.success("Root password updated successfully");
70+
utils.mysql.one.invalidate({ mysqlId });
71+
}}
72+
/>
4573
</div>
4674
</div>
4775
<div className="flex flex-col gap-2">

apps/dokploy/components/dashboard/postgres/general/show-internal-postgres-credentials.tsx

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
2+
import { UpdateDatabasePassword } from "@/components/shared/update-database-password";
23
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
34
import { Input } from "@/components/ui/input";
45
import { Label } from "@/components/ui/label";
56
import { api } from "@/utils/api";
7+
import { toast } from "sonner";
68

79
interface Props {
810
postgresId: string;
911
}
1012
export const ShowInternalPostgresCredentials = ({ postgresId }: Props) => {
1113
const { data } = api.postgres.one.useQuery({ postgresId });
14+
const utils = api.useUtils();
15+
const { mutateAsync: changePassword } =
16+
api.postgres.changePassword.useMutation();
1217
return (
1318
<>
1419
<div className="flex w-full flex-col gap-5 ">
@@ -28,11 +33,21 @@ export const ShowInternalPostgresCredentials = ({ postgresId }: Props) => {
2833
</div>
2934
<div className="flex flex-col gap-2">
3035
<Label>Password</Label>
31-
<div className="flex flex-row gap-4">
36+
<div className="flex flex-row gap-2 items-center">
3237
<ToggleVisibilityInput
3338
value={data?.databasePassword}
3439
disabled
3540
/>
41+
<UpdateDatabasePassword
42+
onUpdatePassword={async (newPassword) => {
43+
await changePassword({
44+
postgresId,
45+
password: newPassword,
46+
});
47+
toast.success("Password updated successfully");
48+
utils.postgres.one.invalidate({ postgresId });
49+
}}
50+
/>
3651
</div>
3752
</div>
3853
<div className="flex flex-col gap-2">

apps/dokploy/components/dashboard/redis/general/show-internal-redis-credentials.tsx

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
2+
import { UpdateDatabasePassword } from "@/components/shared/update-database-password";
23
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
34
import { Input } from "@/components/ui/input";
45
import { Label } from "@/components/ui/label";
56
import { api } from "@/utils/api";
7+
import { toast } from "sonner";
68

79
interface Props {
810
redisId: string;
911
}
1012
export const ShowInternalRedisCredentials = ({ redisId }: Props) => {
1113
const { data } = api.redis.one.useQuery({ redisId });
14+
const utils = api.useUtils();
15+
const { mutateAsync: changePassword } =
16+
api.redis.changePassword.useMutation();
1217
return (
1318
<>
1419
<div className="flex w-full flex-col gap-5 ">
@@ -24,11 +29,21 @@ export const ShowInternalRedisCredentials = ({ redisId }: Props) => {
2429
</div>
2530
<div className="flex flex-col gap-2">
2631
<Label>Password</Label>
27-
<div className="flex flex-row gap-4">
32+
<div className="flex flex-row gap-2 items-center">
2833
<ToggleVisibilityInput
2934
value={data?.databasePassword}
3035
disabled
3136
/>
37+
<UpdateDatabasePassword
38+
onUpdatePassword={async (newPassword) => {
39+
await changePassword({
40+
redisId,
41+
password: newPassword,
42+
});
43+
toast.success("Password updated successfully");
44+
utils.redis.one.invalidate({ redisId });
45+
}}
46+
/>
3247
</div>
3348
</div>
3449
<div className="flex flex-col gap-2">

0 commit comments

Comments
 (0)