chore(app): pre commit

app/src/lib/components/TransferFrom/components/ChainDialog.svelte

@@ -1,20 +1,20 @@
 <script lang="ts">
-  import type {Readable} from "svelte/store";
-  import type {ContextStore} from "$lib/components/TransferFrom/transfer/context.ts";
+import type { Readable } from "svelte/store"
+import type { ContextStore } from "$lib/components/TransferFrom/transfer/context.ts"
 
-  interface Props {
-    context: Readable<ContextStore>
-    kind: "source" | "destination"
-    dialogOpen: boolean
-    onChainSelect: (type: 'source' | 'destination', chain: string) => void
-    onClose: () => void
-  }
+interface Props {
+  context: Readable<ContextStore>
+  kind: "source" | "destination"
+  dialogOpen: boolean
+  onChainSelect: (type: "source" | "destination", chain: string) => void
+  onClose: () => void
+}
 
-  export let context: Props["context"]
-  export let kind: Props["kind"]
-  export let dialogOpen: Props["dialogOpen"]
-  export let onChainSelect: Props["onChainSelect"]
-  export let onClose: Props["onClose"]
+export let context: Props["context"]
+export let kind: Props["kind"]
+export let dialogOpen: Props["dialogOpen"]
+export let onChainSelect: Props["onChainSelect"]
+export let onClose: Props["onClose"]
 </script>
 
 {#if dialogOpen && $context?.chains}

app/src/lib/components/TransferFrom/components/Cube/FaceWrapper.svelte

@@ -1,9 +1,9 @@
 <script>
-  export let visible = true;
-  export let width = 0; // Pixel value
-  export let height = 0; // Pixel value
-  export let translateZ = 0;
-  export let rotateY = "0deg";
+export let visible = true
+export let width = 0 // Pixel value
+export let height = 0 // Pixel value
+export let translateZ = 0
+export let rotateY = "0deg"
 </script>
 
 <div

app/src/lib/components/TransferFrom/components/Cube/faces/Assets.svelte

@@ -1,34 +1,33 @@
 <script lang="ts">
-  import type {IntentStore} from "$lib/components/TransferFrom/transfer/intents.ts";
-  import type {ValidationStoreAndMethods} from "$lib/components/TransferFrom/transfer/validation.ts";
-  import type {Readable} from "svelte/store";
-  import type {ContextStore} from "$lib/components/TransferFrom/transfer/context.ts";
-  import type {CubeFaces} from "$lib/components/TransferFrom/types.ts";
-  import {showUnsupported} from "$lib/stores/user.ts";
-  import {getSupportedAsset} from "$lib/utilities/helpers.ts";
-  import {truncate} from "$lib/utilities/format.ts";
-  import {formatUnits} from "viem";
-  import {Button} from "$lib/components/ui/button";
+import type { IntentStore } from "$lib/components/TransferFrom/transfer/intents.ts"
+import type { ValidationStoreAndMethods } from "$lib/components/TransferFrom/transfer/validation.ts"
+import type { Readable } from "svelte/store"
+import type { ContextStore } from "$lib/components/TransferFrom/transfer/context.ts"
+import type { CubeFaces } from "$lib/components/TransferFrom/types.ts"
+import { showUnsupported } from "$lib/stores/user.ts"
+import { getSupportedAsset } from "$lib/utilities/helpers.ts"
+import { truncate } from "$lib/utilities/format.ts"
+import { formatUnits } from "viem"
+import { Button } from "$lib/components/ui/button"
 
-  interface Props {
-    stores: {
-      intents: IntentStore
-      validation: ValidationStoreAndMethods
-      context: Readable<ContextStore>
-    }
-    rotateTo: (face: CubeFaces) => void
+interface Props {
+  stores: {
+    intents: IntentStore
+    validation: ValidationStoreAndMethods
+    context: Readable<ContextStore>
   }
+  rotateTo: (face: CubeFaces) => void
+}
 
-  export let stores: Props["stores"]
-  export let rotateTo: Props["rotateTo"]
+export let stores: Props["stores"]
+export let rotateTo: Props["rotateTo"]
 
-  let {intents, validation, context} = stores
-
-  function setAsset(address: string) {
-    intents.updateField('asset', address)
-    rotateTo("intentFace")
-  }
+let { intents, validation, context } = stores
 
+function setAsset(address: string) {
+  intents.updateField("asset", address)
+  rotateTo("intentFace")
+}
 </script>
 
 <div class="flex flex-col justify-between h-full w-full p-4">

app/src/lib/components/TransferFrom/components/Cube/faces/Chains.svelte

@@ -1,34 +1,34 @@
 <script lang="ts">
-  import type {IntentStore} from "$lib/components/TransferFrom/transfer/intents.ts";
-  import type {ValidationStoreAndMethods} from "$lib/components/TransferFrom/transfer/validation.ts";
-  import type {Readable} from "svelte/store";
-  import type {ContextStore} from "$lib/components/TransferFrom/transfer/context.ts";
-  import type {CubeFaces} from "$lib/components/TransferFrom/types.ts";
-  import {Button} from "$lib/components/ui/button";
-  import {truncate} from "$lib/utilities/format.ts";
-  import {formatUnits} from "viem";
+import type { IntentStore } from "$lib/components/TransferFrom/transfer/intents.ts"
+import type { ValidationStoreAndMethods } from "$lib/components/TransferFrom/transfer/validation.ts"
+import type { Readable } from "svelte/store"
+import type { ContextStore } from "$lib/components/TransferFrom/transfer/context.ts"
+import type { CubeFaces } from "$lib/components/TransferFrom/types.ts"
+import { Button } from "$lib/components/ui/button"
+import { truncate } from "$lib/utilities/format.ts"
+import { formatUnits } from "viem"
 
-  interface Props {
-    stores: {
-      intents: IntentStore
-      validation: ValidationStoreAndMethods
-      context: Readable<ContextStore>
-    }
-    rotateTo: (face: CubeFaces) => void
-    selected: "source" | "destination"
+interface Props {
+  stores: {
+    intents: IntentStore
+    validation: ValidationStoreAndMethods
+    context: Readable<ContextStore>
   }
+  rotateTo: (face: CubeFaces) => void
+  selected: "source" | "destination"
+}
 
-  export let stores: Props["stores"];
-  export let rotateTo: Props["rotateTo"];
-  export let selected: Props["selected"];
+export let stores: Props["stores"]
+export let rotateTo: Props["rotateTo"]
+export let selected: Props["selected"]
 
-  $: ({intents, validation, context} = stores);
+$: ({ intents, validation, context } = stores)
 
-  function setChain(selected: "source" | "destination", chainId: string) {
-    intents.updateField(selected, chainId);
-    console.log(selected, chainId);
-    rotateTo("intentFace");
-  }
+function setChain(selected: "source" | "destination", chainId: string) {
+  intents.updateField(selected, chainId)
+  console.log(selected, chainId)
+  rotateTo("intentFace")
+}
 </script>
 
 <div class="flex h-full justify-between flex-col gap-4 p-4">

app/src/lib/components/TransferFrom/components/Cube/faces/Intent.svelte

@@ -1,26 +1,26 @@
 <script lang="ts">
-  import Direction from "$lib/components/TransferFrom/components/Direction.svelte";
-  import SelectedAsset from "$lib/components/TransferFrom/components/SelectedAsset.svelte";
-  import type {Readable} from "svelte/store";
-  import type {IntentStore} from "$lib/components/TransferFrom/transfer/intents.ts";
-  import type {ValidationStoreAndMethods} from "$lib/components/TransferFrom/transfer/validation.ts";
-  import type {ContextStore} from "$lib/components/TransferFrom/transfer/context.ts";
-  import type {CubeFaces} from "$lib/components/TransferFrom/types.ts";
-  import {Button} from "$lib/components/ui/button";
+import Direction from "$lib/components/TransferFrom/components/Direction.svelte"
+import SelectedAsset from "$lib/components/TransferFrom/components/SelectedAsset.svelte"
+import type { Readable } from "svelte/store"
+import type { IntentStore } from "$lib/components/TransferFrom/transfer/intents.ts"
+import type { ValidationStoreAndMethods } from "$lib/components/TransferFrom/transfer/validation.ts"
+import type { ContextStore } from "$lib/components/TransferFrom/transfer/context.ts"
+import type { CubeFaces } from "$lib/components/TransferFrom/types.ts"
+import { Button } from "$lib/components/ui/button"
 
-  interface Props {
-    stores: {
-      intents: IntentStore
-      validation: ValidationStoreAndMethods
-      context: Readable<ContextStore>
-    }
-    rotateTo: (face: CubeFaces) => void
+interface Props {
+  stores: {
+    intents: IntentStore
+    validation: ValidationStoreAndMethods
+    context: Readable<ContextStore>
   }
+  rotateTo: (face: CubeFaces) => void
+}
 
-  export let stores: Props["stores"]
-  export let rotateTo: Props["rotateTo"]
+export let stores: Props["stores"]
+export let rotateTo: Props["rotateTo"]
 
-  let {intents, validation, context} = stores
+let { intents, validation, context } = stores
 </script>
 
 <div class="flex flex-col justify-between w-full h-full p-4">

app/src/lib/components/TransferFrom/components/Cube/faces/Transfer.svelte

@@ -1,24 +1,24 @@
 <script lang="ts">
-  import type {IntentStore} from "$lib/components/TransferFrom/transfer/intents.ts";
-  import type {ValidationStoreAndMethods} from "$lib/components/TransferFrom/transfer/validation.ts";
-  import type {Readable} from "svelte/store";
-  import type {ContextStore} from "$lib/components/TransferFrom/transfer/context.ts";
-  import type {CubeFaces} from "$lib/components/TransferFrom/types.ts";
-  import {Button} from "$lib/components/ui/button";
+import type { IntentStore } from "$lib/components/TransferFrom/transfer/intents.ts"
+import type { ValidationStoreAndMethods } from "$lib/components/TransferFrom/transfer/validation.ts"
+import type { Readable } from "svelte/store"
+import type { ContextStore } from "$lib/components/TransferFrom/transfer/context.ts"
+import type { CubeFaces } from "$lib/components/TransferFrom/types.ts"
+import { Button } from "$lib/components/ui/button"
 
-  interface Props {
-    stores: {
-      intents: IntentStore
-      validation: ValidationStoreAndMethods
-      context: Readable<ContextStore>
-    }
-    rotateTo: (face: CubeFaces) => void
+interface Props {
+  stores: {
+    intents: IntentStore
+    validation: ValidationStoreAndMethods
+    context: Readable<ContextStore>
   }
+  rotateTo: (face: CubeFaces) => void
+}
 
-  export let stores: Props["stores"]
-  export let rotateTo: Props["rotateTo"]
+export let stores: Props["stores"]
+export let rotateTo: Props["rotateTo"]
 
-  $: ({intents, validation, context} = stores)
+$: ({ intents, validation, context } = stores)
 </script>
 
 <div class="h-full w-full flex flex-col justify-between p-4">

app/src/lib/components/TransferFrom/components/Cube/index.svelte

@@ -1,61 +1,70 @@
 <script lang="ts">
-  import type {CubeFaces} from "$lib/components/TransferFrom/types.ts";
-  import FaceWrapper from "$lib/components/TransferFrom/components/Cube/FaceWrapper.svelte";
-  import {deviceWidth} from "$lib/utilities/device.ts";
-
-  let currentRotation = {x: 0, y: 0};
-
-  const facePositions = {
-    intentFace: 0,
-    chainsFace: -90,
-    verifyFace: -180,
-    assetsFace: -270,
-    sourceFace: -90,
-    destinationFace: -90,
-  } as const;
-
-  let currentVisibleFace: "source" | "destination" = "source";
-  $: currentVisibleFace = "source";
-
-  function findShortestRotation(current: number, target: number): number {
-    const revolution = Math.floor(current / 360) * 360;
-    const normalizedTarget = target + revolution;
-
-    let diff = normalizedTarget - current;
-    if (Math.abs(diff) > 180) {
-      diff = diff > 0 ? diff - 360 : diff + 360;
-    }
-    return current + diff;
+import type { CubeFaces } from "$lib/components/TransferFrom/types.ts"
+import FaceWrapper from "$lib/components/TransferFrom/components/Cube/FaceWrapper.svelte"
+import { deviceWidth } from "$lib/utilities/device.ts"
+
+let currentRotation = { x: 0, y: 0 }
+
+const facePositions = {
+  intentFace: 0,
+  chainsFace: -90,
+  verifyFace: -180,
+  assetsFace: -270,
+  sourceFace: -90,
+  destinationFace: -90
+} as const
+
+let currentVisibleFace: "source" | "destination" = "source"
+$: currentVisibleFace = "source"
+
+function findShortestRotation(current: number, target: number): number {
+  const revolution = Math.floor(current / 360) * 360
+  const normalizedTarget = target + revolution
+
+  let diff = normalizedTarget - current
+  if (Math.abs(diff) > 180) {
+    diff = diff > 0 ? diff - 360 : diff + 360
   }
-
-  function rotateTo(face: CubeFaces) {
-    console.log('rotate to: ', face)
-    const targetRotation = facePositions[face];
-
-    // Calculate the new Y rotation
-    const newY = findShortestRotation(currentRotation.y, targetRotation);
-    currentRotation = {x: 0, y: newY};
-
-    // Update visibility state
-    if (face === "sourceFace") {
-      currentVisibleFace = "source";
-    } else if (face === "destinationFace") {
-      currentVisibleFace = "destination";
-    }
+  return current + diff
+}
+
+function rotateTo(face: CubeFaces) {
+  console.log("rotate to: ", face)
+  const targetRotation = facePositions[face]
+
+  // Calculate the new Y rotation
+  const newY = findShortestRotation(currentRotation.y, targetRotation)
+  currentRotation = { x: 0, y: newY }
+
+  // Update visibility state
+  if (face === "sourceFace") {
+    currentVisibleFace = "source"
+  } else if (face === "destinationFace") {
+    currentVisibleFace = "destination"
   }
-
-  //If we want to be specific we can set each w
-  $: width =
-    $deviceWidth >= 1536 ? 400 : // 2xl breakpoint
-      $deviceWidth >= 1280 ? 400 : // xl breakpoint
-        $deviceWidth >= 1024 ? 400 : // lg breakpoint
-          $deviceWidth >= 768 ? 400 :  // md breakpoint
-            $deviceWidth >= 640 ? 400 :  // sm breakpoint
-              300; // Default for smaller screens
-
-  $: height = width * 1.5;
-  $: translateZ = width / 2;
-
+}
+
+//If we want to be specific we can set each w
+$: width =
+  $deviceWidth >= 1536
+    ? 400
+    : // 2xl breakpoint
+      $deviceWidth >= 1280
+      ? 400
+      : // xl breakpoint
+        $deviceWidth >= 1024
+        ? 400
+        : // lg breakpoint
+          $deviceWidth >= 768
+          ? 400
+          : // md breakpoint
+            $deviceWidth >= 640
+            ? 400
+            : // sm breakpoint
+              300 // Default for smaller screens
+
+$: height = width * 1.5
+$: translateZ = width / 2
 </script>
 
 <div class="h-screen w-full flex items-center justify-center bg-black perspective-[2000px]">