Merge pull request #1096 from rainlanguage/Replace-subgraph-types-wit…

…h-js_api

crates/common/src/types/order_detail_extended.rs

@@ -1,10 +1,14 @@
 use crate::meta::{TryDecodeRainlangSource, TryDecodeRainlangSourceError};
+#[cfg(target_family = "wasm")]
+use rain_orderbook_bindings::{impl_all_wasm_traits, wasm_traits::prelude::*};
 use rain_orderbook_subgraph_client::types::common::Order;
 use serde::{Deserialize, Serialize};
 use typeshare::typeshare;
 
-#[typeshare]
 #[derive(Serialize, Deserialize, Clone, Debug)]
+#[cfg_attr(target_family = "wasm", derive(Tsify))]
+#[serde(rename_all = "camelCase")]
+#[typeshare]
 pub struct OrderDetailExtended {
     pub order: Order,
     pub rainlang: Option<String>,
@@ -26,3 +30,6 @@ impl TryFrom<Order> for OrderDetailExtended {
         })
     }
 }
+
+#[cfg(target_family = "wasm")]
+impl_all_wasm_traits!(OrderDetailExtended);

crates/subgraph/src/types/common.rs

@@ -203,6 +203,7 @@ pub struct VaultBalanceChangeVault {
 #[typeshare]
 #[serde(rename_all = "camelCase")]
 pub struct VaultBalanceChangeUnwrapped {
+    #[serde(rename = "__typename")]
     pub __typename: String,
     pub amount: BigInt,
     pub new_vault_balance: BigInt,
@@ -233,6 +234,7 @@ pub enum VaultBalanceChange {
 #[serde(rename_all = "camelCase")]
 pub struct Deposit {
     pub id: Bytes,
+    #[serde(rename = "__typename")]
     pub __typename: String,
     #[cfg_attr(target_family = "wasm", tsify(type = "SgBigInt"))]
     pub amount: BigInt,
@@ -253,6 +255,7 @@ pub struct Deposit {
 #[serde(rename_all = "camelCase")]
 pub struct Withdrawal {
     pub id: Bytes,
+    #[serde(rename = "__typename")]
     pub __typename: String,
     #[cfg_attr(target_family = "wasm", tsify(type = "SgBigInt"))]
     pub amount: BigInt,
@@ -273,6 +276,7 @@ pub struct Withdrawal {
 #[serde(rename_all = "camelCase")]
 pub struct TradeVaultBalanceChange {
     pub id: Bytes,
+    #[serde(rename = "__typename")]
     pub __typename: String,
     #[cfg_attr(target_family = "wasm", tsify(type = "SgBigInt"))]
     pub amount: BigInt,
@@ -293,6 +297,7 @@ pub struct TradeVaultBalanceChange {
 #[serde(rename_all = "camelCase")]
 pub struct ClearBounty {
     pub id: Bytes,
+    #[serde(rename = "__typename")]
     pub __typename: String,
     #[cfg_attr(target_family = "wasm", tsify(type = "SgBigInt"))]
     pub amount: BigInt,
@@ -346,9 +351,11 @@ pub struct OrderStructPartialTrade {
 pub struct Erc20 {
     pub id: Bytes,
     pub address: Bytes,
+    #[cfg_attr(target_family = "wasm", tsify(type = "string | undefined"))]
     pub name: Option<String>,
+    #[cfg_attr(target_family = "wasm", tsify(type = "string | undefined"))]
     pub symbol: Option<String>,
-    #[cfg_attr(target_family = "wasm", tsify(type = "SgBigInt"))]
+    #[cfg_attr(target_family = "wasm", tsify(type = "SgBigInt | undefined"))]
     pub decimals: Option<BigInt>,
 }
 

packages/ui-components/src/__tests__/ButtonVaultLink.test.ts

@@ -3,7 +3,7 @@ import { render, screen } from '@testing-library/svelte';
 import ButtonVaultLink from '../lib/components/ButtonVaultLink.svelte';
 import * as navigation from '$app/navigation';
 import { userEvent } from '@testing-library/user-event';
-import type { Vault } from '../lib/typeshare/subgraphTypes';
+import type { Vault } from '@rainlanguage/orderbook/js_api';
 
 // Mock the $app/navigation module
 vi.mock('$app/navigation', () => ({

packages/ui-components/src/__tests__/OrderTradesListTable.test.ts

@@ -2,7 +2,7 @@ import { render, screen, waitFor } from '@testing-library/svelte';
 import { test, vi, type Mock } from 'vitest';
 import { expect } from '../lib/test/matchers';
 import { mockIPC } from '@tauri-apps/api/mocks';
-import type { Trade } from '../lib/typeshare/subgraphTypes';
+import type { Trade } from '@rainlanguage/orderbook/js_api';
 import { formatUnits } from 'viem';
 import OrderTradesListTable from '../lib/components/tables/OrderTradesListTable.svelte';
 import { QueryClient } from '@tanstack/svelte-query';
@@ -34,7 +34,7 @@ const mockTradeOrdersList: Trade[] = [
 				}
 			},
 			id: '1',
-			typename: 'Withdraw',
+			__typename: 'Withdraw',
 			newVaultBalance: '0',
 			oldVaultBalance: '0',
 			timestamp: '0',
@@ -64,7 +64,7 @@ const mockTradeOrdersList: Trade[] = [
 			},
 			amount: '50',
 			id: '1',
-			typename: 'Withdraw',
+			__typename: 'Withdraw',
 			newVaultBalance: '0',
 			oldVaultBalance: '0',
 			timestamp: '0',
@@ -106,7 +106,7 @@ const mockTradeOrdersList: Trade[] = [
 				}
 			},
 			id: '1',
-			typename: 'Withdraw',
+			__typename: 'Withdraw',
 			newVaultBalance: '0',
 			oldVaultBalance: '0',
 			timestamp: '0',
@@ -136,7 +136,7 @@ const mockTradeOrdersList: Trade[] = [
 			},
 			amount: '50',
 			id: '1',
-			typename: 'Withdraw',
+			__typename: 'Withdraw',
 			newVaultBalance: '0',
 			oldVaultBalance: '0',
 			timestamp: '0',

packages/ui-components/src/lib/__fixtures__/orderDetail.ts

@@ -1,4 +1,4 @@
-import type { OrderDetailExtended } from '../typeshare/subgraphTypes';
+import type { OrderDetailExtended } from '@rainlanguage/orderbook/js_api';
 
 export const mockOrderDetailsExtended: OrderDetailExtended = {
 	order: {
@@ -63,7 +63,7 @@ export const mockOrderDetailsExtended: OrderDetailExtended = {
 		trades: []
 	},
 	rainlang: 'rainlang1'
-};
+} as unknown as OrderDetailExtended;
 
 export const mockOrder = {
 	id: '0x9229dadc45c673afcbc393231d5ab0e15bb65719daa5d58bd85adfca3fd60d48',

packages/ui-components/src/lib/components/ButtonVaultLink.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import type { Vault } from '../typeshare/subgraphTypes';
+	import type { Vault } from '@rainlanguage/orderbook/js_api';
 	import { bigintStringToHex } from '../utils/hex';
 	import { Tooltip } from 'flowbite-svelte';
 	import { formatUnits } from 'viem';

packages/ui-components/src/lib/components/tables/OrderTradesListTable.svelte

@@ -9,7 +9,7 @@
 	import Hash, { HashType } from '../Hash.svelte';
 	import { formatUnits } from 'viem';
 	import { BugOutline } from 'flowbite-svelte-icons';
-	import type { Trade } from '../../typeshare/subgraphTypes';
+	import type { Trade } from '@rainlanguage/orderbook/js_api';
 	import TableTimeFilters from '../charts/TableTimeFilters.svelte';
 
 	export let id: string;

packages/ui-components/src/lib/index.ts

@@ -50,7 +50,6 @@ export { default as IconWarning } from './components/IconWarning.svelte';
 //Types
 export type { AppStoresInterface } from './types/appStores.ts';
 export type { ConfigSource, OrderbookConfigSource, OrderbookRef } from './typeshare/config';
-export type { Vault } from './typeshare/subgraphTypes';
 
 // Functions
 export { createResolvableQuery, createResolvableInfiniteQuery } from './__mocks__/queries';

packages/ui-components/src/lib/services/historicalOrderCharts.ts

@@ -1,4 +1,4 @@
-import type { Trade } from '../typeshare/subgraphTypes';
+import type { Trade } from '@rainlanguage/orderbook/js_api';
 import type { UTCTimestamp } from 'lightweight-charts';
 import { timestampSecondsToUTCTimestamp } from '../utils/time';
 import { sortBy } from 'lodash';
@@ -85,7 +85,7 @@ if (import.meta.vitest) {
 						}
 					},
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -115,7 +115,7 @@ if (import.meta.vitest) {
 					},
 					amount: '50',
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -157,7 +157,7 @@ if (import.meta.vitest) {
 						}
 					},
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -187,7 +187,7 @@ if (import.meta.vitest) {
 					},
 					amount: '50',
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -229,7 +229,7 @@ if (import.meta.vitest) {
 						}
 					},
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -259,7 +259,7 @@ if (import.meta.vitest) {
 					},
 					amount: '50',
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -321,7 +321,7 @@ if (import.meta.vitest) {
 						}
 					},
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -351,7 +351,7 @@ if (import.meta.vitest) {
 					},
 					amount: '50',
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -393,7 +393,7 @@ if (import.meta.vitest) {
 						}
 					},
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -423,7 +423,7 @@ if (import.meta.vitest) {
 					},
 					amount: '50',
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -465,7 +465,7 @@ if (import.meta.vitest) {
 						}
 					},
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',
@@ -495,7 +495,7 @@ if (import.meta.vitest) {
 					},
 					amount: '50',
 					id: '1',
-					typename: 'Withdraw',
+					__typename: 'Withdraw',
 					newVaultBalance: '0',
 					oldVaultBalance: '0',
 					timestamp: '0',

packages/ui-components/src/lib/utils/vault.ts

@@ -1,4 +1,4 @@
-import type { Vault } from '../typeshare/subgraphTypes';
+import type { Vault } from '@rainlanguage/orderbook/js_api';
 import { formatUnits } from 'viem';
 
 export const vaultBalanceDisplay = (vault: Vault) => {
@@ -25,7 +25,7 @@ if (import.meta.vitest) {
 			orderbook: {
 				id: '0x00'
 			}
-		} as Vault;
+		} as unknown as Vault;
 
 		expect(vaultBalanceDisplay(vault)).toEqual('1');
 

tauri-app/src/lib/components/charts/VaultBalanceChart.test.ts

@@ -48,7 +48,7 @@ vi.mock('lightweight-charts', async () => {
 
 const mockVaultBalanceChangeUnwrappeds: VaultBalanceChangeUnwrapped[] = [
   {
-    typename: 'Withdrawal',
+    __typename: 'Withdrawal',
     amount: '1000',
     oldVaultBalance: '5000',
     newVaultBalance: '4000',
@@ -75,7 +75,7 @@ const mockVaultBalanceChangeUnwrappeds: VaultBalanceChangeUnwrapped[] = [
     },
   },
   {
-    typename: 'TradeVaultBalanceChangeUnwrapped',
+    __typename: 'TradeVaultBalanceChangeUnwrapped',
     amount: '1500',
     oldVaultBalance: '4000',
     newVaultBalance: '2500',
@@ -102,7 +102,7 @@ const mockVaultBalanceChangeUnwrappeds: VaultBalanceChangeUnwrapped[] = [
     },
   },
   {
-    typename: 'Deposit',
+    __typename: 'Deposit',
     amount: '2000',
     oldVaultBalance: '2500',
     newVaultBalance: '4500',

tauri-app/src/lib/components/tables/VaultBalanceChangesTable.svelte

@@ -65,7 +65,7 @@
       {item.vault.token.symbol}
     </TableBodyCell>
     <TableBodyCell tdClass="break-word p-0 text-left" data-testid="vaultBalanceChangesTableType">
-      {item.typename}
+      {item.__typename}
     </TableBodyCell>
   </svelte:fragment>
 </TanstackAppTable>

tauri-app/src/lib/components/tables/VaultBalanceChangesTable.test.ts

@@ -29,7 +29,7 @@ test('renders the vault list table with correct data', async () => {
 
   const mockVaultBalanceChanges: VaultBalanceChangeUnwrapped[] = [
     {
-      typename: 'Withdrawal',
+      __typename: 'Withdrawal',
       amount: '1000',
       oldVaultBalance: '5000',
       newVaultBalance: '4000',
@@ -56,7 +56,7 @@ test('renders the vault list table with correct data', async () => {
       },
     },
     {
-      typename: 'TradeVaultBalanceChange',
+      __typename: 'TradeVaultBalanceChange',
       amount: '1500',
       oldVaultBalance: '4000',
       newVaultBalance: '2500',
@@ -83,7 +83,7 @@ test('renders the vault list table with correct data', async () => {
       },
     },
     {
-      typename: 'Deposit',
+      __typename: 'Deposit',
       amount: '2000',
       oldVaultBalance: '2500',
       newVaultBalance: '4500',
@@ -133,7 +133,7 @@ test('it shows the correct data in the table', async () => {
 
   const mockVaultBalanceChanges: VaultBalanceChangeUnwrapped[] = [
     {
-      typename: 'Withdrawal',
+      __typename: 'Withdrawal',
       amount: '1000',
       oldVaultBalance: '5000',
       newVaultBalance: '4000',

tauri-app/src/lib/queries/vaultBalanceChangesList.ts

@@ -36,7 +36,7 @@ if (import.meta.vitest) {
   it('uses the vault_balance_changes_list command correctly', async () => {
     const mockVaultBalanceChanges: VaultBalanceChangeUnwrapped[] = [
       {
-        typename: 'Withdrawal',
+        __typename: 'Withdrawal',
         amount: '1000',
         oldVaultBalance: '5000',
         newVaultBalance: '4000',
@@ -63,7 +63,7 @@ if (import.meta.vitest) {
         },
       },
       {
-        typename: 'TradeVaultBalanceChange',
+        __typename: 'TradeVaultBalanceChange',
         amount: '1500',
         oldVaultBalance: '4000',
         newVaultBalance: '2500',
@@ -90,7 +90,7 @@ if (import.meta.vitest) {
         },
       },
       {
-        typename: 'Deposit',
+        __typename: 'Deposit',
         amount: '2000',
         oldVaultBalance: '2500',
         newVaultBalance: '4500',