From d12c05aab68d3b02113975d689fb7b28f6b4749c Mon Sep 17 00:00:00 2001
From: Brian Sztamfater <brian@status.im>
Date: Wed, 17 Apr 2024 11:58:27 -0300
Subject: [PATCH] fix: add external icon to OpenSea button in collectible page
 (#19647)

Signed-off-by: Brian Sztamfater <brian@status.im>
---
 src/quo/components/buttons/button/view.cljs         | 12 ++++++------
 src/status_im/contexts/wallet/collectible/view.cljs | 12 ++++++++----
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/quo/components/buttons/button/view.cljs b/src/quo/components/buttons/button/view.cljs
index 2c080929625..8f56d44d967 100644
--- a/src/quo/components/buttons/button/view.cljs
+++ b/src/quo/components/buttons/button/view.cljs
@@ -28,9 +28,9 @@
     :theme :light/:dark
    only icon
    [button {:icon-only? true} :i/close-circle]"
-  [{:keys [on-press on-long-press disabled? type background size icon-left icon-right icon-top
-           customization-color accessibility-label icon-only? container-style inner-style
-           pressed? on-press-in on-press-out allow-multiple-presses?]
+  [{:keys [on-press on-long-press disabled? type background size icon-left icon-left-color icon-right
+           icon-right-color icon-top icon-top-color customization-color accessibility-label icon-only?
+           container-style inner-style pressed? on-press-in on-press-out allow-multiple-presses?]
     :or   {type                :primary
            size                40
            customization-color (if (= type :primary) :blue nil)}}
@@ -94,7 +94,7 @@
           [quo.icons/icon icon-top
            {:container-style {:margin-bottom 2
                               :opacity       (when disabled? 0.3)}
-            :color           icon-color
+            :color           (or icon-top-color icon-color)
             :size            icon-size}]])
        (when icon-left
          [rn/view
@@ -103,7 +103,7 @@
                     :icon-size icon-size
                     :disabled? disabled?})}
           [quo.icons/icon icon-left
-           {:color icon-color
+           {:color (or icon-left-color icon-color)
             :size  icon-size}]])
        [rn/view
         (cond
@@ -130,5 +130,5 @@
                     :icon-size icon-size
                     :disabled? disabled?})}
           [quo.icons/icon icon-right
-           {:color icon-color
+           {:color (or icon-right-color icon-color)
             :size  icon-size}]])]]]))
diff --git a/src/status_im/contexts/wallet/collectible/view.cljs b/src/status_im/contexts/wallet/collectible/view.cljs
index 594a718a887..82a72c99ff5 100644
--- a/src/status_im/contexts/wallet/collectible/view.cljs
+++ b/src/status_im/contexts/wallet/collectible/view.cljs
@@ -1,6 +1,7 @@
 (ns status-im.contexts.wallet.collectible.view
   (:require
     [quo.core :as quo]
+    [quo.foundations.colors :as colors]
     [quo.theme :as quo.theme]
     [react-native.core :as rn]
     [react-native.svg :as svg]
@@ -36,10 +37,13 @@
      :icon-left       :i/send}
     (i18n/label :t/send)]
    [quo/button
-    {:container-style style/opensea-button
-     :type            :outline
-     :size            40
-     :icon-left       :i/opensea}
+    {:container-style  style/opensea-button
+     :type             :outline
+     :size             40
+     :icon-left        :i/opensea
+     :icon-left-color  (colors/theme-colors colors/neutral-100 colors/neutral-40)
+     :icon-right       :i/external
+     :icon-right-color (colors/theme-colors colors/neutral-50 colors/neutral-40)}
     (i18n/label :t/opensea)]])
 
 (def tabs-data