diff --git a/app/orders/columns.tsx b/app/orders/columns.tsx index e2b3d8f1..354917f4 100644 --- a/app/orders/columns.tsx +++ b/app/orders/columns.tsx @@ -1,4 +1,4 @@ -import { OrderState, Token } from "@renegade-fi/react" +import { OrderState, Token, useBackOfQueueWallet } from "@renegade-fi/react" import { ColumnDef, RowData } from "@tanstack/react-table" import { ChevronDown, ChevronUp, ChevronsUpDown } from "lucide-react" import { formatUnits } from "viem/utils" @@ -105,12 +105,25 @@ export const columns: ColumnDef[] = [ id: "status", accessorKey: "state", header: () =>
Status
, - cell: ({ row }) => { - return ( -
- {formatOrderState[row.getValue("status")]} -
- ) + cell: function Cell({ row }) { + const { data: isCapitalized } = useBackOfQueueWallet({ + query: { + select: (data) => + data.balances.some( + (balance) => + balance.mint === + (row.original.data.side === "Buy" + ? row.original.data.quote_mint + : row.original.data.base_mint) && + balance.amount > BigInt(0), + ), + }, + }) + let status: string = formatOrderState[row.getValue("status")] + if (!isCapitalized && status === "Open") { + status = "Undercapitalized" + } + return
{status}
}, filterFn: (row, _, filterValue) => { if (filterValue === "open") { @@ -259,7 +272,7 @@ export const columns: ColumnDef[] = [ return row.fills.reduce((acc, fill) => acc + fill.amount, BigInt(0)) }, header: () =>
Filled
, - cell: ({ row }) => { + cell: function Cell({ row }) { const filledAmount = row.getValue("filled") const totalAmount = row.getValue("amount") const percentageFilled = @@ -272,28 +285,43 @@ export const columns: ColumnDef[] = [ Number(filledAmount), Number(totalAmount), ) - return ( - <> - {!row.original.fills.length && - row.original.state !== OrderState.Cancelled ? ( -
- Finding counterparties - -
- ) : ( -
- {percentageFilledNumber ? ( - - ) : ( - <> - )} -
- {percentageFilledLabel} -
+ const { data: isCapitalized } = useBackOfQueueWallet({ + query: { + select: (data) => + data.balances.some( + (balance) => + balance.mint === + (row.original.data.side === "Buy" + ? row.original.data.quote_mint + : row.original.data.base_mint) && + balance.amount > BigInt(0), + ), + }, + }) + if ( + row.original.fills.length || + row.original.state === OrderState.Cancelled + ) { + return ( +
+ {percentageFilledNumber ? ( + + ) : ( + <> + )} +
+ {percentageFilledLabel}
- )} - - ) +
+ ) + } else if (isCapitalized) { + return ( +
+ Finding counterparties + +
+ ) + } }, }, { diff --git a/components/dialogs/order-stepper/desktop/new-order-stepper.tsx b/components/dialogs/order-stepper/desktop/new-order-stepper.tsx index cb0c3b61..0e1fec14 100644 --- a/components/dialogs/order-stepper/desktop/new-order-stepper.tsx +++ b/components/dialogs/order-stepper/desktop/new-order-stepper.tsx @@ -1,19 +1,10 @@ import * as React from "react" -import { VisuallyHidden } from "@radix-ui/react-visually-hidden" - import { NewOrderFormProps } from "@/app/trade/[base]/components/new-order/new-order-form" import { DefaultStep } from "@/components/dialogs/order-stepper/desktop/steps/default" import { SuccessStepWithoutSavings } from "@/components/dialogs/order-stepper/desktop/steps/success-without-savings" -import { - Dialog, - DialogContent, - DialogDescription, - DialogHeader, - DialogTitle, - DialogTrigger, -} from "@/components/ui/dialog" +import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog" export interface NewOrderConfirmationProps extends NewOrderFormProps { onSuccess?: () => void diff --git a/components/dialogs/order-stepper/desktop/steps/default.tsx b/components/dialogs/order-stepper/desktop/steps/default.tsx index f953fb14..d1b0e2ea 100644 --- a/components/dialogs/order-stepper/desktop/steps/default.tsx +++ b/components/dialogs/order-stepper/desktop/steps/default.tsx @@ -1,7 +1,12 @@ import React from "react" import { VisuallyHidden } from "@radix-ui/react-visually-hidden" -import { Token, UpdateType, useCreateOrder } from "@renegade-fi/react" +import { + Token, + UpdateType, + useBackOfQueueWallet, + useCreateOrder, +} from "@renegade-fi/react" import { Loader2 } from "lucide-react" import { toast } from "sonner" @@ -14,9 +19,11 @@ import { NewOrderConfirmationProps, useStepper, } from "@/components/dialogs/order-stepper/desktop/new-order-stepper" +import { TransferDialog } from "@/components/dialogs/transfer/transfer-dialog" import { TokenIcon } from "@/components/token-icon" import { Button } from "@/components/ui/button" import { + DialogClose, DialogDescription, DialogFooter, DialogHeader, @@ -40,7 +47,7 @@ import { formatNumber, safeParseUnits } from "@/lib/format" import { decimalCorrectPrice } from "@/lib/utils" export function DefaultStep(props: NewOrderConfirmationProps) { - const { onNext, setTaskId } = useStepper() + const { onNext, setTaskId, setOpen } = useStepper() const baseToken = Token.findByTicker(props.base) const quoteToken = Token.findByTicker("USDC") @@ -76,6 +83,82 @@ export function DefaultStep(props: NewOrderConfirmationProps) { }, }) + const { data: hasBalances } = useBackOfQueueWallet({ + query: { + select: (data) => + data.balances.some((balance) => balance.amount > BigInt(0)), + }, + }) + const parsedAmount = safeParseUnits(props.amount, baseToken.decimals) + const formattedAmount = formatNumber( + parsedAmount instanceof Error ? BigInt(0) : parsedAmount, + baseToken.decimals, + true, + ) + + if (!hasBalances) { + return ( + <> + + Funds Required + + + Deposit {props.isSell ? props.base : "USDC"} to place this order. + + + + +
+
+
+ {props.isSell ? "Sell" : "Buy"} +
+
+
+ {formattedAmount} {props.base} +
+ +
+
+
+
+ {props.isSell ? "For" : "With"} +
+
+
USDC
+ +
+
+ +
+
+
+ + You must fund your account before placing an order. + +
+
+
+ + + + + + + + ) + } + return ( <>