Remove connex wording (#123)

* chore: make basic react app * fix: unused import * chore: adding logging and make options more consistent * chore: refactor packages to remove usage of 'connex' * chore: add coverage
vechain · Nov 30, 2023 · b984755 · b984755
1 parent d09c37b
commit b984755
Show file tree

Hide file tree

Showing 44 changed files with 549 additions and 20,068 deletions.
diff --git a/apps/sample-angular-app/package-lock.json b/apps/sample-angular-app/package-lock.json
diff --git a/apps/sample-angular-app/package.json b/apps/sample-angular-app/package.json
@@ -5,8 +5,10 @@
     "scripts": {
         "add-page": "ng g m pages/page-name --routing && ng g component pages/page-name --skip-tests",
         "build": "ng build --configuration development --base-href '/vechain-dapp-kit/angular/'",
+        "clean": "rm -rf dist .turbo .angular",
         "dev": "ng serve",
         "lint": "eslint src --ext .js,.jsx,.ts,.tsx",
+        "purge": "yarn clean; rm -rf node_modules",
         "watch": "ng build --watch --configuration development"
     },
     "dependencies": {
@@ -24,6 +26,7 @@
         "@ngx-translate/core": "^15.0.0",
         "@ngx-translate/http-loader": "^8.0.0",
         "@popperjs/core": "^2.11.8",
+        "@vechainfoundation/dapp-kit": "*",
         "@vechainfoundation/dapp-kit-ui": "*",
         "angular-svg-icon": "^16.0.0",
         "axios": "^1.4.0",

diff --git a/apps/sample-angular-app/src/main.ts b/apps/sample-angular-app/src/main.ts
@@ -1,13 +1,17 @@
-import { DAppKit } from '@vechainfoundation/dapp-kit-ui';
+import { DAppKitUI } from '@vechainfoundation/dapp-kit-ui';
 import { bootstrapApplication } from '@angular/platform-browser';
+import type {
+    DAppKitOptions,
+    WalletConnectOptions,
+} from '@vechainfoundation/dapp-kit';
 import { AppComponent } from './app/app.component';
 
 bootstrapApplication(AppComponent, {
     providers: [],
     // eslint-disable-next-line no-console
 }).catch((err) => console.error(err));
 
-const walletConnectOptions = {
+const walletConnectOptions: WalletConnectOptions = {
     projectId: 'a0b855ceaf109dbc8426479a4c3d38d8',
     metadata: {
         name: 'Sample VeChain dApp',
@@ -17,12 +21,11 @@ const walletConnectOptions = {
     },
 };
 
-const vechainWalletKitOptions = {
+const vechainWalletKitOptions: DAppKitOptions = {
     nodeUrl: 'https://testnet.vechain.org/',
-    network: 'test',
+    genesis: 'test',
     walletConnectOptions,
-    useWalletKitModal: true,
     usePersistence: true,
 };
 
-DAppKit.configure(vechainWalletKitOptions);
+DAppKitUI.configure(vechainWalletKitOptions);
diff --git a/apps/sample-angular-app/tsconfig.json b/apps/sample-angular-app/tsconfig.json
@@ -23,6 +23,7 @@
         "lib": ["es2020", "dom", "ES2021.String"],
         "paths": {
             "crypto": ["../../node_modules/crypto-browserify"],
+            "buffer": ["../../node_modules/buffer"],
             "stream": ["../../node_modules/stream-browserify"],
             "assert": ["../../node_modules/assert"],
             "http": ["../../node_modules/stream-http"],

diff --git a/apps/sample-next-app/package.json b/apps/sample-next-app/package.json
@@ -3,7 +3,9 @@
     "version": "0.1.0",
     "private": true,
     "scripts": {
+        "clean": "rm -rf .next dist .turbo",
         "dev": "next dev",
+        "purge": "yarn clean; rm -rf node_modules",
         "start": "next start"
     },
     "dependencies": {

diff --git a/apps/sample-next-app/src/app/pages/homepage.tsx b/apps/sample-next-app/src/app/pages/homepage.tsx
@@ -1,16 +1,8 @@
 import {
     ConnectWalletButtonWithModal,
-    ConnexProvider,
-    useWallet,
+    DAppKitProvider,
 } from '@vechainfoundation/dapp-kit-react';
-import type { Options } from '@vechain/connex';
 import type { WalletConnectOptions } from '@vechainfoundation/dapp-kit';
-import { useEffect } from 'react';
-
-const nodeOptions: Omit<Options, 'signer'> = {
-    node: 'https://testnet.vechain.org/',
-    network: 'test',
-};
 
 const walletConnectOptions: WalletConnectOptions = {
     projectId: 'a0b855ceaf109dbc8426479a4c3d38d8',
@@ -26,31 +18,17 @@ const walletConnectOptions: WalletConnectOptions = {
     },
 };
 
-// eslint-disable-next-line func-style
-function ConnectWallet() {
-    const { account } = useWallet();
-
-    useEffect(() => {
-        if (account) {
-            // eslint-disable-next-line no-console
-            console.log('account', account);
-        }
-    }, [account]);
-
-    return <ConnectWalletButtonWithModal />;
-}
-
 // eslint-disable-next-line func-style
 function HomePage() {
     return (
-        <ConnexProvider
-            key="connex"
-            nodeOptions={nodeOptions}
-            persistState
+        <DAppKitProvider
+            genesis="test"
+            nodeUrl="https://testnet.vechain.org/"
+            usePersistence
             walletConnectOptions={walletConnectOptions}
         >
-            <ConnectWallet />
-        </ConnexProvider>
+            <ConnectWalletButtonWithModal />;
+        </DAppKitProvider>
     );
 }
 

diff --git a/apps/sample-react-app/package.json b/apps/sample-react-app/package.json
@@ -5,9 +5,11 @@
     "type": "module",
     "scripts": {
         "build": "tsc && vite build",
+        "clean": "rm -rf dist .turbo",
         "dev": "vite",
         "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-        "preview": "vite preview"
+        "preview": "vite preview",
+        "purge": "yarn clean; rm -rf node_modules"
     },
     "dependencies": {
         "@vechainfoundation/dapp-kit": "*",

diff --git a/apps/sample-react-app/src/main.tsx b/apps/sample-react-app/src/main.tsx
@@ -2,14 +2,9 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App.tsx';
 import './index.css';
-import type { Options } from '@vechain/connex';
 import type { WalletConnectOptions } from '@vechainfoundation/dapp-kit';
-import { ConnexProvider } from '@vechainfoundation/dapp-kit-react';
-
-const nodeOptions: Omit<Options, 'signer'> = {
-    node: 'https://testnet.vechain.org/',
-    network: 'test',
-};
+import '@vechainfoundation/dapp-kit-ui';
+import { DAppKitProvider } from '@vechainfoundation/dapp-kit-react';
 
 const walletConnectOptions: WalletConnectOptions = {
     projectId: 'a0b855ceaf109dbc8426479a4c3d38d8',
@@ -23,12 +18,14 @@ const walletConnectOptions: WalletConnectOptions = {
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
     <React.StrictMode>
-        <ConnexProvider
-            nodeOptions={nodeOptions}
-            persistState={true}
+        <DAppKitProvider
+            nodeUrl={'https://testnet.vechain.org/'}
+            genesis={'test'}
+            usePersistence
             walletConnectOptions={walletConnectOptions}
+            logLevel="DEBUG"
         >
             <App />
-        </ConnexProvider>
+        </DAppKitProvider>
     </React.StrictMode>,
 );
diff --git a/apps/sample-svelte-app/package.json b/apps/sample-svelte-app/package.json
@@ -5,8 +5,10 @@
     "type": "module",
     "scripts": {
         "build": "vite build",
+        "clean": "rm -rf .svelte-kit dist .turbo",
         "dev": "vite dev",
-        "lint": "eslint src --ext .js,.jsx,.ts,.tsx"
+        "lint": "eslint src --ext .js,.jsx,.ts,.tsx",
+        "purge": "yarn clean; rm -rf node_modules"
     },
     "dependencies": {
         "@vechainfoundation/dapp-kit-ui": "*"

diff --git a/apps/sample-svelte-app/src/lib/index.ts b/apps/sample-svelte-app/src/lib/index.ts
@@ -1,6 +1,10 @@
-import { DAppKit } from '@vechainfoundation/dapp-kit-ui';
+import { DAppKitUI } from '@vechainfoundation/dapp-kit-ui';
+import type {
+    DAppKitOptions,
+    WalletConnectOptions,
+} from '@vechainfoundation/dapp-kit';
 
-const walletConnectOptions = {
+const walletConnectOptions: WalletConnectOptions = {
     projectId: 'a0b855ceaf109dbc8426479a4c3d38d8',
     metadata: {
         name: 'Sample VeChain dApp',
@@ -10,12 +14,11 @@ const walletConnectOptions = {
     },
 };
 
-const vechainWalletKitOptions = {
+const vechainWalletKitOptions: DAppKitOptions = {
     nodeUrl: 'https://testnet.vechain.org/',
-    network: 'test',
+    genesis: 'test',
     walletConnectOptions,
-    useWalletKitModal: true,
     usePersistence: true,
 };
 
-DAppKit.configure(vechainWalletKitOptions);
+DAppKitUI.configure(vechainWalletKitOptions);
diff --git a/apps/sample-vanilla-app/index.js b/apps/sample-vanilla-app/index.js
@@ -1,6 +1,6 @@
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable no-undef */
-import { DAppKit } from '@vechainfoundation/dapp-kit-ui';
+import { DAppKitUI } from '@vechainfoundation/dapp-kit-ui';
 
 const walletConnectOptions = {
     projectId: 'a0b855ceaf109dbc8426479a4c3d38d8',
@@ -13,14 +13,13 @@ const walletConnectOptions = {
 };
 
 const vechainWalletKitOptions = {
-    node: 'https://testnet.vechain.org/',
-    network: 'test',
+    nodeUrl: 'https://testnet.vechain.org/',
+    genesis: 'test',
     walletConnectOptions,
-    useWalletKitModal: true,
     usePersistence: true,
 };
 
-const connex = DAppKit.configure(vechainWalletKitOptions);
+const dappKit = DAppKitUI.configure(vechainWalletKitOptions);
 
 // eslint-disable-next-line no-console
-console.log(`Connex configured`, connex.thor.genesis.id);
+console.log(`Connex configured`, dappKit.thor.genesis.id);
diff --git a/apps/sample-vanilla-app/package.json b/apps/sample-vanilla-app/package.json
@@ -7,7 +7,7 @@
     "type": "module",
     "scripts": {
         "build": "parcel build index.html --public-url /vechain-dapp-kit/vanilla",
-        "clean": "rm -rf dist",
+        "clean": "rm -rf dist .turbo",
         "dev": "parcel index.html --open --no-cache --port 3002",
         "purge": "yarn clean && rm -rf node_modules",
         "test": "echo \"Error: no test specified\" && exit 1"

diff --git a/apps/sample-vue-app/src/connex/ConnexProvider.vue b/apps/sample-vue-app/src/connex/ConnexProvider.vue
@@ -12,7 +12,7 @@ import {
     WalletStateSymbol,
 } from '@/connex/keys';
 import { WalletActions, WalletState } from '@/connex/types';
-import { DAppKit } from '@vechainfoundation/dapp-kit-ui';
+import { DAppKitUI } from '@vechainfoundation/dapp-kit-ui';
 
 const initWallets = (hasWcOptions: boolean) => {
     const wallets: WalletSource[] = ['sync2'];
@@ -50,10 +50,9 @@ export default defineComponent({
             account: null,
         });
 
-        const connex = DAppKit.configure({
+        const connex = DAppKitUI.configure({
             nodeUrl: 'https://mainnet.vechain.org/',
             walletConnectOptions,
-            useWalletKitModal: true,
             usePersistence: true,
         });
 

diff --git a/packages/dapp-kit-react/README.md b/packages/dapp-kit-react/README.md
@@ -51,25 +51,25 @@ const walletConnectOptions: WalletConnectOptions = {
 -   Initialise the `ConnexVendor`
 
 ```typescript jsx
-import { ConnexProvider } from '@vechainfoundation/dapp-kit-react';
+import { DAppKitProvider } from '@vechainfoundation/dapp-kit-react';
 
 export const App = (): JSX.Element => {
     return (
         <>
-            <ConnexProvider
+            <DAppKitProvider
                 key="connex"
                 nodeOptions={nodeOptions}
                 persistState={false} // Optional - default: false - If true, account and source will be persisted in local storage
                 walletConnectOptions={walletConnectOptions}
             >
                 <YourApp />
-            </ConnexProvider>
+            </DAppKitProvider>
         </>
     );
 };
 ```
 
--   Use the hooks provided by the `ConnexProvider`
+-   Use the hooks provided by the `DAppKitProvider`
 
 ```typescript jsx
 import { useWallet, useConnex } from '@vechainfoundation/dapp-kit-react';

diff --git a/packages/dapp-kit-react/src/Components/ConnectWalletModal/ConnectWalletModal.tsx b/packages/dapp-kit-react/src/Components/ConnectWalletModal/ConnectWalletModal.tsx
@@ -2,8 +2,8 @@ import React, { useCallback, useMemo } from 'react';
 import { createComponent } from '@lit/react';
 import type { SourceInfo } from '@vechainfoundation/dapp-kit-ui';
 import { ConnectModal } from '@vechainfoundation/dapp-kit-ui';
-import type { ConnectResponse } from '@vechainfoundation/dapp-kit/src';
-import { useWallet } from '../../ConnexProvider';
+import type { ConnectResponse } from '@vechainfoundation/dapp-kit';
+import { useWallet } from '../../DAppKitProvider';
 
 const createButtonWithModal = () =>
     createComponent({

diff --git a/packages/dapp-kit-react/src/Components/SelectWalletModal/SelectWalletModal.tsx b/packages/dapp-kit-react/src/Components/SelectWalletModal/SelectWalletModal.tsx
@@ -2,8 +2,8 @@ import React, { useCallback, useMemo } from 'react';
 import { createComponent } from '@lit/react';
 import type { SourceInfo } from '@vechainfoundation/dapp-kit-ui';
 import { ConnectModal } from '@vechainfoundation/dapp-kit-ui';
-import type { WalletSource } from '@vechainfoundation/dapp-kit/src';
-import { useWallet } from '../../ConnexProvider';
+import type { WalletSource } from '@vechainfoundation/dapp-kit';
+import { useWallet } from '../../DAppKitProvider';
 
 const createButtonWithModal = () =>
     createComponent({