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.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