UI improvements & fix

.papi/descriptors/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.1.0-autogenerated.13566815344429969239",
+  "version": "0.1.0-autogenerated.1192781978334692013",
   "name": "@polkadot-api/descriptors",
   "files": [
     "dist"

.papi/polkadot-api.json

@@ -30,25 +30,44 @@
       "wsUrl": "wss://polkadot-asset-hub-rpc.polkadot.io",
       "metadata": ".papi/metadata/dotAh.scale",
       "genesis": "0x68d56f15f85d3136970ec16946040bc1752654e906147f7e43e9d539d7c3de2f",
-      "codeHash": "0x6e20bc52aaaafd1de82ba7d2a3c0fa39193787e240b93608489cf72a4c46a584"
+      "codeHash": "0x8cada8f706ffc7c9bd0c31985ec4f34520914778edefaa94b624bc6adea48a1c"
     },
     "ksmAh": {
-      "wsUrl": "wss://kusama-asset-hub-rpc.polkadot.io",
+      "wsUrl": "ws://localhost:8000",
       "metadata": ".papi/metadata/ksmAh.scale",
       "genesis": "0x48239ef607d7928874027a43a67689209727dfb3d3dc5e5b03a39bdc2eda771a",
-      "codeHash": "0x8356dd03a2a5521b9339ce0c6b2a56d3edf83f0ca7262e9edabb695df770a0f6"
+      "codeHash": "0xbe293b003ee8173f17e33a8ef2eb2460a2057b9bfa35090261c62eb4072a5a63"
     },
     "pas": {
       "chain": "paseo",
       "metadata": ".papi/metadata/pas.scale",
       "genesis": "0x77afd6190f1554ad45fd0d31aee62aacc33c6db0ea801129acb813f913e0764f",
-      "codeHash": "0xcc4b027a0dbb5e0f389dd8418c41012d618290a22f84af8411c8fd20b2738304"
+      "codeHash": "0x96f6cb4f577e7ecb8c9e648f77724c0c850fe366854f99a29c79275895b4c636"
     },
     "pasAh": {
       "chain": "paseo_asset_hub",
       "metadata": ".papi/metadata/pasAh.scale",
       "genesis": "0xd6eec26135305a8ad257a20d003357284c8aa03d0bdb2b357ab0a22371e11ef2",
-      "codeHash": "0xb7f52ff9b4fb5124568a5b8cbfcebba2bc9318bcb5916b69457c10bc6a2d0ac5"
+      "codeHash": "0x6b99330eb07c2dfd4510609ae8c49d9a2732f9bef8b9c0da544828f4e1a34942"
+    },
+    "ksmEnc": {
+      "chain": "ksmcc3_encointer",
+      "wsUrl": "wss://kusama.api.encointer.org",
+      "metadata": ".papi/metadata/ksmEnc.scale",
+      "genesis": "0x7dd99936c1e9e6d1ce7d90eb6f33bea8393b4bf87677d675aa63c9cb3e8c5b5b",
+      "codeHash": "0x6a1faad9888624da0ec673c6e992312bf6f7bf40ef95d796ee072a3367f87021"
+    },
+    "itp": {
+      "wsUrl": "wss://polkadot.api.integritee.network",
+      "metadata": ".papi/metadata/itp.scale",
+      "genesis": "0xe13e7af377c64e83f95e0d70d5e5c3c01d697a84538776c5b9bbe0e7d7b6034c",
+      "codeHash": "0xb0af24fed5f16dae6fc97645760ca4371a558b4bccc6b97e85acfea266c919ea"
+    },
+    "itk": {
+      "wsUrl": "wss://kusama.api.integritee.network",
+      "metadata": ".papi/metadata/itk.scale",
+      "genesis": "0xcdedc8eadbfa209d3f207bba541e57c3c58a667b05a2e1d1e86353c9000758da",
+      "codeHash": "0xa2a464ba172642998c46f063260bdab6aeeca2fcb266467494aa948f875f9cae"
     },
     "passet": {
       "wsUrl": "wss://testnet-passet-hub.polkadot.io",

README.md

@@ -1,27 +1,6 @@
-# Polkadot-API with React Teleporter: Proof of Concept
+# TEER CrossChain Tool
 
-This project is a basic proof of concept demonstrating how to use the Polkadot API with React and
-the light-client (smoldot) to create a multi-chain decentralized application. The DApp showcases the
-ability to teleport (or bridge) assets between different chains.
-
-### Important Notes
-
-- **Not a Best-Practices Example**: This project is not intended to serve as an example of "best practices" for
-using PAPI. Instead, it’s an illustration of what can be achieved with the API in a short period of time.
-
-- **Development Context**: This project was developed over a weekend, shortly after the Polkadot <-> Kusama
-bridge became operational. At that time, there were no user-friendly interfaces available for testing the bridge,
-so this project aimed to fill that gap.
-
-### Missing Features
-
-- **XCM Fee Calculation**: The current version of this project lacks proper XCM fee calculation. This feature
-will be added in the coming weeks.
-
-### Future Improvements
-
-We plan to continuously improve this project, gradually turning it into a useful starting template for React
-developers interested in working with the Polkadot ecosystem.
+Simple helper to transfer TEER accross chains and consensus systems
 
 ## Get started
 
@@ -48,3 +27,37 @@ pnpm build
 
 pnpm preview
 ```
+
+## Chopsticks Testing
+
+Beware that chopsticks does not yet emulate the bridge! Therefore, all attempts to bridge will fail (the extrinsic will succeed, but the funds will never arrive on the other side). Run zombienet if you need to test bridging behavior.
+
+prepare chopsticks
+```
+git clone https://github.com/brenzi/chopsticks.git
+cd chopsticks
+git checkout ab/xcm-v5-debug
+# get dev runtimes
+wget https://pub-84166bba27804f48a67cf8cc4f3cd0a6.r2.dev/integritee_kusama_runtime-562-dev-sudo.compact.compressed.wasm
+wget https://pub-84166bba27804f48a67cf8cc4f3cd0a6.r2.dev/integritee_polkadot_runtime-562-dev.compact.compressed.wasm
+wget https://pub-84166bba27804f48a67cf8cc4f3cd0a6.r2.dev/asset_hub_kusama_runtime_1.7.1_debug.compact.compressed.wasm
+wget https://pub-84166bba27804f48a67cf8cc4f3cd0a6.r2.dev/asset_hub_polkadot_runtime_1.7.1_debug.compact.compressed.wasm
+```
+run chopsticks in two terminals. call the kusama one first:
+```
+# first terminal, should listen on ports 8000 and 8001
+npx @acala-network/chopsticks@latest xcm --p=./configs/kusama-asset-hub.yml --p=./configs/integritee-kusama.yml
+# other terminal, should listen on ports 8002 and 8003
+npx @acala-network/chopsticks@latest xcm --p=./configs/polkadot-asset-hub.yml --p=./configs/integritee-polkadot.yml
+```
+
+then you can point your browser to
+
+* Integritee Network (Kusama) https://polkadot.js.org/apps/?rpc=ws%3A%2F%2F127.0.0.1%3A8001#
+* Integritee Network (Polkadot) https://polkadot.js.org/apps/?rpc=ws%3A%2F%2F127.0.0.1%3A8003#
+* Asset Hub Kusama https://polkadot.js.org/apps/?rpc=ws%3A%2F%2F127.0.0.1%3A8000#
+* Asset Hub Polkadot https://polkadot.js.org/apps/?rpc=ws%3A%2F%2F127.0.0.1%3A8002#
+
+Alice is now the watchdog account and you'll need to call `porteer.watchdogHeartbeat`
+* https://polkadot.js.org/apps/?rpc=ws%3A%2F%2F127.0.0.1%3A8001#/extrinsics/decode/0x3804
+* https://polkadot.js.org/apps/?rpc=ws%3A%2F%2F127.0.0.1%3A8003#/extrinsics/decode/0x3804

index.html

@@ -5,7 +5,7 @@
   <meta charset="UTF-8" />
   <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Polkadot-API Teleporter</title>
+  <title>TEER CrossChain Tool</title>
 </head>
 
 <body>

package.json

@@ -12,17 +12,21 @@
   },
   "dependencies": {
     "@polkadot-api/descriptors": "file:.papi/descriptors",
+    "@polkadot-api/substrate-bindings": "^0.16.2",
     "@radix-ui/react-dialog": "^1.1.14",
     "@radix-ui/react-label": "^2.1.7",
     "@radix-ui/react-select": "^2.2.5",
     "@radix-ui/react-slot": "^1.2.3",
     "@radix-ui/react-tabs": "^1.1.12",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "@vueuse/core": "^13.9.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^0.525.0",
-    "polkadot-api": "^1.15.0",
+    "polkadot-api": "^1.17.1",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
+    "react-router-dom": "^7.9.1",
     "rxjs": "^7.8.2",
     "tailwind-merge": "^3.3.1",
     "tailwindcss-animate": "^1.0.7"