@rainlanguage/ui-components 0.0.1-alpha.237 → 0.0.1-alpha.239

package/dist/services/historicalOrderCharts.js

@@ -1,12 +1,12 @@
-import { timestampSecondsToUTCTimestamp } from '../services/time';
-import { sortBy } from 'lodash';
+import { timestampSecondsToUTCTimestamp } from "../services/time";
+import { sortBy } from "lodash";
 export function prepareHistoricalOrderChartData(takeOrderEntities, colorTheme) {
     const transformedData = takeOrderEntities.map((d) => ({
         value: Math.abs(Number(d.inputVaultBalanceChange.formattedAmount) /
             Number(d.outputVaultBalanceChange.formattedAmount)),
         time: timestampSecondsToUTCTimestamp(BigInt(d.timestamp)),
-        color: colorTheme == 'dark' ? '#5178FF' : '#4E4AF6',
-        outputAmount: Number(d.outputVaultBalanceChange.amount)
+        color: colorTheme == "dark" ? "#5178FF" : "#4E4AF6",
+        outputAmount: Number(d.outputVaultBalanceChange.amount),
     }));
     // if we have multiple object in the array with the same timestamp, we need to merge them
     // we do this by taking the weighted average of the ioratio values for objects that share the same timestamp.
@@ -22,7 +22,7 @@ export function prepareHistoricalOrderChartData(takeOrderEntities, colorTheme) {
             finalData.push({
                 value: ioratioAverage,
                 time: timestamp,
-                color: objectsWithSameTimestamp[0].color
+                color: objectsWithSameTimestamp[0].color,
             });
         }
         else {
@@ -33,196 +33,196 @@ export function prepareHistoricalOrderChartData(takeOrderEntities, colorTheme) {
 }
 if (import.meta.vitest) {
     const { it, expect } = import.meta.vitest;
-    it('transforms and sorts data as expected', () => {
+    it("transforms and sorts data as expected", () => {
         const takeOrderEntities = [
             {
-                id: '1',
+                id: "1",
                 timestamp: BigInt(1632000000),
                 transaction: {
-                    id: 'transaction_id',
-                    from: '0xsender_address',
+                    id: "transaction_id",
+                    from: "0xsender_address",
                     timestamp: BigInt(1632000000),
-                    blockNumber: BigInt(0)
+                    blockNumber: BigInt(0),
                 },
                 outputVaultBalanceChange: {
                     amount: BigInt(100),
-                    formattedAmount: '100',
+                    formattedAmount: "100",
                     vaultId: BigInt(1),
-                    __typename: 'Withdraw',
+                    __typename: "Withdraw",
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: 'sender_address',
+                        id: "transaction_id",
+                        from: "sender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderHash: 'orderHash',
+                orderHash: "orderHash",
                 inputVaultBalanceChange: {
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     amount: BigInt(50),
-                    formattedAmount: '50',
-                    __typename: 'Withdraw',
+                    formattedAmount: "50",
+                    __typename: "Withdraw",
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderbook: '0x00'
+                raindex: "0x00",
             },
             {
-                id: '2',
+                id: "2",
                 timestamp: BigInt(1631000000),
                 transaction: {
-                    id: 'transaction_id',
-                    from: '0xsender_address',
+                    id: "transaction_id",
+                    from: "0xsender_address",
                     timestamp: BigInt(1631000000),
-                    blockNumber: BigInt(0)
+                    blockNumber: BigInt(0),
                 },
                 outputVaultBalanceChange: {
                     amount: BigInt(100),
-                    formattedAmount: '100',
+                    formattedAmount: "100",
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
-                    __typename: 'Withdraw',
+                    formattedOldBalance: "0",
+                    __typename: "Withdraw",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderHash: 'orderHash',
+                orderHash: "orderHash",
                 inputVaultBalanceChange: {
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     amount: BigInt(50),
-                    formattedAmount: '50',
-                    __typename: 'Withdraw',
+                    formattedAmount: "50",
+                    __typename: "Withdraw",
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderbook: '0x00'
+                raindex: "0x00",
             },
             {
-                id: '3',
+                id: "3",
                 timestamp: BigInt(1630000000),
                 transaction: {
-                    id: 'transaction_id',
-                    from: '0xsender_address',
+                    id: "transaction_id",
+                    from: "0xsender_address",
                     timestamp: BigInt(1630000000),
-                    blockNumber: BigInt(0)
+                    blockNumber: BigInt(0),
                 },
                 outputVaultBalanceChange: {
                     amount: BigInt(100),
-                    formattedAmount: '100',
+                    formattedAmount: "100",
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
-                    __typename: 'Withdraw',
+                    formattedOldBalance: "0",
+                    __typename: "Withdraw",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: 'sender_address',
+                        id: "transaction_id",
+                        from: "sender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderHash: 'orderHash',
+                orderHash: "orderHash",
                 inputVaultBalanceChange: {
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     amount: BigInt(50),
-                    formattedAmount: '50',
-                    __typename: 'Withdraw',
+                    formattedAmount: "50",
+                    __typename: "Withdraw",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: 'sender_address',
+                        id: "transaction_id",
+                        from: "sender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderbook: '0x00'
-            }
+                raindex: "0x00",
+            },
         ];
-        const result = prepareHistoricalOrderChartData(takeOrderEntities, 'dark');
+        const result = prepareHistoricalOrderChartData(takeOrderEntities, "dark");
         expect(result.length).toEqual(3);
         expect(result[0].value).toEqual(0.5);
         expect(result[0].time).toEqual(1630000000);
@@ -231,195 +231,195 @@ if (import.meta.vitest) {
         expect(result[2].value).toEqual(0.5);
         expect(result[2].time).toEqual(1632000000);
         // check the color
-        expect(result[0].color).toEqual('#5178FF');
-        expect(result[1].color).toEqual('#5178FF');
-        expect(result[2].color).toEqual('#5178FF');
+        expect(result[0].color).toEqual("#5178FF");
+        expect(result[1].color).toEqual("#5178FF");
+        expect(result[2].color).toEqual("#5178FF");
     });
-    it('handles the case where multiple trades have the same timestamp', () => {
+    it("handles the case where multiple trades have the same timestamp", () => {
         const takeOrderEntities = [
             {
-                id: '1',
+                id: "1",
                 timestamp: BigInt(1632000000),
                 transaction: {
-                    id: 'transaction_id',
-                    from: '0xsender_address',
+                    id: "transaction_id",
+                    from: "0xsender_address",
                     timestamp: BigInt(1632000000),
-                    blockNumber: BigInt(0)
+                    blockNumber: BigInt(0),
                 },
                 outputVaultBalanceChange: {
                     amount: BigInt(100),
-                    formattedAmount: '100',
+                    formattedAmount: "100",
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    __typename: 'Withdraw',
-                    orderbook: '0x1'
+                    __typename: "Withdraw",
+                    raindex: "0x1",
                 },
-                orderHash: 'orderHash',
+                orderHash: "orderHash",
                 inputVaultBalanceChange: {
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     amount: BigInt(50),
-                    formattedAmount: '50',
+                    formattedAmount: "50",
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderbook: '0x00'
+                raindex: "0x00",
             },
             {
-                id: '2',
+                id: "2",
                 timestamp: BigInt(1632000000),
                 transaction: {
-                    id: 'transaction_id',
-                    from: '0xsender_address',
+                    id: "transaction_id",
+                    from: "0xsender_address",
                     timestamp: BigInt(1632000000),
-                    blockNumber: BigInt(0)
+                    blockNumber: BigInt(0),
                 },
                 outputVaultBalanceChange: {
                     amount: BigInt(200),
-                    formattedAmount: '200',
+                    formattedAmount: "200",
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderHash: 'orderHash',
+                orderHash: "orderHash",
                 inputVaultBalanceChange: {
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     amount: BigInt(50),
-                    formattedAmount: '50',
+                    formattedAmount: "50",
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderbook: '0x00'
+                raindex: "0x00",
             },
             {
-                id: '3',
+                id: "3",
                 timestamp: BigInt(1632000000),
                 transaction: {
-                    id: 'transaction_id',
-                    from: '0xsender_address',
+                    id: "transaction_id",
+                    from: "0xsender_address",
                     timestamp: BigInt(1632000000),
-                    blockNumber: BigInt(0)
+                    blockNumber: BigInt(0),
                 },
                 outputVaultBalanceChange: {
                     amount: BigInt(400),
-                    formattedAmount: '400',
+                    formattedAmount: "400",
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderHash: 'orderHash',
+                orderHash: "orderHash",
                 inputVaultBalanceChange: {
                     vaultId: BigInt(1),
                     token: {
-                        id: 'output_token_id',
-                        address: '0xoutput_token',
-                        name: 'output_token',
-                        symbol: 'output_token',
-                        decimals: BigInt(1)
+                        id: "output_token_id",
+                        address: "0xoutput_token",
+                        name: "output_token",
+                        symbol: "output_token",
+                        decimals: BigInt(1),
                     },
                     amount: BigInt(50),
-                    formattedAmount: '50',
+                    formattedAmount: "50",
                     newBalance: BigInt(0),
-                    formattedNewBalance: '0',
+                    formattedNewBalance: "0",
                     oldBalance: BigInt(0),
-                    formattedOldBalance: '0',
+                    formattedOldBalance: "0",
                     timestamp: BigInt(0),
                     transaction: {
-                        id: 'transaction_id',
-                        from: '0xsender_address',
+                        id: "transaction_id",
+                        from: "0xsender_address",
                         timestamp: BigInt(1632000000),
-                        blockNumber: BigInt(0)
+                        blockNumber: BigInt(0),
                     },
-                    orderbook: '0x1'
+                    raindex: "0x1",
                 },
-                orderbook: '0x00'
-            }
+                raindex: "0x00",
+            },
         ];
-        const result = prepareHistoricalOrderChartData(takeOrderEntities, 'dark');
+        const result = prepareHistoricalOrderChartData(takeOrderEntities, "dark");
         // calculate the weighted average of the ioratio values
         const ioratioSum = 0.5 * 100 + 0.25 * 200 + 0.125 * 400;
         const outputAmountSum = 100 + 200 + 400;
@@ -427,4 +427,63 @@ if (import.meta.vitest) {
         expect(result.length).toEqual(1);
         expect(result[0].value).toEqual(ioratioAverage);
     });
+    // Minimal trade builder: prepareHistoricalOrderChartData only reads
+    // timestamp, the two formattedAmount values and the output amount.
+    const makeTrade = (args) => ({
+        timestamp: BigInt(args.timestamp),
+        inputVaultBalanceChange: {
+            formattedAmount: args.inputFormatted,
+        },
+        outputVaultBalanceChange: {
+            formattedAmount: args.outputFormatted,
+            amount: args.outputAmount,
+        },
+    });
+    it("uses the light theme colour when colorTheme is not 'dark'", () => {
+        const trades = [
+            makeTrade({
+                timestamp: 1632000000,
+                inputFormatted: "50",
+                outputFormatted: "100",
+                outputAmount: BigInt(100),
+            }),
+        ];
+        const result = prepareHistoricalOrderChartData(trades, "light");
+        expect(result.length).toEqual(1);
+        expect(result[0].color).toEqual("#4E4AF6");
+    });
+    it("returns the absolute value of the io ratio (the output vault balance change is negative)", () => {
+        // The output vault balance change is debited, so its formattedAmount is negative;
+        // the raw input/output ratio is negative (50 / -100 = -0.5) and Math.abs yields
+        // the positive charted value.
+        const trades = [
+            makeTrade({
+                timestamp: 1632000000,
+                inputFormatted: "50",
+                outputFormatted: "-100",
+                outputAmount: BigInt(100),
+            }),
+        ];
+        const result = prepareHistoricalOrderChartData(trades, "dark");
+        expect(result.length).toEqual(1);
+        expect(result[0].value).toEqual(0.5);
+    });
+    it("keeps a single trade's value as-is even when its output amount is zero", () => {
+        // A lone trade at a timestamp must go through the single-trade branch and
+        // be preserved verbatim. The merge (weighted-average) branch would divide
+        // by the zero output amount and produce NaN, so a zero output amount
+        // distinguishes the two branches.
+        const trades = [
+            makeTrade({
+                timestamp: 1632000000,
+                inputFormatted: "50",
+                outputFormatted: "100",
+                outputAmount: BigInt(0),
+            }),
+        ];
+        const result = prepareHistoricalOrderChartData(trades, "dark");
+        expect(result.length).toEqual(1);
+        expect(result[0].value).toEqual(0.5);
+        expect(Number.isNaN(result[0].value)).toBe(false);
+    });
 }