refactor: add props to toggle and change colors of button toggle

This commit is contained in:
Mauricio Siu
2024-06-08 13:28:43 -06:00
parent d54c6e4ac9
commit 1a4f5607dc
10 changed files with 51 additions and 28 deletions

View File

@@ -1,4 +1,4 @@
import ToggleVisibilityInput from "@/components/shared/toggle-visibility-input";
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
import { Button } from "@/components/ui/button";
import {
Card,
@@ -138,7 +138,7 @@ export const ShowExternalPostgresCredentials = ({ postgresId }: Props) => {
<div className="grid w-full gap-8">
<div className="flex flex-col gap-3">
<Label>External Host</Label>
<ToggleVisibilityInput value={connectionUrl} />
<ToggleVisibilityInput value={connectionUrl} disabled />
</div>
</div>
)}

View File

@@ -3,7 +3,7 @@ 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";
import ToggleVisibilityInput from "@/components/shared/toggle-visibility-input";
import { ToggleVisibilityInput } from "@/components/shared/toggle-visibility-input";
interface Props {
postgresId: string;
@@ -32,6 +32,7 @@ export const ShowInternalPostgresCredentials = ({ postgresId }: Props) => {
<div className="flex flex-row gap-4">
<ToggleVisibilityInput
value={data?.databasePassword}
disabled
/>
</div>
</div>
@@ -48,6 +49,7 @@ export const ShowInternalPostgresCredentials = ({ postgresId }: Props) => {
<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>