summaryrefslogtreecommitdiff
path: root/src/components/ClipboardDisplay.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/ClipboardDisplay.tsx')
-rw-r--r--src/components/ClipboardDisplay.tsx139
1 files changed, 0 insertions, 139 deletions
diff --git a/src/components/ClipboardDisplay.tsx b/src/components/ClipboardDisplay.tsx
deleted file mode 100644
index 852a50f..0000000
--- a/src/components/ClipboardDisplay.tsx
+++ /dev/null
@@ -1,139 +0,0 @@
-import { useState, useEffect } from "react";
-import { PanelSectionRow } from "@decky/ui";
-import { FaClipboard, FaEye } from "react-icons/fa";
-
-export function ClipboardDisplay() {
- const [clipboardContent, setClipboardContent] = useState<string>("");
- const [isReading, setIsReading] = useState(false);
-
- const readClipboard = async () => {
- if (isReading) return; // Prevent concurrent reads
-
- setIsReading(true);
- try {
- console.log("ClipboardDisplay: Attempting to read clipboard...");
-
- if (!navigator.clipboard) {
- console.log("ClipboardDisplay: navigator.clipboard not available");
- setClipboardContent("Clipboard API not available");
- return;
- }
-
- if (!navigator.clipboard.readText) {
- console.log("ClipboardDisplay: navigator.clipboard.readText not available");
- setClipboardContent("Clipboard read not supported");
- return;
- }
-
- console.log("ClipboardDisplay: Calling navigator.clipboard.readText()...");
- const content = await navigator.clipboard.readText();
- console.log("ClipboardDisplay: Successfully read clipboard:", content.length, "characters");
- setClipboardContent(content);
- } catch (error) {
- // This is expected if user hasn't granted clipboard permissions
- // or if we're in a context where reading isn't allowed
- console.log("ClipboardDisplay: Error reading clipboard:", error);
- console.log("ClipboardDisplay: Error name:", (error as Error).name);
- console.log("ClipboardDisplay: Error message:", (error as Error).message);
-
- // More specific error messages based on error type
- if (error instanceof DOMException) {
- switch (error.name) {
- case 'NotAllowedError':
- setClipboardContent("Clipboard access denied - check permissions");
- break;
- case 'NotFoundError':
- setClipboardContent("No clipboard data found");
- break;
- case 'SecurityError':
- setClipboardContent("Clipboard access blocked by security policy");
- break;
- default:
- setClipboardContent(`Clipboard error: ${error.name}`);
- }
- } else {
- setClipboardContent("Unable to read clipboard");
- }
- } finally {
- setIsReading(false);
- }
- };
-
- // Read clipboard on mount and then every 3 seconds
- useEffect(() => {
- readClipboard();
-
- const interval = setInterval(() => {
- readClipboard();
- }, 3000);
-
- return () => clearInterval(interval);
- }, []);
-
- const truncateText = (text: string, maxLength: number = 60) => {
- if (text.length <= maxLength) return text;
- return text.substring(0, maxLength) + "...";
- };
-
- const displayText = truncateText(clipboardContent);
-
- return (
- <PanelSectionRow>
- <div style={{
- padding: "8px",
- backgroundColor: "rgba(255, 255, 255, 0.05)",
- borderRadius: "4px",
- border: "1px solid rgba(255, 255, 255, 0.1)",
- marginBottom: "8px"
- }}>
- <div style={{
- display: "flex",
- alignItems: "center",
- gap: "8px",
- marginBottom: "4px"
- }}>
- <FaClipboard style={{ color: "#888", fontSize: "12px" }} />
- <div style={{
- fontSize: "12px",
- fontWeight: "bold",
- color: "#888",
- textTransform: "uppercase"
- }}>
- Current Clipboard
- </div>
- {isReading && (
- <FaEye style={{
- color: "#888",
- fontSize: "10px",
- animation: "pulse 1s ease-in-out infinite"
- }} />
- )}
- </div>
- <div style={{
- fontSize: "11px",
- color: clipboardContent.includes("error") ||
- clipboardContent.includes("denied") ||
- clipboardContent.includes("not available") ||
- clipboardContent.includes("not supported") ||
- clipboardContent.includes("blocked") ||
- clipboardContent === "Unable to read clipboard"
- ? "#ff6b6b"
- : "#fff",
- fontFamily: "monospace",
- wordBreak: "break-word",
- lineHeight: "1.3",
- minHeight: "14px"
- }}>
- {displayText || "Reading clipboard..."}
- </div>
- </div>
- <style>{`
- @keyframes pulse {
- 0% { opacity: 0.5; }
- 50% { opacity: 1; }
- 100% { opacity: 0.5; }
- }
- `}</style>
- </PanelSectionRow>
- );
-}