diff --git a/src/modules/[chain]/ibc/connStore.ts b/src/modules/[chain]/ibc/connStore.ts
index 6d6bdf42..ad8f6c36 100644
--- a/src/modules/[chain]/ibc/connStore.ts
+++ b/src/modules/[chain]/ibc/connStore.ts
@@ -1,9 +1,11 @@
-
 import { defineStore } from 'pinia';
 
-import {useBlockchain} from '@/stores'
+import { useBlockchain } from '@/stores';
 import ChainRegistryClient from '@ping-pub/chain-registry-client';
-import type { IBCPath, IBCInfo,  } from '@ping-pub/chain-registry-client/dist/types';
+import type {
+  IBCPath,
+  IBCInfo,
+} from '@ping-pub/chain-registry-client/dist/types';
 import type { Channel } from '@/types';
 import router from '@/router';
 
@@ -11,49 +13,67 @@ export const useIBCModule = defineStore('module-ibc', {
   state: () => {
     return {
       paths: [] as IBCPath[],
-      connectionId: "" as string,
+      connectionId: '' as string,
       registryConf: {} as IBCInfo,
     };
   },
   getters: {
     chain() {
-      return useBlockchain()
+      return useBlockchain();
     },
     commonIBCs(): any {
-      return this.paths.filter((x: IBCPath) => x.path.search(this.chain.current?.prettyName || this.chain.chainName) > -1)
+      return this.paths.filter(
+        (x: IBCPath) =>
+          x.path.search(
+            this.chain.current?.prettyName || this.chain.chainName
+          ) > -1
+      );
     },
     sourceField(): string {
-      return this.registryConf?.chain_1?.chain_name === this.chain.current?.prettyName || this.chain.chainName ? 'chain_1': 'chain_2'
+      return this.registryConf?.chain_1?.chain_name ===
+        this.chain.current?.prettyName || this.chain.chainName
+        ? 'chain_1'
+        : 'chain_2';
     },
-    destField() : string {
-      return this.registryConf?.chain_1?.chain_name === this.chain.current?.prettyName || this.chain.chainName ? 'chain_2': 'chain_1'
+    destField(): string {
+      return this.registryConf?.chain_1?.chain_name ===
+        this.chain.current?.prettyName || this.chain.chainName
+        ? 'chain_2'
+        : 'chain_1';
     },
     registryChannels(): any {
-      return this.registryConf.channels
-    }
+      console.log('registryChannels', this.registryConf);
+      return this.registryConf.channels;
+    },
   },
   actions: {
     load() {
       const client = new ChainRegistryClient();
-      client.fetchIBCPaths().then(res => {
-        this.paths = res
+      client.fetchIBCPaths().then((res) => {
+        this.paths = res;
       });
     },
     fetchConnection(path: string) {
       const client = new ChainRegistryClient();
-      client.fetchIBCPathInfo(path).then(res => {
-        const connId = res.chain_1.chain_name === this.chain.current?.prettyName || this.chain.chainName ?
-          res.chain_1.connection_id : res.chain_2.connection_id
-        this.registryConf = res
-        this.showConnection(connId)
-      })
+      client.fetchIBCPathInfo(path).then((res) => {
+        console.log('fetchIBCPathInfo', res);
+        const connId =
+          res.chain_1.chain_name === this.chain.current?.prettyName ||
+          this.chain.chainName
+            ? res.chain_1.connection_id
+            : res.chain_2.connection_id;
+        this.registryConf = res;
+        this.showConnection(connId);
+      });
     },
     showConnection(connId?: string | number) {
-      if(!connId) {
-        this.registryConf = {} as any
+      if (!connId) {
+        this.registryConf = {} as any;
       }
-      const path = `/${this.chain.chainName}/ibc/connection/${connId || `connection-${this.connectionId || 0}`}`
-      router.push(path)
-    }
+      const path = `/${this.chain.chainName}/ibc/connection/${
+        connId || `connection-${this.connectionId || 0}`
+      }`;
+      router.push(path);
+    },
   },
 });
diff --git a/src/modules/[chain]/ibc/connection/[connection_id].vue b/src/modules/[chain]/ibc/connection/[connection_id].vue
index 6dd97480..3bccf712 100644
--- a/src/modules/[chain]/ibc/connection/[connection_id].vue
+++ b/src/modules/[chain]/ibc/connection/[connection_id].vue
@@ -17,6 +17,11 @@ import { Icon } from '@iconify/vue';
 import type { ConnectionEnd } from 'cosmjs-types/ibc/core/connection/v1/connection';
 import type { IdentifiedClientState } from 'cosmjs-types/ibc/core/client/v1/client';
 import type { IdentifiedChannel } from 'cosmjs-types/ibc/core/channel/v1/channel';
+import {
+  ClientState as TendermintClientState,
+  ConsensusState as TendermintConsensusState,
+} from 'cosmjs-types/ibc/lightclients/tendermint/v1/tendermint';
+import { State } from 'cosmjs-types/ibc/core/channel/v1/channel';
 import type { TxSearchResponse } from '@cosmjs/tendermint-rpc';
 
 const props = defineProps(['chain', 'connection_id']);
@@ -25,7 +30,9 @@ const baseStore = useBaseStore();
 const format = useFormatter();
 const ibcStore = useIBCModule();
 const conn = ref({} as ConnectionEnd | undefined);
-const clientState = ref({} as IdentifiedClientState | undefined);
+const clientState = ref(
+  {} as (IdentifiedClientState & TendermintClientState) | undefined
+);
 const channels = ref([] as IdentifiedChannel[]);
 
 const connId = computed(() => {
@@ -46,7 +53,17 @@ onMounted(() => {
       conn.value = x.connection;
     });
     chainStore.rpc.getIBCConnectionsClientState(connId.value).then((x) => {
+      // @ts-ignore
       clientState.value = x.identifiedClientState;
+      if (x.identifiedClientState?.clientState) {
+        Object.assign(
+          clientState.value?.clientState!,
+          TendermintClientState.decode(
+            x.identifiedClientState?.clientState.value
+          )
+        );
+      }
+      console.log('getIBCConnectionsClientState', clientState.value);
     });
     chainStore.rpc.getIBCConnectionsChannels(connId.value).then((x) => {
       channels.value = x.channels;
@@ -146,9 +163,7 @@ function color(v: string) {
             </div>
           </div>
           <div class="mx-auto flex items-center">
-            <div
-              :class="{ 'text-success': conn?.state?.indexOf('_OPEN') > -1 }"
-            >
+            <div :class="{ 'text-success': conn?.state === State.STATE_OPEN }">
               <span class="text-lg rounded-full">&#x21cc;</span>
               <div class="text-c">
                 {{ conn?.state }}
@@ -159,7 +174,7 @@ function color(v: string) {
             <div
               class="order-first text-3xl font-semibold tracking-tight text-main mb-2"
             >
-              {{ clientState?.clientState?.value }}
+              {{ clientState?.clientState?.chainId }}
             </div>
             <div class="text-sm text-gray-500 dark:text-gray-400">
               {{ conn?.counterparty?.connectionId }} {{ clientState?.clientId }}
@@ -187,36 +202,56 @@ function color(v: string) {
             <tr>
               <td class="w-52">{{ $t('ibc.trust_level') }}:</td>
               <td>
-                {{ clientState?.clientState?.trust_level?.numerator }}/{{
-                  clientState.clientState?.trust_level?.denominator
+                {{ clientState?.clientState?.trustLevel.numerator }}/{{
+                  clientState.clientState?.trustLevel.denominator
                 }}
               </td>
             </tr>
             <tr>
               <td class="w-52">{{ $t('ibc.trusting_period') }}:</td>
               <td>
-                {{ formatSeconds(clientState.clientState?.trusting_period) }}
+                {{
+                  formatSeconds(
+                    clientState.clientState?.trustingPeriod.seconds.toString()
+                  )
+                }}
               </td>
             </tr>
             <tr>
               <td class="w-52">{{ $t('ibc.unbonding_period') }}:</td>
               <td>
-                {{ formatSeconds(clientState.clientState?.unbonding_period) }}
+                {{
+                  formatSeconds(
+                    clientState.clientState?.unbondingPeriod.seconds.toString()
+                  )
+                }}
               </td>
             </tr>
             <tr>
               <td class="w-52">{{ $t('ibc.max_clock_drift') }}:</td>
               <td>
-                {{ formatSeconds(clientState.clientState?.max_clock_drift) }}
+                {{
+                  formatSeconds(
+                    clientState.clientState?.maxClockDrift.seconds.toString()
+                  )
+                }}
               </td>
             </tr>
             <tr>
               <td class="w-52">{{ $t('ibc.frozen_height') }}:</td>
-              <td>{{ clientState.clientState?.frozen_height }}</td>
+              <td>
+                {{
+                  clientState.clientState?.frozenHeight.revisionHeight.toString()
+                }}
+              </td>
             </tr>
             <tr>
               <td class="w-52">{{ $t('ibc.latest_height') }}:</td>
-              <td>{{ clientState.clientState?.latest_height }}</td>
+              <td>
+                {{
+                  clientState.clientState?.latestHeight.revisionHeight.toString()
+                }}
+              </td>
             </tr>
           </tbody>
         </table>
@@ -232,7 +267,7 @@ function color(v: string) {
                 <div class="flex justify-between">
                   <span>{{ $t('ibc.allow_update_after_expiry') }}:</span>
                   <span>{{
-                    clientState.clientState?.allow_update_after_expiry
+                    clientState.clientState?.allowUpdateAfterExpiry
                   }}</span>
                 </div>
               </td>
@@ -242,7 +277,7 @@ function color(v: string) {
                 <div class="flex justify-between">
                   <span>{{ $t('ibc.allow_update_after_misbehaviour') }}: </span>
                   <span>{{
-                    clientState.clientState?.allow_update_after_misbehaviour
+                    clientState.clientState?.allowUpdateAfterMisbehaviour
                   }}</span>
                 </div>
               </td>
@@ -250,7 +285,7 @@ function color(v: string) {
             <tr>
               <td class="w-52">{{ $t('ibc.upgrade_path') }}:</td>
               <td class="text-right">
-                {{ clientState.clientState?.upgrade_path.join(', ') }}
+                {{ clientState.clientState?.upgradePath.join(', ') }}
               </td>
             </tr>
           </tbody>
@@ -392,10 +427,9 @@ function color(v: string) {
             <td>{{ resp.height }}</td>
             <td>
               <div class="text-xs truncate text-primary dark:invert">
-                <RouterLink
-                  :to="`/${chainStore.chainName}/tx/${resp.txhash}`"
-                  >{{ resp.txhash }}</RouterLink
-                >
+                <RouterLink :to="`/${chainStore.chainName}/tx/${resp.hash}`">{{
+                  resp.hash
+                }}</RouterLink>
               </div>
             </td>
             <td>