diff --git a/package-lock.json b/package-lock.json index 3bd37fa..7a05ae4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,6 +18,7 @@ "react": "^18", "react-dom": "^18", "react-use": "^17.5.0", + "sonner": "^1.5.0", "ts-jest": "^29.1.4", "ts-node": "^10.9.2", "use-sound": "^4.0.1" @@ -7919,6 +7920,16 @@ "node": ">=8" } }, + "node_modules/sonner": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/sonner/-/sonner-1.5.0.tgz", + "integrity": "sha512-FBjhG/gnnbN6FY0jaNnqZOMmB73R+5IiyYAw8yBj7L54ER7HB3fOSE5OFiQiE2iXWxeXKvg6fIP4LtVppHEdJA==", + "license": "MIT", + "peerDependencies": { + "react": "^18.0.0", + "react-dom": "^18.0.0" + } + }, "node_modules/source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", diff --git a/package.json b/package.json index a2f8ea2..993a59c 100644 --- a/package.json +++ b/package.json @@ -14,20 +14,21 @@ "@types/jest": "^29.5.12", "flag-icons": "^7.2.2", "jest": "^29.7.0", - "jsdom": "24.1.0", "jest-environment-jsdom": "^29.7.0", + "jsdom": "24.1.0", "next": "^14.1.0", "react": "^18", "react-dom": "^18", "react-use": "^17.5.0", + "sonner": "^1.5.0", "ts-jest": "^29.1.4", "ts-node": "^10.9.2", "use-sound": "^4.0.1" }, "devDependencies": { + "@playwright/test": "^1.45.1", "@testing-library/dom": "^10.1.0", "@testing-library/react": "^16.0.0", - "@playwright/test": "^1.45.1", "@types/node": "^20", "@types/react": "^18.3.3", "@types/react-dom": "^18.3.0", diff --git a/src/components/MotionDisplay.tsx b/src/components/MotionDisplay.tsx index 9714045..d02619b 100644 --- a/src/components/MotionDisplay.tsx +++ b/src/components/MotionDisplay.tsx @@ -8,7 +8,7 @@ const MotionDisplay = ({ motion }: { motion: motion | null }) => { return (

- "{motion && motion?.motion ? motion.motion : ""}" + {motion && motion?.motion ? motion.motion : ""}

{motion && motion.adinfo && (
@@ -18,7 +18,9 @@ const MotionDisplay = ({ motion }: { motion: motion | null }) => { {infoslideString}
-

{motion.adinfo}

+

+ {motion.adinfo} +

)}

diff --git a/src/components/MotionGenerator.tsx b/src/components/MotionGenerator.tsx index 456ffec..9752415 100644 --- a/src/components/MotionGenerator.tsx +++ b/src/components/MotionGenerator.tsx @@ -13,11 +13,15 @@ import { useLang } from "@/lib/useLang"; import { LinkButton } from "./LinkButton"; import { IconPlayCircle } from "./icons/PlayCircle"; import { IconList } from "./icons/List"; +import { IconCopy } from "./icons/Copy"; +import { toast, Toaster } from "sonner"; const MotionGenerator = () => { const [motion, setMotion] = useState(null); const debateContext = useContext(DebateContext); const router = useRouter(); + const infoslideLabel = useLang("infoslide"); + const successfulCopyMessage = useLang("motionCopiedSuccess"); function generateMotion(): motion { const filteredMotions = motions.filter((motion) => { @@ -29,6 +33,20 @@ const MotionGenerator = () => { return filteredMotions[Math.floor(Math.random() * filteredMotions.length)]; } + function copyMotionToClipboard() { + if (!motion?.motion || !motion.source || !motion.type) { + return; + } + const infoslideLine = motion.adinfo + ? `${infoslideLabel}: ${motion.adinfo}\n` + : ""; + const sourceLine = `~${motion.source}`; + navigator.clipboard.writeText( + `${motion.motion}\n${infoslideLine}${sourceLine}` + ); + toast.success(successfulCopyMessage); + } + function saveMotionToContext(): void { debateContext.setConf({ ...debateContext.conf, @@ -53,12 +71,18 @@ const MotionGenerator = () => { return (

+
setMotion(generateMotion())} /> + copyMotionToClipboard()} + /> { icon={IconDice} onClick={() => setMotion(generateMotion())} /> + copyMotionToClipboard()} + /> { + return ( + + + + + ); +}; + +export { IconCopy }; diff --git a/src/data/strings.json b/src/data/strings.json index 9c6a813..0618a08 100644 --- a/src/data/strings.json +++ b/src/data/strings.json @@ -429,5 +429,15 @@ "en": "Debate finished!", "pl": "Debata zakończona!", "de": "Debatte geendet!" + }, + "copyMotion": { + "en": "Copy motion", + "pl": "Skopiuj tezę", + "de": "These kopieren" + }, + "motionCopiedSuccess": { + "en": "Motion copied to clipboard", + "pl": "Teza skopiowana do schowka", + "de": "These kopiert" } }