From 87cb2d5d2301e719d184de4e844203bdcff1566c Mon Sep 17 00:00:00 2001 From: Guy Korland Date: Sun, 21 Jan 2024 13:06:06 +0200 Subject: [PATCH 1/5] fix #13 add connection details --- app/details/page.tsx | 34 ++++++++++++++++++++++++++++++++++ components/custom/navbar.tsx | 33 +++++++++++++++++++++++---------- 2 files changed, 57 insertions(+), 10 deletions(-) create mode 100644 app/details/page.tsx diff --git a/app/details/page.tsx b/app/details/page.tsx new file mode 100644 index 00000000..d1d98908 --- /dev/null +++ b/app/details/page.tsx @@ -0,0 +1,34 @@ +"use client"; + +import { AirVentIcon, Asterisk, Menu, User } from "lucide-react"; +import { useSession } from "next-auth/react"; + +// Shows the details of a current database connection +export default function Page() { + + const { data: session, status } = useSession() + + return ( +
+

Conenction Details

+ +
+ ) +} \ No newline at end of file diff --git a/components/custom/navbar.tsx b/components/custom/navbar.tsx index 2ed3d663..07421213 100644 --- a/components/custom/navbar.tsx +++ b/components/custom/navbar.tsx @@ -1,4 +1,4 @@ -import { LogOut, Menu } from "lucide-react"; +import { Info, LogOut, Menu, Waypoints } from "lucide-react"; import { signOut, useSession } from "next-auth/react"; import Link from "next/link"; import { Switch } from "../ui/switch"; @@ -8,8 +8,8 @@ import { useTheme } from "next-themes"; export default function Navbar() { const { data: session, status } = useSession() - const { theme, setTheme, systemTheme} = useTheme() - + const { theme, setTheme, systemTheme } = useTheme() + const [mounted, setMounted] = useState(false) useEffect(() => { @@ -25,7 +25,7 @@ export default function Navbar() { } } - let darkmode = theme=="dark" || (theme=="system" && systemTheme=="dark") + let darkmode = theme == "dark" || (theme == "system" && systemTheme == "dark") return ( ) } From 8a3561eb39417112080a461bd2a4383a967ca433 Mon Sep 17 00:00:00 2001 From: Guy Korland Date: Sun, 21 Jan 2024 13:25:30 +0200 Subject: [PATCH 2/5] Update app/details/page.tsx Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> --- app/details/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/details/page.tsx b/app/details/page.tsx index d1d98908..b649f905 100644 --- a/app/details/page.tsx +++ b/app/details/page.tsx @@ -10,7 +10,7 @@ export default function Page() { return (
-

Conenction Details

+

Connection Details

  • Host: From 4d9d4684813f3c95cdea84ffcb4c6b316f76e603 Mon Sep 17 00:00:00 2001 From: Guy Korland Date: Sun, 21 Jan 2024 13:50:28 +0200 Subject: [PATCH 3/5] mask password and add C&P --- app/details/DatabaseLine.tsx | 43 ++++++++++++++++++++++++++++++++++++ app/details/page.tsx | 30 ++++++++----------------- app/layout.tsx | 2 ++ 3 files changed, 54 insertions(+), 21 deletions(-) create mode 100644 app/details/DatabaseLine.tsx diff --git a/app/details/DatabaseLine.tsx b/app/details/DatabaseLine.tsx new file mode 100644 index 00000000..d7057207 --- /dev/null +++ b/app/details/DatabaseLine.tsx @@ -0,0 +1,43 @@ +import { Button } from "@/components/ui/button" +import { useToast } from "@/components/ui/use-toast" +import { Copy, Eye, EyeOff } from "lucide-react"; +import { useState } from "react"; + +export function DatabaseLine(props: { label: string, value: string, masked?: string }) { + + const { toast } = useToast() + const [showPassword, setShowPassword] = useState(false); + + function copyToClipboard(value: string) { + navigator.clipboard.writeText(value) + toast({ + variant: "default", + title: "Copied to clipboard", + description: "The value has been copied to your clipboard.", + }) + } + + function showMasked() { + setShowPassword(!showPassword) + } + + return ( +
    +
    {props.label}:
    + { + props.value.length > 0 && + <> + + {props.masked && + + } + + } +
    + ); +} diff --git a/app/details/page.tsx b/app/details/page.tsx index b649f905..42c7bde8 100644 --- a/app/details/page.tsx +++ b/app/details/page.tsx @@ -1,34 +1,22 @@ "use client"; -import { AirVentIcon, Asterisk, Menu, User } from "lucide-react"; import { useSession } from "next-auth/react"; +import { DatabaseLine } from "./DatabaseLine"; // Shows the details of a current database connection export default function Page() { - + const { data: session, status } = useSession() - + return (

    Connection Details

    -
      -
    • - Host: - {session?.user?.host || "localhost"} -
      • -
    • - Port: - {session?.user?.port || 6379} -
      • -
    • - Username: - {session?.user?.name} -
      • -
    • - Password: - {session?.user?.password} -
      • -
    +
    + + + + +
    ) } \ No newline at end of file diff --git a/app/layout.tsx b/app/layout.tsx index fafeb1ef..dc7919f2 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -5,6 +5,7 @@ import Navbar from '@/components/custom/navbar' import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '@/components/ui/resizable' import NextAuth from 'next-auth' import { NextAuthProvider } from './providers' +import { Toaster } from '@/components/ui/toaster' const inter = Inter({ subsets: ['latin'] }) @@ -22,6 +23,7 @@ export default function RootLayout({ {children} + ) From 37c0fac49c3773b8f1f0a663664355b7345eb2dd Mon Sep 17 00:00:00 2001 From: Guy Korland Date: Sun, 21 Jan 2024 15:05:16 +0200 Subject: [PATCH 4/5] Update app/details/DatabaseLine.tsx Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> --- app/details/DatabaseLine.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/details/DatabaseLine.tsx b/app/details/DatabaseLine.tsx index d7057207..873787f9 100644 --- a/app/details/DatabaseLine.tsx +++ b/app/details/DatabaseLine.tsx @@ -28,7 +28,7 @@ export function DatabaseLine(props: { label: string, value: string, masked?: str props.value.length > 0 && <> {props.masked && From a48b9bf248b9e7981b813c3638392f3aa529f15a Mon Sep 17 00:00:00 2001 From: Guy Korland Date: Sun, 21 Jan 2024 15:07:11 +0200 Subject: [PATCH 5/5] handle error on C&P --- app/details/DatabaseLine.tsx | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/app/details/DatabaseLine.tsx b/app/details/DatabaseLine.tsx index 873787f9..6c2ec62e 100644 --- a/app/details/DatabaseLine.tsx +++ b/app/details/DatabaseLine.tsx @@ -10,10 +10,19 @@ export function DatabaseLine(props: { label: string, value: string, masked?: str function copyToClipboard(value: string) { navigator.clipboard.writeText(value) - toast({ - variant: "default", - title: "Copied to clipboard", - description: "The value has been copied to your clipboard.", + .then(() => { + toast({ + variant: "default", + title: "Copied to clipboard", + description: "The value has been copied to your clipboard.", + }) + }) + .catch(() => { + toast({ + variant: "destructive", + title: "Failed to copy to clipboard", + description: "The value could not be copied to your clipboard.", + }) }) }