fix: stop loss ui

Autonomy-Network · Aug 11, 2022 · 3dda0ca · 3dda0ca
1 parent 6806495
commit 3dda0ca
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 4 deletions.
diff --git a/src/features/stop-loss/LimitPriceInputPanel.tsx b/src/features/stop-loss/LimitPriceInputPanel.tsx
@@ -25,7 +25,11 @@ const LimitPriceInputPanel: FC<LimitPriceInputPanel> = ({ trade, limitPrice }) =
     <div className="flex flex-col gap-1">
       <Typography variant="sm" className="px-2 flex items-center">
         {i18n._(t`Minimum Rate`)}
-        <QuestionHelper text={i18n._(t`Minimum output amount`)} />
+        <QuestionHelper
+          text={i18n._(
+            t`Minimum output amount. The difference between the output token at the stop and minimum rates is used to pay the execution (gas) fee, therefore it needs to be sufficiently large to be $1 assuming the worst case.`
+          )}
+        />
       </Typography>
       <div className="flex justify-between items-baseline bg-dark-900 rounded px-4 py-1.5 border border-dark-700 hover:border-dark-600">
         <Typography weight={700} variant="lg" className="relative flex items-baseline flex-grow gap-3 overflow-hidden">

diff --git a/src/features/stop-loss/StopLimitOrderButton.tsx b/src/features/stop-loss/StopLimitOrderButton.tsx
@@ -116,9 +116,9 @@ const StopLimitOrderButton: FC<StopLimitOrderButton> = ({ trade, parsedAmounts }
               {error
                 ? error
                 : tooNarrowMarginOfRates
-                ? 'Too narrow margin of rates'
+                ? 'Rate diff not enough for fee'
                 : fromBentoBalance
-                ? i18n._(t`Review Stop Limit Order`)
+                ? i18n._(t`Create Stop Limit Order`)
                 : i18n._(t`Confirm Deposit`)}
             </Button>
           )

diff --git a/src/features/stop-loss/StopPriceInputPanel.tsx b/src/features/stop-loss/StopPriceInputPanel.tsx
@@ -25,7 +25,11 @@ const StopPriceInputPanel: FC<StopPriceInputPanel> = ({ trade, stopPrice }) => {
     <div className="flex flex-col gap-1">
       <Typography variant="sm" className="px-2 flex items-center">
         {i18n._(t`Stop Rate`)}
-        <QuestionHelper text={i18n._(t`Rate required to trigger limit rate`)} />
+        <QuestionHelper
+          text={i18n._(
+            t`Rate required to trigger limit rate. The difference between the output token at the stop and minimum rates is used to pay the execution (gas) fee, therefore it needs to be sufficiently large to be $1 assuming the worst case.`
+          )}
+        />
       </Typography>
       <div className="flex justify-between items-baseline bg-dark-900 rounded px-4 py-1.5 border border-dark-700 hover:border-dark-600">
         <Typography weight={700} variant="lg" className="relative flex items-baseline flex-grow gap-3 overflow-hidden">

diff --git a/src/pages/stop-loss/[[...tokens]].tsx b/src/pages/stop-loss/[[...tokens]].tsx
@@ -179,6 +179,14 @@ const StopLoss = () => {
         </div>
 
         {isExpertMode && <RecipientField recipient={recipient} action={setRecipient} />}
+
+        <div className="text-xs py-2 flex justify-center">
+          <span className="text-secondary">Powered by</span>&nbsp;
+          <a href="https://www.autonomynetwork.io/" target="_blank" rel="noreferrer">
+            Autonomy Network
+          </a>
+        </div>
+
         <StopLimitOrderButton trade={trade} parsedAmounts={parsedAmounts} />
         <StopLossReviewModal
           parsedAmounts={parsedAmounts}