From e3d2f099882c2d4c926a85a28e1139c881cb9abd Mon Sep 17 00:00:00 2001
From: Vitalii <takur12345@gmail.com>
Date: Mon, 3 Jul 2023 14:53:59 +0300
Subject: [PATCH] web/satellite: add support link to upgrade account STORJ
 token flow

Added support link to upgrade account STORJ token flow to tell user that they have to fill in another form to upgrade with tokens only.

Issue:
https://github.com/storj/storj/issues/5985

Change-Id: Ifb852b883c6bf092d5eec588e823925a8ea661c9
---
 .../upgradeAccountFlow/AddTokensStep.vue      | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/web/satellite/src/components/modals/upgradeAccountFlow/AddTokensStep.vue b/web/satellite/src/components/modals/upgradeAccountFlow/AddTokensStep.vue
index ea12d52ba..568cd8618 100644
--- a/web/satellite/src/components/modals/upgradeAccountFlow/AddTokensStep.vue
+++ b/web/satellite/src/components/modals/upgradeAccountFlow/AddTokensStep.vue
@@ -5,7 +5,15 @@
     <UpgradeAccountWrapper title="Add STORJ Tokens">
         <template #content>
             <div class="add-tokens">
-                <p class="add-tokens__info">Send more than $10 in STORJ Tokens to the following deposit address.</p>
+                <p class="add-tokens__info">
+                    Send more than $10 in STORJ Tokens to the following deposit address, and fill in this
+                    <a
+                        class="add-tokens__info__link"
+                        href="https://supportdcs.storj.io/hc/en-us/requests/new?ticket_form_id=360000683212"
+                        target="_blank"
+                        rel="noopener noreferrer"
+                    >limit increase request form</a> to upgrade to Pro Account.
+                </p>
                 <canvas ref="canvas" />
                 <div class="add-tokens__label">
                     <h2 class="add-tokens__label__text">Deposit Address</h2>
@@ -124,6 +132,16 @@ onMounted(async (): Promise<void> => {
         color: var(--c-blue-6);
         margin-bottom: 16px;
         text-align: left;
+
+        &__link {
+            color: var(--c-blue-3);
+            text-decoration: underline;
+            text-underline-position: under;
+
+            &:visited {
+                color: var(--c-blue-3);
+            }
+        }
     }
 
     &__label {