Merge pull request #6 from Web3Camp-Labs/dev

update to new version

Author: xrdavies

.github/workflows/main.yml

@@ -8,35 +8,26 @@ on:
 
 jobs:
   deploy:
-    runs-on: ubuntu-20.04
+    runs-on: ubuntu-latest
     concurrency:
       group: ${{ github.workflow }}-${{ github.ref }}
     steps:
-      - uses: actions/checkout@v2
+      - name: Checkout code
+        uses: actions/checkout@v3
 
       - name: Setup Node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
-          node-version: '14'
+          node-version: '18'
+          cache: 'yarn'
 
-      - name: Get yarn cache
-        id: yarn-cache
-        run: echo "::set-output name=dir::$(yarn cache dir)"
+      - name: Install dependencies
+        run: yarn install --frozen-lockfile
 
-      - name: Cache dependencies
-        uses: actions/cache@v2
-        with:
-          path: ${{ steps.yarn-cache.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
-          restore-keys: |
-            ${{ runner.os }}-yarn-
-            
       - name: Build
         env:
           CI: false
-        run: |
-          yarn install --frozen-lockfile
-          yarn build
+        run: yarn build
 
       - name: Deploy to gh-pages
         uses: peaceiris/actions-gh-pages@v3

README.md

@@ -6,7 +6,55 @@ Quick DApp is a tool for smart contract developers to interact with any smart co
 
 With Quick DApp, you can just create a simple dapp in minutes and share it with your friends anywhere.
 
-# Plans
+## Features
+
+- **Instant Interface Generation**: Automatically creates a UI for any smart contract from its ABI
+- **Multi-network Support**: Works with Ethereum, Polygon, BSC, and other EVM-compatible networks
+- **Comprehensive Method Support**: Handles view/pure functions, state-changing functions, and payable functions
+- **Enhanced Transaction Tracking**: Real-time status updates with detailed feedback
+- **Advanced Type Handling**: Supports complex parameter types (arrays, structs, etc.)
+- **Clean Result Display**: Clearly formatted function return values
+- **User-friendly Error Messages**: Readable blockchain error information
+
+## Usage
+
+1. Connect your MetaMask wallet
+2. Enter your contract's ABI (JSON format) and address
+3. Select the network where your contract is deployed
+4. Click on any method to interact with it
+5. For read-only methods, results will display immediately
+6. For state-changing methods, you'll see transaction status and confirmations
+
+## Installation
+
+### Prerequisites
+
+- Node.js (v14 or later)
+- Yarn or npm
+
+### Setup
+
+1. Clone the repository
+   ```bash
+   git clone https://github.com/Web3Camp-Labs/quick-dapp.git
+   cd quick-dapp
+   ```
+
+2. Install dependencies
+   ```bash
+   yarn install
+   # or
+   npm install
+   ```
+
+3. Start the development server
+   ```bash
+   yarn start
+   # or
+   npm start
+   ```
+
+## Plans
 - [ ] Add support for other wallets
   - [ ] CoinBase
   - [ ] WalletConnect
@@ -15,11 +63,37 @@ With Quick DApp, you can just create a simple dapp in minutes and share it with
 - [ ] Save the created dapp locally
 - [ ] Provide share link for dapp
 - [ ] New UI
+- [x] Enhanced transaction tracking
+- [x] Improved error handling
+- [x] Better result formatting
+
+## Project Structure
+
+- `src/components/` - React components
+  - `AppMethod.jsx` - Core component for interacting with contract methods
+  - `TransactionStatus.jsx` - Transaction tracking UI
+- `src/utils/` - Utility functions
+  - `contractUtils.js` - Smart contract interaction helpers
+- `src/store/` - State management
+  - `methodReducer.js` - Reducer for method call state
+- `src/hooks/` - Custom React hooks
+  - `useTransactionTracker.js` - Hook for tracking transaction status
 
-# History
+## History
 
 In the past years, **Patrick Gallagher** created a tool named OneClick DApp for the community. However, this tool has not worked for a long time since mid-2023. So we created a new tool to replace it under the name of Web3Camp.
 
-# Special Thanks
+## Technologies
+
+- React 17
+- ethers.js 5.5
+- Ant Design 4.18
+- Styled Components
+
+## Special Thanks
 
 https://oneclickdapp.com
+
+## License
+
+This project is licensed under the MIT License.

public/index.html

@@ -7,7 +7,11 @@
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
-      content="OneClick dApp is a tool for smart contract developers to interactive with any smart contracts easily and quickly with one click!"
+      content="One Click dApp is a tool to instantly build a dApp with any smart contracts easily and quickly with one click!"
+    />
+    <meta
+      name="keywords"
+      content="ethereum, solidity, evm, dapp, oneclick, web3camp.us, web3camp"
     />
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <!--
@@ -24,7 +28,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>One Click DApp</title>
+    <title>One Click DApp ｜ a tool to instantly build a dApp</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>