WIP: theme colors with jaime

Signed-off-by: Mohamed Javid <19339952+smohamedjavid@users.noreply.github.com>

ci/tests/Jenkinsfile.e2e-prs

@@ -45,6 +45,7 @@ pipeline {
 
   options {
     disableConcurrentBuilds()
+    timeout(time: 90, unit: 'MINUTES')
   }
 
   stages {

src/quo2/components/community/community_list_view.cljs

@@ -90,7 +90,8 @@
    (merge {:underlay-color (colors/theme-colors
                             colors/neutral-5
                             colors/neutral-95)
-           :style          {:border-radius 12}}
+           :style          {:border-radius 12
+                            :margin-left   12}}
           props)
    [rn/view (merge (style/membership-info-container) style)
     [community-icon/community-icon

src/quo2/components/counter/counter.cljs

@@ -26,9 +26,8 @@
    value]
   (let [type       (or type :default)
         text-color (or override-text-color
-                       (if (or
-                            (= (theme/get-theme) :dark)
-                            (= type :default))
+                       (if (or (= (theme/get-theme) :dark)
+                               (= type :default))
                          colors/white
                          colors/neutral-100))
         value      (utils.number/parse-int value)
@@ -52,16 +51,20 @@
                                     style)
                              (= type :outline)
                              (merge {:border-width 1
-                                     :border-color (get-color type)})
+                                     :border-color (colors/get-color :yin-yang (theme/get-theme))})
 
                              (not= type :outline)
                              (assoc :background-color
                                     (or override-bg-color
-                                        (get-color type)))
+                                        (colors/get-color :yin-yang (theme/get-theme))))
 
                              (> value max-value)
                              (assoc :padding-left 0.5))}
      [text/text
       {:weight :medium
        :size   :label
-       :style  {:color text-color}} label]]))
+       :style  {:color (colors/get-secondary-color
+                        :yin-yang
+                        (theme/get-theme)
+                        colors/white)}}
+      label]]))

src/quo2/components/drawers/documentation_drawers/style.cljs

@@ -1,10 +1,9 @@
 (ns quo2.components.drawers.documentation-drawers.style)
 
 (def container
-  {:align-items :flex-start
-   :padding     20})
+  {:align-items        :flex-start
+   :padding-horizontal 20})
 
 (def content
-  {:margin-top    12
+  {:margin-top    8
    :margin-bottom 16})
-

src/quo2/components/info/info_message.cljs

@@ -22,27 +22,26 @@
   opts
   {:type           :default/:success/:error
    :size           :default/:tiny
-   :icon           :i/info ;; info message icon
-   :text-color     colors/white     ;; text color override
-   :icon-color     colors/white    ;; icon color override
-   :no-icon-color? false       ;; disable tint color for icon"
+   :icon           :i/info       ;; info message icon
+   :text-color     colors/white  ;; text color override
+   :icon-color     colors/white  ;; icon color override
+   :no-icon-color? false         ;; disable tint color for icon"
   [{:keys [type size icon text-color icon-color no-icon-color? style]} message]
-  (let [weight          (if (= size :default) :regular :medium)
-        icon-size       (if (= size :default) 16 12)
-        icon-margin-top (if (= size :default) 2 3)
-        size            (if (= size :default) :paragraph-2 :label)
-        text-color      (or text-color (get-color type))
-        icon-color      (or icon-color text-color)]
+  (let [weight     (if (= size :default) :regular :medium)
+        icon-size  (if (= size :default) 16 12)
+        size       (if (= size :default) :paragraph-2 :label)
+        text-color (or text-color (get-color type))
+        icon-color (or icon-color text-color)]
     [rn/view
-     {:style (merge {:flex-direction :row}
+     {:style (merge {:flex-direction :row
+                     :align-items    :center}
                     style)}
      [quo2.icons/icon icon
-      {:color           icon-color
-       :no-color        no-icon-color?
-       :size            icon-size
-       :container-style {:margin-top icon-margin-top}}]
+      {:color    icon-color
+       :no-color no-icon-color?
+       :size     icon-size}]
      [text/text
       {:size   size
        :weight weight
        :style  {:color             text-color
-                :margin-horizontal 8}} message]]))
+                :margin-horizontal 4}} message]]))

src/quo2/components/inputs/profile_input/style.cljs

@@ -13,7 +13,7 @@
 
 (def button
   {:position      :absolute
-   :top           23
+   :top           24
    :bottom        0
    :left          33
    :right         0

src/quo2/components/inputs/profile_input/view.cljs

@@ -22,7 +22,7 @@
       (if platform/ios?
         [hole-view/hole-view
          {:holes [{:x            33
-                   :y            23
+                   :y            24
                    :width        24
                    :height       24
                    :borderRadius 12}]}

src/quo2/components/inputs/title_input/view.cljs

@@ -15,13 +15,15 @@
 (defn title-input
   [{:keys [blur?
            on-change-text
+           auto-focus
            placeholder
            max-length
            default-value
            override-theme]
     :or   {max-length    0
+           auto-focus    false
            default-value ""}}]
-  (let [focused?  (reagent/atom false)
+  (let [focused?  (reagent/atom auto-focus)
         value     (reagent/atom default-value)
         on-change (fn [v]
                     (reset! value v)
@@ -42,6 +44,7 @@
           :keyboard-appearance (theme/theme-value :light :dark override-theme)
           :on-focus #(swap! focused? (fn [] true))
           :on-blur #(swap! focused? (fn [] false))
+          :auto-focus auto-focus
           :input-mode :text
           :on-change-text on-change
           :editable (not disabled?)

src/quo2/components/profile/profile_card/style.cljs

@@ -27,7 +27,8 @@
   {:color colors/white})
 
 (def emoji-hash
-  {:margin-top 12})
+  {:margin-top     12
+   :letter-spacing 1.5})
 
 (def user-hash
   {:margin-top 2

src/quo2/components/profile/profile_card/view.cljs

@@ -94,9 +94,8 @@
            style/keycard-icon))]
        (when show-user-hash?
          [text/text
-          {:weight          :monospace
-           :number-of-lines 1
-           :style           style/user-hash} hash])
+          {:weight :monospace
+           :style  style/user-hash} hash])
        (when (and show-emoji-hash? emoji-hash)
          [text/text
           {:weight          :monospace

src/quo2/components/selectors/disclaimer/view.cljs

@@ -6,9 +6,9 @@
 
 (defn view
   [{:keys [checked? blur? accessibility-label container-style on-change]} label]
-  [rn/touchable-opacity
+  [rn/touchable-without-feedback
    {:on-press            on-change
-    :accessibility-label "disclaimer-touchable-opacity"}
+    :accessibility-label :disclaimer-touchable-opacity}
    [rn/view {:style (merge container-style (style/container blur?))}
     [selectors/checkbox
      {:accessibility-label accessibility-label

src/quo2/foundations/colors.cljs

@@ -186,44 +186,111 @@
 
 ;; Colors for customizing profiles and communities themes
 (def customization
-  {:primary   {50 primary-50 ;; User can also use primary color as customisation color
-               60 primary-60}
-   :purple    {50 "#7140FD"
-               60 "#5A33CA"}
-   :indigo    {50 "#496289"
-               60 "#3D5273"}
-   :turquoise {50 "#2A799B"
-               60 "#22617C"}
-   :blue      {50 "#2A4AF5"
-               60 "#223BC4"}
-   :green     {50 "#5BCC95"
-               60 "#4CAB7D"}
-   :yellow    {50 "#F6B03C"
-               60 "#C58D30"}
-   :orange    {50 "#FF7D46"
-               60 "#CC6438"}
-   :red       {50 "#F46666"
-               60 "#CD5656"}
-   :pink      {50 "#F66F8F"
-               60 "#C55972"}
-   :brown     {50 "#99604D"
-               60 "#805141"}
-   :sky       {50 "#1992D7"
-               60 "#1475AC"}
-   :army      {50 "#216266"
-               60 "#1A4E52"}
-   :magenta   {50 "#EC266C"
-               60 "#BD1E56"}
-   :copper    {50 "#CB6256"
-               60 "#A24E45"}
-   :camel     {50 "#C78F67"
-               60 "#9F7252"}
-   :yin       {50 "#09101C"
-               60 "#1D232E"}
-   :yang      {50 "#FFFFFF"
-               60 "#EBEBEB"}
-   :beige     {50 "#CAAE93"
-               60 "#AA927C"}})
+  {:community-color {:main-color {50 "#7140FD"
+                                  60 "#5A33CA"}
+                     }
+
+   :primary         {50 primary-50 ;; User can also use primary color as customisation color
+                     60 primary-60}
+   :purple          {50 "#7140FD"
+                     60 "#5A33CA"}
+   :indigo          {50 "#496289"
+                     60 "#3D5273"}
+   :turquoise       {50 "#2A799B"
+                     60 "#22617C"}
+   :blue            {50 "#2A4AF5"
+                     60 "#223BC4"}
+   :green           {50 "#5BCC95"
+                     60 "#4CAB7D"}
+   :yellow          {50 "#F6B03C"
+                     60 "#C58D30"}
+   :orange          {50 "#FF7D46"
+                     60 "#CC6438"}
+   :red             {50 "#F46666"
+                     60 "#CD5656"}
+   :pink            {50 "#F66F8F"
+                     60 "#C55972"}
+   :brown           {50 "#99604D"
+                     60 "#805141"}
+   :sky             {50 "#1992D7"
+                     60 "#1475AC"}
+   :army            {50 "#216266"
+                     60 "#1A4E52"}
+   :magenta         {50 "#EC266C"
+                     60 "#BD1E56"}
+   :copper          {50 "#CB6256"
+                     60 "#A24E45"}
+   :camel           {50 "#C78F67"
+                     60 "#9F7252"}
+   :yin             {50 "#09101C"
+                     60 "#1D232E"}
+   :yang            {50 "#FFFFFF"
+                     60 "#EBEBEB"}
+   :beige           {50 "#CAAE93"
+                     60 "#AA927C"}})
+
+
+;; TODO: rename
+(def customization-colors-map
+  {:primary   {:primary-color   {:light primary-50 :dark primary-60}
+               :secondary-color nil}
+   :purple    {:primary-color   {:light "#7140FD" :dark "#5A33CA"}
+               :secondary-color nil}
+   :indigo    {:primary-color   {:light "#496289" :dark "#3D5273"}
+               :secondary-color nil}
+   :turquoise {:primary-color   {:light "#2A799B" :dark "#22617C"}
+               :secondary-color nil}
+   :blue      {:primary-color   {:light "#2A4AF5" :dark "#223BC4"}
+               :secondary-color nil}
+   :green     {:primary-color   {:light "#5BCC95" :dark "#4CAB7D"}
+               :secondary-color nil}
+   :yellow    {:primary-color   {:light "#F6B03C" :dark "#C58D30"}
+               :secondary-color nil}
+   :orange    {:primary-color   {:light "#FF7D46" :dark "#CC6438"}
+               :secondary-color nil}
+   :red       {:primary-color   {:light "#F46666" :dark "#CD5656"}
+               :secondary-color nil}
+   :pink      {:primary-color   {:light "#F66F8F" :dark "#C55972"}
+               :secondary-color nil}
+   :brown     {:primary-color   {:light "#99604D" :dark "#805141"}
+               :secondary-color nil}
+   :sky       {:primary-color   {:light "#1992D7" :dark "#1475AC"}
+               :secondary-color nil}
+   :army      {:primary-color   {:light "#216266" :dark "#1A4E52"}
+               :secondary-color nil}
+   :magenta   {:primary-color   {:light "#EC266C" :dark "#BD1E56"}
+               :secondary-color nil}
+   :copper    {:primary-color   {:light "#CB6256" :dark "#A24E45"}
+               :secondary-color nil}
+   :camel     {:primary-color   {:light "#C78F67" :dark "#9F7252"}
+               :secondary-color nil}
+   :beige     {:primary-color   {:light "#CAAE93" :dark "#AA927C"}
+               :secondary-color nil}
+   ;;
+   :yin-yang  {:primary-color   {:light "#09101C" :dark "#EBEBEB"}
+               :secondary-color {:light "#FFFFFF" :dark neutral-100}}
+   ;;
+   #_#_:purple    {:light {:main "#7140FD" :secondary nil}
+               :dark  {:main "#5A33CA" :secondary nil}}
+
+   #_#_:yin-yang  {:light {:main "#09101C"
+                       :dark "#1D232E"}
+               :dark  {:main "#FFFFFF"
+                       :dark "#EBEBEB"}}
+
+   })
+
+(defn get-color [color-kw theme]
+  (get-in customization-colors-map [color-kw :primary-color theme]))
+
+
+(defn get-secondary-color [color-kw theme default-value]
+  (if-let [secondary-color (get-in customization-colors-map
+                                   [color-kw
+                                    :secondary-color
+                                    theme])]
+    secondary-color
+    default-value))
 
 (def colors-map
   (merge {:danger  {50 danger-50

src/status_im/data_store/messages.cljs

@@ -55,10 +55,11 @@
       (update :link-previews #(map <-link-preview-rpc %))
       (update :quoted-message
               set/rename-keys
-              {:parsedText   :parsed-text
-               :deleted      :deleted?
-               :deletedForMe :deleted-for-me?
-               :communityId  :community-id})
+              {:parsedText       :parsed-text
+               :deleted          :deleted?
+               :deletedForMe     :deleted-for-me?
+               :communityId      :community-id
+               :albumImagesCount :album-images-count})
       (update :outgoing-status keyword)
       (update :command-parameters
               set/rename-keys

src/status_im2/common/bottom_sheet/styles.cljs

@@ -1,5 +1,6 @@
 (ns status-im2.common.bottom-sheet.styles
   (:require [quo2.foundations.colors :as colors]
+            [quo2.theme :as theme]
             [status-im.utils.platform :as platform]))
 
 (defn handle
@@ -7,7 +8,7 @@
   {:width            32
    :height           4
    :background-color (colors/theme-colors colors/neutral-100 colors/white override-theme)
-   :opacity          0.05
+   :opacity          (theme/theme-value 0.05 0.1)
    :border-radius    100
    :align-self       :center
    :margin-vertical  8})
@@ -38,9 +39,11 @@
    :bottom           0})
 
 (defn selected-item
-  [override-theme]
+  [override-theme window-height sheet-height {:keys [top]}]
   {:position          :absolute
    :bottom            10
+   :max-height        (- window-height sheet-height top)
+   :overflow          :hidden
    :left              0
    :right             0
    :border-radius     12

src/status_im2/common/bottom_sheet/view.cljs

@@ -7,7 +7,8 @@
             [react-native.gesture :as gesture]
             [oops.core :as oops]
             [react-native.hooks :as hooks]
-            [react-native.blur :as blur]))
+            [react-native.blur :as blur]
+            [reagent.core :as reagent]))
 
 (def duration 450)
 (def timing-options #js {:duration duration})
@@ -51,44 +52,48 @@
            (show translate-y bg-opacity)
            (hide translate-y bg-opacity window-height on-close))))))
 
-(defn view
-  [{:keys [hide? insets]}
-   {:keys [content override-theme selected-item padding-bottom-override on-close shell?]}]
-  (let [{window-height :height} (rn/get-window)
-        bg-opacity              (reanimated/use-shared-value 0)
-        translate-y             (reanimated/use-shared-value window-height)
-        sheet-gesture           (get-sheet-gesture translate-y bg-opacity window-height on-close)]
-    (rn/use-effect
-     #(if hide? (hide translate-y bg-opacity window-height on-close) (show translate-y bg-opacity))
-     [hide?])
-    (hooks/use-back-handler #(do (when (fn? on-close)
-                                   (on-close))
-                                 (rf/dispatch [:hide-bottom-sheet])
-                                 true))
-    [rn/view {:flex 1}
-     ;; backdrop
-     [rn/touchable-without-feedback {:on-press #(rf/dispatch [:hide-bottom-sheet])}
-      [reanimated/view
-       {:style (reanimated/apply-animations-to-style
-                {:opacity bg-opacity}
-                {:flex 1 :background-color colors/neutral-100-opa-70})}]]
-     ;; sheet
-     [gesture/gesture-detector {:gesture sheet-gesture}
-      [reanimated/view
-       {:style (reanimated/apply-animations-to-style
-                {:transform [{:translateY translate-y}]}
-                (styles/sheet insets window-height override-theme padding-bottom-override shell?))}
+(defn f-view
+  [_ _]
+  (let [sheet-height (reagent/atom 0)]
+    (fn [{:keys [hide? insets]}
+         {:keys [content override-theme selected-item padding-bottom-override on-close shell?]}]
+      (let [{window-height :height} (rn/get-window)
+            bg-opacity              (reanimated/use-shared-value 0)
+            translate-y             (reanimated/use-shared-value window-height)
+            sheet-gesture           (get-sheet-gesture translate-y bg-opacity window-height on-close)]
+        (rn/use-effect
+         #(if hide? (hide translate-y bg-opacity window-height on-close) (show translate-y bg-opacity))
+         [hide?])
+        (hooks/use-back-handler #(do (when (fn? on-close)
+                                       (on-close))
+                                     (rf/dispatch [:hide-bottom-sheet])
+                                     true))
+        [rn/view {:style {:flex 1}}
+         ;; backdrop
+         [rn/touchable-without-feedback {:on-press #(rf/dispatch [:hide-bottom-sheet])}
+          [reanimated/view
+           {:style (reanimated/apply-animations-to-style
+                    {:opacity bg-opacity}
+                    {:flex 1 :background-color colors/neutral-100-opa-70})}]]
+         ;; sheet
+         [gesture/gesture-detector {:gesture sheet-gesture}
+          [reanimated/view
+           {:style     (reanimated/apply-animations-to-style
+                        {:transform [{:translateY translate-y}]}
+                        (styles/sheet insets
+                                      window-height
+                                      override-theme
+                                      padding-bottom-override
+                                      shell?))
+            :on-layout #(reset! sheet-height (oops/oget % "nativeEvent" "layout" "height"))}
+           (when shell? [blur/ios-view {:style styles/shell-bg}])
 
-       (when shell?
-         [blur/ios-view
-          {:style styles/shell-bg}])
+           (when selected-item
+             [rn/view
+              [rn/view {:style (styles/selected-item override-theme window-height @sheet-height insets)}
+               [selected-item]]])
 
-       (when selected-item
-         [rn/view
-          [rn/view {:style (styles/selected-item override-theme)}
-           [selected-item]]])
-
-       ;; handle
-       [rn/view {:style (styles/handle override-theme)}]
-       ;; content
-       [content]]]]))
+           ;; handle
+           [rn/view {:style (styles/handle override-theme)}]
+           ;; content
+           [content]]]]))))

src/status_im2/common/bottom_sheet_screen/style.cljs

@@ -1,7 +1,7 @@
 (ns status-im2.common.bottom-sheet-screen.style
-  (:require
-    [quo2.foundations.colors :as colors]
-    [react-native.reanimated :as reanimated]))
+  (:require [quo2.foundations.colors :as colors]
+            [quo2.theme :as theme]
+            [react-native.reanimated :as reanimated]))
 
 (defn background
   [opacity]
@@ -40,4 +40,5 @@
   {:width            32
    :height           4
    :border-radius    100
-   :background-color (colors/theme-colors colors/neutral-100-opa-30 colors/white-opa-30 override-theme)})
+   :background-color (colors/theme-colors colors/neutral-100 colors/white override-theme)
+   :opacity          (theme/theme-value 0.05 0.1)})

src/status_im2/common/home/actions/view.cljs

@@ -71,7 +71,7 @@
                   :on-press            #(hide-sheet-and-dispatch [:chat.ui/clear-history chat-id])}])}]))
 
 (defn delete-chat-action
-  [{:keys [chat-id] :as item}]
+  [{:keys [chat-id] :as item} inside-chat?]
   (hide-sheet-and-dispatch
    [:show-bottom-sheet
     {:content (fn []
@@ -81,7 +81,10 @@
                   :context             item
                   :accessibility-label :delete-chat-confirm
                   :button-text         (i18n/label :t/delete-chat)
-                  :on-press            #(hide-sheet-and-dispatch [:chat.ui/remove-chat chat-id])}])}]))
+                  :on-press            (fn []
+                                         (hide-sheet-and-dispatch [:chat.ui/remove-chat chat-id])
+                                         (when inside-chat?
+                                           (rf/dispatch [:navigate-back])))}])}]))
 
 (defn leave-group-action
   [item chat-id]
@@ -94,10 +97,10 @@
                   :context             item
                   :accessibility-label :leave-group
                   :button-text         (i18n/label :t/leave-group)
-                  :on-press            #(do
-                                          (rf/dispatch [:navigate-back])
-                                          (hide-sheet-and-dispatch [:group-chats.ui/leave-chat-confirmed
-                                                                    chat-id]))}])}]))
+                  :on-press            (fn []
+                                         (hide-sheet-and-dispatch [:group-chats.ui/leave-chat-confirmed
+                                                                   chat-id])
+                                         (rf/dispatch [:navigate-back]))}])}]))
 
 (defn block-user-action
   [{:keys [public-key] :as item}]
@@ -130,7 +133,7 @@
             :chevron?            true})))
 
 (defn mark-as-read-entry
-  [chat-id]
+  [chat-id needs-divider?]
   (entry {:icon                :i/correct
           :label               (i18n/label :t/mark-as-read)
           :on-press            #(mark-all-read-action chat-id)
@@ -138,7 +141,7 @@
           :accessibility-label :mark-as-read
           :sub-label           nil
           :chevron?            false
-          :add-divider?        true}))
+          :add-divider?        needs-divider?}))
 
 (defn clear-history-entry
   [chat-id]
@@ -152,10 +155,10 @@
           :add-divider?        true}))
 
 (defn delete-chat-entry
-  [item]
+  [item inside-chat?]
   (entry {:icon                :i/delete
           :label               (i18n/label :t/delete-chat)
-          :on-press            #(delete-chat-action item)
+          :on-press            #(delete-chat-action item inside-chat?)
           :danger?             true
           :accessibility-label :delete-chat
           :sub-label           nil
@@ -393,15 +396,15 @@
           :chevron?            false}))
 
 (defn destructive-actions
-  [{:keys [group-chat] :as item}]
+  [{:keys [group-chat] :as item} inside-chat?]
   [(clear-history-entry item)
    (if group-chat
      (leave-group-entry item nil)
-     (delete-chat-entry item))])
+     (delete-chat-entry item inside-chat?))])
 
 (defn notification-actions
-  [{:keys [chat-id group-chat public?]} inside-chat?]
-  [(mark-as-read-entry chat-id)
+  [{:keys [chat-id group-chat public?]} inside-chat? needs-divider?]
+  [(mark-as-read-entry chat-id needs-divider?)
    (mute-chat-entry chat-id)
    (notifications-entry false)
    (when inside-chat?
@@ -430,15 +433,17 @@
   [quo/action-drawer
    [[(view-profile-entry chat-id)
      (edit-nickname-entry chat-id)]
-    (notification-actions item inside-chat?)
-    (destructive-actions item)]])
+    (notification-actions item inside-chat? false)
+    (destructive-actions item inside-chat?)]])
 
 (defn private-group-chat-actions
   [item inside-chat?]
   [quo/action-drawer
-   [(group-actions item inside-chat?)
-    (notification-actions item inside-chat?)
-    (destructive-actions item)]])
+   (let [show-group-actions? (:group-chat-member? item)]
+     [(when show-group-actions?
+        (group-actions item inside-chat?))
+      (notification-actions item inside-chat? show-group-actions?)
+      (destructive-actions item inside-chat?)])])
 
 (defn contact-actions
   [{:keys [public-key] :as contact} {:keys [chat-id admin?] :as extra-data}]
@@ -471,4 +476,4 @@
     [quo/action-drawer
      [(when admin? [(edit-name-image-entry)])
       [(notifications-entry admin?)]
-      (destructive-actions group)]]))
+      (destructive-actions group false)]]))

src/status_im2/common/resources.cljs

@@ -22,10 +22,26 @@
    :keycard-watermark             (js/require "../resources/images/ui2/keycard-watermark.png")
    :discover                      (js/require "../resources/images/ui2/discover.png")
    :invite-friends                (js/require "../resources/images/ui2/invite-friends.png")
+   :no-messages-light             (js/require "../resources/images/ui2/no-messages-light.png")
+   :no-messages-dark              (js/require "../resources/images/ui2/no-messages-dark.png")
+   :no-group-chats-light          (js/require "../resources/images/ui2/no-group-chats-light.png")
+   :no-group-chats-dark           (js/require "../resources/images/ui2/no-group-chats-dark.png")
    :no-contacts-light             (js/require "../resources/images/ui2/no-contacts-light.png")
    :no-contacts-dark              (js/require "../resources/images/ui2/no-contacts-dark.png")
-   :no-messages-light             (js/require "../resources/images/ui2/no-messages-light.png")
-   :no-messages-dark              (js/require "../resources/images/ui2/no-messages-dark.png")})
+   :no-sent-requests-light        (js/require "../resources/images/ui2/no-sent-requests-light.png")
+   :no-sent-requests-dark         (js/require "../resources/images/ui2/no-sent-requests-dark.png")
+   :no-received-requests-light    (js/require "../resources/images/ui2/no-received-requests-light.png")
+   :no-received-requests-dark     (js/require "../resources/images/ui2/no-received-requests-dark.png")
+   :no-communities-light          (js/require "../resources/images/ui2/no-communities-light.png")
+   :no-communities-dark           (js/require "../resources/images/ui2/no-communities-dark.png")
+   :no-pending-communities-light  (js/require "../resources/images/ui2/no-pending-communities-light.png")
+   :no-pending-communities-dark   (js/require "../resources/images/ui2/no-pending-communities-dark.png")
+   :no-opened-communities-light   (js/require "../resources/images/ui2/no-opened-communities-light.png")
+   :no-opened-communities-dark    (js/require "../resources/images/ui2/no-opened-communities-dark.png")
+   :no-contacts-to-invite-light   (js/require "../resources/images/ui2/no-contacts-to-invite-light.png")
+   :no-contacts-to-invite-dark    (js/require "../resources/images/ui2/no-contacts-to-invite-dark.png")
+   :no-notifications-light        (js/require "../resources/images/ui2/no-notifications-light.png")
+   :no-notifications-dark         (js/require "../resources/images/ui2/no-notifications-dark.png")})
 
 (def mock-images
   {:coinbase             (js/require "../resources/images/mock2/coinbase.png")

src/status_im2/contexts/chat/composer/reply/style.cljs

@@ -1,11 +1,12 @@
-(ns status-im2.contexts.chat.composer.reply.style)
+(ns status-im2.contexts.chat.composer.reply.style
+  (:require [react-native.platform :as platform]))
 
 
 (defn container
   [pin? in-chat-input?]
   {:flex-direction :row
    :height         (when-not pin? 24)
-   :margin-left    (when (and (not in-chat-input?) (not pin?)) 26)
+   :margin-left    (if (and (not in-chat-input?) (not pin?)) 26 (if platform/android? 4 0))
    :margin-bottom  (when (and (not in-chat-input?) (not pin?)) 8)})
 (defn reply-content
   [pin?]
@@ -33,7 +34,7 @@
   {:text-transform :none
    :margin-left    4
    :margin-top     2
-   :flex           1})
+   :flex-shrink    1})
 
 (def gradient
   {:position :absolute

src/status_im2/contexts/chat/composer/reply/view.cljs

@@ -84,7 +84,8 @@
    in-chat-input? pin? recording-audio?]
   (let [contact-name       (rf/sub [:contacts/contact-name-by-identity from])
         current-public-key (rf/sub [:multiaccount/public-key])
-        content-type       (or content-type contentType)]
+        content-type       (or content-type contentType)
+        text               (get-quoted-text-with-mentions (or parsed-text (:parsed-text content)))]
     [rn/view
      {:style               (style/container pin? in-chat-input?)
       :accessibility-label :reply-message}
@@ -102,26 +103,30 @@
           {:from               from
            :contact-name       contact-name
            :current-public-key current-public-key}]
+         (when (not-empty text)
+           [quo/text
+            {:number-of-lines     1
+             :size                :label
+             :weight              :regular
+             :accessibility-label :quoted-message
+             :ellipsize-mode      :tail
+             :style               style/message-text}
+            text])
          [quo/text
-          {:number-of-lines     1
-           :size                :label
-           :weight              :regular
-           :accessibility-label :quoted-message
-           :ellipsize-mode      :tail
-           :style               (merge
-                                 style/message-text
-                                 (when (or (= constant/content-type-image content-type)
-                                           (= constant/content-type-sticker content-type)
-                                           (= constant/content-type-audio content-type))
-                                   {:color (colors/theme-colors colors/neutral-50 colors/neutral-40)}))}
-          (case (or content-type contentType)
-            constant/content-type-image   (if album-images-count
-                                            (i18n/label :t/images-albums-count
-                                                        {:album-images-count album-images-count})
-                                            (i18n/label :t/image))
-            constant/content-type-sticker (i18n/label :t/sticker)
-            constant/content-type-audio   (i18n/label :t/audio)
-            (get-quoted-text-with-mentions (or parsed-text (:parsed-text content))))]])]
+          {:size   :label
+           :weight :regular
+           :style  {:color      (colors/theme-colors colors/neutral-50 colors/neutral-40)
+                    :margin-top 2}}
+          (str " "
+               (case (or content-type contentType)
+                 constant/content-type-image   (if (pos? album-images-count)
+                                                 (i18n/label :t/album-images-count
+                                                             {:album-images-count album-images-count})
+                                                 (i18n/label :t/photo))
+                 constant/content-type-sticker (i18n/label :t/sticker)
+                 constant/content-type-audio   (i18n/label :t/audio)
+                 ""))]
+        ])]
      (when (and in-chat-input? (not recording-audio?))
        [quo/button
         {:width               24

src/status_im2/contexts/chat/home/style.cljs

@@ -22,3 +22,16 @@
    :right       0
    :left        0
    :padding-top top})
+
+(def header-height 245)
+
+(defn header-space
+  [top]
+  {:height (+ header-height top)})
+
+(defn empty-content-container
+  [top]
+  {:flex            1
+   :margin-top      (+ header-height top)
+   :margin-bottom   44
+   :justify-content :center})

src/status_im2/contexts/chat/home/view.cljs

@@ -1,23 +1,24 @@
 (ns status-im2.contexts.chat.home.view
-  (:require [utils.i18n :as i18n]
-            [utils.re-frame :as rf]
-            [quo2.core :as quo]
-            [re-frame.core :as re-frame]
-            [react-native.core :as rn]
-            [react-native.safe-area :as safe-area]
+  (:require [quo2.core :as quo]
             [quo2.foundations.colors :as colors]
+            [quo2.theme :as theme]
+            [re-frame.core :as re-frame]
             [react-native.blur :as blur]
+            [react-native.core :as rn]
             [react-native.platform :as platform]
+            [react-native.safe-area :as safe-area]
             [status-im.multiaccounts.core :as multiaccounts]
-            [status-im2.contexts.chat.home.style :as style]
+            [status-im2.common.contact-list-item.view :as contact-list-item]
             [status-im2.common.contact-list.view :as contact-list]
+            [status-im2.common.home.actions.view :as actions]
             [status-im2.common.home.view :as common.home]
+            [status-im2.common.resources :as resources]
+            [status-im2.contexts.chat.actions.view :as home.sheet]
             [status-im2.contexts.chat.home.chat-list-item.view :as chat-list-item]
             [status-im2.contexts.chat.home.contact-request.view :as contact-request]
-            [status-im2.common.contact-list-item.view :as contact-list-item]
-            [status-im2.common.home.actions.view :as actions]
-            [status-im2.common.resources :as resources]
-            [status-im2.contexts.chat.actions.view :as home.sheet]))
+            [status-im2.contexts.chat.home.style :as style]
+            [utils.i18n :as i18n]
+            [utils.re-frame :as rf]))
 
 (defn get-item-layout
   [_ index]
@@ -30,36 +31,51 @@
          (filter key)
          (sort-by :timestamp >))))
 
-(defn welcome-blank-chats
-  []
-  [rn/view {:style {:flex 1 :align-items :center :justify-content :center}}
-   [quo/icon :i/placeholder]
-   [quo/text {:weight :semi-bold} (i18n/label :t/no-messages)]
-   [quo/text (i18n/label :t/blank-messages-text)]])
+(defn empty-state-content
+  [selected-tab]
+  (case selected-tab
+    :tab/contacts
+    {:title       (i18n/label :t/no-contacts)
+     :description (i18n/label :t/no-contacts-description)
+     :image       (resources/get-image
+                   (theme/theme-value :no-contacts-light :no-contacts-dark))}
+    :tab/groups
+    {:title       (i18n/label :t/no-group-chats)
+     :description (i18n/label :t/no-group-chats-description)
+     :image       (resources/get-image
+                   (theme/theme-value :no-group-chats-light :no-group-chats-dark))}
+    :tab/recent
+    {:title       (i18n/label :t/no-messages)
+     :description (i18n/label :t/no-messages-description)
+     :image       (resources/get-image
+                   (theme/theme-value :no-messages-light :no-messages-dark))}
+    nil))
+
+(defn empty-state
+  [{:keys [selected-tab top]}]
+  (let [{:keys [image title description]} (empty-state-content selected-tab)]
+    [rn/view {:style (style/empty-content-container top)}
+     [quo/empty-state
+      {:image       image
+       :title       title
+       :description description}]]))
 
 (defn chats
   [selected-tab top]
   (let [unfiltered-items (rf/sub [:chats-stack-items])
         items            (filter-and-sort-items-by-tab selected-tab unfiltered-items)]
     (if (empty? items)
-      [welcome-blank-chats]
+      [empty-state {:top top :selected-tab selected-tab}]
       [rn/flat-list
        {:key-fn                            #(or (:chat-id %) (:public-key %) (:id %))
         :content-inset-adjustment-behavior :never
-        :header                            [rn/view {:height (+ 245 top)}]
+        :header                            [rn/view {:style (style/header-space top)}]
         :get-item-layout                   get-item-layout
         :on-end-reached                    #(re-frame/dispatch [:chat/show-more-chats])
         :keyboard-should-persist-taps      :always
         :data                              items
         :render-fn                         chat-list-item/chat-list-item}])))
 
-(defn welcome-blank-contacts
-  []
-  [rn/view {:style {:flex 1 :align-items :center :justify-content :center}}
-   [quo/icon :i/placeholder]
-   [quo/text {:weight :semi-bold} (i18n/label :t/no-contacts)]
-   [quo/text (i18n/label :t/blank-contacts-text)]])
-
 (defn contact-item-render
   [{:keys [public-key] :as item}]
   (let [current-pk           (rf/sub [:multiaccount/public-key])
@@ -77,13 +93,13 @@
   [pending-contact-requests top]
   (let [items (rf/sub [:contacts/active-sections])]
     (if (and (empty? items) (empty? pending-contact-requests))
-      [welcome-blank-contacts]
+      [empty-state {:top top :selected-tab :tab/contacts}]
       [rn/section-list
        {:key-fn                            :public-key
         :get-item-layout                   get-item-layout
         :content-inset-adjustment-behavior :never
         :header                            [:<>
-                                            [rn/view {:height (+ 245 top)}]
+                                            [rn/view {:style (style/header-space top)}]
                                             (when (seq pending-contact-requests)
                                               [contact-request/contact-requests
                                                pending-contact-requests])]
@@ -103,45 +119,41 @@
 
 (defn home
   []
-  (fn []
-    (let [pending-contact-requests (rf/sub [:activity-center/pending-contact-requests])
-          selected-tab             (or (rf/sub [:messages-home/selected-tab]) :tab/recent)
-          {:keys [key-uid]}        (rf/sub [:multiaccount])
-          account                  (rf/sub [:profile/multiaccount])
-          profile-color            (:color (rf/sub [:onboarding-2/profile]))
-          customization-color      (if profile-color
-                                     profile-color
+  (let [pending-contact-requests (rf/sub [:activity-center/pending-contact-requests])
+        selected-tab             (or (rf/sub [:messages-home/selected-tab]) :tab/recent)
+        {:keys [key-uid]}        (rf/sub [:multiaccount])
+        account                  (rf/sub [:profile/multiaccount])
+        customization-color      (or (:color (rf/sub [:onboarding-2/profile]))
                                      (rf/sub [:profile/customization-color key-uid]))
-          top                      (safe-area/get-top)]
-      [:<>
-       (if (= selected-tab :tab/contacts)
-         [contacts pending-contact-requests top]
-         [chats selected-tab top])
-       [rn/view
-        {:style (style/blur-container top)}
-        [blur/view
-         {:blur-amount (if platform/ios? 20 10)
-          :blur-type   (if (colors/dark?) :dark (if platform/ios? :light :xlight))
-          :style       style/blur}]
-        [common.home/top-nav
-         {:type   :grey
-          :avatar {:customization-color customization-color
-                   :full-name           (multiaccounts/displayed-name account)
-                   :profile-picture     (multiaccounts/displayed-photo account)}}]
-        [common.home/title-column
-         {:label               (i18n/label :t/messages)
-          :handler             #(rf/dispatch [:show-bottom-sheet {:content home.sheet/new-chat}])
-          :accessibility-label :new-chat-button
-          :customization-color customization-color}]
-        [quo/discover-card
-         {:banner      (resources/get-image :invite-friends)
-          :title       (i18n/label :t/invite-friends-to-status)
-          :description (i18n/label :t/share-invite-link)}]
-        ^{:key (str "tabs-" selected-tab)}
-        [quo/tabs
-         {:style          style/tabs
-          :size           32
-          :on-change      (fn [tab]
-                            (rf/dispatch [:messages-home/select-tab tab]))
-          :default-active selected-tab
-          :data           (get-tabs-data (pos? (count pending-contact-requests)))}]]])))
+        top                      (safe-area/get-top)]
+    [:<>
+     (if (= selected-tab :tab/contacts)
+       [contacts pending-contact-requests top]
+       [chats selected-tab top])
+     [rn/view {:style (style/blur-container top)}
+      [blur/view
+       {:blur-amount (if platform/ios? 20 10)
+        :blur-type   (if (colors/dark?) :dark (if platform/ios? :light :xlight))
+        :style       style/blur}]
+      [common.home/top-nav
+       {:type   :grey
+        :avatar {:customization-color customization-color
+                 :full-name           (multiaccounts/displayed-name account)
+                 :profile-picture     (multiaccounts/displayed-photo account)}}]
+      [common.home/title-column
+       {:label               (i18n/label :t/messages)
+        :handler             #(rf/dispatch [:show-bottom-sheet {:content home.sheet/new-chat}])
+        :accessibility-label :new-chat-button
+        :customization-color customization-color}]
+      [quo/discover-card
+       {:banner      (resources/get-image :invite-friends)
+        :title       (i18n/label :t/invite-friends-to-status)
+        :description (i18n/label :t/share-invite-link)}]
+      ^{:key (str "tabs-" selected-tab)}
+      [quo/tabs
+       {:style          style/tabs
+        :size           32
+        :on-change      (fn [tab]
+                          (rf/dispatch [:messages-home/select-tab tab]))
+        :default-active selected-tab
+        :data           (get-tabs-data (pos? (count pending-contact-requests)))}]]]))

src/status_im2/contexts/chat/messages/content/legacy_view.cljs

@@ -2,7 +2,6 @@
   (:require
     [quo.design-system.colors :as quo.colors]
     [quo.react-native :as rn]
-    [re-frame.core :as re-frame]
     [status-im.react-native.resources :as resources]
     [status-im.ui.components.fast-image :as fast-image]
     [status-im.ui.screens.chat.message.gap :as message.gap]
@@ -251,9 +250,10 @@
          [rn/text {:style {:color quo.colors/black}} description]]]
        [rn/view (style/community-view-button)
         [rn/touchable-opacity
-         {:on-press #(re-frame/dispatch
-                      [:communities/navigate-to-community
-                       (:id community)])}
+         {:on-press #(do (rf/dispatch
+                          [:communities/navigate-to-community
+                           (:id community)])
+                         (rf/dispatch [:chat/close]))}
          [rn/text
           {:style {:text-align :center
                    :color      quo.colors/blue}} (i18n/label :t/view)]]]])))

src/status_im2/contexts/chat/messages/content/view.cljs

@@ -74,11 +74,7 @@
       constants/content-type-contact-request       [not-implemented/not-implemented
                                                     [old-message/system-contact-request message-data]])))
 
-(defn on-long-press
-  [message-data context]
-  (rf/dispatch [:dismiss-keyboard])
-  (rf/dispatch [:show-bottom-sheet
-                {:content (drawers/reactions-and-actions message-data context)}]))
+(declare on-long-press)
 
 (defn user-message-content
   []
@@ -94,7 +90,9 @@
             outgoing        (if (= content-type constants/content-type-album)
                               (:outgoing first-image)
                               outgoing)
-            context         (assoc context :on-long-press #(on-long-press message-data context))
+            context         (assoc context
+                                   :on-long-press
+                                   #(on-long-press message-data context keyboard-shown?))
             response-to     (:response-to content)
             height          (rf/sub [:dimensions/window-height])]
         [rn/touchable-highlight
@@ -113,7 +111,7 @@
                                      (reset! show-delivery-state? true)
                                      (js/setTimeout #(reset! show-delivery-state? false)
                                                     delivery-state-showing-time-ms))))
-          :on-long-press       #(on-long-press message-data context)}
+          :on-long-press       #(on-long-press message-data context keyboard-shown?)}
          [rn/view {:style {:padding-vertical 8}}
           (when (and (seq response-to) quoted-message)
             [reply/quoted-message quoted-message])
@@ -152,6 +150,15 @@
              (when @show-delivery-state?
                [status/status outgoing-status])])]]]))))
 
+(defn on-long-press
+  [message-data context keyboard-shown]
+  (rf/dispatch [:dismiss-keyboard])
+  (rf/dispatch [:show-bottom-sheet
+                {:content       (drawers/reactions-and-actions message-data context)
+                 :selected-item (fn []
+                                  [rn/view {:pointer-events :none}
+                                   [user-message-content message-data context keyboard-shown true]])}]))
+
 (defn message-with-reactions
   [{:keys [pinned-by mentioned in-pinned-view? content-type last-in-group?] :as message-data}
    context
@@ -168,4 +175,5 @@
      [system-message-content message-data]
      [user-message-content message-data context keyboard-shown false])
    [reactions/message-reactions-row message-data
-    [user-message-content message-data context keyboard-shown true]]])
+    [rn/view {:pointer-events :none}
+     [user-message-content message-data context keyboard-shown true]]]])

src/status_im2/contexts/chat/messages/drawers/style.cljs

@@ -6,7 +6,10 @@
    :align-items     :center
    :justify-content :center})
 
-(def tab-icon {:margin-right 4})
+(def tab-icon
+  {:margin-right 4
+   :width        20
+   :height       20})
 
 (defn tab-count
   [active?]

src/status_im2/contexts/chat/messages/drawers/view.cljs

@@ -9,7 +9,8 @@
             [reagent.core :as reagent]
             [status-im2.common.contact-list-item.view :as contact-list-item]
             [status-im2.contexts.chat.messages.drawers.style :as style]
-            [react-native.gesture :as gesture]))
+            [react-native.gesture :as gesture]
+            [quo2.components.reactions.resource :as reactions.resource]))
 
 (defn contact-list-item-fn
   [{:keys [from compressed-key]}]
@@ -33,10 +34,10 @@
            {:id                  reaction-type-int
             :accessibility-label (keyword (str "authors-for-reaction-" reaction-type-int))
             :label               [rn/view {:style style/tab}
-                                  [quo/icon
-                                   (get constants/reactions reaction-type-int)
-                                   {:no-color        true
-                                    :container-style style/tab-icon}]
+                                  [rn/image
+                                   {:source (reactions.resource/get-reaction
+                                             (get constants/reactions reaction-type-int))
+                                    :style  style/tab-icon}]
                                   [quo/text
                                    {:weight :medium
                                     :size   :paragraph-1

src/status_im2/contexts/chat/messages/navigation/style.cljs

@@ -1,6 +1,5 @@
 (ns status-im2.contexts.chat.messages.navigation.style
   (:require [quo2.foundations.colors :as colors]
-            [react-native.platform :as platform]
             [react-native.reanimated :as reanimated]))
 
 (defonce ^:const navigation-bar-height 100)
@@ -17,33 +16,47 @@
     :background-color (colors/theme-colors colors/white-opa-40 colors/neutral-80-opa-40)}
    position))
 
-(defn blur-view
-  [status-bar-height]
+(def background-view
+  {:position         :absolute
+   :top              0
+   :left             0
+   :right            0
+   :height           navigation-bar-height
+   :background-color (colors/theme-colors colors/white-opa-70 :transparent)
+   :display          :flex
+   :flex-direction   :row
+   :overflow         :hidden})
+
+(defn animated-background-view
+  [enabled? animation]
+  (reanimated/apply-animations-to-style
+   (when enabled?
+     {:opacity animation})
+   background-view))
+
+(def blur-view
   {:position       :absolute
    :top            0
    :left           0
    :right          0
-   :height         (- navigation-bar-height
-                      (if platform/ios? 0 status-bar-height))
+   :height         navigation-bar-height
    :display        :flex
    :flex-direction :row
    :overflow       :hidden})
 
 (defn animated-blur-view
-  [enabled? animation status-bar-height]
+  [enabled? animation]
   (reanimated/apply-animations-to-style
    (when enabled?
      {:opacity animation})
-   (blur-view status-bar-height)))
+   blur-view))
 
 (def navigation-view
-  {:z-index 4})
+  {:z-index 1})
 
-(defn header-container
-  [status-bar-height]
+(def header-container
   {:position       :absolute
-   :top            (- header-offset
-                      (if platform/ios? 0 status-bar-height))
+   :top            header-offset
    :left           0
    :right          0
    :padding-bottom 8
@@ -63,20 +76,18 @@
       :opacity   opacity-animation})
    header))
 
-(defn pinned-banner
-  [status-bar-height]
+(def pinned-banner
   {:position :absolute
    :left     0
    :right    0
-   :top      (- navigation-bar-height
-                (if platform/ios? 0 status-bar-height))})
+   :top      navigation-bar-height})
 
 (defn animated-pinned-banner
-  [enabled? animation status-bar-height]
+  [enabled? animation]
   (reanimated/apply-animations-to-style
    (when enabled?
      {:opacity animation})
-   (pinned-banner status-bar-height)))
+   pinned-banner))
 
 (def header-content-container
   {:flex-direction :row

src/status_im2/contexts/chat/messages/navigation/view.cljs

@@ -2,21 +2,22 @@
   (:require [quo2.core :as quo]
             [quo2.foundations.colors :as colors]
             [re-frame.db]
+            [react-native.blur :as blur]
             [react-native.core :as rn]
+            [react-native.platform :as platform]
             [react-native.reanimated :as reanimated]
-            [react-native.safe-area :as safe-area]
             [status-im2.contexts.chat.messages.navigation.style :as style]
             [status-im2.contexts.chat.messages.pin.banner.view :as pin.banner]
             [status-im2.constants :as constants]
             [utils.re-frame :as rf]
-            [utils.i18n :as i18n]))
+            [utils.i18n :as i18n]
+            [status-im2.common.home.actions.view :as actions]))
 
 (defn f-navigation-view
   [{:keys [scroll-y]}]
-  (let [insets                   (safe-area/get-insets)
-        status-bar-height        (:top insets)
-        {:keys [group-chat chat-id chat-name emoji
-                chat-type]}      (rf/sub [:chats/current-chat-chat-view])
+  (let [{:keys [group-chat chat-id chat-name emoji
+                chat-type]
+         :as   chat}             (rf/sub [:chats/current-chat-chat-view])
         all-loaded?              (rf/sub [:chats/all-loaded? chat-id])
         display-name             (if (= chat-type constants/one-to-one-chat-type)
                                    (first (rf/sub [:contacts/contact-two-names-by-identity chat-id]))
@@ -50,17 +51,23 @@
                                                          {:extrapolateLeft  "clamp"
                                                           :extrapolateRight "clamp"})]
     [rn/view {:style style/navigation-view}
-     [reanimated/blur-view
-      {:blurAmount   32
-       :blurType     (colors/theme-colors :xlight :dark)
-       :overlayColor :transparent
-       :style        (style/animated-blur-view all-loaded? opacity-animation status-bar-height)}]
+     [reanimated/view
+      {:style (style/animated-background-view all-loaded? opacity-animation)}]
+
+     [reanimated/view {:style (style/animated-blur-view all-loaded? opacity-animation)}
+      [blur/view
+       {:blur-amount 20
+        :blur-type   (colors/theme-colors :light :dark)
+        :blur-radius (if platform/ios? 20 10)
+        :style       {:flex 1}}]]
 
      [rn/view
-      [rn/view {:style (style/header-container status-bar-height)}
+      [rn/view {:style style/header-container}
        [rn/touchable-opacity
         {:active-opacity      1
-         :on-press            #(rf/dispatch [:navigate-back])
+         :on-press            #(do
+                                 (rf/dispatch [:chat/close])
+                                 (rf/dispatch [:navigate-back]))
          :accessibility-label :back-button
          :style               (style/button-container {:margin-left 20})}
         [quo/icon :i/arrow-left
@@ -90,14 +97,19 @@
               :size            :paragraph-2
               :style           (style/header-online)}
              (i18n/label :t/online)])]]]
-       [rn/touchable-opacity
-        {:active-opacity      1
-         :style               (style/button-container {:margin-right 20})
-         :accessibility-label :options-button}
-        [quo/icon :i/options {:size 20 :color (colors/theme-colors colors/black colors/white)}]]]
+       (when (not= chat-type constants/community-chat-type)
+         [rn/touchable-opacity
+          {:active-opacity      1
+           :style               (style/button-container {:margin-right 20})
+           :accessibility-label :options-button
+           :on-press            (fn []
+                                  (rf/dispatch [:dismiss-keyboard])
+                                  (rf/dispatch [:show-bottom-sheet
+                                                {:content (fn [] [actions/chat-actions chat true])}]))}
+          [quo/icon :i/options {:size 20 :color (colors/theme-colors colors/black colors/white)}]])]
 
       [reanimated/view
-       {:style (style/animated-pinned-banner all-loaded? banner-opacity-animation status-bar-height)}
+       {:style (style/animated-pinned-banner all-loaded? banner-opacity-animation)}
        [pin.banner/banner chat-id]]]]))
 
 (defn navigation-view

src/status_im2/contexts/communities/actions/community_options/component_spec.cljs

@@ -69,8 +69,6 @@
         (.toBeTruthy))
     (-> (h/expect (h/get-by-translation-text :view-community-rules))
         (.toBeTruthy))
-    (-> (h/expect (h/get-by-translation-text :edit-community))
-        (.toBeTruthy))
     (-> (h/expect (h/get-by-translation-text :mark-as-read))
         (.toBeTruthy))
     (-> (h/expect (h/get-by-translation-text :mute-community))
@@ -93,8 +91,6 @@
         (.toBeTruthy))
     (-> (h/expect (h/get-by-translation-text :view-community-rules))
         (.toBeTruthy))
-    (-> (h/expect (h/get-by-translation-text :edit-community))
-        (.toBeTruthy))
     (-> (h/expect (h/get-by-translation-text :mark-as-read))
         (.toBeTruthy))
     (-> (h/expect (h/get-by-translation-text :mute-community))

src/status_im2/contexts/communities/actions/community_options/view.cljs

@@ -100,14 +100,6 @@
                                        {:content (fn [] [leave-menu/cancel-request-sheet id
                                                          request-id])}])})
 
-(defn edit-community
-  [id]
-  {:icon                :i/edit
-   :label               (i18n/label :t/edit-community)
-   :accessibility-label :edit-community
-   :on-press            #(rf/dispatch [:communities/open-edit-community id]
-                                      (rf/dispatch [:hide-bottom-sheet]))})
-
 (defn not-joined-options
   [id token-gated?]
   [[(when-not token-gated? (view-members id))
@@ -144,7 +136,6 @@
   [[(view-members id)
     (view-rules id)
     (when token-gated? (view-token-gating id))
-    (edit-community id)
     (mark-as-read id)
     (mute-community id muted?)
     (community-notification-settings id)

src/status_im2/contexts/communities/actions/community_rules_list/style.cljs

@@ -1,31 +1,14 @@
-(ns status-im2.contexts.communities.actions.community-rules-list.style
-  (:require [quo2.foundations.colors :as colors]))
+(ns status-im2.contexts.communities.actions.community-rules-list.style)
 
 (def community-rule
-  {:height           18
-   :width            18
-   :margin-left      1
-   :margin-right     9
-   :background-color colors/white
-   :border-color     colors/neutral-20
-   :border-width     1
-   :border-radius    6})
+  {:flex-direction :row
+   :flex           1
+   :align-items    :flex-start
+   :margin-top     16})
 
-(def community-rule-container
-  {:flex       1
-   :margin-top 16})
-
-(def inner-community-rule-container
-  {:flex           1
-   :flex-direction :row
-   :align-items    :center})
+(def community-rule-index
+  {:margin-left 5})
 
 (def community-rule-text
-  {:margin-left   :auto
-   :margin-right  :auto
-   :margin-top    :auto
-   :margin-bottom :auto})
-
-(def community-rule-sub-text
-  {:margin-left 28
-   :margin-top  1})
+  {:margin-left 6
+   :flex        1})

src/status_im2/contexts/communities/actions/community_rules_list/view.cljs

@@ -1,16 +1,15 @@
 (ns status-im2.contexts.communities.actions.community-rules-list.view
-  (:require [react-native.core :as rn]
-            [status-im2.contexts.communities.actions.community-rules-list.style :as style]
-            [quo2.core :as quo]))
+  (:require [quo2.core :as quo]
+            [react-native.core :as rn]
+            [status-im2.contexts.communities.actions.community-rules-list.style :as style]))
 
-;; TODO: update with real data
 (def rules
   [{:index 1
     :title "Be respectful"
     :content
     "You must respect all users, regardless of your liking towards them. Treat others the way you want to be treated."}
    {:index 2
-    :title "No Inappropriate Language"
+    :title "No inappropriate language"
     :content
     "The use of profanity should be kept to a minimum. However, any derogatory language towards any user is prohibited."}
    {:index 3
@@ -30,28 +29,18 @@
 
 (defn community-rule-item
   [{:keys [title content index]}]
-  [rn/view
-   {:style style/community-rule-container}
-   [rn/view
-    {:style style/inner-community-rule-container}
-    [rn/view
-     {:style style/community-rule}
-     [quo/text
-      {:style               style/community-rule-text
-       :accessibility-label :communities-rule-index
-       :weight              :medium
-       :size                :label}
-      (str index)]]
-    [quo/text
-     {:accessibility-label :communities-rule-title
-      :weight              :semi-bold
-      :size                :paragraph-2}
-     title]]
+  [rn/view {:style style/community-rule}
    [quo/text
-    {:style               style/community-rule-sub-text
-     :accessibility-label :communities-rule-content
+    {:style  style/community-rule-index
+     :weight :medium
+     :size   :paragraph-2}
+    (str index ". ")]
+   [quo/text
+    {:style               style/community-rule-text
+     :accessibility-label :communities-rule-index
+     :weight              :medium
      :size                :paragraph-2}
-    content]])
+    (str title ": " content)]])
 
 (defn view
   [rules]

src/status_im2/contexts/communities/actions/request_to_join/style.cljs

@@ -27,8 +27,15 @@
 
 (defn bottom-container
   []
-  {:margin-horizontal 20
-   :padding-top       32
-   :flex-direction    :row
-   :align-items       :center
-   :justify-content   :space-evenly})
+  {:padding-top     32
+   :flex-direction  :row
+   :align-items     :center
+   :justify-content :space-evenly})
+
+(def final-disclaimer-container
+  {:margin-top         12
+   :padding-horizontal 40})
+
+(def final-disclaimer-text
+  {:color      colors/neutral-50
+   :text-align :center})

src/status_im2/contexts/communities/actions/request_to_join/view.cljs

@@ -1,17 +1,17 @@
 (ns status-im2.contexts.communities.actions.request-to-join.view
-  (:require [react-native.core :as rn]
-            [status-im2.contexts.communities.actions.community-rules-list.view :as community-rules]
+  (:require [quo2.core :as quo]
+            [react-native.core :as rn]
+            [react-native.gesture :as gesture]
             [reagent.core :as reagent]
+            [status-im2.contexts.communities.actions.community-rules-list.view :as community-rules]
             [status-im2.contexts.communities.actions.request-to-join.style :as style]
-            [quo2.core :as quo]
             [utils.i18n :as i18n]
             [utils.re-frame :as rf]
-            [utils.requests :as requests]
-            [react-native.gesture :as gesture]))
+            [utils.requests :as requests]))
 
 (defn request-to-join-text
-  [is-open?]
-  (if is-open?
+  [open?]
+  (if open?
     (i18n/label :t/join-open-community)
     (i18n/label :t/request-to-join)))
 
@@ -27,20 +27,16 @@
                     can-request-access?
                     requested-to-join-at]} (rf/sub [:get-screen-params])
             pending?                       (rf/sub [:communities/my-pending-request-to-join id])
-            is-open?                       (not= 3 (:access permissions))]
-        [rn/view {:flex 1 :margin-top 40}
+            open?                          (not= 3 (:access permissions))]
+        [rn/view {:flex 1}
          [gesture/scroll-view {:style {:flex 1}}
           [rn/view style/page-container
-           [rn/view
-            {:style style/title-container}
+           [rn/view {:style style/title-container}
             [quo/text
              {:accessibility-label :communities-join-community
               :weight              :semi-bold
               :size                :heading-1}
-             (request-to-join-text is-open?)]
-            [rn/view
-             {:style style/request-icon}
-             [quo/icon :i/info]]]
+             (request-to-join-text open?)]]
            [quo/context-tag
             {:style
              {:margin-right :auto
@@ -64,7 +60,8 @@
              {:accessibility-label :cancel
               :on-press            #(rf/dispatch [:navigate-back])
               :type                :grey
-              :style               style/cancel-button} (i18n/label :t/cancel)]
+              :style               style/cancel-button}
+             (i18n/label :t/cancel)]
             [quo/button
              {:accessibility-label :join-community-button
               :on-press            (fn []
@@ -79,4 +76,10 @@
                                            (rf/dispatch [:communities/request-to-join id])
                                            (rf/dispatch [:navigate-back]))))
               :disabled            (not @agreed-to-rules?)
-              :style               {:flex 1}} (request-to-join-text is-open?)]]]]]))))
+              :style               {:flex 1}}
+             (request-to-join-text open?)]]
+           [rn/view {:style style/final-disclaimer-container}
+            [quo/text
+             {:size  :paragraph-2
+              :style style/final-disclaimer-text}
+             (i18n/label :t/request-to-join-disclaimer)]]]]]))))

src/status_im2/contexts/communities/home/style.cljs

@@ -1,6 +1,8 @@
 (ns status-im2.contexts.communities.home.style
-  (:require [react-native.platform :as platform]
-            [quo2.foundations.colors :as colors]))
+  (:require [quo2.foundations.colors :as colors]
+            [react-native.platform :as platform]))
+
+(def header-height 245)
 
 (def tabs
   {:padding-horizontal 20
@@ -14,21 +16,21 @@
    :left     0
    :bottom   0})
 
-(def empty-state-container
-  {:position    :absolute
-   :top         390
-   :left        0
-   :right       0
-   :align-items :center})
+(defn empty-state-container
+  [top]
+  {:margin-top      (+ header-height top)
+   :margin-bottom   44
+   :flex            1
+   :justify-content :center})
 
 (def empty-state-placeholder
   {:height           120
    :width            120
    :background-color colors/danger-50})
 
-(defn header-height
+(defn header-spacing
   [top]
-  {:height (+ 245 top)})
+  {:height (+ header-height top)})
 
 (defn blur-container
   [top]

src/status_im2/contexts/communities/home/view.cljs

@@ -1,18 +1,19 @@
 (ns status-im2.contexts.communities.home.view
-  (:require [utils.i18n :as i18n]
-            [utils.re-frame :as rf]
-            [quo2.core :as quo]
+  (:require [quo2.core :as quo]
             [quo2.foundations.colors :as colors]
-            [react-native.core :as rn]
-            [react-native.safe-area :as safe-area]
+            [quo2.theme :as theme]
             [react-native.blur :as blur]
+            [react-native.core :as rn]
             [react-native.platform :as platform]
+            [react-native.safe-area :as safe-area]
             [status-im.multiaccounts.core :as multiaccounts]
             [status-im2.common.home.view :as common.home]
-            [status-im2.contexts.communities.actions.community-options.view :as options]
-            [status-im2.contexts.communities.home.style :as style]
             [status-im2.common.resources :as resources]
-            [status-im2.contexts.communities.actions.home-plus.view :as actions.home-plus]))
+            [status-im2.contexts.communities.actions.community-options.view :as options]
+            [status-im2.contexts.communities.actions.home-plus.view :as actions.home-plus]
+            [status-im2.contexts.communities.home.style :as style]
+            [utils.i18n :as i18n]
+            [utils.re-frame :as rf]))
 
 (defn item-render
   [{:keys [id] :as item}]
@@ -34,73 +35,92 @@
    {:id :pending :label (i18n/label :t/pending) :accessibility-label :pending-tab}
    {:id :opened :label (i18n/label :t/opened) :accessibility-label :opened-tab}])
 
+(defn empty-state-content
+  [selected-tab]
+  (case selected-tab
+    :joined
+    {:title       (i18n/label :t/no-communities)
+     :description [:<>
+                   [rn/text {:style {:text-decoration-line :line-through}}
+                    (i18n/label :t/no-communities-description-strikethrough)]
+                   " "
+                   (i18n/label :t/no-communities-description)]
+     :image       (resources/get-image (theme/theme-value :no-communities-light
+                                                          :no-communities-dark))}
+    :pending
+    {:title       (i18n/label :t/no-pending-communities)
+     :description (i18n/label :t/no-pending-communities-description)
+     :image       (resources/get-image (theme/theme-value :no-pending-communities-light
+                                                          :no-pending-communities-dark))}
+    :opened
+    {:title       (i18n/label :t/no-opened-communities)
+     :description (i18n/label :t/no-opened-communities-description)
+     :image       (resources/get-image (theme/theme-value :no-opened-communities-light
+                                                          :no-opened-communities-dark))}
+    nil))
+
 (defn empty-state
-  []
-  [rn/view {:style style/empty-state-container}
-   [rn/view {:style style/empty-state-placeholder}]
-   [quo/text
-    {:accessibility-label :communities-rule-index
-     :weight              :semi-bold
-     :size                :paragraph-1}
-    (i18n/label :t/no-communities)]
-   [quo/text
-    {:accessibility-label :communities-rule-index
-     :weight              :regular
-     :size                :paragraph-2}
-    (i18n/label :t/no-communities-sub-title)]])
+  [{:keys [style selected-tab customization-color]}]
+  (let [{:keys [image title description]} (empty-state-content selected-tab)]
+    [rn/view {:style style}
+     [quo/empty-state
+      {:customization-color customization-color
+       :image               image
+       :title               title
+       :description         description}]]))
 
 (defn home
   []
-  (fn []
-    (let [selected-tab                    (or (rf/sub [:communities/selected-tab]) :joined)
-          {:keys [joined pending opened]} (rf/sub [:communities/grouped-by-status])
-          {:keys [key-uid]}               (rf/sub [:multiaccount])
-          account                         (rf/sub [:profile/multiaccount])
-          profile-color                   (:color (rf/sub [:onboarding-2/profile]))
-          customization-color             (if profile-color
-                                            profile-color
+  (let [selected-tab                    (or (rf/sub [:communities/selected-tab]) :joined)
+        {:keys [joined pending opened]} (rf/sub [:communities/grouped-by-status])
+        {:keys [key-uid]}               (rf/sub [:multiaccount])
+        account                         (rf/sub [:profile/multiaccount])
+        customization-color             (or (:color (rf/sub [:onboarding-2/profile]))
                                             (rf/sub [:profile/customization-color key-uid]))
-          selected-items                  (case selected-tab
-                                            :joined  joined
-                                            :pending pending
-                                            :opened  opened)
-          top                             (safe-area/get-top)]
-      [:<>
-       (if (empty? selected-items)
-         [empty-state]
-         [rn/flat-list
-          {:key-fn                            :id
-           :content-inset-adjustment-behavior :never
-           :header                            [rn/view (style/header-height top)]
-           :render-fn                         item-render
-           :data                              selected-items}])
-       [rn/view
-        {:style (style/blur-container top)}
-        [blur/view
-         {:blur-amount (if platform/ios? 20 10)
-          :blur-type   (if (colors/dark?) :dark (if platform/ios? :light :xlight))
-          :style       style/blur}]
-        [common.home/top-nav
-         {:type   :grey
-          :avatar {:customization-color customization-color
-                   :full-name           (multiaccounts/displayed-name account)
-                   :profile-picture     (multiaccounts/displayed-photo account)}}]
-        [common.home/title-column
-         {:label               (i18n/label :t/communities)
-          :handler             #(rf/dispatch [:show-bottom-sheet {:content actions.home-plus/view}])
-          :accessibility-label :new-communities-button
-          :customization-color customization-color}]
-        [quo/discover-card
-         {:on-press            #(rf/dispatch [:navigate-to :discover-communities])
-          :title               (i18n/label :t/discover)
-          :description         (i18n/label :t/favorite-communities)
-          :banner              (resources/get-image :discover)
-          :accessibility-label :communities-home-discover-card}]
-        ^{:key (str "tabs-" selected-tab)}
-        [quo/tabs
-         {:size           32
-          :style          style/tabs
-          :on-change      (fn [tab]
-                            (rf/dispatch [:communities/select-tab tab]))
-          :default-active selected-tab
-          :data           tabs-data}]]])))
+        selected-items                  (case selected-tab
+                                          :joined  joined
+                                          :pending pending
+                                          :opened  opened)
+        top                             (safe-area/get-top)]
+    [:<>
+     (if (empty? selected-items)
+       [empty-state
+        {:style               (style/empty-state-container top)
+         :selected-tab        selected-tab
+         :customization-color customization-color}]
+       [rn/flat-list
+        {:key-fn                            :id
+         :content-inset-adjustment-behavior :never
+         :header                            [rn/view {:style (style/header-spacing top)}]
+         :render-fn                         item-render
+         :data                              selected-items}])
+
+     [rn/view {:style (style/blur-container top)}
+      [blur/view
+       {:blur-amount (if platform/ios? 20 10)
+        :blur-type   (if (colors/dark?) :dark (if platform/ios? :light :xlight))
+        :style       style/blur}]
+      [common.home/top-nav
+       {:type   :grey
+        :avatar {:customization-color customization-color
+                 :full-name           (multiaccounts/displayed-name account)
+                 :profile-picture     (multiaccounts/displayed-photo account)}}]
+      [common.home/title-column
+       {:label               (i18n/label :t/communities)
+        :handler             #(rf/dispatch [:show-bottom-sheet {:content actions.home-plus/view}])
+        :accessibility-label :new-communities-button
+        :customization-color customization-color}]
+      [quo/discover-card
+       {:on-press            #(rf/dispatch [:navigate-to :discover-communities])
+        :title               (i18n/label :t/discover)
+        :description         (i18n/label :t/favorite-communities)
+        :banner              (resources/get-image :discover)
+        :accessibility-label :communities-home-discover-card}]
+      ^{:key (str "tabs-" selected-tab)}
+      [quo/tabs
+       {:size           32
+        :style          style/tabs
+        :on-change      (fn [tab]
+                          (rf/dispatch [:communities/select-tab tab]))
+        :default-active selected-tab
+        :data           tabs-data}]]]))

src/status_im2/contexts/contacts/events.cljs

@@ -96,6 +96,7 @@
   [{:keys [db]} {:keys [public-key]}]
   {:db            (-> db
                       (assoc-in [:contacts/contacts public-key :added?] false)
+                      (assoc-in [:contacts/contacts public-key :active?] false)
                       (assoc-in [:contacts/contacts public-key :contact-request-state]
                                 constants/contact-request-state-none))
    :json-rpc/call [{:method     "wakuext_retractContactRequest"

src/status_im2/contexts/onboarding/create_profile/style.cljs

@@ -28,7 +28,8 @@
    :top      0
    :bottom   0
    :left     0
-   :right    0})
+   :right    0
+   :z-index  100})
 
 (def info-message
   {:margin-top 8})

src/status_im2/contexts/onboarding/create_profile/view.cljs

@@ -48,103 +48,110 @@
 
 (defn button-container
   [keyboard-shown? children]
-  (if keyboard-shown?
-    [blur/ios-view
-     {:style style/blur-button-container}
-     children]
-    [rn/view {:style style/view-button-container}
-     children]))
+  [rn/view {:style {:margin-top :auto}}
+   (if keyboard-shown?
+     [blur/ios-view {:style style/blur-button-container}
+      children]
+     [rn/view {:style style/view-button-container}
+      children])])
 
 (defn- f-page
   [{:keys [onboarding-profile-data navigation-bar-top]}]
-  (let [{:keys [image-path display-name color]} onboarding-profile-data
-        full-name                               (reagent/atom display-name)
-        keyboard-shown?                         (reagent/atom false)
-        validation-msg                          (reagent/atom (validation-message @full-name))
-        on-change-text                          (fn [s]
-                                                  (reset! validation-msg (validation-message s))
-                                                  (reset! full-name (string/trim s)))
-        custom-color                            (reagent/atom (or color c/profile-default-color))
-        profile-pic                             (reagent/atom image-path)
-        on-change-profile-pic                   #(reset! profile-pic %)
-        on-change                               #(reset! custom-color %)]
-    (fn []
-      (rn/use-effect
-       (let [will-show-listener (oops/ocall rn/keyboard
-                                            "addListener"
-                                            "keyboardWillShow"
-                                            #(swap! keyboard-shown? (fn [] true)))
-             will-hide-listener (oops/ocall rn/keyboard
-                                            "addListener"
-                                            "keyboardWillHide"
-                                            #(swap! keyboard-shown? (fn [] false)))]
-         (fn []
-           (fn []
-             (oops/ocall will-show-listener "remove")
-             (oops/ocall will-hide-listener "remove"))))
-       [])
+  (reagent/with-let [keyboard-shown?                         (reagent/atom false)
+                     will-show-listener                      (oops/ocall rn/keyboard
+                                                                         "addListener"
+                                                                         "keyboardWillShow"
+                                                                         #(reset! keyboard-shown? true))
+                     will-hide-listener                      (oops/ocall rn/keyboard
+                                                                         "addListener"
+                                                                         "keyboardWillHide"
+                                                                         #(reset! keyboard-shown? false))
+                     {:keys [image-path display-name color]} onboarding-profile-data
+                     full-name                               (reagent/atom display-name)
+                     validation-msg                          (reagent/atom (validation-message
+                                                                            @full-name))
+                     on-change-text                          (fn [s]
+                                                               (reset! validation-msg (validation-message
+                                                                                       s))
+                                                               (reset! full-name (string/trim s)))
+                     custom-color                            (reagent/atom (or color
+                                                                               c/profile-default-color))
+                     profile-pic                             (reagent/atom image-path)
+                     on-change-profile-pic                   #(reset! profile-pic %)
+                     on-change                               #(reset! custom-color %)]
+    [rn/view {:style style/page-container}
+     [navigation-bar/navigation-bar {:top navigation-bar-top}]
+     [rn/scroll-view
+      {:keyboard-should-persist-taps :always
+       :content-container-style      {:flex-grow 1}}
       [rn/view {:style style/page-container}
-       [navigation-bar/navigation-bar {:top navigation-bar-top}]
-       [rn/scroll-view
-        {:keyboard-should-persist-taps :always
-         :content-container-style      {:flex-grow 1}}
-        [rn/view {:style style/page-container}
+       [rn/view
+        {:style style/content-container}
+        [quo/text
+         {:size   :heading-1
+          :weight :semi-bold
+          :style  style/title} (i18n/label :t/create-profile)]
+        [rn/view
+         {:style style/input-container}
          [rn/view
-          {:style style/content-container}
-          [quo/text
-           {:size   :heading-1
-            :weight :semi-bold
-            :style  style/title} (i18n/label :t/create-profile)]
-          [rn/view
-           {:style style/input-container}
-           [rn/view
-            {:style style/profile-input-container}
-            [quo/profile-input
-             {:customization-color @custom-color
-              :placeholder         (i18n/label :t/your-name)
-              :on-press            (fn []
-                                     (rf/dispatch [:dismiss-keyboard])
-                                     (rf/dispatch
-                                      [:show-bottom-sheet
-                                       {:override-theme :dark
-                                        :content
-                                        (fn []
-                                          [method-menu/view on-change-profile-pic])}]))
-              :image-picker-props  {:profile-picture @profile-pic
-                                    :full-name       @full-name}
-              :title-input-props   {:default-value  @full-name
-                                    :max-length     c/profile-name-max-length
-                                    :on-change-text on-change-text}}]]
-           (when @validation-msg
-             [quo/info-message
-              {:type  :error
-               :size  :default
-               :icon  :i/info
-               :style style/info-message}
-              @validation-msg])
-           [quo/text
-            {:size  :paragraph-2
-             :style style/color-title}
-            (i18n/label :t/accent-colour)]
-           [quo/color-picker
-            {:blur?             true
-             :default-selected? :blue
-             :selected          @custom-color
-             :on-change         on-change}]]]]]
-       [rn/keyboard-avoiding-view {}
-        [button-container @keyboard-shown?
-         [quo/button
-          {:accessibility-label       :submit-create-profile-button
-           :type                      :primary
-           :override-background-color (colors/custom-color @custom-color 60)
-           :on-press                  (fn []
-                                        (rf/dispatch [:onboarding-2/profile-data-set
-                                                      {:image-path   @profile-pic
-                                                       :display-name @full-name
-                                                       :color        @custom-color}]))
-           :style                     style/continue-button
-           :disabled                  (or (not (seq @full-name)) @validation-msg)}
-          (i18n/label :t/continue)]]]])))
+          {:style style/profile-input-container}
+          [quo/profile-input
+           {:customization-color @custom-color
+            :placeholder         (i18n/label :t/your-name)
+            :on-press            (fn []
+                                   (rf/dispatch [:dismiss-keyboard])
+                                   (rf/dispatch
+                                    [:show-bottom-sheet
+                                     {:override-theme :dark
+                                      :content
+                                      (fn []
+                                        [method-menu/view on-change-profile-pic])}]))
+            :image-picker-props  {:profile-picture @profile-pic
+                                  :full-name       @full-name}
+            :title-input-props   {:default-value  @full-name
+                                  :auto-focus     true
+                                  :max-length     c/profile-name-max-length
+                                  :on-change-text on-change-text}}]]
+         (when @validation-msg
+           [quo/info-message
+            {:type  :error
+             :size  :default
+             :icon  :i/info
+             :style style/info-message}
+            @validation-msg])
+         [quo/text
+          {:size   :paragraph-2
+           :weight :medium
+           :style  style/color-title}
+          (i18n/label :t/accent-colour)]
+         [quo/color-picker
+          {:blur?             true
+           :default-selected? :blue
+           :selected          @custom-color
+           :on-change         on-change}]]]]]
+     [rn/keyboard-avoiding-view
+      {:style          {:position :absolute
+                        :top      0
+                        :bottom   0
+                        :left     0
+                        :right    0}
+       :pointer-events :box-none}
+      [button-container @keyboard-shown?
+       [quo/button
+        {:accessibility-label       :submit-create-profile-button
+         :type                      :primary
+         :override-background-color (colors/custom-color @custom-color 60)
+         :on-press                  (fn []
+                                      (rf/dispatch [:onboarding-2/profile-data-set
+                                                    {:image-path   @profile-pic
+                                                     :display-name @full-name
+                                                     :color        @custom-color}]))
+         :style                     style/continue-button
+         :disabled                  (or (not (seq @full-name)) @validation-msg)}
+        (i18n/label :t/continue)]]]]
+    (finally
+     (oops/ocall will-show-listener "remove")
+     (oops/ocall will-hide-listener "remove"))))
 
 (defn create-profile
   []

src/status_im2/contexts/onboarding/identifiers/style.cljs

@@ -5,7 +5,7 @@
 
 (def content-container
   {:position :absolute
-   :top      160
+   :top      170
    :bottom   0
    :left     0
    :right    0})

src/status_im2/contexts/onboarding/new_to_status/style.cljs

@@ -1,8 +1,6 @@
 (ns status-im2.contexts.onboarding.new-to-status.style
   (:require [quo2.foundations.colors :as colors]))
 
-(def full-screen {:flex 1})
-
 (def content-container
   {:position :absolute
    :top      0
@@ -18,16 +16,22 @@
   {:color         colors/white
    :margin-bottom 20})
 
+(def subtitle
+  {:margin-bottom 12
+   :color         colors/white-opa-70})
+
 (def subtitle-container
-  {:height        20
-   :margin-top    16
+  {:margin-top 16})
+
+(def doc-main-content
+  {:color         colors/white
    :margin-bottom 4})
 
-(def subtitle
+(def doc-subtitle
+  {:margin-top    20
+   :margin-bottom 4})
+
+(def doc-content
   {:color colors/white-opa-70})
 
-(def suboptions
-  {:padding-top    4
-   :padding-bottom 8})
-
 (def space-between-suboptions {:height 12})

src/status_im2/contexts/onboarding/new_to_status/view.cljs

@@ -20,7 +20,6 @@
        :size   :heading-1
        :weight :semi-bold}
       (i18n/label :t/new-to-status)]
-
      [quo/small-option-card
       {:variant    :main
        :title      (i18n/label :t/generate-keys)
@@ -31,15 +30,13 @@
                       (* 2 16) ;; spacing between items
                       220)     ;; extra spacing (top bar)
        :on-press   #(rf/dispatch [:onboarding-2/navigate-to-create-profile])}]
-
      [rn/view {:style style/subtitle-container}
       [quo/text
        {:style  style/subtitle
         :size   :paragraph-2
         :weight :medium}
        (i18n/label :t/experienced-web3)]]
-
-     [rn/view {:style style/suboptions}
+     [rn/view
       [quo/small-option-card
        {:variant  :icon
         :title    (i18n/label :t/use-recovery-phrase)
@@ -59,35 +56,37 @@
   [quo/documentation-drawers
    {:title  (i18n/label :t/getting-started-with-status)
     :shell? true}
-   [rn/view
+   [:<>
     [quo/text
      {:size  :paragraph-2
-      :style style/title}
-     (i18n/label
-      :t/getting-started-description)]
+      :style style/doc-main-content}
+     (i18n/label :t/getting-started-description)]
     [quo/text
      {:size   :paragraph-1
+      :style  style/doc-subtitle
       :weight :semi-bold}
      (i18n/label :t/generate-keys)]
     [quo/text
      {:size  :paragraph-2
-      :style style/subtitle}
+      :style style/doc-content}
      (i18n/label :t/getting-started-generate-keys-description)]
     [quo/text
      {:size   :paragraph-1
+      :style  style/doc-subtitle
       :weight :semi-bold}
      (i18n/label :t/getting-started-generate-keys-from-recovery-phrase)]
     [quo/text
      {:size  :paragraph-2
-      :style style/subtitle}
+      :style style/doc-content}
      (i18n/label :t/getting-started-generate-keys-from-recovery-phrase-description)]
     [quo/text
      {:size   :paragraph-1
+      :style  style/doc-subtitle
       :weight :semi-bold}
      (i18n/label :t/getting-started-generate-keys-on-keycard)]
     [quo/text
      {:size  :paragraph-2
-      :style style/subtitle}
+      :style style/doc-content}
      (i18n/label :t/getting-started-generate-keys-on-keycard-description)]]])
 
 (defn new-to-status

src/status_im2/contexts/quo_preview/drawers/documentation_drawers.cljs

@@ -106,7 +106,8 @@
         [preview/customizer state descriptor]
         [rn/view {:padding-vertical 60}
          [quo/button
-          {:style    {:margin-horizontal 40}
+          {:style    {:margin-horizontal 40
+                      :margin-bottom     20}
            :on-press #(rf/dispatch [:show-bottom-sheet
                                     {:content     (constantly [render-documenation-drawer @title
                                                                @show-button?
@@ -129,4 +130,3 @@
      :keyboard-should-persist-taps :always
      :header                       [cool-preview]
      :key-fn                       str}]])
-

src/status_im2/navigation/options.cljs

@@ -87,8 +87,12 @@
                             :orientation              ["portrait"]
                             :backgroundColor          :transparent}
    :modalPresentationStyle :overCurrentContext
-   :animations             {:showModal    {:alpha {:from 1 :to 1 :duration 300}}
-                            :dismissModal {:alpha {:from 1 :to 1 :duration 300}}}})
+   ;; disabled on iOS in debug mode:
+   ;; https://github.com/status-im/status-mobile/pull/16053#issuecomment-1568349702
+   :animations             (if (or platform/android? (not js/goog.DEBUG))
+                             {:showModal    {:alpha {:from 1 :to 1 :duration 300}}
+                              :dismissModal {:alpha {:from 1 :to 1 :duration 300}}}
+                             {})})
 
 (def dark-screen
   (merge (statusbar true)

src/status_im2/navigation/view.cljs

@@ -88,7 +88,7 @@
           :keyboard-vertical-offset (- (max 20 (:bottom insets)))}
          (when sheet
            [:f>
-            bottom-sheet/view
+            bottom-sheet/f-view
             {:insets insets :hide? hide?}
             sheet])]]))))
 

src/status_im2/subs/chat/chats.cljs

@@ -72,9 +72,15 @@
  :chats/home-list-chats
  :<- [:chats/chats]
  :<- [:chats-home-list]
- (fn [[chats active-chats]]
+ :<- [:multiaccount/public-key]
+ (fn [[chats active-chats my-public-key]]
    (reduce #(if-let [item (get chats %2)]
-              (conj %1 item)
+              (let [group-chat-member? (and (chat.events/group-chat? item)
+                                            (group-chats.db/member? my-public-key item))]
+                (conj %1
+                      (assoc item
+                             :group-chat-member?
+                             group-chat-member?)))
               %1)
            []
            active-chats)))

status-go-version.json

@@ -3,7 +3,7 @@
     "_comment": "Instead use: scripts/update-status-go.sh <rev>",
     "owner": "status-im",
     "repo": "status-go",
-    "version": "v0.154.2",
-    "commit-sha1": "5d62a9eef4a6676d62a9a51cdadea596d3d9a658",
-    "src-sha256": "148z0r8iyqanx91hgvbm7wx1nf82v2am1hyy6f892vmbc2y8axnx"
+    "version": "v0.156.1",
+    "commit-sha1": "9e0a12cb32bf8921ba7b5c923f743bb7119fab96",
+    "src-sha256": "0yx8dcxrig1qkna7kfqpjh5ry33ybdmqh31x42jg4wlb9nm2jnw8"
 }

test/appium/support/base_test_report.py

@@ -1,10 +1,9 @@
-import time
-import json
 import hmac
+import json
 import os
-from hashlib import md5
-from sauceclient import SauceException
 import re
+from hashlib import md5
+
 from support.test_data import SingleTestData
 
 

test/appium/tests/base_test_case.py

@@ -15,13 +15,12 @@ from sauceclient import SauceException
 from selenium.common.exceptions import NoSuchElementException
 from selenium.common.exceptions import WebDriverException
 from selenium.webdriver.support.wait import WebDriverWait
-from urllib3.exceptions import MaxRetryError
+from urllib3.exceptions import MaxRetryError, ProtocolError
 
 from support.api.network_api import NetworkApi
-from support.github_report import GithubHtmlReport
 from tests import test_suite_data, start_threads, appium_container, pytest_config_global
 from tests import transl
-from tests.conftest import sauce_username, sauce_access_key, apibase
+from tests.conftest import sauce_username, sauce_access_key, apibase, github_report
 
 executor_sauce_lab = 'https://%s:%s@ondemand.%s:443/wd/hub' % (sauce_username, sauce_access_key, apibase)
 
@@ -127,7 +126,6 @@ class AbstractTestCase:
         return pytest_config_global['env']
 
     network_api = NetworkApi()
-    github_report = GithubHtmlReport()
 
     @staticmethod
     def get_alert_text(driver):
@@ -143,7 +141,7 @@ class AbstractTestCase:
                 test_suite_data.current_test.testruns[-1].error = "%s; also Unexpected Alert is shown: '%s'" % (
                     test_suite_data.current_test.testruns[-1].error, alert_text
                 )
-        except RemoteDisconnected:
+        except (RemoteDisconnected, ProtocolError):
             test_suite_data.current_test.testruns[-1].error = "%s; \n RemoteDisconnected" % \
                                                               test_suite_data.current_test.testruns[-1].error
 
@@ -215,7 +213,7 @@ class SingleDeviceTestCase(AbstractTestCase):
         except (WebDriverException, AttributeError):
             pass
         finally:
-            self.github_report.save_test(test_suite_data.current_test,
+            github_report.save_test(test_suite_data.current_test,
                                          {'%s_geth.log' % test_suite_data.current_test.name: geth_content})
 
 
@@ -277,7 +275,7 @@ class SauceMultipleDeviceTestCase(AbstractTestCase):
             except (WebDriverException, AttributeError):
                 pass
         geth = {geth_names[i]: geth_contents[i] for i in range(len(geth_names))}
-        self.github_report.save_test(test_suite_data.current_test, geth)
+        github_report.save_test(test_suite_data.current_test, geth)
 
     @classmethod
     def teardown_class(cls):
@@ -302,10 +300,10 @@ def create_shared_drivers(quantity):
         print('SC Executor: %s' % executor_sauce_lab)
         try:
             drivers = loop.run_until_complete(start_threads(quantity,
-                                                        Driver,
-                                                        drivers,
-                                                        executor_sauce_lab,
-                                                        update_capabilities_sauce_lab(capabilities)))
+                                                            Driver,
+                                                            drivers,
+                                                            executor_sauce_lab,
+                                                            update_capabilities_sauce_lab(capabilities)))
             for i in range(quantity):
                 test_suite_data.current_test.testruns[-1].jobs[drivers[i].session_id] = i + 1
                 drivers[i].implicitly_wait(implicit_wait)
@@ -377,7 +375,7 @@ class SauceSharedMultipleDeviceTestCase(AbstractTestCase):
             finally:
                 try:
                     geth = {geth_names[i]: geth_contents[i] for i in range(len(geth_names))}
-                    test_suite_data.current_test.geth_paths = self.github_report.save_geth(geth)
+                    test_suite_data.current_test.geth_paths = github_report.save_geth(geth)
                 except IndexError:
                     pass
 
@@ -419,7 +417,7 @@ class SauceSharedMultipleDeviceTestCase(AbstractTestCase):
         if cls.loop:
             cls.loop.close()
         for test in test_suite_data.tests:
-            cls.github_report.save_test(test)
+            github_report.save_test(test)
 
 
 if pytest_config_global['env'] == 'local':
@@ -436,4 +434,4 @@ class NoDeviceTestCase(AbstractTestCase):
         pass
 
     def teardown_method(self, method):
-        self.github_report.save_test(test_suite_data.current_test)
+        github_report.save_test(test_suite_data.current_test)

test/appium/tests/conftest.py

@@ -1,15 +1,16 @@
+import os
 import re
+import urllib.request
 from dataclasses import dataclass
 from datetime import datetime
 from http.client import RemoteDisconnected
 from os import environ
 from time import sleep
-import os
-import urllib.request
 
 import pytest
 from _pytest.runner import runtestprotocol
 from requests.exceptions import ConnectionError as c_er
+
 import tests
 from support.device_stats_db import DeviceStatsDB
 from support.test_rerun import should_rerun_test
@@ -20,7 +21,6 @@ sauce_access_key = environ.get('SAUCE_ACCESS_KEY')
 github_token = environ.get('GIT_HUB_TOKEN')
 
 
-
 def pytest_addoption(parser):
     parser.addoption("--build",
                      action="store",
@@ -158,6 +158,7 @@ def is_uploaded():
         if stored_files[i].name == test_suite_data.apk_name:
             return True
 
+
 def pytest_configure(config):
     global option
     option = config.option
@@ -178,7 +179,7 @@ def pytest_configure(config):
     else:
         raise NotImplementedError("Unknown SauceLabs datacenter")
     global sauce
-    sauce = SauceLab('https://api.' + apibase +'/', sauce_username, sauce_access_key)
+    sauce = SauceLab('https://api.' + apibase + '/', sauce_username, sauce_access_key)
     if config.getoption('log_steps'):
         import logging
         logging.basicConfig(level=logging.INFO)
@@ -208,7 +209,8 @@ def pytest_configure(config):
                         file_path = os.path.join(os.path.dirname(__file__), apk_name)
                         for _ in range(3):
                             try:
-                                urllib.request.urlretrieve(config.getoption('apk'), filename=file_path)  # if url is not valid it raises an error
+                                urllib.request.urlretrieve(config.getoption('apk'),
+                                                           filename=file_path)  # if url is not valid it raises an error
                                 sauce.storage.upload(file_path)
                                 os.remove(file_path)
                                 break
@@ -263,7 +265,8 @@ def pytest_runtest_makereport(item, call):
         is_group = "xdist_group" in item.keywords._markers or "xdist_group" in item.parent.keywords._markers
         error_intro, error = 'Test setup failed:', ''
         final_error = '%s %s' % (error_intro, error)
-        if (hasattr(report, 'wasxfail') and not case_ids_set) or (hasattr(report, 'wasxfail') and (str([mark.args[0] for mark in item.iter_markers(name='testrail_id')][0]) in str(case_ids_set))):
+        if (hasattr(report, 'wasxfail') and not case_ids_set) or (hasattr(report, 'wasxfail') and (
+                str([mark.args[0] for mark in item.iter_markers(name='testrail_id')][0]) in str(case_ids_set))):
             if '[NOTRUN]' in report.wasxfail:
                 test_suite_data.set_current_test(item.name, testrail_case_id=get_testrail_case_id(item))
                 test_suite_data.current_test.create_new_testrun()
@@ -287,15 +290,15 @@ def pytest_runtest_makereport(item, call):
                                       report.passed)
         if error:
             test_suite_data.current_test.testruns[-1].error = final_error
-            from support.github_report import GithubHtmlReport
-            GithubHtmlReport().save_test(test_suite_data.current_test)
+            github_report.save_test(test_suite_data.current_test)
 
     if report.when == 'call':
         current_test = test_suite_data.current_test
         error = catch_error()
         if report.failed:
             current_test.testruns[-1].error = error
-        if (hasattr(report, 'wasxfail') and not case_ids_set) or (hasattr(report, 'wasxfail') and (str([mark.args[0] for mark in item.iter_markers(name='testrail_id')][0]) in str(case_ids_set))):
+        if (hasattr(report, 'wasxfail') and not case_ids_set) or (hasattr(report, 'wasxfail') and (
+                str([mark.args[0] for mark in item.iter_markers(name='testrail_id')][0]) in str(case_ids_set))):
             current_test.testruns[-1].xfail = report.wasxfail
             if error:
                 current_test.testruns[-1].error = '%s [[%s]]' % (error, report.wasxfail)

test/appium/tests/critical/chats/test_1_1_public_chats.py

@@ -926,11 +926,14 @@ class TestOneToOneChatMultipleSharedDevicesNewUi(MultipleSharedDeviceTestCase):
         self.home_2.just_fyi("Check 'Open in Status' option")
         url_message = 'http://status.im'
         self.chat_1.send_message(url_message)
-        self.chat_2.element_starts_with_text(url_message, 'button').wait_for_visibility_of_element(120)
-        self.chat_2.element_starts_with_text(url_message, 'button').click_inside_element_by_coordinate(0.2, 0.5)
-        web_view = self.chat_2.open_in_status_button.click()
-        if not web_view.element_by_text('Private, Secure Communication').is_element_displayed(60):
-            self.errors.append('URL was not opened from 1-1 chat')
+        try:
+            self.chat_2.element_starts_with_text(url_message, 'button').wait_for_visibility_of_element(120)
+            self.chat_2.element_starts_with_text(url_message, 'button').click_inside_element_by_coordinate(0.2, 0.5)
+            web_view = self.chat_2.open_in_status_button.click()
+            if not web_view.element_by_text('Private, Secure Communication').is_element_displayed(60):
+                self.errors.append('URL was not opened from 1-1 chat')
+        except TimeoutException:
+            self.errors.append("Message with URL was not received")
 
         self.errors.verify_no_errors()
 
@@ -1036,6 +1039,9 @@ class TestOneToOneChatMultipleSharedDevicesNewUi(MultipleSharedDeviceTestCase):
         self.chat_2.just_fyi("Send messages with non-latin symbols")
         self.home_1.jump_to_card_by_text(self.username_2)
         self.chat_1.send_message("just a text")  # Sending a message here so the next ones will be in a separate line
+
+        self.home_2.click_system_back_button_until_element_is_shown()
+        self.home_2.jump_to_card_by_text(self.username_1)
         messages = ['hello', '¿Cómo estás tu año?', 'ё, доброго вечерочка', '®	æ ç ♥']
         [self.chat_2.send_message(message) for message in messages]
         for message in messages:
@@ -1121,6 +1127,8 @@ class TestOneToOneChatMultipleSharedDevicesNewUi(MultipleSharedDeviceTestCase):
             self.errors.append("PN are keep staying after message was seen by user")
         self.errors.verify_no_errors()
 
+    @marks.xfail(
+        reason="Message is being in status 'Sending' for a long time: https://github.com/status-im/status-mobile/issues/15385")
     @marks.testrail_id(702855)
     def test_1_1_chat_edit_message(self):
         [home.click_system_back_button_until_element_is_shown() for home in self.homes]
@@ -1157,14 +1165,20 @@ class TestOneToOneChatMultipleSharedDevicesNewUi(MultipleSharedDeviceTestCase):
 
         self.device_2.just_fyi("Delete message for me and check it is only deleted for the author")
         self.chat_2.send_message(message_to_delete_for_me)
-        self.chat_2.chat_element_by_text(message_to_delete_for_me).wait_for_status_to_be("Delivered")
-        self.chat_2.delete_message_in_chat(message_to_delete_for_me, everyone=False)
-        if not self.chat_2.chat_element_by_text(message_to_delete_for_me).is_element_disappeared(20):
-            self.errors.append("Deleted for me message is shown in chat for the author of message")
-        if not self.chat_2.element_by_translation_id('message-deleted-for-you').is_element_displayed(20):
-            self.errors.append("System message about deletion for you is not displayed")
-        if not self.chat_1.chat_element_by_text(message_to_delete_for_me).is_element_displayed(20):
-            self.errors.append("Deleted for me message is deleted for both users")
+        try:
+            timeout = 60
+            self.chat_2.chat_element_by_text(message_to_delete_for_me).wait_for_status_to_be("Delivered", timeout)
+            self.chat_2.delete_message_in_chat(message_to_delete_for_me, everyone=False)
+        except TimeoutException:
+            self.errors.append(
+                "Message status was not changed to 'Delivered' after %s s, https://github.com/status-im/status-mobile/issues/15385" % timeout)
+        else:
+            if not self.chat_2.chat_element_by_text(message_to_delete_for_me).is_element_disappeared(20):
+                self.errors.append("Deleted for me message is shown in chat for the author of message")
+            if not self.chat_2.element_by_translation_id('message-deleted-for-you').is_element_displayed(20):
+                self.errors.append("System message about deletion for you is not displayed")
+            if not self.chat_1.chat_element_by_text(message_to_delete_for_me).is_element_displayed(20):
+                self.errors.append("Deleted for me message is deleted for both users")
 
         self.device_2.just_fyi("Delete message for everyone and check it is not shown in chat preview on home")
         self.chat_2.delete_message_in_chat(message_after_edit_1_1)

test/appium/tests/critical/chats/test_group_chat.py

@@ -244,8 +244,10 @@ class TestGroupChatMultipleDeviceMergedNewUI(MultipleSharedDeviceTestCase):
         self.homes[0].connection_offline_icon.wait_for_invisibility_of_element(60)
         self.homes[0].open_notification_bar()
         for message in (message_1, message_2):
-            if not self.homes[0].element_by_text(message).is_element_displayed(30):
-                self.errors.append('%s PN was not fetched from offline' % message)
+            if self.homes[0].element_by_text(message).is_element_displayed(30):
+                break
+        else:
+            self.errors.append('Messages PN was not fetched from offline')
         self.homes[0].click_system_back_button()
         self.homes[0].chats_tab.click()
         self.homes[0].get_chat(self.chat_name).click()

test/appium/tests/critical/test_public_chat_browsing.py

@@ -452,8 +452,10 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
             if timestamp not in sent_time_variants:
                 self.errors.append("Timestamp is not shown, expected: '%s', in fact: '%s'" %
                                    (", ".join(sent_time_variants), timestamp))
-        for channel in self.channel_1, self.channel_2:
-            channel.verify_message_is_under_today_text(message, self.errors)
+        self.channel_1.verify_message_is_under_today_text(message, self.errors)
+        new_message = "new message"
+        self.channel_1.send_message(message)
+        self.channel_2.verify_message_is_under_today_text(new_message, self.errors, 60)
         if self.channel_2.chat_element_by_text(message).username.text != self.username_1:
             self.errors.append("Default username '%s' is not shown next to the received message" % self.username_1)
         self.errors.verify_no_errors()
@@ -499,9 +501,8 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
         self.home_1.just_fyi('Send image in 1-1 chat from Gallery')
         image_description = 'description'
         self.channel_1.send_images_with_description(image_description)
-        self.channel_1.chat_message_input.click()
-        self.channel_1.chat_element_by_text(image_description).image_in_message.click()
-        self.channel_1.click_system_back_button()
+        # self.channel_1.chat_element_by_text(image_description).image_in_message.click()
+        # self.channel_1.click_system_back_button_until_element_is_shown(element='chat')
 
         # TODO: options for image are still WIP; add case with edit description of image and after 15901 fix
         self.home_2.just_fyi('check image, description and options for receiver')
@@ -530,6 +531,7 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
         #
         # self.channel_2.chat_element_by_text(image_description).image_in_message.save_new_screenshot_of_element('images_test.png')
 
+        self.channel_2.chat_element_by_text(image_description).wait_for_visibility_of_element(60)
         if not self.channel_2.chat_element_by_text(
                 image_description).image_in_message.is_element_image_similar_to_template('image_sent_in_community.png'):
             self.errors.append("Not expected image is shown to the receiver")
@@ -730,7 +732,7 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
         self.home_2.just_fyi("Check that can send message in community after unblock")
         [home.jump_to_card_by_text('# %s' % self.channel_name) for home in [self.home_1, self.home_2]]
         self.chat_2.send_message(message_unblocked)
-        if not self.chat_1.chat_element_by_text(message_unblocked).is_element_displayed(30):
+        if not self.chat_1.chat_element_by_text(message_unblocked).is_element_displayed(120):
             self.errors.append("Message was not received in public chat after user unblock!")
 
         self.home_2.just_fyi("Add blocked user to contacts again after removing(removed automatically when blocked)")

test/appium/views/chat_view.py

@@ -220,11 +220,12 @@ class ChatElementByText(Text):
     def wait_for_status_to_be(self, expected_status: str, timeout: int = 30):
         self.driver.info("Waiting for message to be sent for %s sec" % timeout)
         start_time = time.time()
+        current_status = self.status
         while time.time() - start_time <= timeout:
-            if self.status == expected_status:
+            if current_status == expected_status:
                 return
             time.sleep(1)
-        raise TimeoutException("Message status was not changed to %s" % expected_status)
+        raise TimeoutException("Message status was not changed to %s, it's %s" % (expected_status, current_status))
 
     @property
     def sent_status_checkmark(self) -> object:
@@ -285,7 +286,8 @@ class ChatElementByText(Text):
     @property
     def image_container_in_message(self):
         try:
-            self.driver.info("Trying to access images (image container) inside message with text '%s'" % self.message_text)
+            self.driver.info(
+                "Trying to access images (image container) inside message with text '%s'" % self.message_text)
             ChatElementByText(self.driver, self.message_text).wait_for_sent_state(60)
             return Button(self.driver, xpath='%s//*[@content-desc="image-container"]' % self.locator)
         except NoSuchElementException:
@@ -363,8 +365,9 @@ class CommunityView(HomeView):
         self.invite_button = Button(self.driver, accessibility_id="community-invite-people")
 
         # Community info page
-        self.community_membership_request_value = Text(self.driver, translation_id="members-label",
-                                                       suffix='/following-sibling::android.view.ViewGroup/android.widget.TextView')
+        self.community_membership_request_value = Text(
+            self.driver, translation_id="members-label",
+            suffix='/following-sibling::android.view.ViewGroup/android.widget.TextView')
         self.members_button = Button(self.driver, translation_id="members-label")
         self.community_info_picture = Button(self.driver, accessibility_id="chat-icon")
         self.leave_community_button = Button(self.driver, translation_id="leave-community")
@@ -393,7 +396,6 @@ class CommunityView(HomeView):
         self.checkbox_button.scroll_and_click()
         self.join_community_button.scroll_and_click()
 
-
     def get_channel(self, channel_name: str):
         self.driver.info("Getting  %s channel element in community" % channel_name)
         chat_element = self.get_chat(username=channel_name, community_channel=True, wait_time=30)
@@ -732,9 +734,11 @@ class ChatView(BaseView):
         self.chat_message_input = ChatMessageInput(self.driver)
         self.cancel_reply_button = Button(self.driver, accessibility_id="reply-cancel-button")
         self.url_preview_composer = Button(self.driver, accessibility_id="url-preview")
-        self.url_preview_composer_text = Text(self.driver, xpath='//*[@content-desc="url-preview"]//*[@content-desc="title"]')
-        self.quote_username_in_message_input = EditBox(self.driver,
-                                                       xpath="//*[@content-desc='reply-cancel-button']/preceding::android.widget.TextView[2]")
+        self.url_preview_composer_text = Text(self.driver,
+                                              xpath='//*[@content-desc="url-preview"]//*[@content-desc="title"]')
+        self.quote_username_in_message_input = EditBox(
+            self.driver,
+            xpath="//*[@content-desc='reply-cancel-button']/preceding::android.widget.TextView[3]")
         self.chat_item = Button(self.driver, xpath="(//*[@content-desc='chat-item'])[1]")
         self.chat_name_editbox = EditBox(self.driver, accessibility_id="chat-name-input")
         self.commands_button = CommandsButton(self.driver)
@@ -938,10 +942,10 @@ class ChatView(BaseView):
         self.driver.info("Looking for a message by text: %s" % chat_element.exclude_emoji(text))
         return chat_element
 
-    def verify_message_is_under_today_text(self, text, errors):
+    def verify_message_is_under_today_text(self, text, errors, timeout=10):
         self.driver.info("Verifying that '%s' is under today" % text)
         message_element = self.chat_element_by_text(text)
-        message_element.wait_for_visibility_of_element()
+        message_element.wait_for_visibility_of_element(timeout)
         message_location = message_element.find_element().location['y']
         today_text_element = self.element_by_text('Today').find_element()
         today_location = today_text_element.location['y']
@@ -1043,8 +1047,10 @@ class ChatView(BaseView):
         self.chat_message_input.click()
         self.show_stickers_button.click()
         self.get_stickers.click()
-        element = Button(self.driver,
-                         xpath="//*[@content-desc='sticker-pack-name'][@text='%s']/..//*[@content-desc='sticker-pack-price']" % pack_name)
+        element = Button(
+            self.driver,
+            xpath="//*[@content-desc='sticker-pack-name'][@text='%s']/..//*[@content-desc='sticker-pack-price']"
+                  % pack_name)
         element.scroll_to_element(depth=21)
         element.click()
         element.wait_for_invisibility_of_element()
@@ -1118,7 +1124,7 @@ class ChatView(BaseView):
             "%I:%M %p")
         timestamp_obj = datetime.strptime(timestamp, '%I:%M %p')
         possible_timestamps_obj = [timestamp_obj + timedelta(0, 0, 0, 0, 1), timestamp_obj,
-                                   timestamp_obj - timedelta(0, 0, 0, 0, 1),  timestamp_obj - timedelta(0, 0, 0, 0, 2)]
+                                   timestamp_obj - timedelta(0, 0, 0, 0, 1), timestamp_obj - timedelta(0, 0, 0, 0, 2)]
         timestamps = list(map(lambda x: x.strftime("%I:%M %p"), possible_timestamps_obj))
         final_timestamps = [t[1:] if t[0] == '0' else t for t in timestamps]
         return final_timestamps
@@ -1146,7 +1152,8 @@ class ChatView(BaseView):
         self.chat_message_input.send_keys("@")
         try:
             self.mentions_list.wait_for_element()
-            self.driver.find_element(MobileBy.XPATH, "//*[@content-desc='user-list']//*[@text='%s']" % user_name).click()
+            self.driver.find_element(MobileBy.XPATH,
+                                     "//*[@content-desc='user-list']//*[@text='%s']" % user_name).click()
         except TimeoutException:
             self.driver.fail("Mentions list is not shown")
 

translations/en.json

@@ -1019,9 +1019,7 @@
     "next": "Next",
     "no": "No",
     "no-collectibles": "No collectibles available",
-    "no-contacts": "No contacts yet",
     "no-keycard-applet-on-card": "No Keycard applet on card",
-    "no-messages": "No messages",
     "no-pairing-slots-available": "This card is already paired to 5 devices and cannot pair to this one. Please use one of the paired devices, log in with this card and free up pairing slots on the card",
     "no-result": "No results",
     "no-tokens-found": "No tokens found",
@@ -1203,6 +1201,7 @@
     "repeat-puk": "Repeat new 12-digit PUK",
     "report-bug-email-template": "1. Issue Description\n{{description}}\n\n\n2. Steps to reproduce\n{{steps}}\n\n\n3. Attach screenshots that can demo the problem, please\n",
     "request-processed-after-node-online": "Your request will be processed once the community owner node is back online.",
+    "request-to-join-disclaimer": "Joining the community will reveal your public addresses to the owner",
     "request-to-join": "Request to join",
     "request-to-join-community": "Request to join Community",
     "requested-to-join-community": "You requested to join “{{community}}”",
@@ -1527,7 +1526,7 @@
     "your-data-belongs-to-you": "If you lose your seed phrase you lose your data and funds",
     "your-data-belongs-to-you-description": "If you lose access, for example by losing your phone, you can only access your keys with your seed phrase. No one, but you has your seed phrase. Write it down. Keep it safe",
     "your-identifiers": "Your identicon ring, chat key and emojihash will help others tell you from impersonators",
-    "your-name": "Your Name",
+    "your-name": "Your name",
     "your-recovery-phrase": "Your seed phrase",
     "your-recovery-phrase-description": "This is your seed phrase. You use it to prove that this is your wallet. You only get to see it once! Write it on paper and keep it in a secure place. You will need it if you lose or reinstall your wallet.",
     "custom-seed-phrase": "Invalid seed phrase",
@@ -1574,6 +1573,7 @@
     "one-photo": "1 photo",
     "n-photos": "{{count}} photos",
     "image": "Image",
+    "photo": "Photo",
     "sign-anyway": "Sign anyway",
     "tx-fail-description1": "This transaction is likely to fail. Sign at your own risk using custom network fee.",
     "tx-fail-description2": "This transaction is likely to fail. Set a custom network fee to sign at your own risk.",
@@ -2051,7 +2051,7 @@
     "you-have-no-contacts": "You have no contacts",
     "my-albums": "My albums",
     "images": "images",
-    "images-albums-count": "{{album-images-count}} images",
+    "album-images-count": "{{album-images-count}} photos",
     "only-6-images": "You can only add 6 images to your message",
     "delivered": "Delivered",
     "mark-all-notifications-as-read": "Mark all notifications as read",
@@ -2103,7 +2103,18 @@
     "name-must-have-at-least-characters": "Name must have at least {{min-chars}} characters",
     "name-is-not-valid": "Name is not valid",
     "no-communities": "No communities",
-    "no-communities-sub-title": "Your communities will be shown here",
+    "no-communities-description-strikethrough": "Never",
+    "no-communities-description": "go full nyan, find your community",
+    "no-pending-communities": "No pending communities",
+    "no-pending-communities-description": "It's toaster",
+    "no-opened-communities": "No opened communities",
+    "no-opened-communities-description": "But... feels good man",
+    "no-contacts": "No contacts",
+    "no-contacts-description": "This is fine, just invite your mother",
+    "no-group-chats": "No group chats",
+    "no-group-chats-description": "Much fun. Have friends. Wow!",
+    "no-messages": "No messages",
+    "no-messages-description": "Here’s a cat in a box instead",
     "mute-for-15-mins": "For 15 min",
     "mute-for-1-hour": "For 1 hour",
     "mute-for-8-hours": "For 8 hours",