Merge pull request #228 from cosmology-tech/injective-examples

use newest interchainjs for injective

examples/asset-list/package.json

@@ -53,4 +53,4 @@
     "typescript": "^5.1.6"
   },
   "packageManager": "[email protected]"
-}
+}

examples/authz/package.json

@@ -83,4 +83,4 @@
     "typescript": "^5.1.6"
   },
   "packageManager": "[email protected]"
-}
+}

examples/grpc-web-grpc-gateway/package.json

@@ -56,4 +56,4 @@
     "generate-lockfile": "0.0.12",
     "typescript": "^5.1.6"
   }
-}
+}

examples/ibc-transfer/package.json

@@ -53,4 +53,4 @@
     "typescript": "^5.1.6"
   },
   "packageManager": "[email protected]"
-}
+}

examples/injective-vue/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

examples/injective-vue/.vscode/extensions.json

@@ -0,0 +1,5 @@
+{
+  "recommendations": [
+    "Vue.volar"
+  ]
+}

examples/injective-vue/README.md

@@ -0,0 +1,140 @@
+# Introduction
+This example demonstrates the usage of Vue composables provided by [@interchain-kit/vue](https://github.com/cosmology-tech/interchain-kit/tree/main/packages/vue) and generated by [telescope](https://github.com/cosmology-tech/telescope).
+## Directory Structure
+```
+├── src/
+│   ├── codegen                     # containing vue composables generated by `telescope`
+│   ├── components/
+│   │   ├── asset-list/
+│   │   ├── authz/
+│   │   ├── provide-liquidity/
+│   │   ├── stake-tokens/
+│   │   └── voting/
+│   ├── composables/
+│   │   ├── asset-list/
+│   │   ├── authz/
+│   │   ├── common/
+│   │   ├── injective/
+│   │   ├── provide-liquidity/
+│   │   ├── stake-tokens/
+│   │   └── voting/
+│   ├── utils/
+│   │   ├── asset-list/
+│   │   ├── authz/
+│   │   ├── provide-liquidity/
+│   │   ├── stake-tokens/
+│   │   └── voting/
+│   ├── views/
+│   │   ├── asset-list.vue
+│   │   ├── authz.vue
+│   │   ├── index.vue
+│   │   └── voting.vue
+│   ├── router.ts
+│   ├── utils/
+│   ├── App.vue
+│   └── main.ts 
+```
+## Pages
+
+### Asset List
+- **Completion Status:** ✅ Completed  
+- **Functionalities:**  
+  - Wallet connect  
+  - Assets display  
+  - IBC transfer  
+- **Telescope generated `Vue Composables` Used:**
+```ts
+cosmos.bank.v1beta1.useBalance
+cosmos.bank.v1beta1.useAllBalances
+cosmos.staking.v1beta1.useDelegatorDelegations
+osmosis.gamm.v1beta1.usePools
+```
+- **`msgType`s are signAndBroadcasted:**
+```ts
+/ibc.applications.transfer.v1.MsgTransfer
+```
+
+### Auth
+- **Completion Status:** ✅ Completed  
+- **Functionalities:**  
+  - Vote permission granting and revoking
+  - Send permission granting and revoking
+  - Delegate permission granting and revoking
+  - Claim rewards granting and revoking
+- **Telescope generated `Vue Composables` Used:**
+```ts
+cosmos.authz.v1beta1.useGranterGrants
+cosmos.authz.v1beta1.useGranteeGrants
+cosmos.staking.v1beta1.useValidators
+```
+- **`msgType`s are signAndBroadcasted:**
+```ts
+/cosmos.authz.v1beta1.MsgRevoke
+/cosmos.authz.v1beta1.MsgGrant
+```
+
+### Voting
+- **Completion Status:** ✅ Completed  
+- **Functionalities:**  
+  - Proposals display
+  - Proposal voting
+- **Telescope generated `Vue Composables` Used:**
+```ts
+cosmos.gov.v1.useProposals
+cosmos.gov.v1.useParams
+cosmos.gov.v1.useProposals
+cosmos.staking.v1beta1.usePools
+```
+- **`msgType`s are signAndBroadcasted:**
+```ts
+/cosmos.gov.v1.MsgVote
+```
+
+### Injective
+- **Completion Status:** ✅ Completed 
+- **Functionalities:**  
+  - inj balance display
+  - inj tokens transfer
+- **Telescope generated `Vue Composables` Used:**
+```ts
+cosmos.bank.v1beta1.useBalance
+```
+- **`msgType`s are signAndBroadcasted:**
+```ts
+/cosmos.bank.v1beta1.MsgSend
+```
+### Stake tokens
+- **Completion Status:** ⏳ In Progress... 50% done.
+- **Functionalities:**  
+  - all validators display
+  - validators display for a specified address 
+  - claimable rewards display
+  - staked tokens display for a specified chain
+  - claim rewards
+  - manage validators
+- **Telescope generated `Vue Composables` Used:**
+```ts
+cosmos.mint.v1beta.useAnnualProvisions
+cosmos.distribution.v1beta1.useParams
+cosmos.distribution.v1beta1.useDelegationTotalRewards
+codegen.cosmos.staking.v1beta1.useDelegatorValidators
+cosmos.staking.v1beta1.useParams
+```
+- **`msgType`s are signAndBroadcasted:**
+```ts
+```
+
+### Provide Liquidity
+- **Completion Status:** ⏳ In Progress...
+
+### Swap tokens
+- **Completion Status:** ⏳ In Progress...
+
+### NFT
+- **Completion Status:** ⏳ In Progress...
+
+### Rollkit
+- **Completion Status:** ⏳ In Progress...
+
+### Grpc Web & Grpc Gateway
+- **Completion Status:** ⏳ In Progress...

examples/injective-vue/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Vue + TS</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

examples/injective-vue/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "injective-vue",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vue-tsc -b && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@chain-registry/v2": "^1.71.44",
+    "@chain-registry/v2-types": "^0.53.20",
+    "@cosmjs/amino": "^0.32.4",
+    "@cosmjs/stargate": "^0.32.4",
+    "@interchain-kit/core": "^0.0.1-beta.39",
+    "@interchain-kit/keplr-extension": "^0.0.1-beta.39",
+    "@interchain-kit/leap-extension": "^0.0.1-beta.39",
+    "@interchain-kit/vue": "^0.0.1-beta.38",
+    "@interchain-ui/vue": "^1.4.1",
+    "@interchainjs/cosmos": "1.6.1",
+    "@interchainjs/injective": "1.6.1",
+    "@tanstack/vue-query": "5.62.7",
+    "interchain-vue": "1.6.2",
+    "osmojs": "^16.15.0",
+    "vue": "^3.5.13",
+    "vue-router": "^4.5.0"
+  },
+  "devDependencies": {
+    "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "typescript": "~5.6.2",
+    "vite": "^6.0.0",
+    "vue-tsc": "^2.1.10"
+  }
+}

examples/injective-vue/src/App.vue

@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { ThemeProvider } from '@interchain-ui/vue'
+import { ChainProvider } from '@interchain-kit/vue'
+import { keplrWallet } from '@interchain-kit/keplr-extension';
+import { leapWallet } from '@interchain-kit/leap-extension';
+import { RouterView } from 'vue-router';
+import { chain as junoChain, assetList as junoAssetList } from "@chain-registry/v2/mainnet/juno";
+import { chain as osmosisChain, assetList as osmosisAssetList } from "@chain-registry/v2/mainnet/osmosis";
+import { chain as cosmoshubChain, assetList as cosmoshubAssetList } from "@chain-registry/v2/mainnet/cosmoshub";
+import { chain as stargazeChain, assetList as stargazeAssetList } from "@chain-registry/v2/mainnet/stargaze";
+import { chain as xplaChain, assetList as xplaAssetList} from "@chain-registry/v2/mainnet/xpla"
+import { chain as osmosisTestChain, assetList as osmosisTestAssetList } from "@chain-registry/v2/testnet/osmosistestnet"
+import { chain as injectiveChain, assetList as injectiveAssetList } from "@chain-registry/v2/mainnet/injective"
+</script>
+
+<template>
+  <ThemeProvider>
+    <ChainProvider 
+      :wallets="[keplrWallet, leapWallet]"
+      :chains="[osmosisChain, junoChain, cosmoshubChain, stargazeChain, xplaChain, osmosisTestChain, injectiveChain]"
+      :asset-lists="[osmosisAssetList, junoAssetList, cosmoshubAssetList, stargazeAssetList, xplaAssetList, osmosisTestAssetList, injectiveAssetList]" :signer-options="{}"
+      :endpoint-options="{}">
+      <router-view />
+    </ChainProvider>
+  </ThemeProvider>
+</template>
+
+<style scoped></style>