remove legacy route migration from extension

deployables/extension/src/panel/pages/$activeRouteId/transactions/RouteBubble/index.tsx

@@ -1,19 +1,27 @@
 import { useCompanionAppUrl } from '@/companion'
 import { useExecutionRoute } from '@/execution-routes'
 import { Transition } from '@headlessui/react'
+import {
+  getPilotAddress,
+  getRolesWaypoint,
+  getStartingWaypoint,
+} from '@zodiac/modules'
+import type { HexAddress } from '@zodiac/schema'
 import { Blockie } from '@zodiac/ui'
 import { AlignJustify, Cog } from 'lucide-react'
 import { useState } from 'react'
 import { Link } from 'react-router'
 import Stick from 'react-stick'
+import { parsePrefixedAddress } from 'ser-kit'
 import { ConnectionStack } from '../../../ConnectionStack'
-import { asLegacyConnection } from '../../../legacyConnectionMigrations'
 
 export const RouteBubble = () => {
   const route = useExecutionRoute()
-  const connection = asLegacyConnection(route)
   const [hover, setHover] = useState(false)
 
+  const pilotAddress = getPilotAddress([getStartingWaypoint(route.waypoints)])
+  const rolesWaypoint = getRolesWaypoint(route)
+
   return (
     <Stick
       sameWidth
@@ -33,21 +41,23 @@ export const RouteBubble = () => {
         >
           <div className="isolate z-10 pt-2">
             <div className="rounded-md border border-zinc-200/80 bg-zinc-100/80 px-4 py-2 shadow-lg backdrop-blur-sm dark:border-zinc-500/80 dark:bg-zinc-900/80">
-              <ConnectionStack connection={connection} />
+              <ConnectionStack route={route} />
             </div>
           </div>
         </Transition>
       }
     >
       <div className="flex items-center gap-2 overflow-hidden">
         <Blockies
-          avatarAddress={connection.avatarAddress}
-          moduleAddress={connection.moduleAddress}
-          pilotAddress={connection.pilotAddress}
+          avatarAddress={parsePrefixedAddress(route.avatar)}
+          moduleAddress={
+            rolesWaypoint == null ? undefined : rolesWaypoint.account.address
+          }
+          pilotAddress={pilotAddress}
         />
 
         <p className="overflow-hidden text-ellipsis whitespace-nowrap">
-          {connection.label || <span className="italic">Unnamed route</span>}
+          {route.label || <span className="italic">Unnamed route</span>}
         </p>
       </div>
 
@@ -75,9 +85,9 @@ export const RouteBubble = () => {
 }
 
 type BlockiesProps = {
-  avatarAddress: string
-  pilotAddress?: string
-  moduleAddress?: string
+  avatarAddress: HexAddress
+  pilotAddress?: HexAddress
+  moduleAddress?: HexAddress
 }
 
 const Blockies = ({

deployables/extension/src/panel/pages/ConnectionStack/index.tsx

@@ -1,13 +1,25 @@
-import type { LegacyConnection } from '@/types'
-import { ZODIAC_MODULE_NAMES } from '@zodiac/modules'
+import type { ExecutionRoute } from '@/types'
+import { invariant } from '@epic-web/invariant'
+import {
+  getModuleName,
+  getPilotAddress,
+  getRolesWaypoint,
+} from '@zodiac/modules'
+import { parsePrefixedAddress } from 'ser-kit'
 import { Address } from './Address'
 
 interface Props {
-  connection: LegacyConnection
+  route: ExecutionRoute
 }
 
-export const ConnectionStack = ({ connection }: Props) => {
-  const { avatarAddress, moduleAddress, pilotAddress, moduleType } = connection
+export const ConnectionStack = ({ route }: Props) => {
+  invariant(route.waypoints != null, 'Cannot render route without waypoints')
+
+  const pilotAddress = getPilotAddress(route.waypoints)
+  const avatarAddress = parsePrefixedAddress(route.avatar)
+
+  const rolesWaypoint = getRolesWaypoint(route)
+
   return (
     <div className="flex flex-col gap-2">
       <div className="flex items-center justify-between">
@@ -16,13 +28,13 @@ export const ConnectionStack = ({ connection }: Props) => {
         <Address address={pilotAddress} />
       </div>
 
-      {moduleAddress && (
+      {rolesWaypoint != null && (
         <div className="flex items-center justify-between">
           <div className="text-sm">
-            {(moduleType && ZODIAC_MODULE_NAMES[moduleType]) || 'Zodiac'} Mod
+            {getModuleName(rolesWaypoint.account)} Mod
           </div>
 
-          <Address address={moduleAddress} />
+          <Address address={rolesWaypoint.account.address} />
         </div>
       )}