From 569847e8d454c4c67fe8f3d10bf75ab00ff95364 Mon Sep 17 00:00:00 2001
From: Benyamin206 <136243522+Benyamin206@users.noreply.github.com>
Date: Sun, 15 Dec 2024 20:46:53 +0700
Subject: [PATCH] Update App.js

Task 1
---
 src/App.js | 35 ++++++++++++++++++++++++-----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/App.js b/src/App.js
index 92b83a316..24c63efce 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,5 +1,5 @@
 import './App.css';
-import React, {useState} from 'react';
+import React, { useState } from 'react';
 
 const App = () => {
   const url = "https://api.quotable.io/random";
@@ -7,21 +7,33 @@ const App = () => {
     content: "Let time be your only competitor.",
     author: "Ahmed Saber"
   }
-  const [quote, setQuote] = useState(quoteData)
+  const [quote, setQuote] = useState(quoteData);
 
   const generateQuote = () => {
     fetch(url)
       .then(response => response.json())
       .then(data => {
-        console.log(data)
-        setQuote(data)
+        console.log(data);
+        setQuote(data);
       });
-  }
+  };
 
   const copy = () => {
-    navigator.clipboard.writeText(quote.author + " once said: " + quote.content)
-    alert('copied')
-  }
+    navigator.clipboard.writeText(quote.author + " once said: " + quote.content);
+    alert('Copied!');
+  };
+
+  const shareToTwitter = () => {
+    const tweetText = `${quote.content} - ${quote.author}`;
+    const twitterUrl = `https://twitter.com/intent/tweet?text=${encodeURIComponent(tweetText)}`;
+    window.open(twitterUrl, '_blank');
+  };
+
+  const shareToWhatsApp = () => {
+    const whatsappText = `${quote.content} - ${quote.author}`;
+    const whatsappUrl = `https://api.whatsapp.com/send?text=${encodeURIComponent(whatsappText)}`;
+    window.open(whatsappUrl, '_blank');
+  };
 
   return (
     <>
@@ -32,11 +44,12 @@ const App = () => {
         <div className="btns">
           <button onClick={copy} className="btn">Copy</button>
           <button onClick={generateQuote}>Generate Another Quote</button>
+          <button onClick={shareToTwitter}>Share to Twitter</button>
+          <button onClick={shareToWhatsApp}>Share to WhatsApp</button>
         </div>
       </div>
     </>
-  )
-}
-
+  );
+};
 
 export default App;