cleanup

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "plugins": ["prettier-plugin-tailwindcss"]
+}

global.d.ts

@@ -4,4 +4,4 @@ declare global {
   interface Window {
     ethereum?: MetaMaskInpageProvider;
   }
-}
+}

hardhat.config.js

@@ -7,7 +7,7 @@ module.exports = {
   networks: {
     sepolia: {
       url: `${process.env.NEXT_PUBLIC_SEPOLIA_RPC}`,
-      accounts: [`${process.env.ACCOUNT_PRIVATE_KEY}`]
-      },
+      accounts: [`${process.env.ACCOUNT_PRIVATE_KEY}`],
+    },
   },
 };

next.config.mjs

@@ -7,5 +7,5 @@ const nextConfig = {
     return config;
   },
 };
-  
-export default nextConfig;
+
+export default nextConfig;

package.json

@@ -46,6 +46,8 @@
     "eslint": "^8",
     "eslint-config-next": "14.2.4",
     "postcss": "^8",
+    "prettier": "3.3.3",
+    "prettier-plugin-tailwindcss": "^0.6.5",
     "prisma": "^5.17.0",
     "tailwindcss": "^3.4.1",
     "typescript": "^5.5.2"

scripts/deploy.js

@@ -1,23 +1,23 @@
 const { ethers } = require("hardhat");
 
 async function main() {
-    const Factory = await ethers.getContractFactory("WalletFactory");
+  const Factory = await ethers.getContractFactory("WalletFactory");
 
-    // Deploy the contract
-    const factory = await Factory.deploy(
-      "0x5FF137D4b0FDCD49DcA30c7CF57E578a026d2789"
-    );
+  // Deploy the contract
+  const factory = await Factory.deploy(
+    "0x5FF137D4b0FDCD49DcA30c7CF57E578a026d2789",
+  );
 
-    await factory.waitForDeployment();
+  await factory.waitForDeployment();
 
-    const deployedAddress = await factory.getAddress();
+  const deployedAddress = await factory.getAddress();
 
-    console.log(`Factory deployed to: ${deployedAddress}`);
+  console.log(`Factory deployed to: ${deployedAddress}`);
 }
 
 main()
-.then(() => process.exit(0))
-.catch((error) => {
+  .then(() => process.exit(0))
+  .catch((error) => {
     console.error(error);
     process.exit(1);
-});
+  });

src/app/[walletAddress]/page.tsx

@@ -17,7 +17,7 @@ function biginttostring(userOpFinal: UserOperationStruct) {
     Object.entries(userOpFinal).map(([key, value]) => [
       key,
       typeof value === "bigint" ? value.toString() : value,
-    ])
+    ]),
   ) as UserOperationStruct;
 }
 
@@ -35,7 +35,7 @@ export default function WalletPage({
   const fetchUserOp = async () => {
     try {
       const response = await fetch(
-        `/routes/fetchWallet?walletAddress=${walletAddress}`
+        `/routes/fetchWallet?walletAddress=${walletAddress}`,
       );
       const data = await response.json();
 
@@ -53,7 +53,7 @@ export default function WalletPage({
         data.salt,
         toAddress,
         amountBigInt,
-        data.isDeployed
+        data.isDeployed,
       );
 
       if (!userOp) throw new Error("Could not fetch user operation");
@@ -62,7 +62,7 @@ export default function WalletPage({
       return userOp;
     } catch (e) {
       toast.error(
-        "Could not fetch user operation, check console for more details"
+        "Could not fetch user operation, check console for more details",
       );
       console.log(e);
     }
@@ -83,7 +83,7 @@ export default function WalletPage({
       }
 
       const userOpHash = await entryPointContract.getUserOpHash(
-        userOp as UserOperationStruct
+        userOp as UserOperationStruct,
       );
 
       if (!window.ethereum) throw new Error("Metamask not found");
@@ -110,26 +110,25 @@ export default function WalletPage({
       });
 
       const userOpHashFinal = await entryPointContract.getUserOpHash(
-        userOp as UserOperationStruct
+        userOp as UserOperationStruct,
       );
       const signatureFinal = await signer.signMessage(
-        ethers.getBytes(userOpHashFinal)
+        ethers.getBytes(userOpHashFinal),
       );
       userOp.signature = signatureFinal as Hex;
-      
+
       const balance = await metamaskProvider.getBalance(userOp.sender);
 
       const requiredFunds =
         BigInt(userOp.callGasLimit) * BigInt(userOp.maxFeePerGas) +
-        BigInt(userOp.verificationGasLimit) *
-          BigInt(userOp.maxFeePerGas) +
-        BigInt(userOp.preVerificationGas) *
-          BigInt(userOp.maxFeePerGas) + BigInt(ethers.parseEther(amount.toString()));
+        BigInt(userOp.verificationGasLimit) * BigInt(userOp.maxFeePerGas) +
+        BigInt(userOp.preVerificationGas) * BigInt(userOp.maxFeePerGas) +
+        BigInt(ethers.parseEther(amount.toString()));
 
       if (balance < requiredFunds) {
         const amountToFund = requiredFunds - balance;
         toast.warn(
-          `Account needs funding of ${ethers.formatEther(amountToFund)} ETH`
+          `Account needs funding of ${ethers.formatEther(amountToFund)} ETH`,
         );
 
         if (!window.ethereum) throw new Error("Metamask not found");
@@ -154,7 +153,8 @@ export default function WalletPage({
             signature,
             signerAddress: userAddress,
           },
-          (key, value) => (typeof value === "bigint" ? value.toString() : value)
+          (key, value) =>
+            typeof value === "bigint" ? value.toString() : value,
         ),
         headers: {
           "Content-Type": "application/json",
@@ -183,7 +183,7 @@ export default function WalletPage({
   }, [newTransactionCreated]);
 
   return (
-    <div className="flex flex-col py-6 items-center gap-5">
+    <div className="flex flex-col items-center gap-5 py-6">
       <h1 className="text-5xl font-bold">Manage Wallet</h1>
       <h3 className="text-xl font-medium text-gray-700">{walletAddress}</h3>
 
@@ -207,11 +207,11 @@ export default function WalletPage({
         }}
       />
       <button
-        className="bg-blue-600 mx-auto hover:bg-blue-700 disabled:bg-blue-500/50 disabled:hover:bg-blue-500/50 transition text-white font-bold py-2 w-[8%] px-4 rounded-full duration-300"
+        className="mx-auto w-[8%] rounded-full bg-blue-600 px-4 py-2 font-bold text-white transition duration-300 hover:bg-blue-700 disabled:bg-blue-500/50 disabled:hover:bg-blue-500/50"
         onClick={createTransaction}
       >
         {loading ? (
-          <div className="animate-spin rounded-full h-6 w-6 border-4 border-gray-300 border-l-white items-center justify-center mx-auto" />
+          <div className="mx-auto h-6 w-6 animate-spin items-center justify-center rounded-full border-4 border-gray-300 border-l-white" />
         ) : (
           `Create Txn`
         )}

src/app/createPasskey/page.tsx

@@ -2,8 +2,8 @@ import CreateP256 from "@/components/createP256";
 
 export default function CreateWalletPage() {
   return (
-    <main className="flex flex-col py-6 items-center gap-5">
+    <main className="flex flex-col items-center gap-5 py-6">
       <CreateP256 />
     </main>
   );
-}
+}

src/app/createWallet/page.tsx

@@ -1,7 +1,5 @@
 import CreateSCW from "@/components/createSCW";
 
 export default function CreateWalletPage() {
-  return (
-      <CreateSCW />
-  );
-}
+  return <CreateSCW />;
+}

src/app/layout.tsx

@@ -6,11 +6,15 @@ import { Inter } from "next/font/google";
 import "./globals.css";
 import Footer from "@/components/footer";
 import { ToastContainer, Flip } from "react-toastify";
-import 'react-toastify/dist/ReactToastify.css';
+import "react-toastify/dist/ReactToastify.css";
 
 const inter = Inter({ subsets: ["latin"] });
 
-export default function RootLayout({children}: {children: React.ReactNode;}) {
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
   return (
     <html lang="en">
       <head>
@@ -20,7 +24,7 @@ export default function RootLayout({children}: {children: React.ReactNode;}) {
       </head>
       <body className={inter.className}>
         <Providers>
-          <div className="flex flex-col min-h-screen bg-gray-300 text-slate-950">
+          <div className="flex min-h-screen flex-col bg-gray-300 text-slate-950">
             <Navbar />
             {children}
             <div className="grow" />
@@ -34,12 +38,12 @@ export default function RootLayout({children}: {children: React.ReactNode;}) {
               pauseOnFocusLoss
               pauseOnHover
               theme="dark"
-              stacked 
+              stacked
               transition={Flip}
             />
           </div>
         </Providers>
       </body>
     </html>
   );
-}
+}