feat(ci): add ci checks

.github/actions/setup/action.yaml

@@ -0,0 +1,18 @@
+name: Setup
+runs:
+  using: composite
+  steps:
+    - uses: pnpm/action-setup@v2
+
+    - name: Setup Foundry
+      uses: foundry-rs/foundry-toolchain@v1
+      with:
+        version: nightly
+
+    - name: pnpm install node modules
+      run: pnpm i --frozen-lockfile
+      shell: bash
+
+    - name: pnpm build
+      run: pnpm -r build
+      shell: bash

.github/actions/supersim/action.yaml

@@ -0,0 +1,8 @@
+name: Supersim
+runs:
+  using: composite
+  steps:
+    - name: Install Supersim
+      uses: jaxxstorm/action-install-gh-release@v1.10.0
+      with:
+        repo: ethereum-optimism/supersim

.github/workflows/main.yaml

@@ -0,0 +1,81 @@
+name: Unit Tests
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+  merge_group:
+    branches:
+      - main
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: 'read'
+  actions: 'read'
+
+jobs:
+  typecheck:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Setup
+        uses: ./.github/actions/setup
+      - name: Run TypeChecker
+        run: |
+          pnpm -r typecheck
+
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Setup
+        uses: ./.github/actions/setup
+      - name: Run Linters
+        run: |
+          pnpm -r lint
+
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Setup
+        uses: ./.github/actions/setup
+      - name: Supersim Setup
+        uses: ./.github/actions/supersim
+      - name: Run Tests
+        run: |
+          pnpm -r --filter '!e2e-test' test
+
+  e2e-test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Setup
+        uses: ./.github/actions/setup
+      - name: Supersim Setup
+        uses: ./.github/actions/supersim
+      - name: Run Tests
+        shell: bash
+        run: |
+          pnpm supersim --interop.autorelay &
+          wait-port http://:8420/ready && forge script scripts/MultiChainSuperchainERC20Deployment.s.sol --broadcast --private-key 0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80
+          pnpm e2e-test:ci

package.json

@@ -1,5 +1,6 @@
 {
   "name": "superchainerc20-starter",
+  "packageManager": "pnpm@9.0.2",
   "description": "",
   "scripts": {
     "dev": "mprocs",
@@ -9,7 +10,8 @@
     "contracts:deploy:singlechain": "pnpm nx run @superchainerc20-starter/contracts:deploy:singlechain",
     "update:toc": "doctoc README.md",
     "e2e-test": "mprocs -c mprocs-e2e-test.yaml",
-    "init:env": "pnpm nx run-many --target=init:env"
+    "init:env": "pnpm nx run-many --target=init:env",
+    "e2e-test:ci": "pnpm nx run @superchainerc20-starter/e2e-test:test"
   },
   "license": "MIT",
   "devDependencies": {

packages/e2e-test/package.json

@@ -4,7 +4,7 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "test": "vitest",
+    "test": "vitest --run",
     "init:env": "cp .env.example .env"
   },
   "devDependencies": {

packages/e2e-test/src/envVars.ts

@@ -2,6 +2,6 @@ import { parseEnv, z } from 'znv'
 import { Address as ZodAddress } from 'abitype/zod'
 
 export const envVars = parseEnv(import.meta.env, {
-  VITE_TOKEN_CONTRACT_ADDRESS: ZodAddress,
-  VITE_TOKEN_MINTER_ADDRESS: ZodAddress,
+  VITE_TOKEN_CONTRACT_ADDRESS: ZodAddress.default("0x5BCf71Ca0CE963373d917031aAFDd6D98B80B159"),
+  VITE_TOKEN_MINTER_ADDRESS: ZodAddress.default("0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266"),
 })

packages/frontend/.gitignore

@@ -11,6 +11,8 @@ node_modules
 dist
 dist-ssr
 *.local
+tsconfig.app.tsbuildinfo
+tsconfig.node.tsbuildinfo
 
 # Editor directories and files
 .vscode/*

packages/frontend/package.json

@@ -6,10 +6,12 @@
   "scripts": {
     "dev": "vite",
     "build": "vite build",
-    "lint": "eslint .",
+    "lint": "eslint \"**/*.{ts,tsx}\" && pnpm prettier --check \"**/*.{ts,tsx}\"",
+    "lint:fix": "eslint \"**/*.{ts,tsx}\" --fix --quiet && pnpm prettier \"**/*.{ts,tsx}\" --write --loglevel=warn",
     "preview": "vite preview",
     "shadcn:add": "pnpm dlx shadcn add",
-    "init:env": "cp .env.example .env"
+    "init:env": "cp .env.example .env",
+    "typecheck": "tsc --build --noEmit"
   },
   "dependencies": {
     "@eth-optimism/viem": "^0.0.11",

packages/frontend/src/App.tsx

@@ -1,19 +1,19 @@
-import { ArrowLeftRight as BridgeIcon, Droplet, RefreshCw } from "lucide-react";
-import { Bridge } from "@/Bridge";
-import { Providers } from "@/Providers";
-import { WalletBalance } from "@/components/WalletBalance";
-import { Card } from "@/components/ui/card";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
-import { Faucet } from "@/Faucet";
-import { ConnectWalletButton } from "@/components/connect-wallet/ConnectWalletButton";
-import { TokenInfo } from "@/components/TokenInfo";
-import { TokenAggregateSupply } from "@/components/TokenAggregateSupply";
-import { useStartIndexer } from "@/hooks/useIndexer";
-import { Button } from "@/components/ui/button";
-import { RecentActivity } from "@/components/RecentActivity";
+import { ArrowLeftRight as BridgeIcon, Droplet, RefreshCw } from 'lucide-react'
+import { Bridge } from '@/Bridge'
+import { Providers } from '@/Providers'
+import { WalletBalance } from '@/components/WalletBalance'
+import { Card } from '@/components/ui/card'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
+import { Faucet } from '@/Faucet'
+import { ConnectWalletButton } from '@/components/connect-wallet/ConnectWalletButton'
+import { TokenInfo } from '@/components/TokenInfo'
+import { TokenAggregateSupply } from '@/components/TokenAggregateSupply'
+import { useStartIndexer } from '@/hooks/useIndexer'
+import { Button } from '@/components/ui/button'
+import { RecentActivity } from '@/components/RecentActivity'
 
 const IndexerStarter = () => {
-  const indexer = useStartIndexer();
+  const indexer = useStartIndexer()
   return (
     <Button
       variant="outline"
@@ -24,19 +24,18 @@ const IndexerStarter = () => {
       <RefreshCw className="h-4 w-4" />
       Reset Indexer
     </Button>
-  );
+  )
 }
 
 function App() {
   return (
     <Providers>
-
       <div className="min-h-screen bg-slate-50 dark:bg-slate-950">
         <header className="border-b">
           <div className="container mx-auto flex h-16 items-center justify-between">
             <h1 className="text-xl font-bold">SuperchainERC20 Dev Tools</h1>
             <div className="flex items-center gap-4">
-            <IndexerStarter />  
+              <IndexerStarter />
               <ConnectWalletButton />
             </div>
           </div>
@@ -58,7 +57,7 @@ function App() {
                 <Tabs defaultValue="faucet" className="w-full">
                   <div className="px-6 pt-6">
                     <TabsList className="w-full flex">
-                    <TabsTrigger value="faucet" className="flex-1">
+                      <TabsTrigger value="faucet" className="flex-1">
                         <Droplet className="mr-2 h-4 w-4" />
                         Faucet
                       </TabsTrigger>
@@ -68,7 +67,7 @@ function App() {
                       </TabsTrigger>
                     </TabsList>
                   </div>
-                  
+
                   <div className="p-6">
                     <TabsContent value="bridge">
                       <Bridge />
@@ -78,16 +77,19 @@ function App() {
                     </TabsContent>
                     <TabsContent value="deploy">
                       {/* Add Contract Deployment interface */}
-                      <div className="text-muted-foreground">Contract deployment interface coming soon...</div>
+                      <div className="text-muted-foreground">
+                        Contract deployment interface coming soon...
+                      </div>
                     </TabsContent>
                     <TabsContent value="verify">
                       {/* Add Contract Verification interface */}
-                      <div className="text-muted-foreground">Contract verification interface coming soon...</div>
+                      <div className="text-muted-foreground">
+                        Contract verification interface coming soon...
+                      </div>
                     </TabsContent>
                   </div>
                 </Tabs>
               </Card>
-
             </div>
 
             <div className="space-y-6">
@@ -97,7 +99,7 @@ function App() {
         </main>
       </div>
     </Providers>
-  );
+  )
 }
 
-export default App;
+export default App