feat(app2): save progress

app2/src/lib/components/Transfer/Assets.svelte

@@ -13,8 +13,6 @@
   function ensureTokensForChain() {
     const chainId = transfer.sourceChain?.universal_chain_id;
     if (!chainId) return;
-
-    console.log(tokensStore.getData(chainId));
     const tokenData = tokensStore.getData(chainId);
     if (Option.isNone(tokenData)) {
       tokensStore.fetchTokens(chainId);
@@ -102,13 +100,3 @@
     {(transfer.baseToken?.representations[0]?.name ?? transfer.url.asset) || "Select asset"}
   </button>
 </div>
-
-<style>
-  .space-y-1 > * + * {
-    margin-top: 0.25rem;
-  }
-
-  .space-y-2 > * + * {
-    margin-top: 0.5rem;
-  }
-</style>

app2/src/lib/components/Transfer/index.svelte

@@ -10,6 +10,10 @@
 
   const {transfer} = getTransfer()
 
+  $effect(() => {
+    console.log('ZKGM', transfer.ucs03address)
+  })
+
 </script>
 
 <Card class="max-w-md relative flex flex-col gap-2">

app2/src/lib/services/transfer-ucs03-evm/channel.ts

@@ -0,0 +1,76 @@
+import {Effect} from "effect";
+import {Channel, Channels} from "$lib/schema/channel.ts";
+import {ChannelValidationError} from "$lib/services/transfer-ucs03-evm/errors.ts";
+
+export const getChannelInfoEffect = (
+  source_chain_id: string,
+  destination_chain_id: string,
+  channels: typeof Channels.Type
+): Effect.Effect<typeof Channel.Type, ChannelValidationError> =>
+  Effect.gen(function* () {
+    const rawChannel = channels.find(
+      chan =>
+        chan.source_chain_id === source_chain_id && chan.destination_chain_id === destination_chain_id
+    )
+
+    if (
+      !rawChannel ||
+      rawChannel.source_connection_id === null ||
+      rawChannel.source_channel_id === null ||
+      !rawChannel.source_port_id ||
+      rawChannel.destination_connection_id === null ||
+      rawChannel.destination_channel_id === null ||
+      !rawChannel.destination_port_id
+    ) {
+      return yield* Effect.fail(new ChannelValidationError({
+        source_chain_id,
+        destination_chain_id,
+        cause: 'Missing required channel information'
+      }))
+    }
+
+    return yield* Effect.try({
+      try: () => {
+        let source_port_id = String(rawChannel.source_port_id)
+        if (source_port_id.length < 4) {
+          throw new Error('source_port_id is too short')
+        }
+        source_port_id = source_port_id.slice(2)
+
+        let destination_port_id = String(rawChannel.destination_port_id)
+        if (destination_port_id.length < 4) {
+          throw new Error('destination_port_id is too short')
+        }
+        destination_port_id = destination_port_id.slice(2)
+
+        return new Channel({
+          source_chain_id,
+          source_connection_id: rawChannel.source_connection_id!,
+          source_channel_id: rawChannel.source_channel_id!,
+          source_port_id,
+          destination_chain_id,
+          destination_connection_id: rawChannel.destination_connection_id!,
+          destination_channel_id: rawChannel.destination_channel_id!,
+          destination_port_id
+        })
+      },
+      catch: err => new ChannelValidationError({
+        source_chain_id,
+        destination_chain_id,
+        cause: err
+      })
+    })
+  })
+
+// Safe synchronous wrapper function (similar to getDerivedReceiverSafe in your example)
+export const getChannelInfoSafe = (
+  source_chain_id: string,
+  destination_chain_id: string,
+  channels: typeof Channels.Type
+): typeof Channel.Type | null => {
+  const result = Effect.runSync(
+    Effect.either(getChannelInfoEffect(source_chain_id, destination_chain_id, channels))
+  )
+
+  return result._tag === 'Right' ? result.right : null
+}

app2/src/lib/services/transfer-ucs03-evm/errors.ts

@@ -49,4 +49,10 @@ export class AmountParsingError extends Data.TaggedError("AmountParsingError")<{
   cause?: unknown | undefined
 }> {}
 
+export class ChannelValidationError extends Data.TaggedError("ChannelValidationError")<{
+  source_chain_id: string
+  destination_chain_id: string
+  cause?: unknown | undefined
+}> {}
+
 export type SubmitTransferError = WriteContractError | CreateWalletClientError

app2/src/lib/services/transfer-ucs03-evm/machine.ts

@@ -41,6 +41,7 @@ export async function nextState(
     SwitchChain: ({ state }) => {
       return SwitchChainState.$match(state, {
         InProgress: async () => {
+          //@ts-ignore
           const exit = await Effect.runPromiseExit(switchChain(params.sourceChain.id))
           return TransferSubmission.SwitchChain({ state: SwitchChainState.Complete({ exit }) })
         },

app2/src/routes/transfer/transfer.svelte.ts

@@ -11,9 +11,9 @@ import {
 } from "$lib/services/transfer-ucs03-evm";
 import {chains} from "$lib/stores/chains.svelte.ts";
 import {getChainFromWagmi} from "$lib/wallet/evm/index.ts";
-import type {Chain as ViemChain} from "viem";
-import {getChannelInfo} from "@unionlabs/client";
+import {type Chain as ViemChain, fromHex} from "viem";
 import {channels} from "$lib/stores/channels.svelte.ts";
+import {getChannelInfoSafe} from "$lib/services/transfer-ucs03-evm/channel.ts";
 
 export class Transfer {
   isValid = $state(true);
@@ -45,25 +45,36 @@ export class Transfer {
     return this.baseTokens.find((t: Token) => t.denom === this.url.asset) || null
   });
 
-  amount = $derived(this.url.amount);
   parsedAmount = $derived.by(() => {
     if (!this.baseToken) return null
-    return getParsedAmountSafe(this.amount.toString(), this.baseToken)
+    return getParsedAmountSafe(this.url.amount.toString(), this.baseToken)
   });
 
-  receiver = $derived(this.url.receiver);
   derivedReceiver = $derived.by(() => {
-    return getDerivedReceiverSafe(this.receiver);
+    return getDerivedReceiverSafe(this.url.receiver);
+  });
+
+  channel = $derived.by(() => {
+    return Option.isSome(channels.data) && this.sourceChain && this.destinationChain
+      ? getChannelInfoSafe(this.sourceChain.chain_id, this.destinationChain.chain_id, channels.data.value)
+      : null;
+  });
+
+  ucs03address = $derived.by(() => {
+    if (!this.sourceChain || !this.channel?.source_port_id) {
+      return null;
+    }
+    return this.sourceChain.rpc_type === "cosmos"
+      ? fromHex(`0x${this.channel.source_port_id}`, "string")
+      : `0x${this.channel.source_port_id}`;
   });
 
-  channel = $derived(getChannelInfo(this.sourceChain.chain_id, this.destinationChain.chain_id, channels.data))
-  ucs03address = $state()
   quoteToken = $state()
   wethQuoteToken = $state()
 
   args = $derived<Ucs03TransferEvm>({
     sourceChain: getChainFromWagmi(Number(this.sourceChain?.chain_id)) as ViemChain,
-    sourceChannelId: 9,
+    sourceChannelId: this.channel?.source_channel_id,
     ucs03address: "0x84f074c15513f15baea0fbed3ec42f0bd1fb3efa",
     baseToken: this.baseToken?.denom,
     baseAmount: this.parsedAmount,
@@ -86,7 +97,6 @@ export class Transfer {
   }
 }
 
-
 const STATE_KEY = Symbol("TRANSFER");
 
 export interface RawTransfer {