Merge branch 'main' into feat/lw-10017-specify-validity-interval-in-tx

.gitignore

@@ -21,4 +21,13 @@ dist-ssr
 *.ntvs*
 *.njsproj
 *.sln
-*.sw?
+*.sw?
+
+# Yarn 3 files
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

.nvmrc

@@ -0,0 +1 @@
+v20.12.2

.yarnrc

@@ -0,0 +1,5 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+yarn-path ".yarn/releases/yarn-1.22.22.cjs"

.yarnrc.yml

@@ -0,0 +1,7 @@
+compressionLevel: mixed
+
+enableGlobalCache: false
+
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.1.1.cjs

README.md

@@ -1,25 +1,60 @@
 # SDET dapp
 
-SDET dapp.
+SDET dapp for the purpose of testing the Cardano-JS-SDK connector API.
 
-## Linking @cardano-sdk/dapp-connector-client
+If you are trying to build or see how a transaction is built from an application that allows users to make transactions such as delegation or undelegation, or the sending of tokens or assets in the Cardano chain through the Cardano-JS-SDK, this repo should show an example of it.
+
+## Structure
+
+```
+/src
+  /components
+  /constants
+  /features
+  /pages
+  /state
+  /utils
+```
+
+## Development environment
+
+### Recommended yarn version
+
+Version 4.1.1
+
+### Recommended node version
+
+Version 18.12.1
+
+In order to currently work on with this repository, you have to link to your version of the `dapp-connector-client` in the [`@cardano-js-sdk`](https://github.com/input-output-hk/cardano-js-sdk) repo.
+So first you want to clone this repo in a folder that sits alongside the [`@cardano-js-sdk`](https://github.com/input-output-hk/cardano-js-sdk) and checkout the branch that contains the `dapp-connector-client` unpublished package, `feat/dapp-connector-client-poc`.
+
+Now you should follow the instructions in the _Linking @cardano-js-sdk/dapp-connector-client_.
+
+### Linking @cardano-sdk/dapp-connector-client
 
 Since this package isn't published yet, we need to link it from a local version of the package.
 
-1. Ensure a local branch is checked out of the `@cardano-sdk` package that contains the `dapp-connector-client` package
-2. Run `yarn link:./<path to dapp-connector-client>`
+1. Ensure a local branch is checked out of the [`@cardano-js-sdk`](https://github.com/input-output-hk/cardano-js-sdk) package that contains the `dapp-connector-client` package.
+2. Ensure the `dapp-connector-client` is built, `yarn && yarn build`.
+3. Run `yarn link ./<path to dapp-connector-client>`.
 
 This will symlink to a local version of the package.
 
+You should now be able to start developing, check the _Dev commands_ section for this.
+
 ## Dev commands
 
-Install:
+This is a yarn repository. So you need a local version of yarn.
+In order to set it up and develop, clone the repository and follow the commands in this section:
 
-```console
+Install the packages:
+
+```
 yarn
 ```
 
-Development:
+Launch the development environment:
 
 ```console
 yarn dev
@@ -30,3 +65,23 @@ Build:
 ```console
 yarn build
 ```
+
+## Browser set up
+
+### Mac
+
+In order to use this application for now we need to start the Browser with --disable-web-security --user-data-dir=tmp (make sure if you restart it that you do it from all closed windows, and keep no cache enabled)
+
+- start chrome as: `/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome —disable-web-security —user-data-dir=tmp` to open Chrome or : `open -na "Google Chrome" --args --disable-web-security --user-data-dir=tmp`
+
+### Windows
+
+In order to use this application for now we need to start the Browser with --disable-web-security --user-data-dir=tmp (make sure if you restart it that you do it from all closed windows, and keep no cache enabled)
+
+- start chrome as: `start chrome --disable-web-security --user-data-dir=tmp`
+
+### Linux
+
+In order to use this application for now we need to start the Browser with --disable-web-security --user-data-dir=tmp (make sure if you restart it that you do it from all closed windows, and keep no cache enabled)
+
+- start chrome as: `google-chrome --disable-web-security --user-data-dir=tmp`

package.json

@@ -5,24 +5,18 @@
 	"scripts": {
 		"dev": "vite",
 		"build": "vite build",
-		"preview": "vite preview"
+		"preview": "vite preview",
+		"compile": "yarn tsc && yarn check-errors",
+		"check-errors": "tsc --noEmit"
 	},
 	"dependencies": {
-		"@cardano-sdk/cardano-services": "*",
 		"@cardano-sdk/cardano-services-client": "*",
 		"@cardano-sdk/core": "*",
 		"@cardano-sdk/crypto": "*",
 		"@cardano-sdk/dapp-connector-client": "link:./../cardano-js-sdk/packages/dapp-connector-client",
-		"@cardano-sdk/hardware-ledger": "*",
-		"@cardano-sdk/hardware-trezor": "*",
-		"@cardano-sdk/input-selection": "*",
-		"@cardano-sdk/key-management": "*",
-		"@cardano-sdk/ogmios": "*",
-		"@cardano-sdk/tx-construction": "*",
 		"@cardano-sdk/util": "*",
 		"@cardano-sdk/util-dev": "*",
-		"@cardano-sdk/util-rxjs": "*",
-		"@cardano-sdk/wallet": "*",
+		"@cardano-sdk/wallet": "^0.36.0",
 		"buffer": "^6.0.3",
 		"copy-webpack-plugin": "^12.0.2",
 		"crypto-browserify": "^3.12.0",
@@ -32,7 +26,7 @@
 		"preact-render-to-string": "^6.4.1",
 		"preact-router": "^4.1.2",
 		"rollup-plugin-polyfill-node": "^0.13.0",
-		"rxjs": "^7.4.0"
+		"rxjs": "^7.5.7"
 	},
 	"devDependencies": {
 		"@babel/core": "^7.24.4",
@@ -61,5 +55,29 @@
 		"webpack": "^5.91.0",
 		"webpack-cli": "^5.1.4",
 		"webpack-dev-server": "^5.0.4"
+	},
+	"packageManager": "yarn@4.1.1",
+	"resolutions": {
+		"@cardano-sdk/cardano-services": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/cardano-services",
+		"@cardano-sdk/cardano-services-client": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/cardano-services-client",
+		"@cardano-sdk/core": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/core",
+		"@cardano-sdk/crypto": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/crypto",
+		"@cardano-sdk/dapp-connector": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/dapp-connector",
+		"@cardano-sdk/e2e": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/e2e",
+		"@cardano-sdk/golden-test-generator": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/golden-test-generator",
+		"@cardano-sdk/governance": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/governance",
+		"@cardano-sdk/hardware-ledger": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/hardware-ledger",
+		"@cardano-sdk/hardware-trezor": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/hardware-trezor",
+		"@cardano-sdk/input-selection": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/input-selection",
+		"@cardano-sdk/key-management": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/key-management",
+		"@cardano-sdk/ogmios": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/ogmios",
+		"@cardano-sdk/projection": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/projection",
+		"@cardano-sdk/projection-typeorm": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/projection-typeorm",
+		"@cardano-sdk/tx-construction": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/tx-construction",
+		"@cardano-sdk/util": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/util",
+		"@cardano-sdk/util-dev": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/util-dev",
+		"@cardano-sdk/util-rxjs": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/util-rxjs",
+		"@cardano-sdk/wallet": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/wallet",
+		"@cardano-sdk/web-extension": "portal:/Users/vanessa/Documents/Projects/cardano-js-sdk/packages/web-extension"
 	}
 }

src/components/connect/index.tsx

@@ -40,7 +40,7 @@ const connectLace = (dependencies: ConnectWalletDependencies) => {
 
 export const Connect = () => (
   <button
-    class="connect-button"
+    className="connect-button"
     onClick={() => connectLace(connectWalletDependencies)}
   >
     Connect wallet

src/components/dashboard/index.tsx

@@ -2,7 +2,7 @@ import "./dashboard.css";
 import { Logs, WalletActions } from "..";
 
 export const Dashboard = () => (
-  <div class="dashboard-container">
+  <div className="dashboard-container">
     <div>
       <WalletActions />
     </div>

src/components/wallet-actions/index.tsx

@@ -29,35 +29,78 @@ export const WalletActions = () => {
     return null;
   }
 
-  const handleClick = async ({
-    action,
-    title,
-  }: {
-    action: {
-      ({ connectedWallet }: { connectedWallet: ObservableWallet }): Promise<{
-        hash: string;
-        txId: string;
-      }>;
-      (arg0: { connectedWallet: ObservableWallet }):
-        | PromiseLike<{ hash: any; txId: any }>
-        | { hash: any; txId: any };
-    };
-    title: string;
-  }) => {
+  const handleSendCoins = async () => {
     if (!storeState.wallet) {
       return null;
     }
 
-    const { hash, txId } = await action({
+    const { hash, txId } = await sendCoins({
       connectedWallet: storeState.wallet,
     });
+
     connectorStore.log({
       hash,
-      title,
+      title: "Send coins",
       txId,
     });
   };
 
+  const handleSendSeveralAssets = async () => {
+    if (!storeState.wallet) {
+      return null;
+    }
+
+    const result = await sendSeveralAssets({
+      connectedWallet: storeState.wallet,
+    });
+    if (result) {
+      const { hash, txId } = result;
+      connectorStore.log({
+        hash,
+        title: "Send several assets",
+        txId,
+      });
+    }
+  };
+
+  const handleSingleDelegation = async () => {
+    if (!storeState.wallet) {
+      return null;
+    }
+
+    const result = await singleDelegation({
+      connectedWallet: storeState.wallet,
+    });
+
+    if (result) {
+      const { hash, txId } = result;
+      connectorStore.log({
+        hash,
+        title: "Single delegation",
+        txId,
+      });
+    }
+  };
+
+  const handleSingleUndelegation = async () => {
+    if (!storeState.wallet) {
+      return null;
+    }
+
+    const result = await singleUndelegation({
+      connectedWallet: storeState.wallet,
+    });
+
+    if (result) {
+      const { hash, txId } = result;
+      connectorStore.log({
+        hash,
+        title: "Single undelegation",
+        txId,
+      });
+    }
+  };
+
   const handleValidityInterval = async ({
     options,
     title,
@@ -81,42 +124,18 @@ export const WalletActions = () => {
   };
 
   return (
-    <div class="actions-container">
+    <div className="actions-container">
       <h3>Wallet actions</h3>
-      <button
-        class="wallet-button"
-        onClick={() => handleClick({ action: sendCoins, title: "Send coins" })}
-      >
+      <button className="wallet-button" onClick={handleSendCoins}>
         Send coins
       </button>
-      <button
-        class="wallet-button"
-        onClick={() =>
-          handleClick({
-            action: sendSeveralAssets,
-            title: "Send several assets",
-          })
-        }
-      >
+      <button className="wallet-button" onClick={handleSendSeveralAssets}>
         Send several assets
       </button>
-      <button
-        class="wallet-button"
-        onClick={() =>
-          handleClick({ action: singleDelegation, title: "Single delegation" })
-        }
-      >
+      <button className="wallet-button" onClick={handleSingleDelegation}>
         Single delegation
       </button>
-      <button
-        class="wallet-button"
-        onClick={() =>
-          handleClick({
-            action: singleUndelegation,
-            title: "Single undelegation",
-          })
-        }
-      >
+      <button className="wallet-button" onClick={handleSingleUndelegation}>
         Single undelegation
       </button>
       <button

src/components/wallet-logs/index.tsx

@@ -25,19 +25,19 @@ export const Logs = () => {
     storeState.addresses?.map((a) => <p>{a.address}</p>);
 
   return (
-    <div class="logs-container">
+    <div className="logs-container">
       <h3>Logs</h3>
       {storeState.addresses && storeState.balance ? (
-        <div class="logs-container-summary">
+        <div className="logs-container-summary">
           <h4>Balance: </h4>
           <p> {storeState?.balance?.coins / 1_000_000n} tADA</p>
           <h4>Addresses: </h4> {getAddresses()}
         </div>
       ) : (
-        <p class="logs-container-summary">Loading wallet details</p>
+        <p className="logs-container-summary">Loading wallet details</p>
       )}
 
-      <div class="logs-container-summary">
+      <div className="logs-container-summary">
         {storeState.log.map((entry) => (
           <>
             <h4>{entry.title}</h4>