feat(app): add packet hash intralinks

app2/src/lib/components/model/PacketComponent.svelte

@@ -18,7 +18,8 @@ import * as AppRuntime from "$lib/runtime"
 import * as Ucs03 from "@unionlabs/sdk/Ucs03"
 import * as S from "effect/Schema"
 import { pipe } from "effect/Function"
-    import { getOrUndefined } from "effect/Option";
+import { getOrUndefined } from "effect/Option";
+import A from "../ui/A.svelte";
 
 const sourceChain = $derived(
   Option.flatMap(packetDetails.data, data =>
@@ -42,7 +43,12 @@ const destinationChain = $derived(
     <div class="grid grid-cols-1 md:grid-cols-2 gap-4 p-4">
       <div>
         <Label>Packet Hash</Label>
-        <div class="text-sm font-mono break-all">{packetDetails.data.value.packet_hash}</div>
+        <div class="text-sm font-mono break-all">
+          <A
+            external={false}
+            href={`/explorer/packets/${packetDetails.data.value.packet_hash}`}
+          >{packetDetails.data.value.packet_hash}</A>
+        </div>
       </div>
       <div>
         <Label>Channel Version</Label>

app2/src/routes/explorer/dust/[packet_hash]/+page.svelte

@@ -1,17 +1,18 @@
 <script lang="ts">
 import ChainComponent from "$lib/components/model/ChainComponent.svelte"
 import ErrorComponent from "$lib/components/model/ErrorComponent.svelte"
-import JsonPreview from "$lib/components/ui/JsonPreview.svelte"
+import TokenComponent from "$lib/components/model/TokenComponent.svelte"
+import A from "$lib/components/ui/A.svelte"
 import Card from "$lib/components/ui/Card.svelte"
+import JsonPreview from "$lib/components/ui/JsonPreview.svelte"
 import Label from "$lib/components/ui/Label.svelte"
 import Sections from "$lib/components/ui/Sections.svelte"
-import TokenComponent from "$lib/components/model/TokenComponent.svelte"
+import * as AppRuntime from "$lib/runtime"
 import { Indexer } from "@unionlabs/sdk"
 import { TokenRawAmount } from "@unionlabs/sdk/schema"
 import { ConfigProvider, Effect, Layer, pipe } from "effect"
 import { graphql } from "gql.tada"
 import type { PageData } from "./$types"
-import * as AppRuntime from "$lib/runtime"
 
 interface Props {
   data: PageData
@@ -139,7 +140,10 @@ const dustWithdrawalData = $derived(pipe(
             <div>
               <Label>Packet Hash</Label>
               <div class="font-mono text-sm text-zinc-400 break-all">
-                {dw.packet_hash}
+                <A
+                  external={false}
+                  href={`/explorer/packets/${dw.packet_hash}`}
+                >{dw.packet_hash}</A>
               </div>
             </div>
 
@@ -296,4 +300,3 @@ const dustWithdrawalData = $derived(pipe(
     {/await}
   </Card>
 </Sections>
-

app2/src/routes/explorer/stakes/[packet_hash]/+page.svelte

@@ -3,6 +3,7 @@ import { page } from "$app/state"
 import ChainComponent from "$lib/components/model/ChainComponent.svelte"
 import ErrorComponent from "$lib/components/model/ErrorComponent.svelte"
 import TokenComponent from "$lib/components/model/TokenComponent.svelte"
+import A from "$lib/components/ui/A.svelte"
 import Card from "$lib/components/ui/Card.svelte"
 import JsonPreview from "$lib/components/ui/JsonPreview.svelte"
 import Label from "$lib/components/ui/Label.svelte"
@@ -131,7 +132,10 @@ const bondData = $derived(pipe(
             <div>
               <Label>Packet Hash</Label>
               <div class="font-mono text-sm text-zinc-400 break-all">
-                {bond.packet_hash}
+                <A
+                  external={false}
+                  href={`/explorer/packets/${bond.packet_hash}`}
+                >{bond.packet_hash}</A>
               </div>
             </div>
 

app2/src/routes/explorer/unstakes/[packet_hash]/+page.svelte

@@ -3,6 +3,7 @@ import { page } from "$app/state"
 import ChainComponent from "$lib/components/model/ChainComponent.svelte"
 import ErrorComponent from "$lib/components/model/ErrorComponent.svelte"
 import TokenComponent from "$lib/components/model/TokenComponent.svelte"
+import A from "$lib/components/ui/A.svelte"
 import Card from "$lib/components/ui/Card.svelte"
 import JsonPreview from "$lib/components/ui/JsonPreview.svelte"
 import Label from "$lib/components/ui/Label.svelte"
@@ -113,7 +114,10 @@ const unbondData = $derived(pipe(
             <div>
               <Label>Packet Hash</Label>
               <div class="font-mono text-sm text-zinc-400 break-all">
-                {unbond.packet_hash}
+                <A
+                  external={false}
+                  href={`/explorer/packets/${unbond.packet_hash}`}
+                >{unbond.packet_hash}</A>
               </div>
             </div>
 

app2/src/routes/explorer/withdrawals/[packet_hash]/+page.svelte

@@ -1,17 +1,18 @@
 <script lang="ts">
 import ChainComponent from "$lib/components/model/ChainComponent.svelte"
 import ErrorComponent from "$lib/components/model/ErrorComponent.svelte"
-import JsonPreview from "$lib/components/ui/JsonPreview.svelte"
+import TokenComponent from "$lib/components/model/TokenComponent.svelte"
+import A from "$lib/components/ui/A.svelte"
 import Card from "$lib/components/ui/Card.svelte"
+import JsonPreview from "$lib/components/ui/JsonPreview.svelte"
 import Label from "$lib/components/ui/Label.svelte"
 import Sections from "$lib/components/ui/Sections.svelte"
-import TokenComponent from "$lib/components/model/TokenComponent.svelte"
+import * as AppRuntime from "$lib/runtime"
 import { Indexer } from "@unionlabs/sdk"
 import { TokenRawAmount } from "@unionlabs/sdk/schema"
 import { ConfigProvider, Effect, Layer, pipe } from "effect"
 import { graphql } from "gql.tada"
 import type { PageData } from "./$types"
-import * as AppRuntime from "$lib/runtime"
 
 interface Props {
   data: PageData
@@ -126,7 +127,10 @@ const withdrawalData = $derived(pipe(
             <div>
               <Label>Packet Hash</Label>
               <div class="font-mono text-sm text-zinc-400 break-all">
-                {w.packet_hash}
+                <A
+                  external={false}
+                  href={`/explorer/packets/${w.packet_hash}`}
+                >{w.packet_hash}</A>
               </div>
             </div>
 
@@ -253,7 +257,6 @@ const withdrawalData = $derived(pipe(
                 <div class="text-sm text-zinc-500">{w.destination_universal_chain_id}</div>
               {/if}
             </div>
-
           </div>
         </div>
       </div>

ts-sdk/src/schema/chain.ts

@@ -39,7 +39,7 @@ export class ChainReference extends S.Class<ChainReference>("ChainReference")({
   universal_chain_id: UniversalChainId,
 }) {}
 
-export const RpcProtocolType = S.Literal("rpc", "rest", "grpc")
+export const RpcProtocolType = S.Literal("rpc", "rest", "grpc", "graphql")
 export type RpcProtocolType = typeof RpcProtocolType.Type
 
 export class Rpc extends S.Class<Rpc>("Rpc")({