Initial commit: Beszel fork with Domain Locker integration

internal/site/src/components/ui/input-copy.tsx

@@ -0,0 +1,36 @@
+import { Trans } from "@lingui/react/macro"
+import { CopyIcon } from "lucide-react"
+import { copyToClipboard } from "@/lib/utils"
+import { Button } from "./button"
+import { Input } from "./input"
+import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip"
+
+export function InputCopy({ value, id, name }: { value: string; id: string; name: string }) {
+	return (
+		<div className="relative">
+			<Input readOnly id={id} name={name} value={value} required></Input>
+			<div
+				className={
+					"h-6 w-24 bg-linear-to-r rtl:bg-linear-to-l from-transparent to-background to-65% absolute top-2 end-1 pointer-events-none"
+				}
+			></div>
+			<Tooltip disableHoverableContent={true}>
+				<TooltipTrigger asChild>
+					<Button
+						type="button"
+						variant={"link"}
+						className="absolute end-0 top-0"
+						onClick={() => copyToClipboard(value)}
+					>
+						<CopyIcon className="size-4" />
+					</Button>
+				</TooltipTrigger>
+				<TooltipContent>
+					<p>
+						<Trans>Click to copy</Trans>
+					</p>
+				</TooltipContent>
+			</Tooltip>
+		</div>
+	)
+}