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 {

nix/overlay.nix

@@ -32,6 +32,18 @@ in {
   # For parsing gradle.properties into an attrset
   gradlePropParser = callPackage ./tools/gradlePropParser.nix { };
 
+  # Clojure formatting tool
+  zprint = super.zprint.override rec {
+    buildGraalvmNativeImage = args: super.buildGraalvmNativeImage ( args // rec {
+      inherit (args) pname;
+      version = "1.2.5";
+      src = self.fetchurl {
+        url = "https://github.com/kkinnear/${pname}/releases/download/${version}/${pname}-filter-${version}";
+        sha256 = "sha256-PWdR5jqyzvTk9HoxqDldwtZNik34dmebBtZZ5vtva4A=";
+      };
+    });
+  };
+
   # Fix for missing libarclite_macosx.a in Xcode 14.3.
   # https://github.com/ios-control/ios-deploy/issues/580
   ios-deploy = super.darwin.ios-deploy.overrideAttrs (old: rec {
@@ -48,8 +60,8 @@ in {
   gradle = super.gradle_6;
   nodejs = super.nodejs-18_x;
   yarn = super.yarn.override { nodejs = super.nodejs-18_x; };
-  openjdk = super.openjdk11_headless;
-  xcodeWrapper = super.xcodeenv.composeXcodeWrapper {
+  openjdk = super.openjdk8_headless;
+  xcodeWrapper = callPackage ./pkgs/xcodeenv/compose-xcodewrapper.nix { } {
     version = "14.0";
     allowHigher = true;
   };

nix/pkgs.nix

@@ -11,10 +11,11 @@ let
   # We follow the master branch of official nixpkgs.
   nixpkgsSrc = fetchFromGitHub {
     name = "nixpkgs-source";
-    owner = "NixOS";
+    # FIXME: Fork used to get Cocoapods 1.12.0 and apksigner macOS build.
+    owner = "status-im";
     repo = "nixpkgs";
-    rev = "e7603eba51f2c7820c0a182c6bbb351181caa8e7";
-    sha256 = "sha256-XJZ/o17eOd2sEsGif+/MQBnfa2DKmndWgJyc7CWajFc=";
+    rev = "d0c06fa3d3982a91aa01bd63ed84020cbde3d3ab";
+    sha256 = "sha256-8blvuUHnuf0hFr/PpBxVohJp5CaGXIXhgJlFN/cv7us=";
     # To get the compressed Nix sha256, use:
     # nix-prefetch-url --unpack https://github.com/${ORG}/nixpkgs/archive/${REV}.tar.gz
   };

nix/pkgs/android-sdk/compose.nix

@@ -9,7 +9,7 @@
 # by setting android_sdk.accept_license = true.
 androidenv.composeAndroidPackages {
   toolsVersion = "26.1.1";
-  platformToolsVersion = "33.0.3";
+  platformToolsVersion = "33.0.2";
   buildToolsVersions = [ "30.0.0" ];
   platformVersions = [ "31" ];
   cmakeVersions = [ "3.18.1" ];

nix/pkgs/android-sdk/shell.nix

@@ -2,7 +2,6 @@
 
 mkShell {
   name = "android-sdk-shell";
-  buildInputs = [ openjdk ];
   shellHook = ''
     export JAVA_HOME="${openjdk}"
 

nix/pkgs/xcodeenv/compose-xcodewrapper.nix

@@ -0,0 +1,44 @@
+{ stdenv }:
+
+{ version ? "11.1"
+, allowHigher ? false
+, xcodeBaseDir ? "/Applications/Xcode.app" }:
+
+assert stdenv.isDarwin;
+
+stdenv.mkDerivation {
+  name = "xcode-wrapper-${version}${if allowHigher then "-plus" else ""}";
+  # Fix 'xcodebuild: Operation not permitted' when 'sandbox=relaxed' is used.
+  # https://github.com/NixOS/nixpkgs/pull/228696
+  __noChroot = stdenv.isDarwin;
+  buildCommand = ''
+    mkdir -p $out/bin
+    cd $out/bin
+    ln -s /usr/bin/xcode-select
+    ln -s /usr/bin/security
+    ln -s /usr/bin/codesign
+    ln -s /usr/bin/xcrun
+    ln -s /usr/bin/plutil
+    ln -s /usr/bin/clang
+    ln -s /usr/bin/lipo
+    ln -s /usr/bin/file
+    ln -s /usr/bin/rev
+    ln -s "${xcodeBaseDir}/Contents/Developer/usr/bin/xcodebuild"
+    ln -s "${xcodeBaseDir}/Contents/Developer/Applications/Simulator.app/Contents/MacOS/Simulator"
+
+    cd ..
+    ln -s "${xcodeBaseDir}/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs"
+
+    # Check if we have the xcodebuild version that we want
+    currVer=$($out/bin/xcodebuild -version)
+    ${if allowHigher then ''
+    if [ -z "$(printf '%s\n' "${version}" "$currVer" | sort -V | head -n1)""" != "${version}" ]
+    '' else ''
+    if [ -z "$(echo $currVer | grep -x 'Xcode ${version}')" ]
+    ''}
+    then
+        echo "We require xcodebuild version${if allowHigher then " or higher" else ""}: ${version}"
+        exit 1
+    fi
+  '';
+}

nix/shell.nix

@@ -20,7 +20,7 @@ in mkShell {
     # lint specific utilities
     clj-kondo zprint
     # other nice to have stuff
-    yarn nodejs python310
+    yarn nodejs python27
   ] # and some special cases
     ++ lib.optionals stdenv.isDarwin [ cocoapods clang tcl ]
     ++ lib.optionals (!stdenv.isDarwin) [ gcc8 ]

nix/shells.nix

@@ -57,7 +57,7 @@ let
 
     # for 'scripts/generate-keystore.sh'
     keytool = mkShell {
-      buildInputs = with pkgs; [ openjdk apksigner ];
+      buildInputs = with pkgs; [ openjdk8 apksigner ];
     };
 
     # for targets needing 'adb', 'apkanalyzer' and other SDK/NDK tools

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)
@@ -40,8 +42,9 @@
           :default-value default-value
           :accessibility-label :profile-title-input
           :keyboard-appearance (theme/theme-value :light :dark override-theme)
-          :on-focus #(swap! focused? (constantly true))
-          :on-blur #(swap! focused? (constantly false))
+          :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

@@ -133,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)
@@ -141,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]
@@ -403,8 +403,8 @@
      (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?
@@ -433,15 +433,17 @@
   [quo/action-drawer
    [[(view-profile-entry chat-id)
      (edit-nickname-entry chat-id)]
-    (notification-actions item inside-chat?)
+    (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 inside-chat?)]])
+   (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}]

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,9 +2,10 @@
   (: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]
@@ -14,9 +15,7 @@
 
 (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
+  (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])
@@ -52,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
@@ -104,7 +109,7 @@
           [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/discover/view.cljs

@@ -96,7 +96,7 @@
       [rn/view
        {:style     style/featured-list-container
         :on-layout #(swap! view-size
-                      (fn [_]
+                      (fn []
                         (- (oops/oget % "nativeEvent.layout.width") 40)))}
        (when-not (= @view-size 0)
          [rn/flat-list

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? (constantly true)))
-             will-hide-listener (oops/ocall rn/keyboard
-                                            "addListener"
-                                            "keyboardWillHide"
-                                            #(swap! keyboard-shown? (constantly 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/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.5",
-    "commit-sha1": "92b5d831fe25fd2b0397519a1073a53e0be87289",
-    "src-sha256": "004pm4k090lw35kbfag0wjs815y68k61h3g6kydzpzkbmxrrfzd9"
+    "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)")