1 files changed, 26 insertions, 13 deletions
diff --git a/packages/instant/src/components/buy_order_state_buttons.tsx b/packages/instant/src/components/buy_order_state_buttons.tsx
index d01e9ff57..6f197a772 100644
--- a/packages/instant/src/components/buy_order_state_buttons.tsx
+++ b/packages/instant/src/components/buy_order_state_buttons.tsx
@@ -6,6 +6,7 @@ import { SecondaryButton } from '../components/secondary_button';
 import { Flex } from '../components/ui/flex';
 
 import { PlacingOrderButton } from '../components/placing_order_button';
+import { SimulatedProgressBar } from '../components/simulated_progress_bar';
 import { ColorOption } from '../style/theme';
 import { OrderProcessState, ZeroExInstantError } from '../types';
 
@@ -20,10 +21,13 @@ export interface BuyOrderStateButtonProps {
     onValidationPending: (buyQuote: BuyQuote) => void;
     onValidationFail: (buyQuote: BuyQuote, errorMessage: AssetBuyerError | ZeroExInstantError) => void;
     onSignatureDenied: (buyQuote: BuyQuote) => void;
-    onBuyProcessing: (buyQuote: BuyQuote, txHash: string) => void;
-    onBuySuccess: (buyQuote: BuyQuote, txHash: string) => void;
-    onBuyFailure: (buyQuote: BuyQuote, txHash: string) => void;
+    onBuyProcessing: (buyQuote: BuyQuote, txHash: string, startTimeUnix: number, expectedEndTimeUnix: number) => void;
+    onBuySuccess: (buyQuote: BuyQuote, txHash: string, startTimeUnix: number, expectedEndTimeUnix: number) => void;
+    onBuyFailure: (buyQuote: BuyQuote, txHash: string, startTimeUnix: number, expectedEndTimeUnix: number) => void;
     onRetry: () => void;
+
+    // TODO: dont commit!
+    secondaryProgressDemo: () => void;
 }
 
 // TODO: rename to buttons
@@ -50,16 +54,25 @@ export const BuyOrderStateButtons: React.StatelessComponent<BuyOrderStateButtonP
         return <PlacingOrderButton />;
     }
 
+    const curTime = new Date().getTime();
+    const expectedEndTime = curTime + 5000;
     return (
-        <BuyButton
-            buyQuote={props.buyQuote}
-            assetBuyer={props.assetBuyer}
-            onValidationPending={props.onValidationPending}
-            onValidationFail={props.onValidationFail}
-            onSignatureDenied={props.onSignatureDenied}
-            onBuyProcessing={props.onBuyProcessing}
-            onBuySuccess={props.onBuySuccess}
-            onBuyFailure={props.onBuyFailure}
-        />
+        <div>
+            {/* <div style={{ marginBottom: '20px' }}>
+                <SimulatedProgressBar startTimeUnix={curTime} expectedEndTimeUnix={expectedEndTime} ended={false} />
+            </div> */}
+
+            <SecondaryButton onClick={props.secondaryProgressDemo}>New progress bar demo</SecondaryButton>
+            <BuyButton
+                buyQuote={props.buyQuote}
+                assetBuyer={props.assetBuyer}
+                onValidationPending={props.onValidationPending}
+                onValidationFail={props.onValidationFail}
+                onSignatureDenied={props.onSignatureDenied}
+                onBuyProcessing={props.onBuyProcessing}
+                onBuySuccess={props.onBuySuccess}
+                onBuyFailure={props.onBuyFailure}
+            />
+        </div>
     );
 };