feat: rainbow and privy examples

demo/server/.env.example

@@ -0,0 +1,6 @@
+JUSTANAME_API_KEY=<your_api_key>
+JUSTANAME_PROVIDER_URL=<your_provider_url>
+JUSTANAME_CHAIN_ID=<your_chain_id>
+JUSTANAME_DOMAIN=<your_domain>
+JUSTANAME_ORIGIN=<your_origin>
+JUSTANAME_ENS_DOMAIN=<your_ens_domain>

demo/express-trial/jest.config.ts → demo/server/jest.config.ts

@@ -1,12 +1,12 @@
 /* eslint-disable */
 export default {
-  displayName: 'justaname-express-trial',
+  displayName: 'server',
   preset: '../../jest.preset.js',
   testEnvironment: 'node',
   transform: {
     '^.+\\.[tj]s$': ['ts-jest', { tsconfig: '<rootDir>/tsconfig.spec.json' }],
   },
   moduleFileExtensions: ['ts', 'js', 'html'],
-  coverageDirectory: '../../coverage/apps/express-trial',
+  coverageDirectory: '../../coverage/apps/server',
   passWithNoTests: true,
 };

demo/express-trial/project.json → demo/server/project.json

@@ -1,21 +1,21 @@
 {
-  "name": "justaname-express-trial",
+  "name": "server",
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "demo/express-trial/src",
+  "sourceRoot": "demo/server/src",
   "projectType": "application",
   "targets": {
     "serve": {
       "executor": "@nx/js:node",
       "defaultConfiguration": "development",
       "options": {
-        "buildTarget": "justaname-express-trial:build"
+        "buildTarget": "server:build"
       },
       "configurations": {
         "development": {
-          "buildTarget": "justaname-express-trial:build:development"
+          "buildTarget": "server:build:development"
         },
         "production": {
-          "buildTarget": "justaname-express-trial:build:production"
+          "buildTarget": "server:build:production"
         }
       }
     },
@@ -26,10 +26,10 @@
       "options": {
         "target": "node",
         "compiler": "tsc",
-        "outputPath": "dist/demo/express-trial",
-        "main": "demo/express-trial/src/main.ts",
-        "tsConfig": "demo/express-trial/tsconfig.app.json",
-        "webpackConfig": "demo/express-trial/webpack.config.js",
+        "outputPath": "dist/demo/server",
+        "main": "demo/server/src/main.ts",
+        "tsConfig": "demo/server/tsconfig.app.json",
+        "webpackConfig": "demo/server/webpack.config.js",
         "generatePackageJson": true
       },
       "configurations": {

demo/with-privy/.env.example

@@ -0,0 +1,6 @@
+VITE_APP_BACKEND_URL=<backend-url>
+VITE_APP_ORIGIN=<origin>
+VITE_APP_DOMAIN=<domain>
+VITE_APP_MAINNET_PROVIDER_URL=<mainnet-provider-url>
+VITE_APP_SEPOLIA_PROVIDER_URL=<sepolia-provider-url>
+VITE_APP_PRIVY_APP_ID=<privy-app-id>

demo/with-privy/src/app/app.tsx

@@ -1,9 +1,12 @@
-import { JustWeb3Provider, JustWeb3ProviderConfig } from '@justweb3/widget';
+import {
+  JustWeb3Button,
+  JustWeb3Provider,
+  JustWeb3ProviderConfig,
+} from '@justweb3/widget';
 import '@rainbow-me/rainbowkit/styles.css';
 import { http } from 'wagmi';
 import { mainnet, sepolia } from 'wagmi/chains';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { ChainId } from '@justaname.id/sdk';
 import { PrivyProvider, usePrivy } from '@privy-io/react-auth';
 import { createConfig, WagmiProvider } from '@privy-io/wagmi';
 import { useEnsAuth } from '@justaname.id/react';
@@ -18,14 +21,12 @@ const JustaNameConfig: JustWeb3ProviderConfig = {
   backendUrl: import.meta.env.VITE_APP_BACKEND_URL,
   networks: [
     {
-      chainId: parseInt(import.meta.env.VITE_APP_CHAIN_ID) as ChainId,
-      providerUrl: import.meta.env.VITE_APP_PROVIDER_URL,
+      chainId: 1,
+      providerUrl: import.meta.env.VITE_APP_MAINNET_PROVIDER_URL,
     },
-  ],
-  ensDomains: [
     {
-      ensDomain: import.meta.env.VITE_APP_ENS_DOMAIN,
-      chainId: parseInt(import.meta.env.VITE_APP_CHAIN_ID) as ChainId,
+      chainId: 11155111,
+      providerUrl: import.meta.env.VITE_APP_SEPOLIA_PROVIDER_URL,
     },
   ],
   openOnWalletConnect: true,
@@ -42,33 +43,17 @@ const Connect = () => {
   return (
     <div className="App">
       <header className="App-header">
-        {/* If the user is not authenticated, show a login button */}
-        {/* If the user is authenticated, show the user object and a logout button */}
-        {ready && authenticated ? (
-          <div>
-            <textarea
-              readOnly
-              value={JSON.stringify(user, null, 2)}
-              style={{ width: '600px', height: '250px', borderRadius: '6px' }}
-            />
-            <br />
-            <button
-              onClick={logout}
-              style={{
-                marginTop: '20px',
-                padding: '12px',
-                backgroundColor: '#069478',
-                color: '#FFF',
-                border: 'none',
-                borderRadius: '6px',
-              }}
-            >
-              Log Out
-            </button>
-          </div>
-        ) : (
+        <JustWeb3Button logout={logout}>
           <button
-            onClick={login}
+            onClick={() => {
+              if (!authenticated) {
+                login();
+              } else {
+                logout().then(() => {
+                  login();
+                });
+              }
+            }}
             style={{
               padding: '12px',
               backgroundColor: '#069478',
@@ -79,14 +64,19 @@ const Connect = () => {
           >
             Log In
           </button>
-        )}
+        </JustWeb3Button>
         {connectedEns && (
           <div>
             <textarea
               readOnly
               value={JSON.stringify(connectedEns, null, 2)}
               style={{ width: '600px', height: '250px', borderRadius: '6px' }}
             />
+            <textarea
+              readOnly
+              value={JSON.stringify(user, null, 2)}
+              style={{ width: '600px', height: '250px', borderRadius: '6px' }}
+            />
           </div>
         )}
       </header>
@@ -100,8 +90,6 @@ export function App() {
     transports: {
       [mainnet.id]: http(),
       [sepolia.id]: http(),
-      // For each of your required chains, add an entry to `transports` with
-      // a key of the chain's `id` and a value of `http()`
     },
   });
 

demo/react-trial/index.html → demo/with-rainbow/index.html

@@ -3,7 +3,7 @@
 
 <head>
   <meta charset="utf-8" />
-  <title>JustaNameReactTrial</title>
+  <title>WithRainbow</title>
   <base href="/" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />

demo/react-trial/project.json → demo/with-rainbow/project.json

@@ -1,18 +1,18 @@
 {
-  "name": "react-trial",
+  "name": "with-rainbow",
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "apps/react-trial/src",
+  "sourceRoot": "apps/with-rainbow/src",
   "projectType": "application",
   "targets": {
     "serve": {
       "executor": "@nx/vite:dev-server",
       "defaultConfiguration": "development",
       "options": {
-        "buildTarget": "react-trial:build"
+        "buildTarget": "with-rainbow:build"
       },
       "configurations": {
         "production": {
-          "buildTarget": "react-trial:build:production"
+          "buildTarget": "with-rainbow:build:production"
         }
       },
       "dependsOn": [
@@ -31,7 +31,7 @@
       "executor": "nx:run-commands",
       "options": {
         "command": "yarn tsc --noEmit",
-        "cwd": "apps/react-trial"
+        "cwd": "apps/with-rainbow"
       }
     }
   },

demo/react-trial/src/app/app.tsx → demo/with-rainbow/src/app/app.tsx

@@ -1,7 +1,7 @@
 import {
-  JustWeb3ProviderConfig,
-  JustWeb3Provider,
   JustWeb3Button,
+  JustWeb3Provider,
+  JustWeb3ProviderConfig,
 } from '@justweb3/widget';
 import '@rainbow-me/rainbowkit/styles.css';
 import {
@@ -11,8 +11,7 @@ import {
 } from '@rainbow-me/rainbowkit';
 import { WagmiProvider } from 'wagmi';
 import { mainnet, sepolia } from 'wagmi/chains';
-import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
-import { ChainId } from '@justaname.id/sdk';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
 const queryClient = new QueryClient();
 
@@ -24,25 +23,24 @@ const JustaNameConfig: JustWeb3ProviderConfig = {
   backendUrl: import.meta.env.VITE_APP_BACKEND_URL,
   networks: [
     {
-      chainId: parseInt(import.meta.env.VITE_APP_CHAIN_ID) as ChainId,
-      providerUrl: import.meta.env.VITE_APP_PROVIDER_URL,
+      chainId: 1,
+      providerUrl: import.meta.env.VITE_APP_MAINNET_PROVIDER_URL,
     },
-  ],
-  ensDomains: [
     {
-      ensDomain: import.meta.env.VITE_APP_ENS_DOMAIN,
-      chainId: parseInt(import.meta.env.VITE_APP_CHAIN_ID) as ChainId,
+      chainId: 11155111,
+      providerUrl: import.meta.env.VITE_APP_SEPOLIA_PROVIDER_URL,
     },
   ],
   openOnWalletConnect: true,
   allowedEns: 'all',
 };
 
 export function App() {
+  console.log('rainbow', import.meta.env.VITE_APP_CHAIN_ID);
   const config = getDefaultConfig({
     appName: 'My RainbowKit App',
     projectId: 'YOUR_PROJECT_ID',
-    chains: import.meta.env.VITE_APP_CHAIN_ID === 1 ? [mainnet] : [sepolia],
+    chains: import.meta.env.VITE_APP_CHAIN_ID === '1' ? [mainnet] : [sepolia],
   });
 
   return (