wip

apps/console/app/root.tsx

@@ -125,6 +125,15 @@ export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
         console.error('Could not retrieve profile image.', e)
       }
 
+      console.log({
+        INTERNAL_GOOGLE_ANALYTICS_TAG,
+        REMIX_DEV_SERVER_WS_PORT:
+          process.env.NODE_ENV === 'development'
+            ? +process.env.REMIX_DEV_SERVER_WS_PORT!
+            : undefined,
+        WALLET_CONNECT_PROJECT_ID,
+      })
+
       return json<LoaderData>({
         apps: reshapedApps,
         avatarUrl,

apps/console/app/routes/apps/$clientId/designer.beta.tsx

@@ -6,7 +6,7 @@ import {
   useLoaderData,
   useOutletContext,
 } from '@remix-run/react'
-import { ReactNode, lazy, useContext, useEffect, useRef, useState } from 'react'
+import { ReactNode, Suspense, lazy, useContext, useEffect, useRef, useState } from 'react'
 import { IconType } from 'react-icons'
 import { HiCog, HiOutlineCog, HiOutlineMail } from 'react-icons/hi'
 import { DocumentationBadge } from '~/components/DocumentationBadge'
@@ -1140,7 +1140,7 @@ export default () => {
   const [loading, setLoading] = useState<boolean>(false)
 
   return (
-    <>
+    <Suspense fallback={<Loader />}>
       {loading && <Loader />}
 
       <Form method="post">
@@ -1212,6 +1212,6 @@ export default () => {
           </Tab.Panels>
         </Tab.Group>
       </Form>
-    </>
+    </Suspense>
   )
 }

apps/console/app/web3/lazyAuth.tsx

@@ -1,4 +1,5 @@
 import { getDefaultConfig, ConnectKitProvider } from 'connectkit'
+import { Suspense } from 'react'
 import { useHydrated } from 'remix-utils'
 import { createConfig, WagmiConfig } from 'wagmi'
 
@@ -22,10 +23,12 @@ export function LazyAuth({
         })
     )
     return (
-        <WagmiConfig config={config}>
-            <ConnectKitProvider>
-                {children}
-            </ConnectKitProvider>
-        </WagmiConfig>
+        <Suspense fallback="">
+            <WagmiConfig config={config}>
+                <ConnectKitProvider>
+                    {children}
+                </ConnectKitProvider>
+            </WagmiConfig>
+        </Suspense>
     )
 }

apps/console/bindings.d.ts

@@ -15,4 +15,5 @@ declare global {
 
   const INTERNAL_CLOUDFLARE_ZONE_ID: string
   const TOKEN_CLOUDFLARE_API: string
+  const WALLET_CONNECT_PROJECT_ID: string
 }

apps/console/package.json

@@ -32,7 +32,7 @@
     "@remix-run/react": "1.14.0",
     "@tailwindcss/forms": "0.5.3",
     "bcryptjs": "2.4.3",
-    "connectkit": "1.2.0",
+    "connectkit": "1.4.0",
     "cross-env": "7.0.3",
     "ethers": "5.7.2",
     "flowbite": "1.6.5",
@@ -44,7 +44,8 @@
     "react-helmet": "6.1.0",
     "react-icons": "4.8.0",
     "tiny-invariant": "1.3.1",
-    "wagmi": "0.11.7"
+    "viem": "0.3.41",
+    "wagmi": "1.0.9"
   },
   "devDependencies": {
     "@babel/core": "7.20.2",

apps/console/wrangler.toml

@@ -36,6 +36,7 @@ STORAGE_NAMESPACE = "console"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-NHNH4KRWC3"
 PROFILE_APP_URL = "http://localhost:10003"
 COOKIE_DOMAIN = "localhost"
+WALLET_CONNECT_PROJECT_ID = "36efbf71d7586e254d72041a15a42078"
 
 # Site
 # -----------------------------------------------------------------------------
@@ -77,6 +78,7 @@ COOKIE_DOMAIN = "rollup.id"
 STORAGE_NAMESPACE = "console"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-NHNH4KRWC3"
 PROFILE_APP_URL = "https://my-dev.rollup.id"
+WALLET_CONNECT_PROJECT_ID = "249578b973e49826abb32d2ad263e2a3"
 
 # Environment: next
 # -----------------------------------------------------------------------------
@@ -107,6 +109,7 @@ COOKIE_DOMAIN = "rollup.id"
 STORAGE_NAMESPACE = "console"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-X7ZN16M4NB"
 PROFILE_APP_URL = "https://my-next.rollup.id"
+WALLET_CONNECT_PROJECT_ID = "7bce942e261433eb70c2a72d555dd61f"
 
 # Environment: current
 # -----------------------------------------------------------------------------
@@ -138,3 +141,4 @@ COOKIE_DOMAIN = "rollup.id"
 STORAGE_NAMESPACE = "console"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-675VJMWSRY"
 PROFILE_APP_URL = "https://my.rollup.id"
+WALLET_CONNECT_PROJECT_ID = "6f2ebc8aa6a1d5c4d4ac1e700294e35f"

apps/passport/app/root.tsx

@@ -113,6 +113,7 @@ export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
               ? process.env.REMIX_DEV_SERVER_WS_PORT
               : undefined,
           WALLET_CONNECT_PROJECT_ID: context.env.WALLET_CONNECT_PROJECT_ID,
+          APIKEY_ALCHEMY_PUBLIC: context.env.APIKEY_ALCHEMY_PUBLIC,
         },
       },
       {

apps/passport/app/routes/authenticate/$clientId/index.tsx

@@ -50,8 +50,6 @@ export const loader: LoaderFunction = getRollupReqFunctionErrorWrapper(
       clientId: params.clientId,
       displayKeys,
       authnQueryParams: new URL(request.url).searchParams.toString(),
-      APIKEY_ALCHEMY_PUBLIC: context.env.APIKEY_ALCHEMY_PUBLIC,
-      WALLET_CONNECT_PROJECT_ID: context.env.WALLET_CONNECT_PROJECT_ID,
     })
   }
 )

apps/passport/bindings.d.ts

@@ -18,6 +18,7 @@ declare global {
     CONSOLE_APP_URL: string
     PASSPORT_REDIRECT_URL: string
     APIKEY_ALCHEMY_PUBLIC: string
+    WALLET_CONNECT_PROJECT_ID: string
     REMIX_DEV_SERVER_WS_PORT: number
 
     INTERNAL_GOOGLE_ANALYTICS_TAG: string

apps/passport/package.json

@@ -30,7 +30,7 @@
     "@remix-run/cloudflare-workers": "1.14.0",
     "@remix-run/react": "1.14.0",
     "@tailwindcss/forms": "0.5.3",
-    "connectkit": "1.2.0",
+    "connectkit": "1.4.0",
     "csp-header": "5.1.0",
     "flowbite": "1.6.5",
     "flowbite-react": "0.4.3",
@@ -47,7 +47,8 @@
     "remix-auth-oauth2": "1.5.0",
     "remix-auth-twitter": "1.0.0",
     "remix-utils": "6.3.0",
-    "wagmi": "0.11.7"
+    "viem": "0.3.41",
+    "wagmi": "1.0.9"
   },
   "devDependencies": {
     "@babel/core": "^7.20.2",

apps/passport/wrangler.toml

@@ -38,6 +38,7 @@ INTERNAL_MICROSOFT_OAUTH_CALLBACK_URL = "http://localhost:10001/connect/microsof
 INTERNAL_APPLE_OAUTH_CALLBACK_URL = "http://localhost:10001/connect/apple/callback"
 INTERNAL_DISCORD_OAUTH_CALLBACK_URL = "http://localhost:10001/connect/discord/callback"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-NHNH4KRWC3"
+WALLET_CONNECT_PROJECT_ID = "36efbf71d7586e254d72041a15a42078"
 
 [env.dev]
 routes = [
@@ -65,6 +66,7 @@ INTERNAL_APPLE_OAUTH_CALLBACK_URL = "https://passport-dev.rollup.id/connect/appl
 INTERNAL_MICROSOFT_OAUTH_CALLBACK_URL = "https://passport-dev.rollup.id/connect/microsoft/callback"
 INTERNAL_DISCORD_OAUTH_CALLBACK_URL = "https://passport-dev.rollup.id/connect/discord/callback"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-NHNH4KRWC3"
+WALLET_CONNECT_PROJECT_ID = "249578b973e49826abb32d2ad263e2a3"
 
 [env.next]
 routes = [
@@ -91,6 +93,7 @@ INTERNAL_APPLE_OAUTH_CALLBACK_URL = "https://passport-next.rollup.id/connect/app
 INTERNAL_MICROSOFT_OAUTH_CALLBACK_URL = "https://passport-next.rollup.id/connect/microsoft/callback"
 INTERNAL_DISCORD_OAUTH_CALLBACK_URL = "https://passport-next.rollup.id/connect/discord/callback"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-X7ZN16M4NB"
+WALLET_CONNECT_PROJECT_ID = "7bce942e261433eb70c2a72d555dd61f"
 
 [env.next.build]
 command = "yarn build"
@@ -120,6 +123,7 @@ INTERNAL_APPLE_OAUTH_CALLBACK_URL = "https://passport.rollup.id/connect/apple/ca
 INTERNAL_MICROSOFT_OAUTH_CALLBACK_URL = "https://passport.rollup.id/connect/microsoft/callback"
 INTERNAL_DISCORD_OAUTH_CALLBACK_URL = "https://passport.rollup.id/connect/discord/callback"
 INTERNAL_GOOGLE_ANALYTICS_TAG = "G-675VJMWSRY"
+WALLET_CONNECT_PROJECT_ID = "6f2ebc8aa6a1d5c4d4ac1e700294e35f"
 
 [env.current.build]
 command = "yarn build"

apps/profile/package.json

@@ -57,7 +57,7 @@
     "remix-auth-oauth2": "1.5.0",
     "tw-elements": "1.0.0-alpha12",
     "urns": "0.6.0",
-    "wagmi": "0.10.8"
+    "wagmi": "1.0.9"
   },
   "devDependencies": {
     "@babel/core": "7.20.2",

packages/design-system/.storybook/main.js

@@ -50,6 +50,24 @@ module.exports = {
         Buffer: ['buffer', 'Buffer'],
       })
     )
+    config.resolve.fallback = {
+      crypto: require.resolve('crypto-browserify'),
+      stream: require.resolve('stream-browserify'),
+      buffer: require.resolve('buffer/'),
+      http: require.resolve('stream-http'),
+      https: require.resolve('https-browserify'),
+      os: require.resolve('os-browserify/browser'),
+      path: require.resolve('path-browserify'),
+      vm: require.resolve('vm-browserify'),
+      zlib: require.resolve('browserify-zlib'),
+      assert: require.resolve('assert/'),
+      _stream_transform: require.resolve("readable-stream/transform"),
+      fs: false,
+      net: false,
+      tls: false,
+      child_process: false,
+
+    }
 
     // Return the altered config
     return config

packages/design-system/src/atoms/buttons/connect-button/ConnectButton.stories.mdx

@@ -18,8 +18,8 @@ export const Template = (args) => <ConnectButton {...args} />
   <Story
     decorators={[
       (Story) => {
-        const client = createClient(
-          getDefaultClient({
+        const config = createConfig(
+          getDefaultConfig({
             appName: 'Rollup',
             walletConnectProjectId: "foo",
           })