Repository: artsy/force
Pull request #15607: feat: Final wire details for the message section.
Author: login: oxaudo
Labels: name: Jira Synced
Created: 2025-05-21T14:57:45Z | Merged: 2025-05-22T01:31:49Z

Finally! It's the last part of [EMI-2436](https://artsyproduct.atlassian.net/browse/EMI-2436)

Here we are adding wire details selection based on order currency. I refactored this Wire details info into separate component and think it's a bit easier to see the variations in this format. But that brings a question - is that intentional that both EUR and GBP bank address is in London [cami-w](https://github.com/cami-w)?

Also removing a link for 'contact gallery' for now. As we've discussed it'll be a follow up to link this properly based on presense of existing conversation.

Here is the look for USD:
<img width="1369" alt="Screenshot 2025-05-21 at 10 49 05 AM" src="https://github.com/user-attachments/assets/0df3e860-9621-4baa-ac5a-c60d410b389e" />


[EMI-2436]: https://artsyproduct.atlassian.net/browse/EMI-2436?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ


Diff:
diff --git a/src/Apps/Order2/Routes/Details/Components/Order2DetailsMessage.tsx b/src/Apps/Order2/Routes/Details/Components/Order2DetailsMessage.tsx
index 5b78466ba36..c6561c1f5ba 100644
--- a/src/Apps/Order2/Routes/Details/Components/Order2DetailsMessage.tsx
+++ b/src/Apps/Order2/Routes/Details/Components/Order2DetailsMessage.tsx
@@ -1,7 +1,8 @@
-import { Box, Flex, Link, Spacer, Text } from "@artsy/palette"
+import { Box, Flex, Spacer, Text } from "@artsy/palette"
 import { RouterLink } from "System/Components/RouterLink"
 import type { Order2DetailsMessage_order$key } from "__generated__/Order2DetailsMessage_order.graphql"
 import { graphql, useFragment } from "react-relay"
+import { WireTransferInfo } from "./WireTransferInfo"
 
 interface Order2DetailsMessageProps {
   order: Order2DetailsMessage_order$key
@@ -72,8 +73,7 @@ const getMessageContent = (order): React.ReactNode => {
             The gallery will confirm by {formattedStateExpireTime}.
           </Text>
           <Text variant="sm">
-            You can <Link>contact the gallery</Link> with any questions about
-            your order.
+            You can contact the gallery with any questions about your order.
           </Text>
         </>
       )
@@ -90,8 +90,7 @@ const getMessageContent = (order): React.ReactNode => {
             The gallery will confirm by {formattedStateExpireTime}.
           </Text>
           <Text variant="sm">
-            You can <Link>contact the gallery</Link> with any questions about
-            your order.
+            You can contact the gallery with any questions about your order.
           </Text>
         </>
       )
@@ -149,45 +148,7 @@ const getMessageContent = (order): React.ReactNode => {
             </Text>
           </NumberedListItem>
           <Spacer y={2} />
-          <Box border="1px solid" borderColor="mono15" p={2}>
-            <Text variant="sm" fontWeight="bold">
-              Send wire transfer to
-            </Text>
-            <Spacer y={1} />
-            <Text variant="sm">
-              Account name: Art.sy Inc.
-              <br />
-              Account number: 424385142
-              <br />
-              Routing number: 121000248
-              <br />
-              International SWIFT: WFBIUS6S
-            </Text>
-            <Spacer y={4} />
-            <Text variant="sm" fontWeight="bold">
-              Bank address
-            </Text>
-            <Spacer y={1} />
-            <Text variant="sm">
-              Wells Fargo Bank, N.A.
-              <br />
-              420 Montgomery Street
-              <br />
-              San Francisco, CA 9410
-            </Text>
-            <Spacer y={4} />
-            <Text variant="sm" fontWeight="bold">
-              Add order #{order.code} to the notes section in your wire
-              transfer.
-            </Text>
-            <Spacer y={1} />
-            <Text variant="sm">
-              If your bank account is not in USD, please reference Artsy’s
-              intermediary bank ING Brussels (Intermediary Bank BIC/SWIFT:
-              PNBPUS3NNYC) along with Artsy’s international SWIFT (WFBIUS6S)
-              when making payment. Ask your bank for further instructions.
-            </Text>
-          </Box>
+          <WireTransferInfo order={order} />
         </>
       )
     case "APPROVED_PICKUP":
@@ -198,8 +159,7 @@ const getMessageContent = (order): React.ReactNode => {
             business days to coordinate pickup.
           </Text>
           <Text variant="sm">
-            You can <Link>contact the gallery</Link> with any questions about
-            your order.
+            You can contact the gallery with any questions about your order.
           </Text>
         </>
       )
@@ -303,6 +263,7 @@ const FRAGMENT = graphql`
   fragment Order2DetailsMessage_order on Order {
     buyerStateExpiresAt
     code
+    currencyCode
     internalID
     displayTexts {
       messageType
diff --git a/src/Apps/Order2/Routes/Details/Components/WireTransferInfo.tsx b/src/Apps/Order2/Routes/Details/Components/WireTransferInfo.tsx
new file mode 100644
index 00000000000..008005e05b6
--- /dev/null
+++ b/src/Apps/Order2/Routes/Details/Components/WireTransferInfo.tsx
@@ -0,0 +1,115 @@
+import { Box, Spacer, Stack, Text } from "@artsy/palette"
+
+interface BankDetails {
+  transferInfo: string[]
+  bankAddress: string[]
+  referenceInfo: {
+    intermediary: string
+    international: string
+  }
+}
+
+const BANK_DETAILS: Record<string, BankDetails> = {
+  GBP: {
+    transferInfo: [
+      "Account name: Art.sy Inc.",
+      "Account number: 88005417",
+      "IBAN: GB30PNBP16567188005417",
+      "International SWIFT: PNBPGB2L",
+      "Sort Code: 16-56-7",
+    ],
+    bankAddress: [
+      "Wells Fargo Bank, N.A. London Branch",
+      "1 Plantation Place",
+      "30 Fenchurch Street",
+      "London, United Kingdom, EC3M 3BD",
+    ],
+    referenceInfo: {
+      intermediary: "NWBKGB2LXXX",
+      international: "PNBPGB2L",
+    },
+  },
+  EUR: {
+    transferInfo: [
+      "Account name: Art.sy Inc.",
+      "Account number: 88005419",
+      "IBAN: GB73PNBP16567188005419",
+      "International SWIFT: PNBPGB2L",
+    ],
+    bankAddress: [
+      "Wells Fargo Bank, N.A. London Branch",
+      "1 Plantation Place",
+      "30 Fenchurch Street",
+      "London, United Kingdom, EC3M 3BD",
+    ],
+    referenceInfo: {
+      intermediary: "BBRUBEBB010",
+      international: "PNBPGB2L",
+    },
+  },
+  USD: {
+    transferInfo: [
+      "Account name: Art.sy Inc.",
+      "Account number: 4243851425",
+      "Routing number: 121000248",
+      "International SWIFT: WFBIUS6S",
+    ],
+    bankAddress: [
+      "Wells Fargo Bank, N.A.",
+      "420 Montgomery Street",
+      "San Francisco, CA 94104",
+      "United States",
+    ],
+    referenceInfo: {
+      intermediary: "PNBPUS3NNYC",
+      international: "WFBIUS6S",
+    },
+  },
+}
+
+interface WireTransferInfoProps {
+  order: {
+    currencyCode?: string
+    code: string
+  }
+}
+
+export const WireTransferInfo: React.FC<WireTransferInfoProps> = ({
+  order,
+}) => {
+  const currencyCode = order.currencyCode || "USD"
+
+  const details = BANK_DETAILS[currencyCode] || BANK_DETAILS.USD
+
+  return (
+    <Box border="1px solid" borderColor="mono15" p={2}>
+      <Text variant="sm" fontWeight="bold">
+        Send wire transfer to
+      </Text>
+      <Stack gap={0} mt={1} mb={4}>
+        {details.transferInfo.map(rowText => (
+          <Text variant="sm">{rowText}</Text>
+        ))}
+      </Stack>
+      <Text variant="sm" fontWeight="bold">
+        Bank address
+      </Text>
+      <Stack gap={0} mt={1} mb={4}>
+        {details.bankAddress.map(rowText => (
+          <Text variant="sm">{rowText}</Text>
+        ))}
+      </Stack>
+      <Text variant="sm" fontWeight="bold">
+        Add order #{order.code} to the notes section in your wire transfer.
+      </Text>
+      <Spacer y={1} />
+      <Text variant="sm">
+        If your bank account is not in {currencyCode}, please reference Artsy's
+        intermediary bank ING Brussels (Intermediary Bank BIC/SWIFT:{" "}
+        {details.referenceInfo.intermediary}) along with Artsy's international
+        SWIFT ({details.referenceInfo.international}) when making payment. Ask
+        your bank for further instructions.
+      </Text>
+    </Box>
+  )
+}
diff --git a/src/Apps/Order2/Routes/Details/Components/__tests__/Order2DetailsMessage.jest.tsx b/src/Apps/Order2/Routes/Details/Components/__tests__/Order2DetailsMessage.jest.tsx
index 08d043ecc9c..0a66105d957 100644
--- a/src/Apps/Order2/Routes/Details/Components/__tests__/Order2DetailsMessage.jest.tsx
+++ b/src/Apps/Order2/Routes/Details/Components/__tests__/Order2DetailsMessage.jest.tsx
@@ -61,6 +61,7 @@ describe("Order2DetailsMessage", () => {
       Order: () => ({
         buyerStateExpiresAt: mockDate,
         code: "123",
+        currencyCode: "USD",
         internalID: "test-id",
         displayTexts: {
           messageType: "PROCESSING_WIRE",
@@ -69,8 +70,8 @@ describe("Order2DetailsMessage", () => {
     })
 
     expect(screen.getByText("Send wire transfer to")).toBeInTheDocument()
-    expect(screen.getByText(/Account name: Art\.sy Inc\./)).toBeInTheDocument()
-    expect(screen.getByText(/Account number: 424385142/)).toBeInTheDocument()
+    expect(screen.getByText(/Account name: Art.sy Inc/)).toBeInTheDocument()
+    expect(screen.getByText(/Account number: 4243851425/)).toBeInTheDocument()
     expect(screen.getByText(/Routing number: 121000248/)).toBeInTheDocument()
     expect(
       screen.getByText(/International SWIFT: WFBIUS6S/),
diff --git a/src/__generated__/Order2DetailsMessage_Test_Query.graphql.ts b/src/__generated__/Order2DetailsMessage_Test_Query.graphql.ts
index 4aa30e35e33..2766f4f6887 100644
--- a/src/__generated__/Order2DetailsMessage_Test_Query.graphql.ts
+++ b/src/__generated__/Order2DetailsMessage_Test_Query.graphql.ts
@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<5b3a620d3a9122c22edd96794ff87218>>
+ * @generated SignedSource<<d1d8cf340ab10ca8154cbc5bc1c7ecdd>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -25,6 +25,7 @@ export type Order2DetailsMessage_Test_Query$rawResponse = {
     readonly order: {
       readonly buyerStateExpiresAt: string | null | undefined;
       readonly code: string;
+      readonly currencyCode: string;
       readonly displayTexts: {
         readonly messageType: DisplayTextsMessageTypeEnum;
       };
@@ -128,6 +129,13 @@ return {
                 "name": "code",
                 "storageKey": null
               },
+              {
+                "alias": null,
+                "args": null,
+                "kind": "ScalarField",
+                "name": "currencyCode",
+                "storageKey": null
+              },
               {
                 "alias": null,
                 "args": null,
@@ -164,12 +172,12 @@ return {
     ]
   },
   "params": {
-    "cacheID": "026726dfaec107b3bf6992676e78181e",
+    "cacheID": "ad9d13880b5046dfddbc8c297366e6f9",
     "id": null,
     "metadata": {},
     "name": "Order2DetailsMessage_Test_Query",
     "operationKind": "query",
-    "text": "query Order2DetailsMessage_Test_Query {\n  me {\n    order(id: \"123\") {\n      ...Order2DetailsMessage_order\n      id\n    }\n    id\n  }\n}\n\nfragment Order2DetailsMessage_order on Order {\n  buyerStateExpiresAt\n  code\n  internalID\n  displayTexts {\n    messageType\n  }\n}\n"
+    "text": "query Order2DetailsMessage_Test_Query {\n  me {\n    order(id: \"123\") {\n      ...Order2DetailsMessage_order\n      id\n    }\n    id\n  }\n}\n\nfragment Order2DetailsMessage_order on Order {\n  buyerStateExpiresAt\n  code\n  currencyCode\n  internalID\n  displayTexts {\n    messageType\n  }\n}\n"
   }
 };
 })();
diff --git a/src/__generated__/Order2DetailsMessage_order.graphql.ts b/src/__generated__/Order2DetailsMessage_order.graphql.ts
index 7119118cbc8..dd0b9cf4927 100644
--- a/src/__generated__/Order2DetailsMessage_order.graphql.ts
+++ b/src/__generated__/Order2DetailsMessage_order.graphql.ts
@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<7f929f33f156661f87d51b52c66a5d36>>
+ * @generated SignedSource<<fdd4bd904ed4b60e7555cc7b22389581>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -14,6 +14,7 @@ import { FragmentRefs } from "relay-runtime";
 export type Order2DetailsMessage_order$data = {
   readonly buyerStateExpiresAt: string | null | undefined;
   readonly code: string;
+  readonly currencyCode: string;
   readonly displayTexts: {
     readonly messageType: DisplayTextsMessageTypeEnum;
   };
@@ -45,6 +46,13 @@ const node: ReaderFragment = {
       "name": "code",
       "storageKey": null
     },
+    {
+      "alias": null,
+      "args": null,
+      "kind": "ScalarField",
+      "name": "currencyCode",
+      "storageKey": null
+    },
     {
       "alias": null,
       "args": null,
@@ -75,6 +83,6 @@ const node: ReaderFragment = {
   "abstractKey": null
 };
 
-(node as any).hash = "ac63312303fcd0bfc71d10cd7c5fc070";
+(node as any).hash = "d4a3de784c48a5844b365765f8ecc8ee";
 
 export default node;
diff --git a/src/__generated__/Order2DetailsPage_Test_Query.graphql.ts b/src/__generated__/Order2DetailsPage_Test_Query.graphql.ts
index 8f64498b692..9207f5ee677 100644
--- a/src/__generated__/Order2DetailsPage_Test_Query.graphql.ts
+++ b/src/__generated__/Order2DetailsPage_Test_Query.graphql.ts
@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<c768ca0e9db6153d03d6da3397a000af>>
+ * @generated SignedSource<<e8cd55f9c4dc63f3c185130cd3819a71>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -25,6 +25,7 @@ export type Order2DetailsPage_Test_Query$rawResponse = {
     readonly order: {
       readonly buyerStateExpiresAt: string | null | undefined;
       readonly code: string;
+      readonly currencyCode: string;
       readonly displayTexts: {
         readonly messageType: DisplayTextsMessageTypeEnum;
         readonly title: string;
@@ -154,6 +155,13 @@ return {
                 "name": "buyerStateExpiresAt",
                 "storageKey": null
               },
+              {
+                "alias": null,
+                "args": null,
+                "kind": "ScalarField",
+                "name": "currencyCode",
+                "storageKey": null
+              },
               {
                 "alias": null,
                 "args": null,
@@ -172,12 +180,12 @@ return {
     ]
   },
   "params": {
-    "cacheID": "61a32786e85f3e38827d7810119284b9",
+    "cacheID": "203c3298efbd326659a486ca2f4e07fb",
     "id": null,
     "metadata": {},
     "name": "Order2DetailsPage_Test_Query",
     "operationKind": "query",
-    "text": "query Order2DetailsPage_Test_Query {\n  me {\n    order(id: \"123\") {\n      ...Order2DetailsPage_order\n      id\n    }\n    id\n  }\n}\n\nfragment Order2DetailsHeader_order on Order {\n  code\n  displayTexts {\n    title\n  }\n}\n\nfragment Order2DetailsMessage_order on Order {\n  buyerStateExpiresAt\n  code\n  internalID\n  displayTexts {\n    messageType\n  }\n}\n\nfragment Order2DetailsPage_order on Order {\n  ...Order2DetailsHeader_order\n  ...Order2DetailsMessage_order\n}\n"
+    "text": "query Order2DetailsPage_Test_Query {\n  me {\n    order(id: \"123\") {\n      ...Order2DetailsPage_order\n      id\n    }\n    id\n  }\n}\n\nfragment Order2DetailsHeader_order on Order {\n  code\n  displayTexts {\n    title\n  }\n}\n\nfragment Order2DetailsMessage_order on Order {\n  buyerStateExpiresAt\n  code\n  currencyCode\n  internalID\n  displayTexts {\n    messageType\n  }\n}\n\nfragment Order2DetailsPage_order on Order {\n  ...Order2DetailsHeader_order\n  ...Order2DetailsMessage_order\n}\n"
   }
 };
 })();
diff --git a/src/__generated__/order2Routes_DetailsQuery.graphql.ts b/src/__generated__/order2Routes_DetailsQuery.graphql.ts
index ea0ae6f0553..409ae65815f 100644
--- a/src/__generated__/order2Routes_DetailsQuery.graphql.ts
+++ b/src/__generated__/order2Routes_DetailsQuery.graphql.ts
@@ -1,5 +1,5 @@
 /**
- * @generated SignedSource<<956c9fb7b32b906699401fb9ad235bc6>>
+ * @generated SignedSource<<81bcc62989eb68d462725ba1923163f0>>
  * @lightSyntaxTransform
  * @nogrep
  */
@@ -192,6 +192,13 @@ return {
                     "name": "buyerStateExpiresAt",
                     "storageKey": null
                   },
+                  {
+                    "alias": null,
+                    "args": null,
+                    "kind": "ScalarField",
+                    "name": "currencyCode",
+                    "storageKey": null
+                  },
                   (v2/*: any*/),
                   (v4/*: any*/),
                   (v3/*: any*/)
@@ -208,12 +215,12 @@ return {
     ]
   },
   "params": {
-    "cacheID": "bdec2d1ebb12cd6b86640375a38b172d",
+    "cacheID": "8b8b7e035b0ee2ec21b699c64bc5e516",
     "id": null,
     "metadata": {},
     "name": "order2Routes_DetailsQuery",
     "operationKind": "query",
-    "text": "query order2Routes_DetailsQuery(\n  $orderID: ID!\n) {\n  viewer {\n    ...Order2DetailsRoute_viewer_3HPek8\n    me {\n      order(id: $orderID) {\n        internalID\n        mode\n        id\n      }\n      id\n    }\n  }\n}\n\nfragment Order2DetailsHeader_order on Order {\n  code\n  displayTexts {\n    title\n  }\n}\n\nfragment Order2DetailsMessage_order on Order {\n  buyerStateExpiresAt\n  code\n  internalID\n  displayTexts {\n    messageType\n  }\n}\n\nfragment Order2DetailsPage_order on Order {\n  ...Order2DetailsHeader_order\n  ...Order2DetailsMessage_order\n}\n\nfragment Order2DetailsRoute_viewer_3HPek8 on Viewer {\n  me {\n    order(id: $orderID) {\n      ...Order2DetailsPage_order\n      internalID\n      id\n    }\n    id\n  }\n}\n"
+    "text": "query order2Routes_DetailsQuery(\n  $orderID: ID!\n) {\n  viewer {\n    ...Order2DetailsRoute_viewer_3HPek8\n    me {\n      order(id: $orderID) {\n        internalID\n        mode\n        id\n      }\n      id\n    }\n  }\n}\n\nfragment Order2DetailsHeader_order on Order {\n  code\n  displayTexts {\n    title\n  }\n}\n\nfragment Order2DetailsMessage_order on Order {\n  buyerStateExpiresAt\n  code\n  currencyCode\n  internalID\n  displayTexts {\n    messageType\n  }\n}\n\nfragment Order2DetailsPage_order on Order {\n  ...Order2DetailsHeader_order\n  ...Order2DetailsMessage_order\n}\n\nfragment Order2DetailsRoute_viewer_3HPek8 on Viewer {\n  me {\n    order(id: $orderID) {\n      ...Order2DetailsPage_order\n      internalID\n      id\n    }\n    id\n  }\n}\n"
   }
 };
 })();


Reviews:
user: login: starsirius
state: COMMENTED
author_association: MEMBER
submitted_at: 2025-05-21T21:02:22Z
user: login: starsirius
state: COMMENTED
author_association: MEMBER
submitted_at: 2025-05-21T21:10:41Z

Review comments:
diff_hunk: @@ -82,16 +82,15 @@ const getMessageContent = (order): React.ReactNode => {
         <>
           <Text variant="sm">
             Thank you! Your offer has been submitted. You will receive an email
-            shortly with all the details. Please note making an offer doesn’t
+            shortly with all the details. Please note making an offer doesn't
path: src/Apps/Order2/Routes/Details/Components/Order2DetailsMessage.tsx
user: login: starsirius
body: I remember we generally want apostrophe to be the curly one, rather than straight.
created_at: 2025-05-21T21:02:22Z
author_association: MEMBER
diff_hunk: @@ -0,0 +1,132 @@
+import { Box, Spacer, Stack, Text } from "@artsy/palette"
+
+interface BankDetails {
+  accountNumber: string
+  iban?: string
+  routingNumber?: string
+  swift: string
+  sortCode?: string
+  bankAddress: {
+    name: string
+    street1: string
+    street2?: string
+    city: string
+    country: string
+  }
+  intermediaryBank?: {
+    name: string
+    swift: string
+  }
+}
+
+const BANK_DETAILS: Record<string, BankDetails> = {
+  GBP: {
+    accountNumber: "88005417",
+    iban: "GB30PNBP16567188005417",
+    swift: "PNBPGB2L",
+    sortCode: "16-56-7",
+    bankAddress: {
+      name: "Wells Fargo Bank, N.A. London Branch",
+      street1: "1 Plantation Place",
+      street2: "30 Fenchurch Street",
+      city: "London, United Kingdom, EC3M 3BD",
+      country: "United Kingdom",
+    },
+    intermediaryBank: {
+      name: "ING Brussels",
+      swift: "NWBKGB2LXXX",
+    },
+  },
+  EUR: {
+    accountNumber: "88005419",
+    iban: "GB73PNBP16567188005419",
+    swift: "PNBPGB2L",
+    bankAddress: {
+      name: "Wells Fargo Bank, N.A. London Branch",
+      street1: "1 Plantation Place",
+      street2: "30 Fenchurch Street",
+      city: "London, United Kingdom, EC3M 3BD",
+      country: "United Kingdom",
+    },
+    intermediaryBank: {
+      name: "ING Brussels",
+      swift: "BBRUBEBB010",
+    },
+  },
+  USD: {
+    accountNumber: "4243851425",
+    routingNumber: "121000248",
+    swift: "WFBIUS6S",
+    bankAddress: {
+      name: "Wells Fargo Bank, N.A.",
+      street1: "420 Montgomery Street",
+      city: "San Francisco, CA 94104",
path: src/Apps/Order2/Routes/Details/Components/WireTransferInfo.tsx
user: login: starsirius
body: #non-blocking. We can make these an array of _lines_ and in the view simply print them all, to avoid getting into preciseness of the structure, like city here. Minor tho.
created_at: 2025-05-21T21:10:40Z
author_association: MEMBER

PR comments:
user: login: oxaudo
created_at: 2025-05-21T15:05:28Z
body: Ok. Here is GBP:
<img width="1314" alt="Screenshot 2025-05-21 at 11 01 29 AM" src="https://github.com/user-attachments/assets/93682b8e-e36a-4189-8997-0b932ff0d979" />

author_association: MEMBER
user: login: relativeci[bot]
created_at: 2025-05-21T15:05:46Z
body: ## [#2881](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L?utm_source=github&utm_campaign=pr-report&utm_content=title "Bundle Size — 8.85MiB (+0.01%).") Bundle Size — 8.85MiB (+0.01%).
1d3979c(current) vs 4594c1d **[main#2879](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2879-eXoJgNNybJ56IaRiAdIt?utm_source=github&utm_content=report-header&utm_campaign=pr-report "View baseline job report")**(baseline)

> [!WARNING]
> Bundle contains 18 duplicate packages – [View duplicate packages](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/packages?bp=%7B%22filters%22%3A%22duplicate-1%22%7D&utm_source=github&utm_campaign=pr-report&utm_content=insights)
<details>
<summary><strong>Bundle metrics</strong>&nbsp;&nbsp;<img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-blue.svg?sanitize=true" width="8" alt="Change" align="center"> <code>3 changes</code> <img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-red.svg?sanitize=true" width="8" alt="Regression" align="center"> <code>1 regression</code></summary>
<br>


|            |       Current<br />[#2881](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L?utm_source=github&utm_content=summary&utm_campaign=pr-report "View bundle analysis report") |      Baseline<br />[#2879](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2879-eXoJgNNybJ56IaRiAdIt?utm_source=github&utm_content=summary&utm_campaign=pr-report "View baseline bundle analysis report") |
|:--|--:|--:|
| <strong><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-red.svg?sanitize=true" width="8" alt="Regression" align="center">&nbsp;&nbsp;[Initial JS](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22et.entrypoint-0_et.initial-1_et.chunk-0_et.asset-0_ft.CSS-0_ft.JS-1_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-0%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View initial JS assets")</strong> | <strong>`3.59MiB`(`~+0.01%`)</strong> | <strong>`3.59MiB`</strong> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Initial CSS](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22et.entrypoint-0_et.initial-1_et.chunk-0_et.asset-0_ft.CSS-1_ft.JS-0_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-0%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View initial CSS assets")</span> | <span>`0B`</span> | <span>`0B`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-blue.svg?sanitize=true" width="8" alt="Change" align="center">&nbsp;&nbsp;[Cache Invalidation](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22changed-1%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View changed assets")</span> | <span>`43.55%`</span> | <span>`41.49%`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Chunks](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22et.entrypoint-0_et.initial-0_et.chunk-1_et.asset-0%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View chunks")</span> | <span>`101`</span> | <span>`101`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Assets](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22changed-0%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View assets")</span> | <span>`104`</span> | <span>`104`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-blue.svg?sanitize=true" width="8" alt="Change" align="center">&nbsp;&nbsp;[Modules](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/modules?bm=%7B%22metric%22%3A%22totalSize%22%2C%22filters%22%3A%22changed-0%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View modules")</span> | <span>`5790`(`+0.02%`)</span> | <span>`5789`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Duplicate Modules](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/modules?bm=%7B%22metric%22%3A%22duplicateSize%22%2C%22filters%22%3A%22changed-0_md-1%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View duplicate modules")</span> | <span>`519`</span> | <span>`519`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Duplicate Code](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/modules?bm=%7B%22metric%22%3A%22duplicateSize%22%2C%22filters%22%3A%22changed-0_md-1%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View duplicate modules")</span> | <span>`3.94%`</span> | <span>`3.94%`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Packages](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/packages?bp=%7B%22filters%22%3A%22changed-0%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View packages")</span> | <span>`271`</span> | <span>`271`</span> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Duplicate Packages](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/packages?bp=%7B%22filters%22%3A%22duplicate-1%22%7D&utm_source=github&utm_content=summary&utm_campaign=pr-report "View duplicate packages")</span> | <span>`17`</span> | <span>`17`</span> |
</details>


<details>
<summary><strong>Bundle size by type</strong>&nbsp;&nbsp;<img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-blue.svg?sanitize=true" width="8" alt="Change" align="center"> <code>1 change</code> <img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-red.svg?sanitize=true" width="8" alt="Regression" align="center"> <code>1 regression</code></summary>
<br>


|            |       Current<br />[#2881](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L?utm_source=github&utm_content=totals&utm_campaign=pr-report "View bundle analysis report") |      Baseline<br />[#2879](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2879-eXoJgNNybJ56IaRiAdIt?utm_source=github&utm_content=totals&utm_campaign=pr-report "View baseline bundle analysis report") |
|:--|--:|--:|
| <strong><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-red.svg?sanitize=true" width="8" alt="Regression" align="center">&nbsp;&nbsp;[JS](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22ft.CSS-0_ft.JS-1_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-0%22%7D&utm_source=github&utm_content=totals&utm_campaign=pr-report "View JS assets")</strong> | <strong>`8.72MiB` (`+0.01%`)</strong> | <strong>`8.71MiB`</strong> |
| <span><img src="https://raw.githubusercontent.com/relative-ci/relative-ci-github-app-assets/v0.0.4/reports/circle-gray.svg?sanitize=true" width="8" alt="No change" align="center">&nbsp;&nbsp;[Other](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L/assets?ba=%7B%22filters%22%3A%22ft.CSS-0_ft.JS-0_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-1%22%7D&utm_source=github&utm_content=totals&utm_campaign=pr-report "View Other assets")</span> | <span>`141.52KiB`</span> | <span>`141.52KiB`</span> |
</details>


[Bundle analysis report](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/jobs/2881-IbZWGvVPlSSySYUKGV1L?utm_source=github&utm_content=report-footer&utm_campaign=pr-report) [Branch **oxaudo/wire**](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt/tree/oxaudo%2Fwire?utm_source=github&utm_content=report-footer&utm_campaign=pr-report) [Project dashboard](https://app.relative-ci.com/projects/zNeNymVCPwxxOLTcM9qt?utm_source=github&utm_content=report-footer&utm_campaign=pr-report)---<sup>Generated by [RelativeCI](https://relative-ci.com/?utm_source=github&utm_content=report-footer&utm_campaign=pr-report) [Documentation](https://relative-ci.com/documentation?utm_source=github&utm_content=report-footer&utm_campaign=pr-report) [Report issue](https://github.com/relative-ci/roadmap/issues)</sup>
<!--RELATIVE_CI_PROJECT_NAME="force"-->
author_association: NONE
user: login: oxaudo
created_at: 2025-05-21T15:06:10Z
body: And here is EUR:
<img width="1296" alt="Screenshot 2025-05-21 at 11 01 59 AM" src="https://github.com/user-attachments/assets/08087bcc-085d-4761-a51b-cf743a3bb09e" />

author_association: MEMBER