fix: Fix testnet bugs

client/src/App.js

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import "@fontsource/jetbrains-mono"; // Defaults to weight 400
 import "@fontsource/jetbrains-mono/400.css"; // Specify weight
 import { ToastContainer } from "react-toastify";
@@ -23,7 +23,7 @@ const App = () => {
   return (
     <QueryClientProvider client={queryClient}>
       <Provider store={store}>
-        <div className={`h-[90vh] ${isDarkTheme ? "dark" : ""}  `}>
+        <div className={`h-[90vh] ${!isDarkTheme ? "dark" : ""}  `}>
           <WalletConnectionChecker />
           <ToastContainer theme="colored" position="bottom-right" />
           <div className={bodyCS}>

client/src/api/hooks/useTransactionModalApi.js

@@ -96,7 +96,7 @@ export const useTransactionModalApi = (tokenContract) => {
             tokenContract,
             utils.toBigInt(to_wei_token_amount),
             OwshenWallet.wallet,
-            options,
+            options
           );
           await tx.wait();
           axios.get(`${coreEndpoint}/coins`).then((result) => {
@@ -143,19 +143,19 @@ export const useTransactionModalApi = (tokenContract) => {
       return toast.error(errorMessage);
     }
 
-    let selectedCoint;
+    let selectedCoin;
     for (let coin of receivedCoins) {
       if (
         trueAmount(coin.amount, coin.uint_token) > Number(tokenAmount) &&
         String(coin.uint_token) === String(tokenContract)
       ) {
-        selectedCoint = coin;
+        selectedCoin = coin;
         break;
       }
     }
 
-    if(!selectedCoint) {
-      return toast.error("No matching coin is found");
+    if (!selectedCoin) {
+      return toast.error("No matching coin is found!");
     }
 
     const options = {
@@ -166,7 +166,7 @@ export const useTransactionModalApi = (tokenContract) => {
 
       .get(`${coreEndpoint}/send`, {
         params: {
-          index: selectedCoint.index,
+          index: selectedCoin.index,
           address: OwshenWallet.wallet,
           new_amount: to_wei_token_amount,
           receiver_address: destOwshenWallet,
@@ -233,8 +233,8 @@ export const useTransactionModalApi = (tokenContract) => {
             result.data.obfuscated_receiver_amount,
             result.data.obfuscated_sender_amount,
             true,
-            options,
             result.data.memo,
+            options
           );
           console.log("Transaction response", txResponse);
           const txReceipt = await txResponse.wait();
@@ -336,7 +336,7 @@ export const useTransactionModalApi = (tokenContract) => {
             result.data.obfuscated_remaining_amount,
             address,
             commitment,
-            OwshenWallet.wallet,
+            OwshenWallet.wallet
           );
           console.log("Transaction response", txResponse);
           const txReceipt = await txResponse.wait();

client/src/components/Header/index.js

@@ -14,15 +14,15 @@ const Header = ({ isDarkTheme, setIsDarkTheme }) => {
   }, [isDarkTheme]);
 
   const darkThemeHandler = () => {
-    const newTheme = !isDarkTheme;
-    setIsDarkTheme(newTheme);
+    const newTheme = isDarkTheme;
+    setIsDarkTheme(!newTheme);
     localStorage.setItem("theme", newTheme);
   };
   useEffect(() => {
     if (isDarkTheme) {
-      document.documentElement.classList.add("dark");
-    } else {
       document.documentElement.classList.remove("dark");
+    } else {
+      document.documentElement.classList.add("dark");
     }
   }, [isDarkTheme]);
 
@@ -34,7 +34,7 @@ const Header = ({ isDarkTheme, setIsDarkTheme }) => {
     >
       <img
         className=" w-8"
-        src={isDarkTheme ? SunIcon : MoonIcon}
+        src={!isDarkTheme ? SunIcon : MoonIcon}
         alt="theme Icon"
       />
     </button>

client/src/components/Modal/TransactionModal.js

@@ -111,7 +111,16 @@ const TransactionModal = ({
     const val = trueAmount(maxValue);
     return setTokenAmount(val);
   };
-
+  const shuffleText = useCallback(() => {
+    const randomLoadingTexts = [
+      "Processing your request...",
+      "This may take some time...",
+      "Please hold on! Proof generation takes time...",
+      "We're almost done...",
+    ];
+    const index = Math.floor(Math.random() * randomLoadingTexts.length);
+    SetLoadingText(randomLoadingTexts[index]);
+  }, []);
   const handleSend = async () => {
     setInterval(shuffleText, 8000);
     setIsLoading(true); // Set isLoading to true at the beginning of the method
@@ -137,6 +146,7 @@ const TransactionModal = ({
           setIsOpen
         );
       } else {
+        setInterval(shuffleText, 8000);
         await send(
           destOwshenWallet,
           tokenContract,
@@ -152,16 +162,6 @@ const TransactionModal = ({
       setIsLoading(false); // Set isLoading to false after the transaction is complete
     }
   };
-  const shuffleText = useCallback(() => {
-    const randomLoadingTexts = [
-      "Processing your request...",
-      "This may take some time...",
-      "Please hold on! Proof generation takes time...",
-      "We're almost done...",
-    ];
-    const index = Math.floor(Math.random() * randomLoadingTexts.length);
-    SetLoadingText(randomLoadingTexts[index]);
-  }, []);
   const handleWithdraw = async () => {
     setInterval(shuffleText, 8000);
     try {

client/src/components/WalletSelection/ImportWallet.js

@@ -4,9 +4,10 @@ import { useMainApi } from "../../api/hooks/useMainApi";
 import { selectIsOwshenWalletExist } from "../../store/containerSlice";
 import { useNavigate } from "react-router-dom";
 import { useSelector } from "react-redux";
+
 const ImportWallet = () => {
   const { callImportWallet } = useWalletSelectionApi();
-  const [phrases, setPhrases] = useState([]);
+  const [phrases, setPhrases] = useState(Array(12).fill("")); // Initialize with empty strings
   const IsOwshenWalletExist = useSelector(selectIsOwshenWalletExist);
   const navigate = useNavigate();
   const { getInfo } = useMainApi();
@@ -16,22 +17,25 @@ const ImportWallet = () => {
     if (IsOwshenWalletExist) {
       navigate("/");
     }
-  });
+  }, [IsOwshenWalletExist, navigate, getInfo]);
 
-  const handelPhrases = (e) => {
-    setPhrases((prev) => {
-      const index = parseInt(e.target.name, 10) - 1;
-      const newPhrases = [...prev];
-      newPhrases[index] = e.target.value;
-      return newPhrases;
-    });
+  const handlePhraseChange = (index) => (e) => {
+    const inputWords = e.target.value.trim().split(/\s+/);
+    if (inputWords.length === 12) {
+      setPhrases(inputWords);
+    } else {
+      const newPhrases = [...phrases];
+      newPhrases[index] = e.target.value.trim();
+      setPhrases(newPhrases);
+    }
   };
+
   const importWallet = async () => {
     try {
       await callImportWallet(phrases);
       await getInfo();
     } catch (error) {
-      console.log("Error while importing wallet: ", error);
+      console.error("Error while importing wallet: ", error);
     }
   };
 
@@ -40,6 +44,7 @@ const ImportWallet = () => {
   const inputCs =
     "border border-black rounded-lg py-2 w-5/6 text-center dark:bg-transparent dark:border-white";
   const inputHolderCs = "w-full flex items-center justify-between";
+
   return (
     <>
       <div className="text-center flex lg:h-[700px] w-full justify-center items-center ">
@@ -48,115 +53,20 @@ const ImportWallet = () => {
             Please enter your 12-word mnemonic phrase to securely import your
             wallet!
           </p>
-          <div className="border-2 grid md:grid-cols-3 grid-cols-2	p-3 rounded-lg gap-5">
-            <div className={inputHolderCs}>
-              1.
-              <input
-                name="1"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              2.
-              <input
-                name="2"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              3.
-              <input
-                name="3"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              4.
-              <input
-                name="4"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              5.
-              <input
-                name="5"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              6.
-              <input
-                name="6"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              7.
-              <input
-                name="7"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              8.
-              <input
-                name="8"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              9.
-              <input
-                name="9"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              10.
-              <input
-                name="10"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              11.
-              <input
-                name="11"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
-            <div className={inputHolderCs}>
-              12.
-              <input
-                name="12"
-                onChange={handelPhrases}
-                type="text"
-                className={inputCs}
-              />
-            </div>
+          <div className="border-2 grid md:grid-cols-3 grid-cols-2 p-3 rounded-lg gap-5">
+            {phrases.map((phrase, index) => (
+              <div key={index} className={inputHolderCs}>
+                {index + 1}.
+                <input
+                  name={String(index + 1)}
+                  value={phrase}
+                  onChange={handlePhraseChange(index)}
+                  type="text"
+                  className={inputCs}
+                  placeholder={`Word ${index + 1}`}
+                />
+              </div>
+            ))}
           </div>
           <div className="flex flex-col items-center mt-4">
             <button onClick={importWallet} className={btnCS}>

contracts/src/CheckpointedHashchain.sol

@@ -80,8 +80,8 @@ contract CheckpointedHashchain {
         return false;
     }
 
-    function getLastCommitment() public view returns (uint256) {
-        return last_commitment;
+    function getState() public view returns (uint256, uint256) {
+        return (head, checkpoint);
     }
 
     function getCheckpointInterval() public pure returns (uint256) {

contracts/src/Owshen.sol

@@ -213,8 +213,8 @@ contract Owshen {
         }
     }
 
-    function head() public view returns (uint256) {
-        return chc.getLastCommitment();
+    function getState() public view returns (uint256, uint256) {
+        return chc.getState();
     }
 
     function getUintTokenAddress(address _token_address) private pure returns (uint256) {