feature update: copy generated password to clipboard

src/projects/06-password-generator/components/PasswordGenerator.jsx

@@ -6,6 +6,8 @@ import usePasswordGenerator from '../hooks/usePasswordGenerator';
 const PasswordGenerator = () => {
   const [passwordLength, setPasswordLength] = useState(8);
   const [checkboxData, setCheckboxData] = useState(characterData);
+  const [copied, setCopied] = useState(false);
+
   // custom hook
   const { error, password, generatePassword } = usePasswordGenerator();
   // console.log(error, password);
@@ -21,6 +23,14 @@ const PasswordGenerator = () => {
     setCheckboxData(checkboxData);
   };
 
+  const handleCopy = () => {
+    navigator.clipboard.writeText(password);
+    setCopied(true);
+    setTimeout(() => {
+      setCopied(false);
+    }, 1000);
+  };
+
   return (
     <section className="pwg-app section">
       <div className="section-center">
@@ -35,7 +45,9 @@ const PasswordGenerator = () => {
           {password && (
             <header className="password">
               <p className="pwd">{password}</p>
-              <button className="btn copyBtn">copy</button>
+              <button className="btn copyBtn" onClick={handleCopy}>
+                {copied ? 'copied' : 'copy'}
+              </button>
             </header>
           )}