From 3ff010caf9cd62c537991bcec7ae8b8cb0f41503 Mon Sep 17 00:00:00 2001
From: Muhammad Umar Farooq <92017762+UmarFarooq361@users.noreply.github.com>
Date: Sat, 6 May 2023 13:46:59 +0500
Subject: [PATCH] update in ethereum card display when account is connected 
 then account shorted address will be display but when no account is connected
 then simple text 'Addesss' will be displayed

---
 client/src/components/Welcome.jsx | 75 ++++++++++++++++++++++---------
 package-lock.json                 |  6 +++
 2 files changed, 60 insertions(+), 21 deletions(-)
 create mode 100644 package-lock.json

diff --git a/client/src/components/Welcome.jsx b/client/src/components/Welcome.jsx
index a009dfa..c1122ea 100644
--- a/client/src/components/Welcome.jsx
+++ b/client/src/components/Welcome.jsx
@@ -7,7 +7,8 @@ import { TransactionContext } from "../context/TransactionContext";
 import { shortenAddress } from "../utils/shortenAddress";
 import { Loader } from ".";
 
-const companyCommonStyles = "min-h-[70px] sm:px-0 px-2 sm:min-w-[120px] flex justify-center items-center border-[0.5px] border-gray-400 text-sm font-light text-white";
+const companyCommonStyles =
+  "min-h-[70px] sm:px-0 px-2 sm:min-w-[120px] flex justify-center items-center border-[0.5px] border-gray-400 text-sm font-light text-white";
 
 const Input = ({ placeholder, name, type, value, handleChange }) => (
   <input
@@ -21,7 +22,14 @@ const Input = ({ placeholder, name, type, value, handleChange }) => (
 );
 
 const Welcome = () => {
-  const { currentAccount, connectWallet, handleChange, sendTransaction, formData, isLoading } = useContext(TransactionContext);
+  const {
+    currentAccount,
+    connectWallet,
+    handleChange,
+    sendTransaction,
+    formData,
+    isLoading,
+  } = useContext(TransactionContext);
 
   const handleSubmit = (e) => {
     const { addressTo, amount, keyword, message } = formData;
@@ -41,7 +49,8 @@ const Welcome = () => {
             Send Crypto <br /> across the world
           </h1>
           <p className="text-left mt-5 text-white font-light md:w-9/12 w-11/12 text-base">
-            Explore the crypto world. Buy and sell cryptocurrencies easily on Krypto.
+            Explore the crypto world. Buy and sell cryptocurrencies easily on
+            Krypto.
           </p>
           {!currentAccount && (
             <button
@@ -84,9 +93,13 @@ const Welcome = () => {
                 <BsInfoCircle fontSize={17} color="#fff" />
               </div>
               <div>
-                <p className="text-white font-light text-sm">
-                  {shortenAddress(currentAccount)}
-                </p>
+                {currentAccount ? (
+                  <p className="text-white font-light text-sm">
+                    {shortenAddress(currentAccount)}
+                  </p>
+                ) : (
+                  <p className="text-white font-light text-sm">Address</p>
+                )}
                 <p className="text-white font-semibold text-lg mt-1">
                   Ethereum
                 </p>
@@ -94,24 +107,44 @@ const Welcome = () => {
             </div>
           </div>
           <div className="p-5 sm:w-96 w-full flex flex-col justify-start items-center blue-glassmorphism">
-            <Input placeholder="Address To" name="addressTo" type="text" handleChange={handleChange} />
-            <Input placeholder="Amount (ETH)" name="amount" type="number" handleChange={handleChange} />
-            <Input placeholder="Keyword (Gif)" name="keyword" type="text" handleChange={handleChange} />
-            <Input placeholder="Enter Message" name="message" type="text" handleChange={handleChange} />
+            <Input
+              placeholder="Address To"
+              name="addressTo"
+              type="text"
+              handleChange={handleChange}
+            />
+            <Input
+              placeholder="Amount (ETH)"
+              name="amount"
+              type="number"
+              handleChange={handleChange}
+            />
+            <Input
+              placeholder="Keyword (Gif)"
+              name="keyword"
+              type="text"
+              handleChange={handleChange}
+            />
+            <Input
+              placeholder="Enter Message"
+              name="message"
+              type="text"
+              handleChange={handleChange}
+            />
 
             <div className="h-[1px] w-full bg-gray-400 my-2" />
 
-            {isLoading
-              ? <Loader />
-              : (
-                <button
-                  type="button"
-                  onClick={handleSubmit}
-                  className="text-white w-full mt-2 border-[1px] p-2 border-[#3d4f7c] hover:bg-[#3d4f7c] rounded-full cursor-pointer"
-                >
-                  Send now
-                </button>
-              )}
+            {isLoading ? (
+              <Loader />
+            ) : (
+              <button
+                type="button"
+                onClick={handleSubmit}
+                className="text-white w-full mt-2 border-[1px] p-2 border-[#3d4f7c] hover:bg-[#3d4f7c] rounded-full cursor-pointer"
+              >
+                Send now
+              </button>
+            )}
           </div>
         </div>
       </div>
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..126eef0
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,6 @@
+{
+  "name": "project_web3.0",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {}
+}