Merge pull request #194 from rainlanguage/2024-02-07-gui-clear-orders

feat(tauri): order clears list page

tauri-app/src-tauri/src/commands/mod.rs

@@ -3,3 +3,4 @@ pub mod fork;
 pub mod order;
 pub mod vault;
 pub mod wallet;
+pub mod order_clear;

tauri-app/src-tauri/src/commands/order_clear.rs

@@ -0,0 +1,43 @@
+use crate::error::CommandResult;
+use rain_orderbook_common::subgraph::SubgraphArgs;
+use rain_orderbook_subgraph_client::{
+    types::{flattened::{OrderClearFlattened, TryIntoFlattenedError}, order_clears_list},
+    TryIntoCsv,
+    PaginationArgs,
+};
+use std::path::PathBuf;
+use std::fs;
+
+#[tauri::command]
+pub async fn order_clears_list(
+    subgraph_args: SubgraphArgs,
+    pagination_args: PaginationArgs,
+) -> CommandResult<Vec<order_clears_list::OrderClear>> {
+    let order_clears = subgraph_args
+        .to_subgraph_client()
+        .await?
+        .order_clears_list(pagination_args)
+        .await?;
+    Ok(order_clears)
+}
+
+#[tauri::command]
+pub async fn order_clears_list_write_csv(
+    path: PathBuf,
+    subgraph_args: SubgraphArgs,
+    pagination_args: PaginationArgs,
+) -> CommandResult<()> {
+    let order_clears = subgraph_args
+        .to_subgraph_client()
+        .await?
+        .order_clears_list(pagination_args)
+        .await?;
+    let order_clears_flattened: Vec<OrderClearFlattened> = order_clears
+            .into_iter()
+            .map(|o| o.try_into())
+            .collect::<Result<Vec<OrderClearFlattened>, TryIntoFlattenedError>>()?;
+    let csv_text = order_clears_flattened.try_into_csv()?;
+    fs::write(path, csv_text)?;
+
+    Ok(())
+}

tauri-app/src-tauri/src/main.rs

@@ -13,6 +13,7 @@ use commands::vault::{
     vault_deposit, vault_detail, vault_list_balance_changes, vault_list_balance_changes_write_csv,
     vault_withdraw, vaults_list, vaults_list_write_csv,
 };
+use commands::order_clear::{order_clears_list, order_clears_list_write_csv};
 use commands::wallet::get_address_from_ledger;
 
 fn main() {
@@ -30,6 +31,8 @@ fn main() {
             order_detail,
             order_add,
             order_remove,
+            order_clears_list,
+            order_clears_list_write_csv,
             get_address_from_ledger,
             get_chainid,
             parse_dotrain,

tauri-app/src/lib/components/Sidebar.svelte

@@ -15,6 +15,7 @@
   import { page } from '$app/stores';
   import { isSettingsDefinedAndValid } from '$lib/stores/settings';
   import ButtonDarkMode from './ButtonDarkMode.svelte';
+  import { CashSolid } from 'flowbite-svelte-icons';
 
   $: nonActiveClass = $isSettingsDefinedAndValid
     ? 'flex items-center p-2 text-base font-normal text-green-900 rounded-lg dark:text-white hover:bg-green-100 dark:hover:bg-green-700'
@@ -49,6 +50,11 @@
           <ReceiptSolid class="h-5 w-5" />
         </svelte:fragment>
       </SidebarItem>
+      <SidebarItem label="Order Clears" href="/order-clears" {nonActiveClass}>
+        <svelte:fragment slot="icon">
+          <CashSolid class="h-5 w-5" />
+        </svelte:fragment>
+      </SidebarItem>
     </SidebarGroup>
     <SidebarGroup border>
       <SidebarItem label="Settings" href="/settings">

tauri-app/src/lib/components/TableOrders.svelte

@@ -26,7 +26,7 @@
   export let ordersList: PaginatedCachedStore<Order>;
 </script>
 
-{#if $ordersList.page.length === 0}
+{#if $ordersList.currentPage.length === 0}
   <div class="text-center text-gray-900 dark:text-white">No Orders found</div>
 {:else}
   <Table divClass="cursor-pointer" hoverable={true}>

tauri-app/src/lib/stores/orderClearsList.ts

@@ -0,0 +1,11 @@
+import { get } from 'svelte/store';
+import type { OrderClear } from '$lib/typeshare/orderClearsList';
+import { invoke } from '@tauri-apps/api';
+import { subgraphUrl } from '$lib/stores/settings';
+import { listStore } from '$lib/storesGeneric/listStore';
+
+export const orderClearsList = listStore<OrderClear>(
+  'orderClearsList',
+  (page) => invoke("order_clears_list", {subgraphArgs: { url: get(subgraphUrl)}, paginationArgs: { page, page_size: 10 } }),
+  (path) => invoke("order_clears_list_write_csv", { path, subgraphArgs: { url: get(subgraphUrl)}, paginationArgs: { page: 1, page_size: 1000 } })
+);

tauri-app/src/routes/order-clears/+page.svelte

@@ -0,0 +1,63 @@
+<script lang="ts">
+  import { redirectIfSettingsNotDefined } from '$lib/utils/redirect';
+  import {
+    Table,
+    TableBody,
+    TableBodyCell,
+    TableBodyRow,
+    TableHead,
+    TableHeadCell,
+  } from 'flowbite-svelte';
+  import { goto } from '$app/navigation';
+  import { orderClearsList } from '$lib/stores/orderClearsList';
+  import PageHeader from '$lib/components/PageHeader.svelte';
+  import ButtonsPagination from '$lib/components/ButtonsPagination.svelte';
+  import ButtonLoading from '$lib/components/ButtonLoading.svelte';
+  import Hash from '$lib/components/Hash.svelte';
+  import { HashType } from '$lib/utils/hash';
+  import { formatTimestampSecondsAsLocal } from '$lib/utils/time';
+  import { FileCsvOutline } from 'flowbite-svelte-icons';
+
+  redirectIfSettingsNotDefined();
+  orderClearsList.fetchFirst();
+</script>
+
+<PageHeader title="Order Clears" />
+
+
+{#if $orderClearsList.currentPage.length === 0}
+  <div class="text-center text-gray-900 dark:text-white">No Order Clears found</div>
+{:else}
+  <Table divClass="cursor-pointer" hoverable={true}>
+    <TableHead>
+      <TableHeadCell>Order Clear ID</TableHeadCell>
+      <TableHeadCell>Cleared At</TableHeadCell>
+      <TableHeadCell>Sender</TableHeadCell>
+      <TableHeadCell>Clearer</TableHeadCell>
+      <TableHeadCell>Bounty A</TableHeadCell>
+      <TableHeadCell>Bounty B</TableHeadCell>
+    </TableHead>
+    <TableBody>
+      {#each $orderClearsList.currentPage as orderClear}
+        <TableBodyRow on:click={() => {goto(`/order-clears/${orderClear.id}`)}}>
+          <TableBodyCell tdClass="break-all px-4 py-2"><Hash type={HashType.Identifier} value={orderClear.id} /></TableBodyCell>
+          <TableBodyCell tdClass="break-word px-4 py-2">
+            {formatTimestampSecondsAsLocal(BigInt(orderClear.timestamp))}
+          </TableBodyCell>
+          <TableBodyCell tdClass="break-all px-4 py-2 min-w-48"><Hash type={HashType.Wallet} value={orderClear.sender.id} /></TableBodyCell>
+          <TableBodyCell tdClass="break-all px-4 py-2 min-w-48"><Hash type={HashType.Wallet} value={orderClear.clearer.id} /></TableBodyCell>
+          <TableBodyCell tdClass="break-all px-4 py-2 min-w-48">{orderClear.bounty.bounty_amount_adisplay} {orderClear.bounty.bounty_token_a.symbol}</TableBodyCell>
+          <TableBodyCell tdClass="break-all px-4 py-2 min-w-48">{orderClear.bounty.bounty_amount_bdisplay} {orderClear.bounty.bounty_token_b.symbol}</TableBodyCell>
+        </TableBodyRow>
+      {/each}
+    </TableBody>
+  </Table>
+
+  <div class="flex justify-between mt-2">
+    <ButtonLoading size="xs" color="blue" on:click={() => orderClearsList.exportCsv()} loading={$orderClearsList.isExporting}>
+      <FileCsvOutline class="w-4 h-4 mr-2"/>
+      Export to CSV
+    </ButtonLoading>
+    <ButtonsPagination index={$orderClearsList.index} on:previous={orderClearsList.fetchPrev} on:next={orderClearsList.fetchNext} loading={$orderClearsList.isFetching} />
+  </div>
+{/if}

tauri-app/src/routes/vaults/+page.svelte

@@ -38,7 +38,7 @@
 
 <PageHeader title="Vaults" />
 
-{#if $vaultsList.page.length === 0}
+{#if $vaultsList.currentPage.length === 0}
   <div class="text-center text-gray-900 dark:text-white">No Vaults found</div>
 {:else}
   <Table divClass="cursor-pointer" hoverable={true}>