Merge pull request #267 from deriv-com/hasan/live-market-card-fix

deriv-com · Dec 15, 2023 · 0b7244f · 0b7244f
2 parents 47f6eb9 + b2b419b
commit 0b7244f
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 5 deletions.
diff --git a/libs/components/src/lib/card/live-market/buy-sell.buttons.tsx b/libs/components/src/lib/card/live-market/buy-sell.buttons.tsx
@@ -1,15 +1,21 @@
 import { Text, TradeButton } from '@deriv/quill-design';
 import { MarketStatus } from '../types';
 
+export type BuySellButtonsProps = {
+  status: MarketStatus;
+  spread: string;
+  textClass: string;
+  onClickBuyButton?: () => void;
+  onClickSellButton?: () => void;
+};
+
 export const BuySellButtons = ({
   status,
   spread,
   textClass,
-}: {
-  status: MarketStatus;
-  spread: string;
-  textClass: string;
-}) => {
+  onClickBuyButton,
+  onClickSellButton,
+}: BuySellButtonsProps) => {
   return (
     <div className="flex flex-col gap-gap-md">
       <div className="flex flex-row gap-gap-md">
@@ -26,6 +32,7 @@ export const BuySellButtons = ({
           variant="secondary"
           disabled={status === 'closed'}
           className="flex-1"
+          onClick={onClickBuyButton}
         >
           Buy
         </TradeButton>
@@ -34,6 +41,7 @@ export const BuySellButtons = ({
           variant="secondary"
           disabled={status === 'closed'}
           className="flex-1"
+          onClick={onClickSellButton}
         >
           Sell
         </TradeButton>

diff --git a/libs/components/src/lib/card/live-market/index.tsx b/libs/components/src/lib/card/live-market/index.tsx
@@ -50,6 +50,8 @@ export const LiveMarketCard: React.FC<LiveMarketCardProps> = ({
   bidPrice,
   askPrice,
   spread,
+  onClickBuyButton,
+  onClickSellButton,
 }) => {
   const textClassName =
     status === 'closed'
@@ -101,6 +103,8 @@ export const LiveMarketCard: React.FC<LiveMarketCardProps> = ({
         status={status}
         spread={spread}
         textClass={textClassName}
+        onClickBuyButton={onClickBuyButton}
+        onClickSellButton={onClickSellButton}
       />
     </div>
   );

diff --git a/libs/components/src/lib/card/types/index.ts b/libs/components/src/lib/card/types/index.ts
@@ -44,4 +44,6 @@ export interface LiveMarketContent {
   bidPrice: string;
   askPrice: string;
   spread: string;
+  onClickBuyButton?: () => void;
+  onClickSellButton?: () => void;
 }