peanutprotocol · borcherd · Aug 17, 2023 · Aug 17, 2023 · Aug 17, 2023 · Aug 17, 2023
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1,3 @@
+node_modules/
+.next/
+.out/
diff --git a/README.md b/README.md
@@ -13,8 +13,9 @@ npm install
 ```
 
 Secondly, copy the .env.example to .env and fill in the values:
-there are 3 .env values: 
-you can get both WalletConnect and Socket.tech from their docs, and reach out to us for the Peanut api key. 
+there are 3 .env values:
+you can get both WalletConnect and Socket.tech from their docs, and reach out to us for the Peanut api key.
+
 ```bash
 cp .env.example .env
 ```

diff --git a/next.config.js b/next.config.js
@@ -1,12 +1,12 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  env: {
-    WC_PROJECT_ID: process.env.WC_PROJECT_ID,
-    SOCKET_API_KEY: process.env.SOCKET_API_KEY,
-    PEANUT_API_KEY: process.env.PEANUT_API_KEY,
-    OPTI_GOERLI_RPC_URL: process.env.OPTI_GOERLI_RPC_URL,
-    GOERLI_RPC_URL: process.env.GOERLI_RPC_URL,
-  },
-};
+    env: {
+        WC_PROJECT_ID: process.env.WC_PROJECT_ID,
+        SOCKET_API_KEY: process.env.SOCKET_API_KEY,
+        PEANUT_API_KEY: process.env.PEANUT_API_KEY,
+        OPTI_GOERLI_RPC_URL: process.env.OPTI_GOERLI_RPC_URL,
+        GOERLI_RPC_URL: process.env.GOERLI_RPC_URL,
+    },
+}
 
-module.exports = nextConfig;
+module.exports = nextConfig
diff --git a/package.json b/package.json
@@ -1,45 +1,48 @@
 {
-  "name": "peanut-ui",
-  "version": "0.1.0",
-  "private": true,
-  "scripts": {
-    "dev": "next dev",
-    "build": "next build",
-    "start": "next start",
-    "lint": "next lint"
-  },
-  "dependencies": {
-    "@socket.tech/socket-v2-sdk": "^1.21.8",
-    "@squirrel-labs/peanut-sdk": "0.0.76",
-    "@types/node": "20.4.2",
-    "@types/react": "18.2.15",
-    "@types/react-dom": "18.2.7",
-    "@web3modal/ethereum": "^2.7.0",
-    "@web3modal/react": "^2.7.0",
-    "autoprefixer": "^10.4.14",
-    "encoding": "^0.1.13",
-    "ethers": "5.7.2",
-    "jotai": "^2.2.2",
-    "lokijs": "^1.5.12",
-    "next": "13.4.10",
-    "pino-pretty": "^10.0.1",
-    "postcss": "^8.4.26",
-    "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "react-fast-marquee": "^1.6.0",
-    "react-hook-form": "^7.42.1",
-    "react-qr-code": "^2.0.11",
-    "react-select": "^5.7.4",
-    "react-tooltip": "^5.20.0",
-    "sharp": "^0.32.4",
-    "tailwindcss": "^3.3.3",
-    "typescript": "5.1.6",
-    "viem": "^1.3.0",
-    "wagmi": "^1.3.9",
-    "web3": "^1.7.0",
-    "web3modal": "^1.9.12"
-  },
-  "devDependencies": {
-    "parcel": "^2.9.3"
-  }
+    "name": "peanut-ui",
+    "version": "0.1.0",
+    "private": true,
+    "scripts": {
+        "dev": "next dev",
+        "build": "next build",
+        "start": "next start",
+        "lint": "next lint",
+        "prettier": "prettier --write ."
+    },
+    "dependencies": {
+        "@socket.tech/socket-v2-sdk": "^1.21.8",
+        "@squirrel-labs/peanut-sdk": "*",
+        "@types/node": "20.4.2",
+        "@types/react": "18.2.15",
+        "@types/react-dom": "18.2.7",
+        "@web3modal/ethereum": "^2.7.0",
+        "@web3modal/react": "^2.7.0",
+        "autoprefixer": "^10.4.14",
+        "encoding": "^0.1.13",
+        "ethers": "5.7.2",
+        "jotai": "^2.2.2",
+        "lokijs": "^1.5.12",
+        "next": "13.4.10",
+        "pino-pretty": "^10.0.1",
+        "postcss": "^8.4.26",
+        "react": "18.2.0",
+        "react-dom": "18.2.0",
+        "react-fast-marquee": "^1.6.0",
+        "react-hook-form": "^7.42.1",
+        "react-qr-code": "^2.0.11",
+        "react-select": "^5.7.4",
+        "react-tooltip": "^5.20.0",
+        "sharp": "^0.32.4",
+        "tailwindcss": "^3.3.3",
+        "typescript": "5.1.6",
+        "viem": "^1.3.0",
+        "wagmi": "^1.3.9",
+        "web3": "^1.7.0",
+        "web3modal": "^1.9.12"
+    },
+    "devDependencies": {
+        "parcel": "^2.9.3",
+        "prettier": "^3.0.2",
+        "prettier-plugin-tailwindcss": "^0.5.3"
+    }
 }
diff --git a/postcss.config.js b/postcss.config.js
@@ -1,6 +1,6 @@
 module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
+    plugins: {
+        tailwindcss: {},
+        autoprefixer: {},
+    },
 }
diff --git a/prettier.config.js b/prettier.config.js
@@ -0,0 +1,8 @@
+module.exports = {
+    plugins: ['prettier-plugin-tailwindcss'],
+    trailingComma: 'es5',
+    tabWidth: 4,
+    semi: false,
+    singleQuote: true,
+    printWidth: 120,
+}
diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
@@ -1,10 +1,10 @@
-"use client";
-import * as global_components from "@/components/global";
-import * as components from "@/components";
+'use client'
+import * as global_components from '@/components/global'
+import * as components from '@/components'
 export default function AboutPage() {
-  return (
-    <global_components.PageWrapper showMarquee={false} bgColor="bg-lightblue">
-      <components.About />
-    </global_components.PageWrapper>
-  );
+    return (
+        <global_components.PageWrapper showMarquee={false} bgColor="bg-lightblue">
+            <components.About />
+        </global_components.PageWrapper>
+    )
 }
diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
@@ -1,11 +1,11 @@
-"use client";
-import * as global_components from "@/components/global";
-import * as components from "@/components";
+'use client'
+import * as global_components from '@/components/global'
+import * as components from '@/components'
 
 export default function BlogPage() {
-  return (
-    <global_components.PageWrapper showMarquee={false} bgColor="bg-lightblue">
-      <components.Blog />
-    </global_components.PageWrapper>
-  );
+    return (
+        <global_components.PageWrapper showMarquee={false} bgColor="bg-lightblue">
+            <components.Blog />
+        </global_components.PageWrapper>
+    )
 }
diff --git a/src/app/claim/page.tsx b/src/app/claim/page.tsx
@@ -1,13 +1,13 @@
-"use client";
-import * as global_components from "@/components/global";
-import * as components from "@/components";
-import { useSearchParams } from "next/navigation";
+'use client'
+import * as global_components from '@/components/global'
+import * as components from '@/components'
+import { useSearchParams } from 'next/navigation'
 
 export default function ClaimPage() {
-  const params = useSearchParams();
-  return (
-    <global_components.PageWrapper>
-      <components.Claim link={params} />
-    </global_components.PageWrapper>
-  );
+    const params = useSearchParams()
+    return (
+        <global_components.PageWrapper>
+            <components.Claim link={params} />
+        </global_components.PageWrapper>
+    )
 }
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
@@ -1,11 +1,11 @@
-"use client";
-import * as global_components from "@/components/global";
-import * as components from "@/components";
+'use client'
+import * as global_components from '@/components/global'
+import * as components from '@/components'
 
 export default function DashboardPage() {
-  return (
-    <global_components.PageWrapper>
-      <components.Dashboard />
-    </global_components.PageWrapper>
-  );
+    return (
+        <global_components.PageWrapper>
+            <components.Dashboard />
+        </global_components.PageWrapper>
+    )
 }
diff --git a/src/app/jobs/page.tsx b/src/app/jobs/page.tsx
@@ -1,11 +1,11 @@
-"use client";
-import * as global_components from "@/components/global";
-import * as components from "@/components";
+'use client'
+import * as global_components from '@/components/global'
+import * as components from '@/components'
 
 export default function JobsPage() {
-  return (
-    <global_components.PageWrapper bgColor="bg-yellow">
-      <components.Jobs />
-    </global_components.PageWrapper>
-  );
+    return (
+        <global_components.PageWrapper bgColor="bg-yellow">
+            <components.Jobs />
+        </global_components.PageWrapper>
+    )
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,49 +1,45 @@
-"use client";
-import "@/styles/globals.css";
-import { Inter } from "next/font/google";
-import { Web3Modal } from "@web3modal/react";
-import { WagmiConfig } from "wagmi";
+'use client'
+import '@/styles/globals.css'
+import { Inter } from 'next/font/google'
+import { Web3Modal } from '@web3modal/react'
+import { WagmiConfig } from 'wagmi'
 
-import * as config from "@/config";
-import { Store } from "@/store/store";
-import { useState, useEffect } from "react";
+import * as config from '@/config'
+import { Store } from '@/store/store'
+import { useState, useEffect } from 'react'
 
-const inter = Inter({ subsets: ["latin"] });
+const inter = Inter({ subsets: ['latin'] })
 
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  const [ready, setReady] = useState(false);
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+    const [ready, setReady] = useState(false)
 
-  //this useEffect is needed to prevent hydration error when autoConnect in wagmiConfig is true
-  useEffect(() => {
-    setReady(true);
-  }, []);
+    //this useEffect is needed to prevent hydration error when autoConnect in wagmiConfig is true
+    useEffect(() => {
+        setReady(true)
+    }, [])
 
-  return (
-    <html lang="en">
-      <title>Peanut Protocol</title>
-      <body className={inter.className}>
-        {ready && (
-          <WagmiConfig config={config.wagmiConfig}>
-            <Store>{children}</Store>
-          </WagmiConfig>
-        )}
-        <Web3Modal
-          projectId={process.env.WC_PROJECT_ID ?? ""}
-          ethereumClient={config.ethereumClient}
-          themeMode="dark"
-          themeVariables={{
-            "--w3m-accent-color": "white",
-            "--w3m-background-color": "white",
-            "--w3m-accent-fill-color": "black",
-            "--w3m-container-border-radius": "0px",
-            "--w3m-background-border-radius": "0px",
-          }}
-        />
-      </body>
-    </html>
-  );
+    return (
+        <html lang="en">
+            <title>Peanut Protocol</title>
+            <body className={inter.className}>
+                {ready && (
+                    <WagmiConfig config={config.wagmiConfig}>
+                        <Store>{children}</Store>
+                    </WagmiConfig>
+                )}
+                <Web3Modal
+                    projectId={process.env.WC_PROJECT_ID ?? ''}
+                    ethereumClient={config.ethereumClient}
+                    themeMode="dark"
+                    themeVariables={{
+                        '--w3m-accent-color': 'white',
+                        '--w3m-background-color': 'white',
+                        '--w3m-accent-fill-color': 'black',
+                        '--w3m-container-border-radius': '0px',
+                        '--w3m-background-border-radius': '0px',
+                    }}
+                />
+            </body>
+        </html>
+    )
 }