From f788d7bc85349f26115b3e052a437e45db0d6bc4 Mon Sep 17 00:00:00 2001
From: Sean Hagstrom <sean@seanhagstrom.com>
Date: Tue, 5 Mar 2024 14:07:45 +0000
Subject: [PATCH] [#19035] Add status tag for pending contact request to
 contact profile (#19075)

* chore: add english translation for contact-profile-request-pending

* feature: integrate status-tag for pending contact-request
---
 .../profile/contact/header/style.cljs         |  9 +++++++
 .../contexts/profile/contact/header/view.cljs | 27 ++++++++++++-------
 translations/en.json                          |  1 +
 3 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/src/status_im/contexts/profile/contact/header/style.cljs b/src/status_im/contexts/profile/contact/header/style.cljs
index 6523436a2bf..f31ec965c3a 100644
--- a/src/status_im/contexts/profile/contact/header/style.cljs
+++ b/src/status_im/contexts/profile/contact/header/style.cljs
@@ -15,3 +15,12 @@
    {:background-color   (colors/theme-colors colors/white colors/neutral-95 theme)
     :padding-horizontal 20
     :margin-top         margin-top}))
+
+(def status-tag-wrapper
+  {:flex-direction :row
+   :padding-top    12
+   :padding-right  12})
+
+(def header-top-wrapper
+  {:flex-direction  :row
+   :justify-content :space-between})
diff --git a/src/status_im/contexts/profile/contact/header/view.cljs b/src/status_im/contexts/profile/contact/header/view.cljs
index 8e5978512c5..9dac7029da8 100644
--- a/src/status_im/contexts/profile/contact/header/view.cljs
+++ b/src/status_im/contexts/profile/contact/header/view.cljs
@@ -4,14 +4,16 @@
             [quo.theme]
             [react-native.core :as rn]
             [status-im.common.scalable-avatar.view :as avatar]
+            [status-im.constants :as constants]
             [status-im.contexts.profile.contact.header.style :as style]
             [status-im.contexts.profile.utils :as profile.utils]
+            [utils.i18n :as i18n]
             [utils.re-frame :as rf]))
 
 (defn view
   [{:keys [scroll-y]}]
   (let [{:keys [public-key customization-color
-                emoji-hash bio]
+                emoji-hash bio contact-request-state]
          :as   profile}     (rf/sub [:contacts/current-contact])
         customization-color (or customization-color :blue)
         full-name           (profile.utils/displayed-name profile)
@@ -19,14 +21,21 @@
         online?             (rf/sub [:visibility-status-updates/online? public-key])
         theme               (quo.theme/use-theme-value)]
     [rn/view {:style style/header-container}
-     [rn/view {:style style/avatar-wrapper}
-      [avatar/view
-       {:scroll-y            scroll-y
-        :full-name           full-name
-        :online?             online?
-        :profile-picture     profile-picture
-        :border-color        (colors/theme-colors colors/white colors/neutral-95 theme)
-        :customization-color customization-color}]]
+     [rn/view {:style style/header-top-wrapper}
+      [rn/view {:style style/avatar-wrapper}
+       [avatar/view
+        {:scroll-y            scroll-y
+         :full-name           full-name
+         :online?             online?
+         :profile-picture     profile-picture
+         :border-color        (colors/theme-colors colors/white colors/neutral-95 theme)
+         :customization-color customization-color}]]
+      (when (= contact-request-state constants/contact-request-state-sent)
+        [rn/view {:style style/status-tag-wrapper}
+         [quo/status-tag
+          {:label  (i18n/label :t/contact-profile-request-pending)
+           :status {:type :pending}
+           :size   :large}]])]
      [quo/page-top
       {:title            full-name
        :description      :text
diff --git a/translations/en.json b/translations/en.json
index a0bd65906e7..9b64d4a94fa 100644
--- a/translations/en.json
+++ b/translations/en.json
@@ -2116,6 +2116,7 @@
     "selected-count-from-max": "{{selected}}/{{max}}",
     "online": "Online",
     "contact-request-chat-pending": "Your contact request is pending",
+    "contact-profile-request-pending": "Contact request pending",
     "contact-request-chat-add": "Add {{name}} as contact to send a message",
     "join-request": "Join request",
     "join-one-user": "Join {{user}}",